@font-face{font-family:Fraunces;font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/fraunces-400.woff2")format("woff2");}@font-face{font-family:Fraunces;font-style:italic;font-weight:400;font-display:swap;src:url("/fonts/fraunces-italic.woff2")format("woff2");}@font-face{font-family:Fraunces;font-style:normal;font-weight:600;font-display:swap;src:url("/fonts/fraunces-600.woff2")format("woff2");}@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url("/fonts/plex-400.woff2")format("woff2");}@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url("/fonts/plex-500.woff2")format("woff2");}:root{--ink:#14120e;--ink-2:#1c1a16;--bone:#f3ecdf;--bone-2:#e7dfd0;--muted:#cfc6b8;--brass:#e0b15a;--brass-2:#f0cb86;--line:rgba(243,236,223,0.14);--paper:#f3ecdf;--glyph:#1a1612;color-scheme:dark;}*{box-sizing:border-box;}html{scroll-behavior:smooth;}body{margin:0;min-height:100vh;padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right);background:radial-gradient(ellipse 70% 45% at 8% -10%,rgba(224,177,90,0.16),transparent 55%),radial-gradient(ellipse 40% 30% at 100% 0%,rgba(143,158,120,0.07),transparent 50%),var(--ink);color:var(--bone);font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:15px;line-height:1.55;}img{max-width:100%;}button,input,select{font:inherit;color:inherit;}button{cursor:pointer;}::selection{background:var(--brass);color:var(--ink);}.grain{position:fixed;inset:0;width:100%;height:100%;pointer-events:none;opacity:0.05;z-index:40;mix-blend-mode:overlay;}.skip{position:absolute;left:1rem;top:-4rem;z-index:50;background:var(--brass);color:var(--ink);padding:0.55rem 0.8rem;text-decoration:none;}.skip:focus{top:0.6rem;}.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0;}.wrap{width:min(1180px,calc(100% - 2rem));margin:0 auto;min-width:0;}.inner{width:min(1180px,calc(100% - 2rem));margin:0 auto;}header{position:sticky;top:0;z-index:20;padding-top:env(safe-area-inset-top);background:rgba(20,18,14,0.78);backdrop-filter:blur(16px);border-bottom:1px solid var(--line);}header .inner,footer .inner{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:68px;}.logo,.word{display:inline-flex;align-items:center;gap:0.55rem;color:var(--bone);text-decoration:none;}.logo svg{width:34px;height:34px;}.word{font-family:Fraunces,Georgia,serif;font-weight:600;font-size:1.35rem;letter-spacing:-0.03em;}.word span{font-family:"IBM Plex Mono",monospace;font-weight:500;font-size:0.68rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--brass);margin-left:0.15rem;}nav{display:flex;gap:1.1rem;}nav a{color:var(--muted);text-decoration:none;font-size:0.68rem;letter-spacing:0.14em;text-transform:uppercase;}nav a:hover{color:var(--brass-2);}.lang-menu{position:relative;}.lang-menu details{position:relative;border:0;padding:0;}.lang-menu summary{cursor:pointer;list-style:none;min-height:0;display:inline-flex;align-items:center;gap:0.35rem;width:auto;color:var(--muted);font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:0.68rem;font-weight:400;letter-spacing:0.12em;text-transform:uppercase;}.lang-menu summary::after{font-size:0.68rem;}.lang-menu summary::-webkit-details-marker{display:none;}.lang-menu ul{position:absolute;z-index:5;top:0;bottom:auto;transform:translateY(calc(-100% - 0.35rem));left:0;margin:0;padding:0.3rem;list-style:none;min-width:11rem;background:var(--ink-2);border:1px solid var(--line);}.lang-menu a{display:flex;align-items:center;min-height:32px;padding:0 0.55rem;color:var(--bone);font-family:"IBM Plex Mono",ui-monospace,monospace;font-size:0.72rem;text-decoration:none;}.lang-menu a:hover,.lang-menu a[aria-current="page"]{color:var(--brass-2);}.claude-btn{color:var(--bone);text-decoration:none;font-size:0.68rem;letter-spacing:0.12em;text-transform:uppercase;border:1px solid rgba(243,236,223,0.28);min-height:40px;display:inline-flex;align-items:center;padding:0 0.8rem;}.claude-btn:hover{color:var(--brass-2);border-color:var(--brass);}.share{position:relative;}.share-btn{border:0;background:transparent;color:var(--bone);font:inherit;font-size:0.68rem;letter-spacing:0.14em;text-transform:uppercase;min-height:44px;padding:0 0.15rem;cursor:pointer;}.share-btn:hover,.share-btn[aria-expanded="true"]{color:var(--brass-2);}.stage-tools{display:flex;flex-wrap:wrap;align-items:center;gap:0.4rem;margin:0 0 0.55rem;}.stage-tools .frame-actions{display:flex;flex-wrap:wrap;gap:0.4rem;}.stage-tools .btn{color:var(--bone);border-color:rgba(243,236,223,0.28);background:transparent;}.stage-tools .btn.primary{background:var(--bone);color:var(--ink);border-color:var(--bone);}.stage .share-btn{border:1px solid rgba(243,236,223,0.28);padding:0 0.95rem;}.share-menu{position:absolute;top:calc(100%+0.35rem);left:0;right:auto;z-index:30;display:flex;flex-direction:column;min-width:168px;padding:0.3rem;background:var(--ink-2);border:1px solid var(--line);box-shadow:0 16px 40px rgba(0,0,0,0.35);}.share-menu[hidden]{display:none;}.share-menu a,.share-menu button{display:flex;align-items:center;min-height:44px;padding:0 0.7rem;border:0;background:transparent;color:var(--bone);font:inherit;font-size:0.72rem;letter-spacing:0.08em;text-transform:uppercase;text-decoration:none;text-align:left;cursor:pointer;}.share-menu a:hover,.share-menu button:hover{color:var(--brass-2);}.studio{padding:2.2rem 0 1rem;}.studio-intro{margin-bottom:1.4rem;}.eyebrow{margin:0;color:var(--brass);font-size:0.68rem;letter-spacing:0.16em;text-transform:uppercase;}h1,h2,h3{font-family:Fraunces,Georgia,serif;font-weight:600;letter-spacing:-0.03em;line-height:1.02;}h1{font-size:clamp(2.5rem,5vw,4.4rem);margin:0.35rem 0 0.7rem;max-width:12ch;}h1 em{font-style:italic;font-weight:400;}.lede{max-width:62ch;margin:0;color:var(--muted);font-size:0.95rem;}.noscript{background:var(--brass);color:var(--ink);padding:0.8rem 1rem;margin-bottom:1rem;}.noscript p{margin:0;}.workspace{display:block;min-width:0;}.has-image .workspace{display:grid;grid-template-columns:340px minmax(0,1fr);gap:1.15rem;align-items:start;}.panel{position:static;max-height:none;overflow:visible;padding:0;border:0;background:transparent;}.has-image .panel{position:sticky;top:84px;max-height:calc(100vh - 100px);overflow:auto;padding:0.95rem;border:1px solid var(--line);background:rgba(255,255,255,0.02);scrollbar-width:thin;}.after[hidden],.stage[hidden]{display:none!important;}.save-label{align-self:center;color:var(--muted);font-size:0.66rem;letter-spacing:0.12em;text-transform:uppercase;}fieldset{border:0;margin:0 0 1rem;padding:0.85rem 0 0;border-top:1px solid var(--line);min-inline-size:0;}legend{padding:0;font-size:0.66rem;letter-spacing:0.16em;text-transform:uppercase;color:var(--brass-2);}fieldset:disabled{opacity:0.42;}.drop{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;min-height:280px;margin-bottom:0;padding:1.5rem 1rem;border:1px dashed var(--brass);cursor:pointer;background:linear-gradient(180deg,rgba(224,177,90,0.1),transparent 70%);}.has-image .drop{align-items:flex-start;text-align:left;min-height:0;margin-bottom:0.85rem;padding:0.9rem;}.drop:hover,.drop.hot,.drop:focus-within{border-color:var(--brass);background:rgba(224,177,90,0.08);}.drop-kicker{color:var(--brass);font-size:0.66rem;letter-spacing:0.16em;text-transform:uppercase;}.drop-title{font-family:Fraunces,Georgia,serif;font-size:clamp(2.2rem,4vw,3.1rem);letter-spacing:-0.03em;line-height:1;margin:0.3rem 0;}.drop-sub{color:var(--muted);font-size:0.75rem;}#thumb{width:72px;height:72px;object-fit:cover;margin-top:0.75rem;background:var(--bone);}#thumb[hidden]{display:none;}.has-image .drop-title{font-size:1.7rem;overflow-wrap:anywhere;}.actions,.chips,.presets,.segments,.checks{display:flex;flex-wrap:wrap;gap:0.4rem;}.checks{margin-top:0.7rem;}.btn,.presets button,.chips button,.segments label,select,.text-input{border:1px solid rgba(243,236,223,0.22);background:transparent;color:var(--bone);min-height:40px;}.btn,.presets button,.chips button{padding:0.45rem 0.6rem;font-size:0.68rem;letter-spacing:0.08em;text-transform:uppercase;}.btn:hover,.presets button:hover,.chips button:hover,.segments label:hover{border-color:var(--brass);color:var(--brass-2);}.btn.primary,.presets button[aria-pressed="true"],.chips button[aria-pressed="true"]{background:var(--bone);color:var(--ink);border-color:var(--bone);}.btn.primary:hover{background:var(--brass-2);color:var(--ink);border-color:var(--brass-2);}.segments{display:grid;grid-template-columns:1fr 1fr;}.segments.three{grid-template-columns:1.35fr 1fr 0.85fr;}.segments.even{grid-template-columns:repeat(3,minmax(0,1fr));}.segments label{display:flex;align-items:center;justify-content:center;text-align:center;padding:0.4rem 0.45rem;font-size:0.68rem;letter-spacing:0.06em;text-transform:uppercase;cursor:pointer;}.segments input{position:absolute;opacity:0;width:1px;height:1px;}.segments label:has(input:checked){background:var(--bone);color:var(--ink);border-color:var(--bone);}.segments label:has(input:focus-visible){outline:2px solid var(--brass);outline-offset:2px;}select,.text-input{width:100%;padding:0.6rem 0.65rem;font-size:16px;border-radius:0;}select{margin-top:0.55rem;}#custom-wrap{margin-top:0.55rem;}.field-label,.slider-head label{font-size:0.72rem;letter-spacing:0.06em;text-transform:uppercase;color:var(--muted);}.slider-head{display:flex;justify-content:space-between;align-items:baseline;margin:0.65rem 0 0.15rem;}output{color:var(--bone);font-size:0.78rem;}.hint{margin:0.45rem 0 0;color:var(--muted);font-size:0.75rem;}input[type="range"]{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;margin:0;}input[type="range"]:focus-visible{outline:none;}input[type="range"]::-webkit-slider-runnable-track{height:2px;background:linear-gradient(90deg,var(--brass)var(--fill,0%),rgba(243,236,223,0.22)var(--fill,0%));}input[type="range"]::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;margin-top:-6px;background:var(--bone);border:0;}input[type="range"]::-moz-range-track{height:2px;background:rgba(243,236,223,0.22);border:0;}input[type="range"]::-moz-range-progress{height:2px;background:var(--brass);}input[type="range"]::-moz-range-thumb{width:14px;height:14px;border:0;border-radius:0;background:var(--bone);}input[type="range"]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 2px var(--ink),0 0 0 4px var(--brass);}.check{display:inline-flex;align-items:center;gap:0.5rem;min-height:40px;font-size:0.72rem;letter-spacing:0.06em;text-transform:uppercase;cursor:pointer;}.check input{appearance:none;width:16px;height:16px;margin:0;border:1px solid rgba(243,236,223,0.45);display:grid;place-items:center;background:transparent;}.check input:checked{background:var(--brass);border-color:var(--brass);}.check input:checked::after{content:"";width:8px;height:8px;background:var(--ink);}.check input:focus-visible{outline:2px solid var(--brass);outline-offset:2px;}.actions{margin:0.75rem 0 0.15rem;}.stage,.frame,.stage-scroll{min-width:0;max-width:100%;}.frame{position:relative;min-height:280px;display:flex;flex-direction:column;background:var(--paper);color:var(--glyph);box-shadow:0 1px 0 rgba(255,255,255,0.05)inset,0 30px 80px rgba(0,0,0,0.35);}.frame-bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:0.55rem 1rem;padding:0.65rem 0.85rem;border-bottom:1px solid color-mix(in srgb,currentColor 18%,transparent);font-size:0.66rem;letter-spacing:0.12em;text-transform:uppercase;}.frame-bar p{margin:0;opacity:0.72;}.frame-actions{display:flex;flex-wrap:wrap;gap:0.4rem;}.frame-actions .btn{color:inherit;border-color:color-mix(in srgb,currentColor 40%,transparent);background:transparent;}.frame-actions .btn.primary{background:currentColor;color:var(--paper,#f3ecdf);border-color:currentColor;}.ticks i{position:absolute;width:12px;height:12px;border:1px solid currentColor;opacity:0.45;pointer-events:none;}.ticks i:nth-child(1){top:46px;left:10px;border-right:0;border-bottom:0;}.ticks i:nth-child(2){top:46px;right:10px;border-left:0;border-bottom:0;}.ticks i:nth-child(3){bottom:10px;left:10px;border-right:0;border-top:0;}.ticks i:nth-child(4){bottom:10px;right:10px;border-left:0;border-top:0;}.stage-scroll{overflow:auto;max-height:min(72vh,820px);padding:1.3rem 1.15rem 1.5rem;flex:1;}#output{margin:0 auto;width:max-content;font-family:"IBM Plex Mono","DejaVu Sans Mono",ui-monospace,monospace;font-weight:400;line-height:1;letter-spacing:0;font-variant-ligatures:none;font-feature-settings:"liga"0,"calt"0;white-space:pre;tab-size:1;}#output.grid span.g{display:inline-block;width:1ch;height:1em;line-height:1;vertical-align:top;text-align:center;overflow:hidden;}#original{display:block;max-width:100%;max-height:min(68vh,760px);margin:0 auto;object-fit:contain;}#original[hidden],#output[hidden]{display:none!important;}.guide,.faq{padding:4.5rem 0 1rem;}.guide{display:grid;grid-template-columns:minmax(220px,0.8fr)1.2fr;gap:2.5rem;}.guide-title{position:sticky;top:96px;align-self:start;}.guide h2,.faq h2{font-size:clamp(2.1rem,4vw,3.5rem);margin:0.4rem 0 0;}.guide-body h3{font-size:1.7rem;margin:1.8rem 0 0.45rem;}.guide-body p{color:var(--muted);max-width:68ch;}.steps{list-style:none;margin:0.5rem 0 0;padding:0;}.steps li{display:grid;grid-template-columns:auto 1fr;gap:0.9rem;padding:0.9rem 0;border-top:1px solid var(--line);color:var(--bone);}.steps .n{font-family:Fraunces,Georgia,serif;font-style:italic;color:var(--brass);font-size:1.25rem;}.formats{margin:0.4rem 0 0;}.formats div{display:grid;grid-template-columns:14rem 1fr;gap:1rem;padding:0.7rem 0;border-top:1px solid var(--line);}.formats dt{color:var(--bone);}.formats dd{margin:0;color:var(--muted);}.faq-list{margin-top:1.4rem;}.faq-list details{border-top:1px solid var(--line);padding:0.85rem 0;}.faq-list details:last-child{border-bottom:1px solid var(--line);}.faq-list summary{cursor:pointer;font-family:Fraunces,Georgia,serif;font-size:clamp(1.25rem,2vw,1.7rem);letter-spacing:-0.02em;list-style:none;display:flex;justify-content:space-between;gap:1rem;align-items:baseline;}summary::-webkit-details-marker{display:none;}summary::after{content:"+";color:var(--brass);font-family:"IBM Plex Mono",monospace;font-size:1rem;}details[open]summary::after{content:"–";}details p{color:var(--muted);max-width:70ch;margin:0.55rem 0 0.3rem;}footer{margin-top:3rem;border-top:1px solid var(--line);}footer p{margin:0;color:var(--muted);font-size:0.78rem;max-width:46ch;}footer .word{color:var(--bone);}#toast{position:fixed;bottom:calc(1.2rem+env(safe-area-inset-bottom));left:50%;z-index:45;transform:translateX(-50%)translateY(10px);background:var(--bone);color:var(--ink);font-size:0.72rem;letter-spacing:0.08em;text-transform:uppercase;padding:0.75rem 0.95rem;opacity:0;pointer-events:none;transition:opacity 0.2s ease,transform 0.2s ease;}#toast.show{opacity:1;transform:translateX(-50%)translateY(0);}:focus-visible{outline:2px solid var(--brass);outline-offset:3px;}@media(max-width:960px){.guide,.formats div,.has-image .workspace{grid-template-columns:1fr;}.has-image .workspace{display:flex;flex-direction:column;}.panel,.has-image .panel,.guide-title{position:static;max-height:none;}header .inner,footer .inner{align-items:flex-start;padding:0.8rem 0;flex-wrap:wrap;}h1{max-width:none;}.frame{min-height:380px;}}@media(max-width:640px){nav{width:100%;flex-wrap:wrap;}.drop{min-height:220px;}.segments.three,.segments.even{grid-template-columns:repeat(3,minmax(0,1fr));}.segments label{letter-spacing:0.03em;padding:0.45rem 0.2rem;}.stage-scroll{max-height:70vh;}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto;}*,*::before,*::after{animation:none!important;transition:none!important;}}@media print{header,footer,.panel,.guide,.faq,.grain,#toast,.studio-intro,.noscript{display:none!important;}body{background:white;}.wrap,.workspace,.stage,.frame{display:block;width:auto;max-width:none;box-shadow:none;}.stage-scroll{overflow:visible;max-height:none;}}