:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#0d0f12;--bg-soft:#12161b;--surface:#12161bdb;--surface-strong:#171c22;--ink:#ecf1ea;--ink-muted:#9ba79e;--ink-faint:#76817b;--accent:#7cffbd;--accent-2:#f4c35e;--accent-3:#ff6fa9;--line:#ecf1ea21;--line-strong:#7cffbd5c;--shadow:0 24px 90px #0000006b;--scanline:#ffffff06;--canvas-bg:#050607;--canvas-inner-border:#ecf1ea0f;--gol-color:#7cffbd9e;--gol-alpha:.05;--hud:#7cffbd80;--camera-overlay:#050607d1;--ambient-green:#7cffbd0f;--ambient-gold:#f4c35e0f;--ambient-pink:#ff6fa90f;--font-display:"Silkscreen", "JetBrains Mono", ui-monospace, monospace;--font-mono:"JetBrains Mono", "Courier New", ui-monospace, monospace;--radius:8px;--space-1:.5rem;--space-2:.75rem;--space-3:1rem;--space-4:1.5rem;--space-5:2rem;--space-6:3rem;--target-size:2.75rem;--duration-fast:.15s;--ease:cubic-bezier(.2, .8, .2, 1)}[data-theme=light]{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--bg:#f3efe6;--bg-soft:#ebe4d8;--surface:#fffcf4e0;--surface-strong:#fffaf0;--ink:#171612;--ink-muted:#625f56;--ink-faint:#6f6a5f;--accent:#086b45;--accent-2:#8f5d0d;--accent-3:#a62e67;--line:#17161224;--line-strong:#086b4557;--shadow:0 24px 70px #54462a29;--scanline:#0a0a0a09;--canvas-bg:#fffaf0;--canvas-inner-border:#17161214;--gol-color:#086b458c;--gol-alpha:.04;--hud:#086b4573}*,:before,:after{box-sizing:border-box}*{margin:0}html{background:var(--bg);min-height:100%}body{min-height:100%;color:var(--ink);font-family:var(--font-mono);background:linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px), linear-gradient(180deg, var(--bg) 0%, var(--bg-soft) 100%);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;background-size:42px 42px,42px 42px,auto;font-size:1rem;line-height:1.55}body:before{content:"";z-index:30;pointer-events:none;background:repeating-linear-gradient(to bottom, transparent 0 3px, var(--scanline) 3px 4px);position:fixed;top:0;bottom:0;left:0;right:0}body:after{content:"";z-index:-2;pointer-events:none;background:linear-gradient(120deg, transparent 0 64%, var(--ambient-green) 64% 65%, transparent 65%), linear-gradient(90deg, var(--ambient-gold), transparent 34% 66%, var(--ambient-pink));position:fixed;top:0;bottom:0;left:0;right:0}button,select,input{font:inherit}button,select,label{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:disabled,select:disabled,input:disabled{cursor:not-allowed;opacity:.5}::selection{color:var(--bg);background:var(--accent)}@keyframes boot-hide{to{opacity:0;visibility:hidden}}@keyframes boot-enter{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.boot-screen{z-index:9999;color:var(--accent);background:var(--bg);animation:boot-hide .35s var(--ease) 1.65s forwards;place-items:center;display:grid;position:fixed;top:0;bottom:0;left:0;right:0}.boot-screen>div{animation:boot-enter .55s var(--ease) both}.boot-screen pre{font-family:var(--font-display);color:var(--accent);text-align:center;white-space:pre;font-size:.78rem;line-height:1.15}.boot-log{margin-top:var(--space-4);color:var(--ink-muted);text-align:center;font-size:.82rem}.app{z-index:1;width:min(1180px,100% - 2rem);min-height:100svh;padding:var(--space-5) 0 var(--space-6);gap:var(--space-5);grid-template-rows:auto 1fr;margin:0 auto;display:grid;position:relative}.site-header{justify-content:space-between;align-items:flex-end;gap:var(--space-4);padding-bottom:var(--space-4);border-bottom:1px solid var(--line);display:flex}.brand-block{gap:var(--space-1);display:grid}.pipeline{align-items:baseline;gap:var(--space-1);color:var(--ink-faint);letter-spacing:.04em;font-size:.78rem;display:flex}.pipeline .step.active{color:var(--accent)}.pipeline .step.done{color:var(--ink-muted)}.pipeline .step.done:before{content:"✓ ";color:var(--accent-2)}@keyframes blink{0%,55%{opacity:1}56%,to{opacity:0}}.cursor{color:var(--accent-2);animation:1.1s step-end infinite blink}.site-header h1{font-family:var(--font-display);color:var(--ink);text-transform:lowercase;font-size:3.75rem;font-weight:400;line-height:.95}.brand-link{min-height:var(--target-size);color:var(--ink);font-family:var(--font-display);transition:transform var(--duration-fast) var(--ease);align-items:center;font-size:3.75rem;line-height:.95;text-decoration:none;display:inline-flex}.brand-link .prompt{color:var(--accent)}.brand-link .dot{color:var(--accent-2)}.site-header .prompt{color:var(--accent)}.site-header .dot{color:var(--accent-2)}.theme-toggle,.upload-button,.animate-toggle,.export-button,.reset-button,.copy-button,.link-button,.toggle-group button{min-height:var(--target-size);border:1px solid var(--line);border-radius:var(--radius);color:var(--ink);background:var(--surface);transition:transform var(--duration-fast) var(--ease)}.theme-toggle{color:var(--ink-muted);padding:.7rem .9rem;font-size:.88rem}.theme-toggle:before{content:"[";color:var(--accent)}.theme-toggle:after{content:"]";color:var(--accent)}.theme-toggle:hover:not(:disabled),.upload-button:hover:not(:disabled),.animate-toggle:hover:not(:disabled),.export-button:hover:not(:disabled),.reset-button:hover:not(:disabled),.copy-button:hover:not(:disabled),.link-button:hover:not(:disabled),.toggle-group button:hover:not(:disabled){border-color:var(--line-strong);color:var(--accent);background:var(--surface-strong);transform:translateY(-1px)}.theme-toggle:active:not(:disabled),.upload-button:active:not(:disabled),.animate-toggle:active:not(:disabled),.export-button:active:not(:disabled),.reset-button:active:not(:disabled),.copy-button:active:not(:disabled),.link-button:active:not(:disabled),.toggle-group button:active:not(:disabled){transform:translateY(0)scale(.98)}.brand-link:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.theme-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.upload-button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.animate-toggle:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.export-button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.reset-button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.copy-button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.link-button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.upload-demo:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.upload-webcam:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.toggle-group button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.control-group select:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.control-group input[type=range]:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.brand-link:active{transform:scale(.98)}.workspace{gap:var(--space-4);display:grid}.upload-zone{min-height:min(620px,100svh - 13rem);padding:var(--space-6) var(--space-4);border:1px solid var(--line-strong);border-radius:var(--radius);background:linear-gradient(var(--line) 1px, transparent 1px), linear-gradient(90deg, var(--line) 1px, transparent 1px), var(--surface);box-shadow:var(--shadow);cursor:pointer;transition:transform .16s var(--ease);background-size:28px 28px,28px 28px,auto;place-items:center;display:grid;position:relative;overflow:hidden}.upload-zone:before{content:"010101  ::  .:-=+*#%@  ::  image to glyph field  ::  []{}<>/_";top:var(--space-3);left:var(--space-3);right:var(--space-3);color:var(--ink-faint);white-space:nowrap;font-size:.78rem;position:absolute;overflow:hidden}.upload-zone:after{content:"";inset:auto var(--space-3) var(--space-3) var(--space-3);background:linear-gradient(90deg, var(--accent), var(--accent-2), var(--accent-3), var(--accent));opacity:.76;background-size:200% 100%;height:1px;animation:7s linear infinite shimmer;position:absolute}@keyframes shimmer{to{background-position:-200% 0}}.upload-zone:hover,.upload-zone.dragging{border-color:var(--accent);transform:translateY(-2px)}.upload-zone.dragging:before{content:"drop source image here";color:var(--accent)}.upload-zone.compact{min-height:0;padding:.72rem var(--space-3);box-shadow:none}.upload-zone.compact:before{content:"SOURCE";color:var(--accent-2);flex:none;position:static;overflow:visible}.upload-zone.compact:after{top:auto;bottom:0;left:0;right:0}.upload-zone.compact .upload-content{justify-content:flex-end;align-items:center;gap:var(--space-2);text-align:left;width:100%;max-width:none;display:flex}.upload-zone.compact .upload-content p{color:var(--ink-muted);font-family:var(--font-mono);margin-right:auto;font-size:.82rem}.upload-zone.compact .upload-content p:after{content:none}.upload-zone.compact .upload-button{min-height:var(--target-size);padding:.52rem .78rem;font-size:.82rem}.upload-zone.compact .upload-demo{white-space:nowrap;margin:0}.upload-zone.compact .upload-webcam{white-space:nowrap}.upload-content{justify-items:center;gap:var(--space-3);text-align:center;width:min(100%,34rem);display:grid;position:relative}.upload-icon{color:var(--accent);font-family:var(--font-display);white-space:pre;font-size:1rem;line-height:1.18}.upload-content p{color:var(--ink);font-family:var(--font-display);font-size:2.4rem;line-height:1.05}.upload-content p:after{content:"_";color:var(--accent);animation:1.1s step-end infinite blink}.upload-demo{min-height:var(--target-size);margin-top:var(--space-2);color:var(--ink-muted);text-underline-offset:4px;transition:transform var(--duration-fast) var(--ease);background:0 0;border:none;justify-content:center;align-items:center;padding:.25rem .4rem;font-size:.84rem;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;display:inline-flex}.upload-demo:hover:not(:disabled),.upload-webcam:hover:not(:disabled){color:var(--accent);transform:translateY(-1px)}.upload-demo:active:not(:disabled),.upload-webcam:active:not(:disabled){transform:translateY(0)scale(.98)}.upload-webcam{min-height:var(--target-size);color:var(--accent-3);text-underline-offset:4px;transition:transform var(--duration-fast) var(--ease);background:0 0;border:none;justify-content:center;align-items:center;padding:.25rem .4rem;font-size:.84rem;-webkit-text-decoration:underline dotted;text-decoration:underline dotted;display:inline-flex}.webcam-panel{align-items:center;gap:var(--space-3);padding:var(--space-3);border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);grid-template-columns:minmax(12rem,18rem) 1fr auto;display:grid}.webcam-loading{min-height:9rem;color:var(--ink-muted);place-items:center;display:grid}.webcam-preview{aspect-ratio:16/9;border:1px solid var(--line-strong);border-radius:calc(var(--radius) - 2px);background:var(--canvas-bg);position:relative;overflow:hidden}.webcam-preview video{object-fit:cover;width:100%;height:100%;display:block;transform:scaleX(-1)}.webcam-state{inset:auto var(--space-1) var(--space-1) var(--space-1);color:var(--accent-2);background:var(--camera-overlay);text-transform:uppercase;letter-spacing:.04em;padding:.25rem .35rem;font-size:.62rem;position:absolute}.webcam-state.live{color:var(--accent-3)}.webcam-copy{gap:.22rem;display:grid}.webcam-kicker{color:var(--accent-3);font-family:var(--font-display);font-size:.65rem}.webcam-copy strong{color:var(--ink);font-family:var(--font-display);font-size:clamp(.9rem,2vw,1.25rem);font-weight:400}.webcam-copy small{color:var(--ink-muted);font-size:.72rem}.webcam-actions{gap:var(--space-2);display:grid}.webcam-actions button{min-height:var(--target-size);border:1px solid var(--line);border-radius:var(--radius);color:var(--ink-muted);background:var(--surface-strong);transition:transform var(--duration-fast) var(--ease);padding:.62rem .78rem;font-size:.78rem}.webcam-actions .webcam-snapshot{color:var(--bg);border-color:var(--accent);background:var(--accent)}.webcam-actions button:hover:not(:disabled){border-color:var(--accent);color:var(--accent)}.webcam-actions .webcam-snapshot:hover:not(:disabled){color:var(--bg)}.webcam-actions button:active:not(:disabled){transform:scale(.98)}.webcam-actions button:disabled{opacity:.45;cursor:not-allowed}.webcam-actions button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.upload-or{color:var(--ink-faint);font-size:.84rem}.upload-button{color:var(--bg);background:var(--accent);border-color:var(--accent);justify-content:center;align-items:center;padding:.78rem 1rem;display:inline-flex}.upload-button:hover:not(:disabled){color:var(--bg);border-color:var(--accent);background:var(--accent)}.controls{gap:var(--space-3);padding:var(--space-3);border:1px solid var(--line);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);grid-template-columns:repeat(6,minmax(0,1fr));align-items:end;display:grid}.control-group{gap:var(--space-2);min-width:0;display:grid}.control-group label,.control-label{color:var(--ink-muted);text-transform:uppercase;letter-spacing:.08em;font-size:.7rem}.control-group label .value,.control-label .value{margin-left:var(--space-1);color:var(--accent-2);font-variant-numeric:tabular-nums}.control-group select{width:100%;min-height:var(--target-size);color:var(--ink);border:1px solid var(--line);border-radius:var(--radius);background:linear-gradient(45deg, transparent 50%, var(--accent) 50%) right .9rem top 1.08rem / 7px 7px no-repeat, linear-gradient(135deg, var(--accent) 50%, transparent 50%) right .56rem top 1.08rem / 7px 7px no-repeat, var(--surface-strong);-webkit-appearance:none;appearance:none;transition:transform var(--duration-fast) var(--ease);padding:.64rem 2rem .64rem .72rem}.control-group select:hover:not(:disabled){border-color:var(--line-strong)}.control-group select:active:not(:disabled){transform:scale(.99)}.control-group select option{color:var(--ink);background:var(--surface-strong)}.control-group input[type=range]{width:100%;min-height:var(--target-size);cursor:pointer;accent-color:var(--accent)}.control-group input[type=range]:disabled{cursor:not-allowed}.control-group input[type=range]::-webkit-slider-runnable-track{background:var(--line-strong);border-radius:999px;height:4px}.control-group input[type=range]::-webkit-slider-thumb{margin-top:-6px}.toggle-group{gap:var(--space-1);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.toggle-group button{color:var(--ink-muted);padding:.62rem .78rem;font-size:.86rem}.toggle-group button[aria-pressed=true]{color:var(--bg);border-color:var(--accent);background:var(--accent)}.animation-controls{gap:var(--space-1);grid-template-columns:minmax(0,1fr) auto;display:grid}.animate-toggle{color:var(--accent-3);padding:.62rem .84rem}.animate-toggle[aria-pressed=true]{color:var(--bg);border-color:var(--accent-3);background:var(--accent-3)}.action-bar{gap:var(--space-2);flex-wrap:wrap;justify-content:flex-end;display:flex}.export-menu{position:relative}.export-menu summary{min-height:var(--target-size);border:1px solid var(--accent);border-radius:var(--radius);color:var(--bg);background:var(--accent);cursor:pointer;-webkit-user-select:none;user-select:none;transition:transform var(--duration-fast) var(--ease);justify-content:center;align-items:center;padding:.75rem 1rem;font-size:.88rem;list-style:none;display:inline-flex}.export-menu summary::-webkit-details-marker{display:none}.export-menu summary:hover{transform:translateY(-1px)}.export-menu summary:active{transform:translateY(0)scale(.98)}.export-menu summary:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.export-menu-panel{z-index:20;top:calc(100% + var(--space-1));border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface-strong);width:14.5rem;box-shadow:var(--shadow);display:grid;position:absolute;right:0;overflow:hidden}.export-menu-panel button{min-height:var(--target-size);justify-content:space-between;align-items:center;gap:var(--space-2);border:0;border-bottom:1px solid var(--line);color:var(--ink);text-align:left;transition:transform var(--duration-fast) var(--ease);background:0 0;padding:.62rem .78rem;font-size:.8rem;display:flex}.export-menu-panel button:last-child{border-bottom:0}.export-menu-panel button span{color:var(--ink-faint);font-size:.7rem}.export-menu-panel button:hover:not(:disabled){color:var(--accent);background:color-mix(in srgb, var(--accent) 8%, transparent)}.export-menu-panel button:focus-visible{color:var(--accent);background:color-mix(in srgb, var(--accent) 8%, transparent);outline:2px solid var(--accent);outline-offset:-3px}.export-menu-panel button:active:not(:disabled){transform:scale(.98)}.export-menu-panel button:disabled{color:var(--ink-faint);cursor:not-allowed;opacity:.55}.export-menu-panel .export-support-link{min-height:var(--target-size);border-top:1px solid var(--line);color:var(--ink-faint);background:color-mix(in srgb, var(--accent-2) 4%, transparent);align-items:center;padding:.58rem .78rem;font-size:.68rem;line-height:1.3;text-decoration:none;display:flex}.export-menu-panel .export-support-link:hover{color:var(--accent-2);background:color-mix(in srgb, var(--accent-2) 8%, transparent)}.export-menu-panel .export-support-link:focus-visible{color:var(--accent-2);background:color-mix(in srgb, var(--accent-2) 8%, transparent);outline:2px solid var(--accent-2);outline-offset:-3px}.export-menu-panel .export-support-link:active{transform:scale(.98)}.export-button,.reset-button{padding:.75rem 1rem;font-size:.88rem}.export-button{color:var(--bg);border-color:var(--accent);background:var(--accent)}.export-button:hover{color:var(--bg);background:var(--accent)}.reset-button{color:var(--ink-muted)}.canvas-container{width:100%;display:grid}.canvas-wrapper{width:100%;padding:var(--space-3);border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--canvas-bg);box-shadow:var(--shadow);justify-content:center;display:flex;position:relative;overflow:auto}.canvas-wrapper:before{content:"";z-index:2;pointer-events:none;border:1px solid var(--canvas-inner-border);border-radius:inherit;background:linear-gradient(var(--hud), var(--hud)) left 10px top 10px / 16px 2px, linear-gradient(var(--hud), var(--hud)) left 10px top 10px / 2px 16px, linear-gradient(var(--hud), var(--hud)) right 10px top 10px / 16px 2px, linear-gradient(var(--hud), var(--hud)) right 10px top 10px / 2px 16px, linear-gradient(var(--hud), var(--hud)) left 10px bottom 10px / 16px 2px, linear-gradient(var(--hud), var(--hud)) left 10px bottom 10px / 2px 16px, linear-gradient(var(--hud), var(--hud)) right 10px bottom 10px / 16px 2px, linear-gradient(var(--hud), var(--hud)) right 10px bottom 10px / 2px 16px;background-repeat:no-repeat;position:absolute;top:0;bottom:0;left:0;right:0}.canvas-wrapper canvas{z-index:1;max-width:100%;height:auto;display:block;position:relative}.three-canvas-wrapper{background:var(--canvas-bg);padding:0;overflow:hidden}.three-canvas-wrapper canvas{cursor:grab;width:100%;height:62vh;display:block}.three-canvas-wrapper canvas:active{cursor:grabbing}.three-loading{min-height:62vh;color:var(--ink-muted);place-items:center;display:grid}.canvas-statusbar{align-items:baseline;gap:var(--space-3);margin-top:calc(var(--space-2) - var(--space-4));border:1px solid var(--line);border-radius:var(--radius);color:var(--ink-muted);background:var(--surface);font-variant-numeric:tabular-nums;flex-wrap:wrap;padding:.45rem .8rem;font-size:.74rem;display:flex}.canvas-statusbar .key{color:var(--ink-faint);text-transform:uppercase;letter-spacing:.08em;margin-right:.3rem;font-size:.66rem}.canvas-statusbar .live{color:var(--accent);margin-left:auto}.canvas-statusbar .recording{color:var(--accent-3);font-family:var(--font-display);text-transform:uppercase;margin-left:auto;font-size:.66rem}.canvas-statusbar .recording+.live{margin-left:0}.banner-app{grid-template-rows:auto 1fr auto}.banner-workspace{gap:var(--space-4);display:grid}.banner-intro{gap:var(--space-2);width:min(52rem,100%);padding:var(--space-4) 0 var(--space-2);animation:boot-enter .42s var(--ease) both;display:grid}.page-kicker{color:var(--accent-2);font-family:var(--font-display);letter-spacing:.08em;font-size:.72rem}.banner-intro h1{color:var(--ink);font-family:var(--font-display);font-size:clamp(2rem,6vw,4.8rem);font-weight:400;line-height:1.02}.banner-intro p,.banner-help p{color:var(--ink-muted)}.banner-console{gap:var(--space-4);padding:var(--space-4);border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--surface);box-shadow:var(--shadow);display:grid}.banner-input-row{align-items:center;gap:var(--space-3);grid-template-columns:minmax(8rem,.35fr) 1fr;display:grid}.banner-input-row label,.font-picker legend{color:var(--ink-muted);text-transform:uppercase;letter-spacing:.08em;font-size:.72rem}.banner-input-row label span,.font-picker legend span{color:var(--accent-2)}.banner-input-row input{border:1px solid var(--line);border-radius:var(--radius);width:100%;min-height:58px;color:var(--ink);background:var(--surface-strong);font-family:var(--font-display);padding:.75rem 1rem;font-size:clamp(1rem,3vw,1.8rem)}.banner-input-row input:hover:not(:disabled){border-color:var(--line-strong)}.banner-input-row input:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.font-picker button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.banner-actions button:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.font-picker{border:0;min-width:0}.font-picker legend{margin-bottom:var(--space-2)}.font-reel{gap:var(--space-2);padding:2px 2px var(--space-2);scrollbar-color:var(--accent) var(--surface-strong);scroll-snap-type:x proximity;display:flex;overflow-x:auto}.font-reel button{gap:var(--space-2);min-height:8.75rem;padding:var(--space-2);border:1px solid var(--line);border-radius:var(--radius);color:var(--ink-muted);background:var(--surface-strong);text-align:left;scroll-snap-align:start;transition:transform var(--duration-fast) var(--ease);flex:0 0 13rem;grid-template-rows:auto 1fr;display:grid;overflow:hidden}.font-reel button:hover:not(:disabled){border-color:var(--line-strong);color:var(--accent);transform:translateY(-2px)}.font-reel button:active:not(:disabled){transform:translateY(0)scale(.98)}.font-reel button[aria-pressed=true]{border-color:var(--accent);color:var(--accent);background:color-mix(in srgb, var(--accent) 8%, var(--surface-strong))}.font-reel button>span{text-transform:uppercase;letter-spacing:.05em;font-size:.72rem}.font-reel pre{color:currentColor;font-family:var(--font-mono);white-space:pre;align-self:center;font-size:.72rem;line-height:1.1}.banner-toolbar{justify-content:space-between;align-items:end;gap:var(--space-3);display:flex}.banner-layout-control{width:min(15rem,100%)}.banner-actions{justify-content:flex-end;gap:var(--space-2);flex-wrap:wrap;display:flex}.banner-actions button{min-height:var(--target-size);border:1px solid var(--line);border-radius:var(--radius);color:var(--ink-muted);background:var(--surface-strong);transition:transform var(--duration-fast) var(--ease);padding:.7rem .9rem}.banner-actions button:hover:not(:disabled){border-color:var(--accent);color:var(--accent);transform:translateY(-1px)}.banner-actions button:active:not(:disabled){transform:translateY(0)scale(.98)}.banner-actions .banner-primary-action{border-color:var(--accent);color:var(--bg);background:var(--accent)}.banner-actions .banner-primary-action:hover:not(:disabled){color:var(--bg)}.banner-actions button:disabled{opacity:.45;cursor:not-allowed}.banner-output{border:1px solid var(--line-strong);border-radius:var(--radius);background:var(--canvas-bg);min-height:22rem;box-shadow:var(--shadow);grid-template-rows:auto 1fr;display:grid;position:relative;overflow:hidden}.banner-output:before{content:"";pointer-events:none;border:1px solid var(--canvas-inner-border);position:absolute;top:10px;bottom:10px;left:10px;right:10px}.banner-output-hud{z-index:1;justify-content:space-between;gap:var(--space-2);border-bottom:1px solid var(--line);color:var(--ink-faint);text-transform:uppercase;padding:.6rem .85rem;font-size:.68rem;display:flex;position:relative}.banner-output-hud span:first-child{color:var(--accent)}.banner-output>pre{z-index:1;max-width:100%;padding:var(--space-5);color:var(--accent);font-family:var(--font-mono);white-space:pre;margin:auto;font-size:clamp(.55rem,1.2vw,1rem);line-height:1.18;position:relative;overflow:auto}.banner-help{gap:var(--space-2);width:min(48rem,100%);padding:var(--space-5) 0;border-top:1px solid var(--line);display:grid}.banner-help h2{color:var(--ink);font-family:var(--font-display);font-size:clamp(1.2rem,3vw,2rem);font-weight:400}.site-footer{justify-content:space-between;align-items:baseline;gap:var(--space-4);padding-top:var(--space-4);border-top:1px solid var(--line);color:var(--ink-faint);font-size:.72rem;display:flex}.site-footer nav{gap:var(--space-3);flex-wrap:wrap;display:flex}.site-footer a{min-height:var(--target-size);min-width:var(--target-size);color:var(--ink-muted);text-underline-offset:4px;transition:transform var(--duration-fast) var(--ease);justify-content:center;align-items:center;display:inline-flex}.site-footer a:active{transform:scale(.98)}.site-footer a:focus-visible{color:var(--accent);outline:2px solid var(--accent);outline-offset:3px}.site-footer a:hover,.site-footer a[aria-current=page]{color:var(--accent)}.static-app{grid-template-rows:auto 1fr auto}.seo-page{gap:clamp(5rem,11vw,10rem);padding:clamp(2rem,5vw,4.5rem) 0 clamp(4rem,8vw,7rem);display:grid}.seo-hero{border-top:1px solid var(--line);grid-template-columns:minmax(19rem,.82fr) minmax(30rem,1.18fr);align-items:center;gap:clamp(2rem,5vw,5rem);min-height:min(720px,100svh - 10rem);padding:clamp(2.5rem,5vw,5rem) 0 0;display:grid;position:relative}.seo-hero:before{content:"";background:var(--accent);width:clamp(4rem,12vw,9rem);height:1px;position:absolute;top:-1px;left:0}.seo-hero-copy{justify-items:start;gap:var(--space-4);padding-left:var(--space-4);border-left:1px solid var(--line-strong);animation:boot-enter .42s var(--ease) both;display:grid}.seo-hero h1{color:var(--ink);font-family:var(--font-display);letter-spacing:-.045em;text-wrap:balance;font-size:clamp(2.5rem,5.4vw,4.9rem);font-weight:400;line-height:.98}.seo-hero p{max-width:36rem;color:var(--ink-muted);font-size:clamp(1rem,1.8vw,1.2rem);line-height:1.7}.seo-cta{min-height:var(--target-size);border:1px solid var(--accent);border-radius:var(--radius);color:var(--bg);background:var(--accent);transition:transform var(--duration-fast) var(--ease);justify-content:center;align-items:center;padding:.75rem 1rem;font-size:.86rem;text-decoration:none;display:inline-flex}.seo-cta:hover{box-shadow:0 8px 30px color-mix(in srgb, var(--accent) 20%, transparent);transform:translateY(-2px)}.seo-cta:active{transform:translateY(0)scale(.98)}.seo-cta:focus-visible{outline:2px solid var(--accent-2);outline-offset:3px}.seo-specimen{border:1px solid var(--line);border-radius:var(--radius);background:var(--canvas-bg);width:100%;min-width:0;box-shadow:var(--shadow);animation:specimen-enter .56s 90ms var(--ease) both;position:relative;overflow:hidden}.seo-specimen:before{content:"";z-index:2;pointer-events:none;background:linear-gradient(var(--accent), var(--accent)) left top / 24px 1px no-repeat, linear-gradient(var(--accent), var(--accent)) left top / 1px 24px no-repeat, linear-gradient(var(--accent), var(--accent)) right top / 24px 1px no-repeat, linear-gradient(var(--accent), var(--accent)) right top / 1px 24px no-repeat, linear-gradient(var(--accent), var(--accent)) left bottom / 24px 1px no-repeat, linear-gradient(var(--accent), var(--accent)) left bottom / 1px 24px no-repeat, linear-gradient(var(--accent), var(--accent)) right bottom / 24px 1px no-repeat, linear-gradient(var(--accent), var(--accent)) right bottom / 1px 24px no-repeat;opacity:.58;position:absolute;top:8px;bottom:8px;left:8px;right:8px}@keyframes specimen-enter{0%{opacity:0;transform:translateY(14px)scale(.985)}}.seo-specimen-header,.seo-specimen figcaption{justify-content:space-between;align-items:center;gap:var(--space-3);color:var(--ink-faint);letter-spacing:.08em;text-transform:uppercase;font-size:.65rem;display:flex}.seo-specimen-header{border-bottom:1px solid var(--line);padding:.72rem 1.15rem}.seo-specimen figcaption{border-top:1px solid var(--line);padding:.72rem 1.15rem}.seo-status{color:var(--accent);flex:none}.seo-status.is-recording{color:var(--accent-3);animation:1.1s step-end infinite blink}.seo-example{width:100%;max-width:100%;color:var(--accent);font-family:var(--font-mono);text-align:center;text-shadow:0 0 16px var(--line-strong);white-space:pre;padding:clamp(2rem,5vw,4.25rem) clamp(1rem,3vw,2.5rem);font-size:clamp(.51rem,1.02vw,.86rem);line-height:1.42;overflow:hidden}.braille-example{font-size:clamp(.72rem,1.45vw,1.12rem);line-height:1.25}.webcam-example{color:var(--ink)}.seo-specs{border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong);grid-column:1/-1;grid-template-columns:repeat(4,minmax(0,1fr));margin-top:clamp(.5rem,2vw,1.5rem);display:grid}.seo-specs>div{min-width:0;padding:var(--space-3) var(--space-4);border-left:1px solid var(--line);gap:.2rem;display:grid}.seo-specs>div:first-child{border-left:0}.seo-specs dt{color:var(--ink-faint);letter-spacing:.08em;text-transform:uppercase;font-size:.62rem}.seo-specs dd{overflow-wrap:anywhere;color:var(--ink);font-size:.76rem}.status-dot{width:.48rem;height:.48rem;margin-right:var(--space-1);background:var(--accent);box-shadow:0 0 10px var(--line-strong);border-radius:50%;display:inline-block}.seo-copy,.seo-faq{gap:var(--space-4) clamp(3rem, 8vw, 8rem);padding-top:var(--space-5);border-top:1px solid var(--line);grid-template-columns:minmax(12rem,.3fr) minmax(0,.7fr);display:grid}.section-index{padding-left:var(--space-4);color:var(--accent-2);font-family:var(--font-display);letter-spacing:.06em;grid-area:1/1/-1;align-self:start;font-size:.7rem;position:relative}.section-index:before{content:"";background:var(--accent-2);width:2px;position:absolute;top:.3em;bottom:.3em;left:0}.seo-copy>:not(.section-index),.seo-faq>:not(.section-index){grid-column:2}.seo-copy h2,.seo-faq h2,.seo-final-cta h2{color:var(--ink);font-family:var(--font-display);text-wrap:balance;font-size:clamp(1.5rem,4vw,2.8rem);font-weight:400;line-height:1.08}.seo-copy p{color:var(--ink-muted);line-height:1.82}.seo-copy p:first-of-type{color:var(--ink);font-size:1.04rem}.seo-copy kbd{border:1px solid var(--line-strong);border-radius:calc(var(--radius) / 2);color:var(--accent);background:var(--surface);font:.76em var(--font-mono);letter-spacing:.04em;text-transform:uppercase;border-bottom-width:2px;padding:.06rem .4rem .12rem;display:inline-block}.faq-list{counter-reset:faq;display:grid}.faq-list details{counter-increment:faq;border-bottom:1px solid var(--line)}.faq-list summary{align-items:baseline;gap:var(--space-3);padding:var(--space-4) 0;color:var(--ink);font-family:var(--font-display);cursor:pointer;transition:transform var(--duration-fast) var(--ease);grid-template-columns:2.6rem minmax(0,1fr) auto;font-size:clamp(.9rem,2vw,1.2rem);font-weight:400;line-height:1.4;list-style:none;display:grid}.faq-list summary::-webkit-details-marker{display:none}.faq-list summary:before{content:counter(faq, decimal-leading-zero);color:var(--ink-faint);font:.64rem var(--font-mono);letter-spacing:.08em}.faq-list summary:after{content:"+";color:var(--accent);font:1rem var(--font-mono)}.faq-list details[open] summary{color:var(--accent)}.faq-list details[open] summary:after{content:"−"}.faq-list summary:hover{transform:translateX(var(--space-1));color:var(--accent)}.faq-list summary:active{transform:translateX(var(--space-1)) scale(.99)}.faq-list summary:focus-visible{outline:2px solid var(--accent-2);outline-offset:3px}.faq-list p{max-width:42rem;margin:0 0 var(--space-5) clamp(3.6rem, 8vw, 6rem);color:var(--ink-muted);animation:faq-reveal .18s var(--ease) both;line-height:1.75}@keyframes faq-reveal{0%{opacity:0;transform:translateY(-5px)}}.seo-final-cta{align-items:center;gap:var(--space-5);border-top:1px solid var(--line-strong);border-bottom:1px solid var(--line-strong);background:linear-gradient(90deg, var(--surface), transparent 76%);grid-template-columns:minmax(0,1fr) auto;padding:clamp(2rem,5vw,4rem) clamp(1.25rem,4vw,3rem);display:grid}.seo-final-cta h2{max-width:45rem}@keyframes notice-enter{0%{opacity:0;transform:translateY(-8px)}}.notice{z-index:100;top:var(--space-3);right:var(--space-3);align-items:start;gap:var(--space-2);border:1px solid var(--line-strong);border-left:3px solid var(--accent);border-radius:var(--radius);width:min(31rem,100% - 2rem);color:var(--ink);background:var(--surface-strong);box-shadow:var(--shadow);animation:notice-enter .18s var(--ease) both;grid-template-columns:auto 1fr auto;padding:.85rem;font-size:.82rem;display:grid;position:fixed}.notice-error{border-left-color:var(--accent-3)}.notice-warning{border-left-color:var(--accent-2)}.notice-code{color:var(--accent);font-family:var(--font-display);font-size:.7rem}.notice-error .notice-code{color:var(--accent-3)}.notice-warning .notice-code{color:var(--accent-2)}.notice button{min-width:var(--target-size);min-height:var(--target-size);color:var(--ink-muted);background:0 0;border:0;margin:-.35rem -.35rem 0 0;font-size:1.25rem;line-height:1}.notice button:hover:not(:disabled){color:var(--accent)}.notice button:active:not(:disabled){transform:scale(.94)}.notice button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@media (max-width:980px){.controls{grid-template-columns:repeat(3,minmax(0,1fr))}.seo-hero{grid-template-columns:1fr;align-items:start;min-height:0}.seo-hero-copy{max-width:42rem}.seo-specimen{justify-self:end;width:min(46rem,100%)}.seo-copy,.seo-faq{gap:var(--space-4);grid-template-columns:1fr}.seo-copy>:not(.section-index),.seo-faq>:not(.section-index){grid-column:1}.section-index{grid-area:auto/1}.site-footer{flex-direction:column;align-items:stretch}}@media (max-width:720px){.app{width:min(100% - 1rem,1180px);padding-top:var(--space-3);gap:var(--space-4)}.site-header{align-items:flex-start;gap:var(--space-3);grid-template-columns:1fr;display:grid}.theme-toggle{justify-self:start}.site-header h1,.brand-link{font-size:2.35rem}.pipeline{font-size:.875rem}.upload-zone{min-height:calc(100svh - 11rem);padding:var(--space-5) var(--space-3)}.upload-zone:before{left:var(--space-2);right:var(--space-2)}.upload-zone.compact{padding:var(--space-2)}.upload-zone.compact:before{display:none}.upload-zone.compact .upload-content{flex-wrap:wrap;justify-content:stretch}.upload-zone.compact .upload-content p{flex:1 0 100%}.upload-zone.compact .upload-button,.upload-zone.compact .upload-demo,.upload-zone.compact .upload-webcam{flex:9rem}.webcam-panel{grid-template-columns:1fr}.webcam-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.upload-content p{font-size:1.9rem}.upload-icon{font-size:.78rem}.controls{grid-template-columns:1fr}.action-bar>*{flex:10rem}.export-menu summary{width:100%}.export-menu-panel{width:min(18rem,100vw - 1rem)}.three-canvas-wrapper canvas,.three-loading{height:55vh;min-height:55vh}.banner-console{padding:var(--space-3)}.banner-input-row{grid-template-columns:1fr}.banner-toolbar,.site-footer{flex-direction:column;align-items:stretch}.banner-layout-control{width:100%}.banner-actions{grid-template-columns:1fr;display:grid}.banner-output{min-height:17rem}.banner-output>pre{padding:var(--space-4)}.seo-page{padding-top:var(--space-4);gap:clamp(4.5rem,18vw,6rem)}.seo-hero{gap:var(--space-6);padding-top:var(--space-5)}.seo-hero-copy{gap:var(--space-3);padding-left:var(--space-3)}.seo-hero h1{font-size:clamp(2.35rem,12vw,3.7rem)}.seo-specimen-header,.seo-specimen figcaption{padding-inline:var(--space-3)}.seo-example{padding:var(--space-5) var(--space-2)}.seo-specs{margin-top:calc(var(--space-3) * -1);grid-template-columns:repeat(2,minmax(0,1fr))}.seo-specs>div{padding:var(--space-3)}.seo-specs>div:nth-child(3){border-left:0}.seo-specs>div:nth-child(n+3){border-top:1px solid var(--line)}.seo-final-cta{grid-template-columns:1fr;align-items:stretch}.seo-final-cta .seo-cta{justify-self:start}.boot-screen pre,.boot-log,.pipeline,.upload-zone.compact .upload-content p,.upload-zone.compact .upload-button,.upload-demo,.upload-webcam,.upload-or,.webcam-state,.webcam-kicker,.webcam-copy small,.webcam-actions button,.control-group label,.control-label,.toggle-group button,.export-menu-panel button,.export-menu-panel button span,.export-menu-panel .export-support-link,.canvas-statusbar,.canvas-statusbar .key,.canvas-statusbar .recording,.page-kicker,.banner-input-row label,.font-picker legend,.font-reel button>span,.banner-output-hud,.site-footer,.seo-cta,.seo-specimen-header,.seo-specimen figcaption,.seo-specs dt,.seo-specs dd,.seo-copy kbd,.section-index,.faq-list summary:before,.notice,.notice-code{font-size:.875rem}}@media (max-width:440px){.seo-specimen-header span:first-child{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.seo-specimen figcaption{display:block}.seo-specs dd{font-size:.875rem}.faq-list summary{gap:var(--space-2);grid-template-columns:2rem minmax(0,1fr) auto}.faq-list p{margin-left:2.75rem}.seo-final-cta .seo-cta{width:100%}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.boot-screen{animation:.01ms forwards boot-hide!important}}
