:root{--buncss-light:initial;--buncss-dark: ;color-scheme:light;--bg:#f5efe1;--bg-grain:#ede5d3;--panel:#fbf6ea;--panel-2:#f0e9d6;--panel-inset:#ebe2cc;--ink:#221d14;--ink-soft:#4d4536;--ink-quiet:#8a7f6a;--muted:#9d927b;--line:#e0d6bc;--line-strong:#c9bd9d;--rule:#cfc5ae;--accent:#221d14;--accent-ink:#fbf6ea;--accent-soft:#ebe2cc;--danger:#9b3a2c;--danger-bg:#f3dfd5;--danger-line:#d9b6a7;--brand-tile:#221d14;--brand-mark:#fbf6ea;--checker:#d8cfb6;--checker-bg:#fbf6ea;--shadow:0 1px 0 #3c2d140a,0 1px 2px #3c2d140d;--shadow-lift:0 1px 0 #3c2d140d,0 4px 14px #3c2d1414;--shadow-press:inset 0 1px 0 #0000000a,0 1px 2px #3c2d140f;--radius:16px;--radius-sm:10px;--radius-pill:999px;--ease-out:cubic-bezier(.22,1,.36,1);--ease-in-out:cubic-bezier(.65,0,.35,1);--t-fast:.14s;--t-base:.22s;--t-slow:.42s;--font-display:"Iowan Old Style","Palatino Linotype","Book Antiqua",Palatino,"Source Serif Pro",Georgia,"Times New Roman",serif;--font-body:-apple-system,BlinkMacSystemFont,"Segoe UI","Inter",Roboto,"PingFang SC","Hiragino Sans GB","Microsoft YaHei",sans-serif;--font-mono:ui-monospace,"SF Mono",SFMono-Regular,"JetBrains Mono",Menlo,Consolas,monospace;--fs-display:clamp(28px,3.4vw,40px);--fs-display-sm:clamp(20px,1.8vw,24px);--fs-body:14px;--fs-small:12px;--fs-micro:11px;--gap-1:6px;--gap-2:12px;--gap-3:18px;--gap-4:24px;--gap-5:36px}[data-theme=dark]{--buncss-light: ;--buncss-dark:initial;color-scheme:dark;--bg:#15110b;--bg-grain:#1b170f;--panel:#1c1810;--panel-2:#221d14;--panel-inset:#2a241a;--ink:#f0e7d2;--ink-soft:#cdc2a8;--ink-quiet:#908574;--muted:#8b8070;--line:#2a241a;--line-strong:#3a3122;--rule:#3a3122;--accent:#f0e7d2;--accent-ink:#1c1810;--accent-soft:#2a241a;--danger:#e08a76;--danger-bg:#2a1a13;--danger-line:#4a2818;--brand-tile:#f0e7d2;--brand-mark:#1c1810;--checker:#2e2818;--checker-bg:#1c1810;--shadow:0 1px 0 #00000059,0 1px 2px #0006;--shadow-lift:0 1px 0 #0006,0 6px 20px #00000080;--shadow-press:inset 0 1px 0 #ffffff08,0 1px 2px #0006}*{box-sizing:border-box}html,body,#root{height:100%;margin:0}body{font:var(--fs-body)/1.55 var(--font-body);font-feature-settings:"ss01","ss02","cv01";background:var(--bg);background-image:radial-gradient(ellipse at 20% 0%,var(--bg-grain)0%,transparent 50%),radial-gradient(ellipse at 100% 100%,var(--bg-grain)0%,transparent 60%);color:var(--ink);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}button{font:inherit;color:inherit}.app{display:grid;grid-template-rows:auto auto minmax(0,1fr)auto;height:100vh;padding:env(safe-area-inset-top,0)env(safe-area-inset-right,0)env(safe-area-inset-bottom,0)env(safe-area-inset-left,0);height:100dvh}.app>*{animation:rise var(--t-slow)var(--ease-out)both}.app>.topbar{animation-delay:0s}.app>.section-nav{animation-delay:40ms}.app>.workspace,.app>.solo{animation-delay:80ms}.app>.footer{animation-delay:.14s}@keyframes rise{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important}}.topbar{display:grid;grid-template-columns:auto 1fr auto;align-items: center;gap:var(--gap-4);background:color-mix(in srgb,var(--panel)88%,transparent);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--line);position:relative;z-index:5;padding:14px 28px}.brand{display:flex;text-decoration:none;color:inherit;align-items: center;gap:10px}button.brand-link{font:inherit;color:inherit;cursor:pointer;background:0 0;border:0;padding:0}.brand-link .brand-name,.brand-link .brand-tag{transition:opacity var(--t-fast)var(--ease-out)}.brand-link:hover .brand-name{opacity:.72}.brand-link:focus-visible{outline:2px solid var(--ink-soft);outline-offset:3px;border-radius:8px}.brand-mark{display:grid;background:var(--brand-tile);color:var(--brand-mark);box-shadow:var(--shadow);border-radius:8px;place-items: center;width:30px;height:30px}.brand-mark svg{display:block}.brand-text{display:flex;flex-direction:column;gap:0;line-height:1}.brand-name{font-family:var(--font-display);letter-spacing:-.01em;font-size:19px;font-weight:600}.brand-tag{font-family:var(--font-display);color:var(--ink-quiet);letter-spacing:.02em;margin-top:3px;font-size:11px;font-style:italic}.crumb{display:flex;font-size:var(--fs-small);color:var(--ink-quiet);align-items: center;gap:10px;min-width:0}.crumb-file{font-family:var(--font-display);color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:32ch;font-size:13px;font-style:italic}.crumb-dot{background:var(--line-strong);border-radius:50%;width:3px;height:3px}.crumb-dim{font-variant-numeric:tabular-nums;letter-spacing:.02em}.crumb-close{display:grid;border:1px solid var(--line-strong);color:var(--ink-quiet);cursor:pointer;transition:color var(--t-fast)var(--ease-out),border-color var(--t-fast)var(--ease-out),background var(--t-fast)var(--ease-out);background:0 0;border-radius:6px;flex:none;place-items: center;width:22px;height:22px}.crumb-close:hover{color:var(--ink);border-color:var(--ink-soft);background:var(--panel-2)}.crumb-close:focus-visible{outline:2px solid var(--ink-soft);outline-offset:2px}.header-actions{display:flex;align-items: center;gap:8px}.btn{display:inline-flex;border:1px solid var(--line-strong);background:var(--panel);color:var(--ink);border-radius:var(--radius-pill);letter-spacing:.01em;cursor:pointer;transition:transform var(--t-fast)var(--ease-out),box-shadow var(--t-fast)var(--ease-out),background var(--t-fast),border-color var(--t-fast);align-items: center;gap:7px;padding:8px 16px;font-size:13px;font-weight:500}.btn:hover:not(:disabled){box-shadow:var(--shadow-lift);transform:translateY(-1px)}.btn:active:not(:disabled){box-shadow:var(--shadow-press);transform:translateY(0)}.btn:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.btn.primary{background:var(--ink);color:var(--accent-ink);border-color:var(--ink);font-weight:600}.btn.primary:hover:not(:disabled){background:color-mix(in srgb,var(--ink)90%,#000)}.btn.ghost{color:var(--ink-soft);background:0 0;border-color:#0000}.btn.ghost:hover:not(:disabled){background:var(--accent-soft);color:var(--ink);box-shadow:none}.btn.ghost.active{border-color:var(--line-strong);color:var(--ink);background:var(--panel);font-weight:600}.btn.icon{display:inline-grid;border-radius:10px;place-items: center;width:34px;height:34px;padding:0;font-size:15px}.btn:disabled{opacity:.42;cursor:default;box-shadow:none;transform:none}.workspace{display:grid;grid-template-columns:320px minmax(0,1fr);grid-template-areas:"rail stage";overflow:hidden;min-height:0}.workspace>.rail{grid-area:rail}.workspace>.workspace-main,.workspace>.stage-col{grid-area:stage}.workspace-main{display:grid;grid-template-rows:auto minmax(0,1fr);overflow:hidden;min-width:0;min-height:0}.workspace-main>.stage-col{min-height:0}.workspace-main>.error{margin:10px 16px 0}.rail{display:flex;border-right:1px solid var(--line);background:var(--panel);overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;-webkit-overflow-scrolling:touch;flex-direction:column;min-height:0}.rail-section{border-bottom:1px solid var(--line);padding:22px}.rail-section:last-child{border-bottom:none}.stage-col{display:grid;grid-template-rows:auto 1fr auto;background:repeating-linear-gradient(0deg,transparent 0px,transparent 31px,var(--line)32px,var(--line)32px),var(--bg);background-size:100% 32px;min-width:0;min-height:0}.stage-head{display:flex;justify-content:space-between;align-items: center;gap:var(--gap-3);border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--panel)70%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);flex-wrap:wrap;padding:16px 28px}.section-nav{overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;place-self: center;max-width:calc(100% - 32px);margin:12px 16px 0}.section-nav::-webkit-scrollbar{display:none}.solo{overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;width:100%;max-width:1080px;min-height:0;margin:0 auto;padding:0 clamp(12px,3vw,28px)}.solo .readout{display:none}.solo .stage-col{display:block;background:0 0;min-height:0}.solo .stage-canvas.empty-canvas{padding:clamp(12px,3vw,28px) 0 clamp(28px,5vw,48px)}.mcp-guide{max-width:720px;margin:0 auto;padding:30px 26px 40px}.mcp-h{font-family:var(--font-display);letter-spacing:.04em;text-transform:uppercase;color:var(--ink-quiet);margin:26px 0 8px;font-size:13px;font-weight:600}.mcp-tools{list-style:none;display:grid;font-size:var(--fs-small);color:var(--ink-soft);gap:8px;margin:0;padding:0}.mcp-tools code{font:12.5px/1.5 var(--font-mono);color:var(--ink);background:var(--panel-inset);border:1px solid var(--line);border-radius:6px;padding:1px 6px}.code-block{font:12px/1.6 var(--font-mono);color:var(--ink);background:var(--panel-inset);border:1px solid var(--line);border-radius:var(--radius-sm);white-space:pre-wrap;word-break:break-word;overflow-x:auto;margin:0;padding:12px 16px}.tabs{display:inline-flex;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-pill);box-shadow:var(--shadow);align-items: center;gap:2px;padding:3px}.tabs button{letter-spacing:.02em;color:var(--ink-quiet);cursor:pointer;border-radius:var(--radius-pill);transition:background var(--t-fast),color var(--t-fast);background:0 0;border:0;padding:6px 14px;font-size:12px;font-weight:500}.tabs button:hover:not(.active):not(:disabled){color:var(--ink)}.tabs button.active{background:var(--ink);color:var(--accent-ink);font-weight:600}.tabs button:disabled{opacity:.35;cursor:default}.head-actions{display:flex;align-items: center;gap:8px}.stage-canvas{position:relative;display:grid;padding:var(--gap-4);overflow:hidden;place-items: center;min-height:0}.stage-canvas.has-source{padding:0}.stage-canvas.empty-canvas{display:flex;justify-content:flex-start;align-items: center;gap:var(--gap-4);overflow:auto;scrollbar-gutter:stable;flex-direction:column}.readout{display:flex;justify-content:space-between;align-items: center;gap:var(--gap-3);border-top:1px solid var(--line);background:var(--panel);font-size:var(--fs-small);color:var(--ink-soft);flex-wrap:wrap;padding:14px 28px}.readout-main{display:flex;align-items:baseline;gap:var(--gap-2);flex-wrap:wrap}.readout-cell{display:inline-flex;font-variant-numeric:tabular-nums;align-items:baseline;gap:6px}.readout-cell .num{font-family:var(--font-display);color:var(--ink);letter-spacing:-.01em;font-size:16px;font-weight:600}.readout-cell .lbl{text-transform:uppercase;letter-spacing:.1em;color:var(--ink-quiet);font-size:10px;font-weight:600}.readout-rule{background:var(--line-strong);width:1px;height:14px}.readout-side{display:flex;align-items: center;gap:var(--gap-2);color:var(--ink-quiet);font-style:italic;font-family:var(--font-display);font-size:13px}.palette-strip{display:inline-flex;border:1px solid var(--line);border-radius:var(--radius-pill);background:var(--panel);align-items: center;gap:0;height:22px;padding:2px 6px 2px 8px}.palette-swatches{display:flex;align-items: center}.palette-swatch{border:1.5px solid var(--panel);box-shadow:var(--shadow);border-radius:50%;width:14px;height:14px;margin-left:-4px}.palette-swatch:first-child{margin-left:0}.palette-swatch.placeholder{background:repeating-linear-gradient(45deg,var(--line)0 3px,transparent 3px 6px);border-color:var(--line-strong);box-shadow:none}.palette-meta{font-family:var(--font-display);color:var(--ink-quiet);letter-spacing:.04em;margin-left:8px;font-size:11px;font-style:italic}.frame{border:1px solid var(--line);border-radius:var(--radius);background:var(--panel);box-shadow:var(--shadow-lift);position:relative;overflow:hidden}.frame img{display:block}.checker{background-image:linear-gradient(45deg,var(--checker)25%,transparent 25%,transparent 75%,var(--checker)75%),linear-gradient(45deg,var(--checker)25%,transparent 25%,transparent 75%,var(--checker)75%);background-position:0 0,8px 8px;background-size:16px 16px;background-color:var(--checker-bg)}.compare{display:grid;grid-template-columns:1fr 1fr;gap:var(--gap-3);width:100%;max-width:1280px;height:100%}.compare-cell{display:grid;grid-template-rows:auto 1fr;gap:10px;min-height:0}.compare-cell figcaption{display:flex;font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:.14em;color:var(--ink-quiet);justify-content:space-between;align-items: center;padding:0 4px;font-weight:600}.compare-cell figcaption em{font-family:var(--font-display);text-transform:none;letter-spacing:0;color:var(--ink-soft);font-size:12px;font-style:italic;font-weight:400}.compare-cell .frame{display:grid;place-items: center;min-height:0;padding:14px}.compare-cell .frame img{object-fit:contain;width:auto;max-width:100%;height:auto;max-height:100%}.compare-empty{font-family:var(--font-display);color:var(--ink-quiet);font-size:13px;font-style:italic}.wipe-frame{display:grid;grid-template-rows:auto 1fr;gap:10px;width:100%;max-width:1100px;height:100%;min-height:0}.wipe-box{position:relative;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow-lift);overflow:hidden;touch-action:none;cursor:col-resize;background:var(--checker-bg)}.wipe-box img{position:absolute;object-fit:contain;user-select:none;width:100%;height:100%;padding:14px;inset:0}.wipe-box img.top{z-index:2}.wipe-box img.base{z-index:1}.wipe-divider{position:absolute;background:var(--accent);z-index:3;pointer-events:none;width:2px;top:0;bottom:0;box-shadow:0 0 0 1px #ffffff2e}[data-theme=dark] .wipe-divider{box-shadow:0 0 0 1px #0000004d}.wipe-handle{position:absolute;background:var(--accent);color:var(--accent-ink);display:grid;box-shadow:var(--shadow-lift);transition:transform var(--t-base)var(--ease-out);letter-spacing:-2px;border-radius:50%;place-items: center;width:36px;height:36px;font-size:13px;top:50%;left:50%;transform:translate(-50%,-50%)}.wipe-box:hover .wipe-handle{transform:translate(-50%,-50%)scale(1.1)}.chip{position:absolute;z-index:3;letter-spacing:.16em;text-transform:uppercase;background:color-mix(in srgb,var(--panel)80%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--line-strong);color:var(--ink);border-radius:var(--radius-pill);pointer-events:none;padding:4px 10px;font-size:10px;font-weight:600;top:14px}.chip.left{left:14px}.chip.right{right:14px}.wipe-foot{display:flex;font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:.14em;color:var(--ink-quiet);justify-content:space-between;align-items: center;min-width:0;padding:0 8px}.wipe-foot .pos{font-variant-numeric:tabular-nums;font-family:var(--font-display);text-transform:none;letter-spacing:0;color:var(--ink-soft);font-size:13px;font-style:italic}.zoom-wrap{display:grid;grid-template-rows:1fr auto;gap:var(--gap-2);width:100%;height:100%;min-height:0}.zoom-box{position:relative;border:1px solid var(--line);border-radius:var(--radius);background:var(--checker-bg);box-shadow:var(--shadow-lift);overflow:hidden;touch-action:none;display:grid;place-items: center}.zoom-box.pannable{cursor:grab}.zoom-box.pannable:active{cursor:grabbing}.zoom-box img{object-fit:contain;user-select:none;will-change:transform;max-width:100%;max-height:100%;transition:transform 60ms linear}.zoombar{display:inline-flex;background:var(--panel);border:1px solid var(--line);border-radius:var(--radius-pill);box-shadow:var(--shadow);place-self: center;align-items: center;gap:4px;padding:4px 6px}.zoombar button{cursor:pointer;color:var(--ink-soft);display:grid;transition:background var(--t-fast),color var(--t-fast);background:0 0;border:0;border-radius:8px;place-items: center;width:30px;height:30px;font-size:15px}.zoombar button:hover:not(:disabled){background:var(--accent-soft);color:var(--ink)}.zoombar button:disabled{opacity:.4;cursor:default}.zoom-pct{font-variant-numeric:tabular-nums;color:var(--ink-quiet);text-align:center;font-size:11px;font-family:var(--font-display);min-width:42px;font-style:italic}.source-wrap{display:grid;grid-template-rows:auto 1fr;width:100%;height:100%;min-height:0}.source-meta{display:flex;align-items: center;gap:var(--gap-2);font-size:var(--fs-micro);text-transform:uppercase;letter-spacing:.14em;color:var(--ink-quiet);padding:0 4px 8px;font-weight:600}.source-meta em{font-family:var(--font-display);text-transform:none;letter-spacing:0;color:var(--ink-soft);font-size:12px;font-style:italic;font-weight:500}.source-box{display:grid;grid-template-columns:auto 1fr;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;min-height:0}.source-gutter{text-align:right;font:12px/1.6 var(--font-mono);color:var(--ink-quiet);background:var(--panel-inset);border-right:1px solid var(--line);user-select:none;white-space:pre;overflow:hidden;padding:14px 12px}.source-code{font:12px/1.6 var(--font-mono);color:var(--ink);white-space:pre;word-break:break-word;overflow:auto;margin:0;padding:14px 18px}.source-code .tag{color:var(--ink-quiet)}.source-code .attr{color:var(--ink-soft)}.source-code .str{color:var(--ink)}.settings{display:flex;flex-direction:column}.section-label{display:flex;font-family:var(--font-display);letter-spacing:.04em;color:var(--ink-quiet);justify-content:space-between;align-items:baseline;margin:0 0 14px;font-size:12px;font-style:italic;font-weight:500}.section-label:after{content:"";background:var(--rule);flex:1;align-self: center;height:1px;margin-left:10px}.presets{display:grid;grid-template-columns:repeat(2,1fr);gap:6px}.preset-chip{position:relative;display:flex;border:1px solid var(--line);border-radius:var(--radius-sm);cursor:pointer;text-align:left;font:inherit;color:var(--ink-quiet);transition:background var(--t-fast),border-color var(--t-fast),color var(--t-fast);background:0 0;flex-direction:column;align-items: flex-start;gap:4px;padding:10px 12px}.preset-chip:hover{border-color:var(--line-strong);color:var(--ink-soft)}.preset-chip.active{background:var(--panel-inset);border-color:var(--ink);color:var(--ink)}.preset-chip.active:before{content:"";position:absolute;background:var(--ink);border-radius:3px 0 0 3px;width:3px;top:-1px;bottom:-1px;left:-1px}.preset-chip .pc-name{font-family:var(--font-display);letter-spacing:-.005em;font-size:14px;font-weight:600}.preset-chip .pc-desc{text-transform:uppercase;letter-spacing:.1em;color:var(--ink-quiet);font-size:10px;font-weight:500}.preset-chip.active .pc-desc{color:var(--ink-soft)}.control{display:flex;flex-direction:column;gap:8px;margin-bottom:14px}.control:last-child{margin-bottom:0}.control-row{display:flex;color:var(--ink-soft);justify-content:space-between;align-items:baseline;gap:8px;font-size:12px;font-weight:500}.control-row em{font-variant-numeric:tabular-nums;font-style:normal;font-family:var(--font-display);color:var(--ink);font-size:13px;font-weight:600}.control input[type=range]{-webkit-appearance:none;appearance:none;background:var(--panel-inset);border-radius:var(--radius-pill);outline:none;cursor:pointer;accent-color:var(--ink);width:100%;height:4px}.control input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;background:var(--ink);border:3px solid var(--panel);box-shadow:var(--shadow);cursor:grab;transition:transform var(--t-fast)var(--ease-out);border-radius:50%;width:16px;height:16px}.control input[type=range]::-webkit-slider-thumb:hover{transform:scale(1.18)}.control input[type=range]::-moz-range-thumb{background:var(--ink);border:3px solid var(--panel);box-shadow:var(--shadow);cursor:grab;border-radius:50%;width:16px;height:16px}.toggle-row{display:flex;border-bottom:1px dotted var(--line);color:var(--ink-soft);justify-content:space-between;align-items: center;gap:10px;padding:9px 0;font-size:13px}.toggle-row:last-child{border-bottom:none}.toggle-row.disabled{opacity:.45}.toggle-switch{position:relative;display:inline-block;flex-shrink:0;width:32px;height:18px}.toggle-switch input{opacity:0;width:0;height:0}.toggle-track{position:absolute;background:var(--panel-inset);border:1px solid var(--line-strong);border-radius:var(--radius-pill);cursor:pointer;transition:background var(--t-fast),border-color var(--t-fast);inset:0}.toggle-track:before{content:"";position:absolute;background:var(--panel);box-shadow:var(--shadow);transition:transform var(--t-fast)var(--ease-out),background var(--t-fast);border-radius:50%;width:12px;height:12px;top:2px;left:2px}.toggle-switch input:checked+.toggle-track{background:var(--ink);border-color:var(--ink)}.toggle-switch input:checked+.toggle-track:before{background:var(--accent-ink);transform:translate(14px)}.toggle-switch input:focus-visible+.toggle-track{outline:2px solid var(--ink);outline-offset:2px}.seg{display:flex;background:var(--panel-inset);border:1px solid var(--line);border-radius:var(--radius-pill);gap:2px;padding:2px}.seg button{color:var(--ink-quiet);cursor:pointer;border-radius:var(--radius-pill);transition:background var(--t-fast),color var(--t-fast);background:0 0;border:0;flex:1;padding:5px 10px;font-size:11px;font-weight:500}.seg button:hover:not(.active):not(:disabled){color:var(--ink)}.seg button.active{background:var(--ink);color:var(--accent-ink);font-weight:600}.seg button:disabled{opacity:.35;cursor:default}.disclosure{border-top:1px solid var(--line);margin-top:6px;padding-top:14px}.disclosure summary{list-style:none;cursor:pointer;display:flex;font-family:var(--font-display);color:var(--ink-quiet);user-select:none;justify-content:space-between;align-items: center;padding:4px 0;font-size:12px;font-style:italic}.disclosure summary::-webkit-details-marker{display:none}.disclosure summary:after{content:"+";font-style:normal;font-family:var(--font-body);color:var(--ink-quiet);transition:transform var(--t-fast)var(--ease-out);font-size:16px;line-height:1}.disclosure[open] summary:after{content:"−"}.disclosure-body{padding-top:12px}.dropzone{position:relative;border:2px dashed var(--line-strong);border-radius:var(--radius);background:var(--panel-2);text-align:center;cursor:pointer;color:var(--ink-quiet);transition:border-color var(--t-base),background var(--t-base),transform var(--t-base)var(--ease-out);display:flex;flex-direction:column;align-items: center;gap:4px;padding:16px}.dropzone:hover,.dropzone.dragging{border-color:var(--ink);background:var(--accent-soft);transform:rotate(-.5deg)}.dropzone:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.dropzone.hero{background:var(--panel);border-style:dashed;border-width:2px;border-radius:20px;gap:10px;padding:56px 32px}.dropzone.hero .hero-title{font-family:var(--font-display);color:var(--ink);letter-spacing:-.01em;margin:4px 0 2px;font-size:clamp(20px,2.4vw,26px);font-weight:600;line-height:1.15}.dropzone.hero .hero-sub{font-family:var(--font-display);color:var(--ink-quiet);font-size:14px;font-style:italic}.dropzone.hero .hero-art{background:var(--ink);color:var(--accent-ink);display:grid;box-shadow:var(--shadow-lift);border-radius:12px;place-items: center;width:44px;height:44px}.dropzone.hero .hero-keys{display:flex;flex-wrap:wrap;justify-content:center;gap:10px;margin-top:16px}.dropzone.hero .hero-keys span{text-transform:uppercase;letter-spacing:.12em;color:var(--ink-quiet);font-size:11px;font-weight:600}.dropzone.hero .hero-keys em{color:var(--ink-soft);font-style:normal}.dropzone.compact strong{font-family:var(--font-display);color:var(--ink);font-size:13px;font-weight:600}.dropzone.compact .file-name{color:var(--ink-quiet);font-size:11px;font-style:italic;font-family:var(--font-display);word-break:break-all;text-align:center;margin-top:2px}.empty{display:grid;grid-template-rows:auto auto auto;gap:var(--gap-3);place-items: center;width:100%;max-width:620px}.empty-art{text-align:center;display:flex;align-items: center;gap:var(--gap-3);flex-direction:column}.empty-headline{font-family:var(--font-display);font-size:var(--fs-display);letter-spacing:-.02em;color:var(--ink);display:flex;flex-direction:column;gap:4px;max-width:16ch;margin:0;font-weight:600;line-height:1.05}.empty-headline em{color:var(--ink-quiet);letter-spacing:-.01em;font-size:.65em;font-style:italic;font-weight:500}.empty-sub{font-family:var(--font-display);color:var(--ink-quiet);max-width:44ch;margin:0;font-size:15px;font-style:italic;line-height:1.5}.empty-hint{text-transform:uppercase;letter-spacing:.14em;color:var(--ink-quiet);display:flex;flex-wrap:wrap;justify-content:center;align-items: center;gap:14px;font-size:11px;font-weight:600}.empty-hint span{display:inline-flex;align-items: center;gap:6px}.empty-hint .pip{display:inline-block;background:var(--ink-quiet);border-radius:50%;width:5px;height:5px}.empty .dropzone{width:100%;max-width:560px}.spinner{border:2px solid var(--line-strong);border-top-color:var(--ink);display:inline-block;animation:spin .7s linear infinite;border-radius:50%;width:12px;height:12px}@keyframes spin{to{transform:rotate(360deg)}}.progress{display:inline-block;background:var(--line);overflow:hidden;vertical-align:middle;border-radius:2px;width:96px;height:4px}.progress-bar{display:block;background:var(--ink);height:100%;transition:width .14s linear}.progress-pill{display:inline-flex;background:color-mix(in srgb,var(--panel)86%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--line-strong);border-radius:var(--radius-pill);color:var(--ink-soft);font-variant-numeric:tabular-nums;align-items: center;gap:8px;padding:6px 12px;font-size:11px}.progress-pill .phase{font-family:var(--font-display);color:var(--ink-quiet);font-style:italic}.busy-chip{position:absolute;z-index:4;display:inline-flex;background:color-mix(in srgb,var(--panel)88%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:1px solid var(--line-strong);border-radius:var(--radius-pill);box-shadow:var(--shadow);color:var(--ink-soft);font-variant-numeric:tabular-nums;align-items: center;gap:10px;padding:6px 14px;font-size:11px;top:14px;left:50%;transform:translate(-50%)}.error{display:flex;background:var(--danger-bg);color:var(--danger);border:1px solid var(--danger-line);border-radius:var(--radius-sm);align-items:baseline;gap:10px;margin:14px 28px 0;padding:12px 16px;font-size:13px}.error strong{font-family:var(--font-display);letter-spacing:.01em;font-style:italic;font-weight:600}.footer{border-top:1px solid var(--line);background:var(--panel);color:var(--ink-quiet);display:flex;justify-content:space-between;align-items: center;gap:var(--gap-3);flex-wrap:wrap;padding:10px 28px;font-size:11px}.footer span{font-family:var(--font-display);font-style:italic}.footer .dots{display:inline-flex;align-items: center;gap:4px}.footer .dot{background:var(--line-strong);border-radius:50%;width:4px;height:4px}.footer .dot.active{background:var(--ink)}.header-close-mobile{display:none}@media (max-width:1100px){.workspace{grid-template-columns:280px minmax(0,1fr)}.topbar{gap:var(--gap-2);padding:12px 20px}.stage-head,.readout{padding:12px 18px}.compare{gap:var(--gap-2)}.rail-section{padding:18px}.mcp-guide{padding:24px 8px 36px}}@media (max-width:900px){.workspace{grid-template-columns:1fr;grid-template-rows:minmax(0,1fr)auto;grid-template-areas:"stage" "rail"}.workspace>.workspace-main{grid-area:stage}.rail{border-right:none;border-top:1px solid var(--line);max-height:min(42dvh,380px)}.topbar{gap:8px;padding:10px 14px}.brand-tag,.crumb-dim,.crumb-dot{display:none}.crumb-file{max-width:18ch}.landing{padding-left:0;padding-right:0}}@media (max-width:720px){.compare{grid-template-columns:1fr;max-width:none}.compare-cell{min-height:min(42vw,220px)}.compare-cell .frame{padding:10px}.crumb{display:none}.header-close-mobile{display:inline-grid}.header-actions .btn.ghost,.header-actions .btn.primary .btn-label{display:none}.header-actions .btn.primary{display:inline-grid;border-radius:10px;place-items: center;width:40px;height:40px;padding:0}.topbar{grid-template-columns:1fr auto}.readout{gap:var(--gap-2);padding:10px 14px}.readout-side{display:none}.readout-cell .num{font-size:14px}.stage-head{padding:10px 14px}.stage-canvas{padding:var(--gap-2)}.empty-headline{font-size:clamp(22px,7vw,28px)}.empty-sub{padding:0 4px;font-size:14px}.empty-hint{letter-spacing:.1em;gap:10px 14px}.dropzone.hero{padding:32px 16px}.dropzone.hero .hero-keys{display:none}.error{margin:10px 14px 0}.footer{text-align:center;justify-content:center;padding:10px 14px}.presets{grid-template-columns:repeat(4,1fr)}.preset-chip{text-align:center;align-items: center;padding:8px 6px}.preset-chip .pc-desc{display:none}.preset-chip .pc-name{font-size:12px}}@media (max-width:480px){.presets{grid-template-columns:repeat(2,1fr)}.section-nav{margin-top:8px}.tabs button{padding:6px 12px;font-size:11px}.landing-headline{font-size:clamp(28px,9vw,36px)}.landing-lede{font-size:15px}.rail{max-height:min(48dvh,420px)}.compare-cell{min-height:180px}}@media (pointer:coarse){.btn{min-height:44px}.btn.icon{width:44px;height:44px}.header-actions .btn.primary{width:44px;height:44px;min-height:44px}.tabs button{min-height:40px;padding:10px 16px}.preset-chip{min-height:44px}.dropzone{padding:22px 14px}.proof-nav{width:44px;height:44px}.film-thumb{min-height:44px}.crumb-close{width:36px;height:36px}}.palette-field{display:flex;flex-direction:column;gap:6px}.palette-input{font:12px/1.4 var(--font-mono);color:var(--ink);background:var(--panel);border:1px solid var(--line);outline:none;transition:border-color var(--t-fast),box-shadow var(--t-fast);border-radius:8px;width:100%;padding:8px 10px}.palette-input:focus{border-color:var(--ink);box-shadow:0 0 0 3px color-mix(in srgb,var(--ink)10%,transparent)}.palette-input::placeholder{color:var(--muted);font-style:italic}.palette-swatches{display:flex;flex-wrap:wrap;gap:4px}.palette-swatch-input{border:1px solid var(--line-strong);box-shadow:var(--shadow);border-radius:4px;width:16px;height:16px}.palette-error{color:var(--danger);font-size:11px;font-family:var(--font-mono);line-height:1.4}.landing{display:flex;flex-direction:column;gap:clamp(28px,4vw,40px);width:100%;max-width:960px;padding:12px 4px 8px}.landing-top{display:flex;flex-direction:column;gap:clamp(20px,3vw,28px)}.landing-top .examples{padding-top:0;padding-bottom:0}.landing-hero{display:flex;flex-direction:column;align-items: flex-start;gap:14px;max-width:38rem}.landing-eyebrow{letter-spacing:.16em;text-transform:uppercase;color:var(--ink-quiet);margin:0;font-size:11px;font-weight:600}.landing-headline{display:flex;font-family:var(--font-display);letter-spacing:-.025em;color:var(--ink);flex-direction:column;gap:4px;margin:0;font-size:clamp(32px,5vw,44px);font-weight:600;line-height:1.05}.landing-headline em{letter-spacing:-.01em;color:var(--ink-quiet);font-size:.62em;font-style:italic;font-weight:500}.landing-lede{font-family:var(--font-display);color:var(--ink-soft);max-width:34em;margin:0;font-size:16px;font-style:italic;line-height:1.5}.landing-cta{display:flex;flex-wrap:wrap;gap:8px;padding-top:4px}.landing-band{display:flex;flex-direction:column;gap:12px;width:100%;max-width:960px;margin:0 auto;padding:clamp(20px,3vw,34px) 4px 8px}.landing-band h1{font-family:var(--font-display);letter-spacing:-.025em;color:var(--ink);margin:0;font-size:clamp(28px,4.5vw,40px);font-weight:600;line-height:1.05}.landing-band .lede{font-family:var(--font-display);color:var(--ink-soft);max-width:34em;margin:0;font-size:16px;font-style:italic;line-height:1.5}.landing-points{list-style:none;display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:8px 20px;max-width:46em;margin:0;padding:0}.landing-points li{position:relative;color:var(--ink-soft);padding-left:18px;font-size:14px;line-height:1.45}.landing-points li:before{content:"";position:absolute;background:var(--line-strong);width:8px;height:1px;top:.62em;left:0}.landing-cta{font:inherit;color:var(--accent-ink);background:var(--accent);border:1px solid var(--accent);border-radius:var(--radius-pill);cursor:pointer;align-self: flex-start;margin-top:4px;padding:9px 18px;font-size:14px;font-weight:500}.landing-cta:hover{background:var(--ink-soft);border-color:var(--ink-soft)}.landing-prerender{display:none}.landing-section-title{font-family:var(--font-display);color:var(--ink-soft);display:grid;grid-template-columns:auto 1fr;align-items: center;gap:12px;margin:0 0 12px;font-size:15px;font-style:italic;font-weight:500}.landing-section-title:after{content:"";background:var(--rule);height:1px}.landing-why-list{list-style:none;display:flex;border-top:1px solid var(--line);flex-direction:column;gap:0;margin:0;padding:0}.landing-why-list li{display:grid;grid-template-columns:minmax(9rem,12rem)1fr;border-bottom:1px solid var(--line);align-items:baseline;gap:16px 24px;padding:14px 2px}.landing-why-list strong{font-family:var(--font-display);letter-spacing:-.01em;color:var(--ink);font-size:15px;font-weight:600}.landing-why-list span{color:var(--ink-soft);font-size:13.5px;line-height:1.55}.landing-compare-lede{color:var(--ink-quiet);max-width:40em;margin:0 0 12px;font-size:13.5px;line-height:1.5}.landing-compare-list{border-top:1px solid var(--line);margin:0;padding:0}.landing-compare-row{display:grid;grid-template-columns:minmax(9rem,14rem)1fr;border-bottom:1px dotted var(--line);align-items:baseline;gap:12px 24px;padding:12px 2px}.landing-compare-row dt{font-family:var(--font-display);color:var(--ink);margin:0;font-size:13px;font-weight:600}.landing-compare-row dd{color:var(--ink-soft);margin:0;font-size:13px;line-height:1.5}@media (max-width:640px){.landing-why-list li,.landing-compare-row{grid-template-columns:1fr;gap:4px}}.examples{display:flex;gap:var(--gap-3);flex-direction:column;width:100%;max-width:960px;padding:8px 0 28px}.examples.busy{opacity:.72;pointer-events:none}.examples-head{padding:0 4px}.examples-title{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;gap:var(--gap-2);font-family:var(--font-display);margin:0}.examples-title-main{letter-spacing:-.005em;color:var(--ink-soft);font-size:17px;font-style:italic;font-weight:500}.examples-title-rule{background:var(--rule);align-self: center;height:1px}.examples-title-sub{text-transform:uppercase;letter-spacing:.12em;color:var(--ink-quiet);white-space:nowrap;font-size:11px;font-weight:600}.proof{position:relative;display:flex;background:var(--panel);border:1px solid var(--line-strong);border-radius:var(--radius);box-shadow:var(--shadow-lift);flex-direction:column;gap:14px;padding:18px 20px}.proof:before{content:"";position:absolute;background:var(--ink);border-radius:4px 0 0 4px;width:4px;top:-1px;bottom:-1px;left:-1px}.proof-toolbar{display:grid;grid-template-columns:auto 1fr auto;align-items: center;gap:12px}.proof-nav{display:inline-grid;border:1px solid var(--line);background:var(--panel-2);color:var(--ink-soft);cursor:pointer;transition:background var(--t-fast),color var(--t-fast),border-color var(--t-fast);border-radius:10px;place-items: center;width:36px;height:36px}.proof-nav:hover{background:var(--ink);color:var(--accent-ink);border-color:var(--ink)}.proof-nav:focus-visible{outline:2px solid var(--ink);outline-offset:2px}.proof-identity{display:flex;text-align:center;flex-direction:column;gap:2px;min-width:0}.proof-label{display:inline-flex;font-family:var(--font-display);letter-spacing:-.015em;color:var(--ink);flex-wrap:wrap;justify-content:center;align-items:baseline;gap:8px;font-size:clamp(18px,2.4vw,22px);font-weight:600}.proof-today{font-family:var(--font-body);letter-spacing:.08em;text-transform:uppercase;color:var(--accent-ink);background:var(--ink);border-radius:var(--radius-pill);padding:3px 8px;font-size:10px;font-style:normal;font-weight:600}.proof-flag{font-family:var(--font-mono);color:var(--ink-quiet);font-size:11px}.proof-stage{display:grid;grid-template-columns:1fr auto 1fr;animation:proof-in .28s var(--ease-out)both;align-items: center;gap:14px}@keyframes proof-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.proof-stage{animation:none}}.proof-frame{position:relative;aspect-ratio:4/3;background:var(--checker-bg);background-image:linear-gradient(45deg,var(--checker)25%,transparent 25%,transparent 75%,var(--checker)75%),linear-gradient(45deg,var(--checker)25%,transparent 25%,transparent 75%,var(--checker)75%);border:1px solid var(--line);overflow:hidden;display:grid;background-position:0 0,6px 6px;background-size:12px 12px;border-radius:12px;place-items: center;margin:0}.proof-frame img{object-fit:contain;display:block;width:100%;height:100%;padding:8px}.proof-arrow{display:grid;color:var(--ink-quiet);place-items: center}.example-chip{position:absolute;z-index:1;background:color-mix(in srgb,var(--panel)88%,transparent);backdrop-filter:blur(6px);-webkit-backdrop-filter:blur(6px);border:1px solid var(--line-strong);border-radius:var(--radius-pill);letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);pointer-events:none;padding:2px 8px;font-size:10px;font-weight:600;top:8px;left:8px}.proof-meta{display:flex;flex-direction:column;gap:6px;padding:0 4px}.proof-caption{font-family:var(--font-display);color:var(--ink-soft);margin:0;font-size:14px;font-style:italic;line-height:1.45}.proof-stats{display:inline-flex;font-variant-numeric:tabular-nums;color:var(--ink-quiet);align-items: center;gap:8px;font-size:12px}.proof-index{letter-spacing:.04em}.example-dot{background:var(--line-strong);border-radius:50%;width:3px;height:3px}.proof-actions{display:flex;flex-wrap:wrap;gap:8px;padding-top:4px}.filmstrip-wrap{display:flex;flex-direction:column;gap:8px;padding:0 2px}.filmstrip-label{font-family:var(--font-display);color:var(--ink-quiet);font-size:12px;font-style:italic}.filmstrip{list-style:none;display:grid;grid-auto-flow:column;grid-auto-columns:minmax(92px,1fr);overflow-x:auto;scrollbar-gutter:stable;gap:8px;margin:0;padding:2px 0 6px}.filmstrip li{min-width:0}.film-thumb{display:grid;grid-template-rows:1fr auto;background:var(--panel);border:1px solid var(--line);cursor:pointer;text-align:left;color:inherit;font:inherit;box-shadow:var(--shadow);transition:transform var(--t-fast)var(--ease-out),border-color var(--t-fast),background var(--t-fast),box-shadow var(--t-fast);border-radius:10px;gap:6px;width:100%;padding:6px}.film-thumb img{aspect-ratio:1;object-fit:cover;background:var(--panel-inset);display:block;border-radius:6px;width:100%}.film-name{display:block;font-family:var(--font-display);color:var(--ink-soft);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:0 2px;font-size:11px;font-weight:600}.film-thumb:hover{border-color:var(--line-strong);background:var(--panel-2);transform:translateY(-1px)}.film-thumb.selected{border-color:var(--ink);background:var(--panel-2);box-shadow:var(--shadow-lift)}.film-thumb.selected .film-name{color:var(--ink)}.film-thumb.today:not(.selected){box-shadow:inset 3px 0 0 var(--ink)}.film-thumb:focus-visible{outline:2px solid var(--ink);outline-offset:2px}@media (max-width:720px){.examples-title-sub{display:none}.examples-title{grid-template-columns:auto 1fr}.proof{padding:14px 12px}.proof-toolbar,.proof-stage{gap:8px}.proof-frame{aspect-ratio:1;border-radius:10px}.proof-label{font-size:17px}.filmstrip{grid-auto-columns:84px;scroll-snap-type:x proximity;margin:0 -4px;padding-left:4px;padding-right:4px}.film-thumb{scroll-snap-align:start}}@media (max-width:480px){.proof-stage{grid-template-columns:1fr;grid-template-rows:1fr auto 1fr}.proof-arrow{transform:rotate(90deg)}.proof-actions{flex-direction:column}.proof-actions .btn{justify-content:center;width:100%}.proof-nav{width:40px;height:40px}}