*{box-sizing:border-box}:root{--terminal-ink: #c7e6c2;--terminal-bright: #e0f3dc;--terminal-rgb: 199, 230, 194;font-family:Monaco,Lucida Console,Cascadia Mono,SFMono-Regular,monospace;color:var(--terminal-ink);background:#050506;font-synthesis:none}html,body,#root{width:100%;height:100%;margin:0;overflow:hidden;background:#050506}button,select,input{font:inherit}button{min-height:2.4rem;border:1px solid rgba(var(--terminal-rgb),.3);border-radius:0;padding:0 .8rem;color:rgba(var(--terminal-rgb),.82);background:#0505068a;cursor:pointer;letter-spacing:.02em;transition:color .12s ease,border-color .12s ease,background .12s ease}button:hover{color:var(--terminal-bright);border-color:rgba(var(--terminal-rgb),.72);background:rgba(var(--terminal-rgb),.07)}button:focus-visible,select:focus-visible,input:focus-visible,a:focus-visible{outline:1px solid var(--terminal-bright);outline-offset:3px}select,input[type=color]{width:100%;min-height:2.4rem;border:1px solid rgba(var(--terminal-rgb),.24);border-radius:0;color:var(--terminal-ink);background:#0a0a0c}select{padding:0 .65rem}input[type=color]{padding:.2rem}input[type=range]{width:100%;accent-color:var(--terminal-ink)}a{color:inherit;text-underline-offset:.22em}.gumdrop-visualizer-web{position:relative;width:100%;height:100%;background:#050506}.gumdrop-visualizer-canvas,.scrim{position:absolute;inset:0;width:100%;height:100%}.debug-readout{position:absolute;z-index:6;left:max(.75rem,env(safe-area-inset-left));bottom:calc(max(.75rem,env(safe-area-inset-bottom)) + 4.5rem);display:grid;grid-template-columns:repeat(2,auto);gap:.25rem 1rem;border:1px solid rgba(var(--terminal-rgb),.24);padding:.65rem;color:rgba(var(--terminal-rgb),.72);background:#050506cc;font-size:.64rem;line-height:1.4;pointer-events:none}.sync-status{position:absolute;z-index:6;left:50%;bottom:max(.75rem,env(safe-area-inset-bottom));width:min(38rem,calc(100vw - 1.5rem));display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:.35rem .9rem;border:1px solid rgba(var(--terminal-rgb),.24);padding:.6rem .7rem;color:rgba(var(--terminal-rgb),.68);background:#050506d1;backdrop-filter:blur(14px);font-size:.64rem;line-height:1.35;letter-spacing:.04em;text-transform:lowercase;transform:translate(-50%);pointer-events:none}.microphone-prompt{position:absolute;z-index:3;left:50%;bottom:max(.75rem,env(safe-area-inset-bottom));width:min(23rem,calc(100vw - 1.5rem));display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.7rem;border:1px solid rgba(var(--terminal-rgb),.24);padding:.55rem;color:rgba(var(--terminal-rgb),.58);background:#050506d1;backdrop-filter:blur(14px);font-size:.62rem;line-height:1.35;text-transform:lowercase;transform:translate(-50%)}.microphone-prompt button{min-width:0;white-space:nowrap}.microphone-prompt span{text-align:right}@media(max-width:420px){.microphone-prompt{grid-template-columns:1fr}.microphone-prompt span{text-align:center}}.sync-status-state{color:var(--terminal-ink)}.sync-status.is-syncing .sync-status-state:after{content:"_";animation:terminal-cursor .9s steps(1,end) infinite}.sync-status-detail{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sync-status-reading{color:rgba(var(--terminal-rgb),.88);font-variant-numeric:tabular-nums;white-space:nowrap}.sync-status-track{grid-column:1 / -1;height:2px;overflow:hidden;background:rgba(var(--terminal-rgb),.12)}.sync-status-track>span{display:block;width:0;height:100%;background:var(--terminal-ink);transition:width .18s linear}.sync-status.is-synced .sync-status-track>span{background:rgba(var(--terminal-rgb),.62)}@keyframes terminal-cursor{0%,48%{opacity:1}49%,to{opacity:0}}.scrim{pointer-events:none;background:linear-gradient(180deg,rgba(0,0,0,.38),transparent 30%,transparent 70%,rgba(0,0,0,.5)),radial-gradient(circle at center,transparent 42%,rgba(0,0,0,.26))}.about-overlay,.control-panel,.topbar{position:absolute;z-index:2;border:1px solid rgba(var(--terminal-rgb),.22);background:#050506c7;backdrop-filter:blur(14px)}.about-overlay{z-index:4;left:max(.75rem,env(safe-area-inset-left));right:max(.75rem,env(safe-area-inset-right));top:max(.75rem,env(safe-area-inset-top));bottom:max(.75rem,env(safe-area-inset-bottom));width:auto;max-height:none;overflow:auto;display:grid;gap:1.35rem;padding:clamp(1.25rem,4vw,2.4rem);transform:none}.artifact-label,.kicker,.status,.fine-print{margin:0;color:rgba(var(--terminal-rgb),.52);font-size:.7rem;line-height:1.5;letter-spacing:.08em;text-transform:lowercase}.artifact-label{color:rgba(var(--terminal-rgb),.72)}h1,h2,h3,p{margin-top:0}h1,h2{margin-bottom:0;font-weight:400}h1{max-width:10ch;font-size:clamp(2.8rem,8vw,6rem);line-height:.92;letter-spacing:-.075em}h2{font-size:clamp(1.05rem,2vw,1.5rem);letter-spacing:-.04em;text-transform:lowercase}.lede{max-width:34rem;margin-bottom:0;color:rgba(var(--terminal-rgb),.7);font-size:clamp(.92rem,1.5vw,1.05rem);line-height:1.65}.tutorial-grid{display:grid;grid-template-columns:1fr;gap:1rem}.tutorial-grid article,.about-card{border-top:1px solid rgba(var(--terminal-rgb),.22);padding-top:.75rem}.tutorial-grid span{color:rgba(var(--terminal-rgb),.42);font-size:.68rem}.tutorial-grid h3,.about-card h3{margin:.65rem 0 .4rem;color:rgba(var(--terminal-rgb),.88);font-size:.78rem;font-weight:400;text-transform:lowercase}.tutorial-grid p,.about-card p{margin-bottom:0;color:rgba(var(--terminal-rgb),.58);font-size:.74rem;line-height:1.6}.about-card{max-width:34rem}.hero-actions,.actions,.topbar-actions,.inline-fields{display:grid;gap:.6rem}.hero-actions,.actions,.inline-fields{grid-template-columns:1fr}.hero-actions{max-width:31rem}.primary-action{color:#050506;border-color:var(--terminal-ink);background:var(--terminal-ink)}.primary-action:hover{color:#050506;border-color:var(--terminal-bright);background:var(--terminal-bright)}.topbar{left:max(1rem,env(safe-area-inset-left));right:max(1rem,env(safe-area-inset-right));top:max(1rem,env(safe-area-inset-top));display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);align-items:center;gap:.6rem;padding:.7rem}.topbar-scene{min-width:0}.topbar-actions{display:flex;min-width:0;flex-wrap:nowrap;justify-content:flex-end}.brand-name{min-width:0;justify-self:center;margin:0;color:rgba(var(--terminal-rgb),.9);font-size:clamp(.58rem,2.9vw,.82rem);letter-spacing:0;text-align:center;text-transform:lowercase;white-space:nowrap}.topbar-actions button{min-height:2rem;border-color:transparent;padding-inline:clamp(.42rem,1.5vw,.8rem);background:transparent}.control-panel{z-index:5;left:auto;right:0;top:calc(100% + .5rem);bottom:auto;width:min(28rem,calc(100vw - 1.5rem));max-height:min(calc(100vh - 8rem),42rem);overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(var(--terminal-rgb),.24) transparent;display:grid;gap:1rem;padding:1rem}@media(max-width:600px){.topbar{grid-template-columns:minmax(0,1fr) auto;align-items:center;row-gap:.45rem}.brand-name{grid-column:1 / -1;grid-row:1;width:100%}.topbar-scene{grid-column:1;grid-row:2}.topbar-actions{grid-column:2;grid-row:2}}.control-panel::-webkit-scrollbar{width:5px}.control-panel::-webkit-scrollbar-track{background:transparent}.control-panel::-webkit-scrollbar-thumb{background:rgba(var(--terminal-rgb),.24)}.settings-quick-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}.actions button,.hero-actions button,.settings-quick-actions button{min-width:0;white-space:nowrap}label{display:grid;gap:.45rem;color:rgba(var(--terminal-rgb),.52);font-size:.7rem;line-height:1.4;text-transform:lowercase}.checkbox{grid-template-columns:auto 1fr;align-items:center;align-content:center}.checkbox input{width:1rem;height:1rem}.palette-control{display:grid;gap:.55rem}.palette-heading{display:flex;align-items:center;justify-content:space-between;color:rgba(var(--terminal-rgb),.52);font-size:.7rem;text-transform:lowercase}.palette-heading button{min-height:auto;border:0;padding:0;color:rgba(var(--terminal-rgb),.62);background:transparent;text-decoration:underline;text-underline-offset:.2em}.palette-heading button:hover{color:var(--terminal-bright);background:transparent}.palette-presets{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:.4rem}.palette-preset{min-width:0;min-height:1.65rem;border-color:rgba(var(--terminal-rgb),.2);padding:0}.palette-preset:hover,.palette-preset.is-active{border-color:var(--terminal-bright)}.palette-preset.is-active{outline:1px solid rgba(5,5,6,.85);outline-offset:-3px}.about-link{min-height:auto;justify-self:start;border:0;padding:0;color:rgba(var(--terminal-rgb),.45);background:transparent;text-decoration:underline;text-underline-offset:.22em}.about-link:hover{color:rgba(var(--terminal-rgb),.86);background:transparent}@media(min-width:420px){.hero-actions,.actions,.inline-fields{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(min-width:721px){.about-overlay{left:max(1rem,env(safe-area-inset-left));right:auto;top:50%;bottom:auto;width:min(47rem,calc(100vw - 2rem));max-height:calc(100vh - 2rem);transform:translateY(-50%)}.tutorial-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.brand-name{font-size:.82rem}.control-panel{max-height:min(calc(100vh - 5.5rem),42rem)}}@media(prefers-reduced-motion:reduce){button,.sync-status-track>span{transition:none}.sync-status.is-syncing .sync-status-state:after{animation:none}}
