.gitignore-studio{grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:1.25rem;display:grid}.faq-section{flex-direction:column;gap:.95rem;margin-top:2.5rem;display:flex}.faq-heading h2{letter-spacing:-.01em;color:var(--color-ink);margin:.2rem 0 0;font-size:1.05rem;font-weight:700}.faq-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.9rem;display:grid}.faq-card{border-radius:var(--radius-lg);border:1px solid var(--color-hairline);background:var(--color-canvas-soft);overflow:hidden}.faq-card summary{cursor:pointer;justify-content:space-between;align-items:flex-start;gap:.9rem;padding:1rem 1.05rem;list-style:none;display:flex}.faq-card summary::-webkit-details-marker{display:none}.faq-card summary span:first-child{color:var(--color-ink);margin:0;font-size:.94rem;font-weight:600;line-height:1.4}.faq-plus{text-align:center;width:1.5rem;color:var(--color-accent);flex-shrink:0;font-size:1.05rem;line-height:1.2;transition:transform .16s}.faq-card[open] .faq-plus{transform:rotate(180deg)}.faq-answer{padding:0 1.05rem 1rem}.faq-card p{color:var(--color-body);margin:0;font-size:.83rem;line-height:1.6}.panel-topline{border-bottom:1px solid var(--color-hairline);background:radial-gradient(circle at top left, color-mix(in srgb, var(--color-accent) 9%, transparent), transparent 44%), linear-gradient(180deg, color-mix(in srgb, var(--color-canvas-soft) 90%, white), var(--color-card));justify-content:space-between;align-items:flex-start;gap:1rem;padding:1rem 1.25rem;display:flex}.eyebrow,.mini-label,.artifact-label,.template-category{letter-spacing:.12em;text-transform:uppercase;margin:0;font-size:.7rem;font-weight:700}.eyebrow{color:var(--color-accent)}.panel-topline h2{letter-spacing:-.01em;margin:.15rem 0 0;font-size:.98rem;font-weight:700}.builder-shell,.preview-shell{flex-direction:column;gap:1rem;padding:1.05rem;display:flex}.builder-intro,.builder-controls-card,.selection-summary-card,.template-library-card,.note-card,.share-panel-card{border-radius:var(--radius-lg);border:1px solid var(--color-hairline);background:var(--color-canvas-soft)}.builder-intro{background:linear-gradient(135deg, color-mix(in srgb, var(--color-accent) 11%, transparent), transparent 58%), var(--color-canvas-soft);border-color:color-mix(in srgb, var(--color-accent) 16%, var(--color-hairline));padding:1rem}.builder-intro p{color:var(--color-body);margin:.55rem 0 0;font-size:.86rem;line-height:1.6}.intro-badge{background:color-mix(in srgb, var(--color-accent) 16%, var(--color-card));color:var(--color-ink);border-radius:999px;align-items:center;gap:.45rem;padding:.35rem .55rem;font-size:.76rem;font-weight:600;display:inline-flex}.preset-row{grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem;display:grid}.preset-card{border:1px solid color-mix(in srgb, var(--color-hairline) 88%, white);background:linear-gradient(180deg, color-mix(in srgb, var(--color-card) 94%, white), var(--color-card));text-align:left;cursor:pointer;border-radius:20px;padding:.95rem 1rem;transition:transform .18s,border-color .18s,box-shadow .18s;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff8c,0 10px 24px #0f172a0d}.preset-card:after{content:"";background:linear-gradient(135deg, color-mix(in srgb, var(--color-accent) 6%, transparent), transparent 60%);opacity:0;pointer-events:none;transition:opacity .18s;position:absolute;inset:0}.preset-card:hover:after{opacity:1}.preset-card:hover{border-color:color-mix(in srgb, var(--color-accent) 28%, var(--color-hairline-strong));transform:translateY(-2px);box-shadow:inset 0 1px #ffffffb3,0 16px 32px #0f172a14}.preset-card:active{transform:translateY(0)}.preset-card strong{color:var(--color-ink);font-size:.96rem;line-height:1.15;display:block}.preset-card span{color:var(--color-mute);margin-top:.35rem;font-size:.8rem;line-height:1.45;display:block}.builder-controls-card,.selection-summary-card,.template-library-card,.share-panel-card{padding:1rem}.search-shell{border:1.5px solid color-mix(in srgb, var(--color-accent) 30%, var(--color-hairline-strong));background:linear-gradient(180deg, color-mix(in srgb, var(--color-card) 95%, white), var(--color-card));box-shadow:inset 0 1px 0 #ffffffbf, 0 0 0 3px color-mix(in srgb, var(--color-accent) 8%, transparent), 0 10px 22px #0f172a0a;border-radius:18px;align-items:center;transition:border-color .2s,box-shadow .2s,transform .2s;display:flex;position:relative}.search-icon{color:var(--color-accent);pointer-events:none;transition:color .2s;position:absolute;left:.8rem}.search-shell input{background:0 0;outline:none;height:48px;padding-left:2.35rem;border:0!important}.search-shell:focus-within{border-color:color-mix(in srgb, var(--color-accent) 50%, var(--color-hairline-strong));box-shadow:inset 0 1px 0 #ffffffbf, 0 0 0 4px color-mix(in srgb, var(--color-accent) 14%, transparent), 0 14px 28px #0f172a14;transform:translateY(-1px)}.output-mode-card{border-top:1px solid var(--color-hairline);justify-content:space-between;align-items:center;gap:.85rem;margin-top:.95rem;padding-top:.95rem;display:flex}.mode-label{letter-spacing:.08em;text-transform:uppercase;color:var(--color-mute);font-size:.75rem;font-weight:700;display:block}.output-mode-card p{color:var(--color-mute);margin:.3rem 0 0;font-size:.79rem;line-height:1.52}.mode-toggle{border:1px solid var(--color-hairline);background:color-mix(in srgb, var(--color-card) 92%, white);border-radius:999px;flex-shrink:0;align-items:center;gap:.4rem;padding:.28rem;display:inline-flex}.mode-chip{min-width:78px;height:34px;color:var(--color-mute);cursor:pointer;background:0 0;border:0;border-radius:999px;padding:0 .9rem;font-size:.78rem;font-weight:700}.mode-chip.is-active{background:color-mix(in srgb, var(--color-accent) 14%, var(--color-card));color:var(--color-accent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--color-accent) 22%, transparent)}.category-filter{flex-wrap:wrap;gap:.55rem;margin-top:.95rem;display:flex}.category-chip,.ghost-chip{border:1px solid var(--color-hairline);background:var(--color-card);height:36px;color:var(--color-body);cursor:pointer;border-radius:999px;padding:0 .8rem;font-size:.78rem;font-weight:600}.category-chip.is-active,.category-chip:hover,.ghost-chip:hover{border-color:var(--color-hairline-strong);background:color-mix(in srgb, var(--color-canvas-soft) 74%, white);color:var(--color-ink)}.summary-header,.library-header,.output-actions,.summary-actions,.share-actions-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.8rem;display:flex}.summary-header h3,.library-header h3,.share-header h3{color:var(--color-ink);margin:.22rem 0 0;font-size:.95rem;font-weight:700}.ghost-chip{align-items:center;gap:.42rem;display:inline-flex}.selected-stack{flex-wrap:wrap;gap:.5rem;margin-top:.95rem;display:flex}.stack-chip{border:1px solid var(--color-hairline);background:var(--color-card);color:var(--color-ink);white-space:nowrap;border-radius:10px;align-items:center;gap:.5rem;padding:.4rem .5rem .4rem .65rem;font-size:.82rem;font-weight:600;line-height:1;display:inline-flex}.stack-chip-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px}.stack-chip-label{margin:0}.stack-chip-remove{width:20px;height:20px;color:var(--color-mute);cursor:pointer;background:0 0;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;margin-left:.1rem;padding:0;font-size:1rem;line-height:1;transition:background .12s,color .12s;display:flex}.stack-chip-remove:hover{color:#ef4444;background:#ef44441f}.stack-empty-state{border:1px dashed var(--color-hairline-strong);background:color-mix(in srgb, var(--color-canvas-soft) 78%, white);border-radius:18px;padding:.95rem 1rem}.stack-empty-state strong,.stack-empty-state span{display:block}.stack-empty-state span{color:var(--color-mute);margin-top:.35rem;font-size:.82rem;line-height:1.5}.template-library{grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;max-height:34rem;margin-top:.95rem;padding-right:.2rem;display:grid;overflow-y:auto}.library-subtitle{color:var(--color-mute);margin:.35rem 0 0;font-size:.8rem;line-height:1.55}.template-card{border:1px solid var(--color-hairline);background:var(--color-card);border-radius:14px;padding:.8rem .85rem;transition:border-color .16s,transform .16s,box-shadow .16s}.template-card.is-selected{border-color:color-mix(in srgb, var(--color-accent) 35%, var(--color-hairline-strong));background:linear-gradient(180deg, color-mix(in srgb, var(--color-accent) 5%, white), var(--color-card));box-shadow:0 2px 12px color-mix(in srgb, var(--color-accent) 10%, transparent)}.template-card:hover{border-color:var(--color-hairline-strong);transform:translateY(-1px);box-shadow:0 6px 16px #0f172a0d}.template-card-top{align-items:center;gap:.55rem;display:flex}.template-card-dot{border-radius:50%;flex-shrink:0;width:10px;height:10px}.template-card h4{color:var(--color-ink);flex:1;min-width:0;margin:0;font-size:.92rem;line-height:1.15}.template-description{color:var(--color-body);margin:.5rem 0 0;font-size:.78rem;line-height:1.5}.template-tags{flex-wrap:wrap;gap:.35rem;margin-top:.6rem;display:flex}.template-tags span{background:color-mix(in srgb, var(--color-canvas-soft) 80%, white);color:var(--color-mute);border-radius:6px;padding:.15rem .45rem;font-size:.65rem;font-weight:600}.template-toggle{background:var(--color-accent);color:#fff;cursor:pointer;white-space:nowrap;letter-spacing:.02em;border:none;border-radius:999px;flex-shrink:0;justify-content:center;align-items:center;min-height:36px;padding:0 .85rem;font-size:.78rem;font-weight:700;transition:all .16s;display:inline-flex}.template-toggle:hover{opacity:.88;box-shadow:0 4px 12px color-mix(in srgb, var(--color-accent) 30%, transparent);transform:translateY(-1px)}.template-toggle:active{transform:translateY(0)}.template-toggle.is-selected{background:var(--color-canvas-soft);color:var(--color-accent);border:1.5px solid color-mix(in srgb, var(--color-accent) 35%, var(--color-hairline))}.template-toggle.is-selected:hover{background:color-mix(in srgb, var(--color-accent) 10%, var(--color-card));box-shadow:none}.library-empty-state{border:1px dashed var(--color-hairline-strong);background:color-mix(in srgb, var(--color-canvas-soft) 78%, white);color:var(--color-mute);border-radius:18px;padding:1rem}.library-empty-state strong,.library-empty-state span{display:block}.library-empty-state span{margin-top:.35rem;font-size:.84rem;line-height:1.5}.stats-strip{grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem;display:grid}.stat-pill{border:1px solid var(--color-hairline);background:linear-gradient(135deg, color-mix(in srgb, var(--color-card) 94%, white), var(--color-card));border-radius:18px;padding:.9rem 1rem;transition:transform .16s,box-shadow .16s;box-shadow:inset 0 1px #ffffff80,0 6px 16px #0f172a0a}.stat-pill:hover{transform:translateY(-1px);box-shadow:inset 0 1px #fff9,0 10px 24px #0f172a0f}.stat-pill span{color:var(--color-mute);text-transform:uppercase;letter-spacing:.08em;margin-bottom:.32rem;font-size:.74rem;font-weight:700;display:block}.stat-pill strong{color:var(--color-ink);font-size:1.15rem}.artifact-card{color:#e5eefc;background:radial-gradient(circle at 100% 0,#22c55e14,#0000 36%),linear-gradient(#101827,#09111f 58%,#06101b);border:1px solid #94a3b829;border-radius:24px;overflow:auto hidden;box-shadow:inset 0 1px #ffffff0d,0 28px 72px #02061733}.artifact-topbar{background:#ffffff08;border-bottom:1px solid #ffffff14;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 1.1rem;display:flex}.artifact-label{color:#7dd3fc}.artifact-topbar strong{color:#fff;margin-top:.22rem;font-size:1.06rem;display:block}.artifact-stack-label{color:#94a3b8;text-align:right;max-width:52%;font-size:.76rem;line-height:1.45}.output-frame{padding:.8rem 0;position:relative}.copy-overlay-btn{color:#fff;cursor:pointer;z-index:2;background:#ffffff0f;border:1px solid #ffffff1f;border-radius:999px;justify-content:center;align-items:center;width:36px;height:36px;display:inline-flex;position:absolute;top:.8rem;right:.8rem}.output-code{font-family:var(--font-mono);flex-direction:column;gap:.08rem;padding:.35rem 0;font-size:.83rem;line-height:1.62;display:flex}.code-line{white-space:pre-wrap;word-break:break-word;grid-template-columns:3.2rem minmax(0,1fr);gap:.55rem;padding:0 1.1rem;display:grid}.line-no{color:#94a3b899;text-align:right;user-select:none}.line-text{color:#e5eefc}.line-text.is-comment{color:#7dd3fc}.notes-grid{grid-template-columns:1fr 1fr;gap:.8rem;display:grid}.note-card{border-radius:var(--radius-lg);border:1px solid var(--color-hairline);background:linear-gradient(135deg, color-mix(in srgb, var(--color-card) 96%, white), var(--color-card));padding:.95rem 1rem;transition:transform .16s,box-shadow .16s;box-shadow:inset 0 1px #fff6,0 6px 14px #0f172a08}.note-card:hover{transform:translateY(-1px);box-shadow:inset 0 1px #ffffff80,0 10px 20px #0f172a0d}.note-card .mini-label{color:var(--color-accent)}.note-card p{color:var(--color-body);margin:.42rem 0 0;font-size:.82rem;line-height:1.55}.share-panel-card{padding:1rem}.share-header p{color:var(--color-mute);margin:.28rem 0 0;font-size:.82rem;line-height:1.58}.primary-action,.icon-action,.export-item,.export-chevron-btn,.export-main-btn{border:1px solid var(--color-hairline);background:var(--color-card);color:var(--color-ink)}.primary-action{border-radius:var(--radius-md);background:var(--color-accent);color:#fff;cursor:pointer;border-color:#0000;height:42px;font-weight:600}.primary-action:hover{background:var(--color-accent-hover)}.icon-action,.export-main-btn{border-radius:var(--radius-md);cursor:pointer;height:42px;font-weight:600}.icon-action:hover,.export-item:hover,.export-main-btn:hover,.export-chevron-btn:hover{border-color:var(--color-hairline-strong);background:color-mix(in srgb, var(--color-canvas-soft) 74%, white)}.icon-action{justify-content:center;align-items:center;width:42px;display:inline-flex}.share-native-btn{white-space:nowrap;align-items:center;gap:.5rem;padding:0 1rem 0 1.05rem;display:inline-flex}.social-links-container{flex-wrap:wrap;gap:.7rem;display:flex}.social-share-btn{border-radius:var(--radius-md);color:#fff;justify-content:center;align-items:center;height:40px;padding:0 1rem;font-size:.8125rem;font-weight:600;text-decoration:none;transition:opacity .2s;display:inline-flex}.social-share-btn:hover{opacity:.92}.social-share-btn.tw{background:#0f1419}.social-share-btn.li{background:#0a66c2}.social-share-btn.wa{background:#25d366}.social-share-btn.rd{background:#ff4500}.export-dropdown-container{position:relative}.split-button{align-items:stretch;display:inline-flex}.export-main-btn,.export-chevron-btn{cursor:pointer;justify-content:center;align-items:center;height:42px;display:inline-flex}.export-main-btn{border-right:0;gap:.45rem;min-width:182px;padding:0 .95rem}.button-icon{align-items:center;display:inline-flex}.export-chevron-btn{width:42px}.icon-action:disabled,.export-main-btn:disabled,.export-chevron-btn:disabled{cursor:not-allowed;opacity:.5}.export-menu{border-radius:var(--radius-lg);border:1px solid var(--color-hairline);background:color-mix(in srgb, var(--color-card) 96%, white);z-index:20;min-width:220px;max-width:calc(100vw - 2rem);padding:.4rem;position:absolute;top:calc(100% + .55rem);right:0;box-shadow:0 18px 34px #0f172a1f}.export-item{border-radius:calc(var(--radius-md) - 2px);cursor:pointer;border:0;justify-content:space-between;align-items:center;width:100%;height:40px;padding:0 .8rem;font-weight:600;display:flex}.export-feedback{color:var(--color-success);align-items:center;display:inline-flex}@media (width<=1100px){.gitignore-studio{grid-template-columns:1fr}}@media (width<=820px){.preset-row,.notes-grid,.stats-strip,.faq-grid{grid-template-columns:1fr}.template-library{grid-template-columns:1fr;max-height:30rem}}@media (width<=640px){.panel-topline,.summary-header,.library-header,.output-actions,.share-actions-row{flex-direction:column;align-items:stretch}.summary-actions{width:100%}.ghost-chip,.share-native-btn,.export-main-btn{flex:1;justify-content:center}.template-card-top,.artifact-topbar{flex-direction:column;align-items:flex-start}.artifact-stack-label{text-align:left;max-width:none}.code-line{grid-template-columns:2.5rem minmax(0,1fr);padding:0 .85rem}}
