@import "https://fonts.googleapis.com/css2?family=Inter:wght@400;600;700;800&family=JetBrains+Mono:wght@600;700&display=swap";:root{--canvas:#e8ece9;--ink:#15202d;--line:#26313e29;--muted:#697482;--surface:#ffffffb3;--mono:"JetBrains Mono", "SFMono-Regular", Consolas, monospace;--sans:"Inter", system-ui, sans-serif;color:var(--ink);font:16px/1.5 var(--sans);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*{box-sizing:border-box}body{background:linear-gradient(120deg, #f75c4a1f, transparent 34rem), linear-gradient(250deg, #51d7c82e, transparent 38rem), var(--canvas);min-height:100vh;margin:0}#root{max-width:88rem;min-height:100vh;margin:0 auto}h1{color:var(--ink);font:800 clamp(2.6rem, 6vw, 5.6rem) / .92 var(--sans);letter-spacing:0;margin:0 0 1rem}p{color:#465260;margin:0;font-size:1.04rem}button,input{font:inherit}@media (width<=700px){h1{margin-block-end:0;font-size:clamp(1.8rem,10vw,2.6rem)}}.app-shell{gap:1.25rem;padding:1.25rem;display:grid}.intro{grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:1rem;display:grid}.intro p{max-width:47rem}.readouts{grid-template-columns:minmax(0,1fr);gap:.75rem;display:grid}.readout{background:var(--surface);border:1px solid var(--line);border-radius:8px;place-items:end;min-width:10.5rem;padding:1rem 1.1rem;display:grid}.readout span{color:var(--ink);font:700 2.2rem/1 var(--mono)}.readout small,.stats dt,.height-control span,.slice-header p{color:var(--muted);letter-spacing:.13em;text-transform:uppercase;font-size:.74rem;font-weight:700}.workspace{grid-template-columns:minmax(0,1fr) minmax(20rem,.36fr);gap:1rem;min-height:42rem;display:grid}.stage-panel,.control-panel{border:1px solid var(--line);background:#fafaf8d6;border-radius:8px;box-shadow:0 24px 70px #18202d1f}.stage-panel{align-items:center;display:grid;position:relative;overflow:hidden}.drag-hint{color:#fffaf2;pointer-events:none;z-index:2;background:#15202ddb;border:1px solid #ffffff38;border-radius:8px;padding:.45rem .65rem;font-size:.82rem;font-weight:700;position:absolute;top:1rem;left:1rem}.stage-panel:before{content:"";pointer-events:none;background-image:linear-gradient(#2c364614 1px,#0000 1px),linear-gradient(90deg,#2c364614 1px,#0000 1px);background-size:2rem 2rem;position:absolute;inset:0;-webkit-mask-image:radial-gradient(circle at 50% 48%,#000,#0000 72%);mask-image:radial-gradient(circle at 50% 48%,#000,#0000 72%)}.three-stage{cursor:grab;z-index:1;block-size:clamp(30rem,100vh - 14rem,46rem);inline-size:100%;position:relative}.three-stage:active{cursor:grabbing}.three-stage canvas{block-size:100%;inline-size:100%;display:block}.preview-node{fill:#fff7ef;stroke:#d73325;stroke-width:2.5px}.control-panel{align-content:start;gap:.9rem;max-block-size:clamp(30rem,100vh - 14rem,46rem);padding:1rem;display:grid;overflow:auto}.slice-card{border:1px solid var(--line);border-radius:8px;gap:.8rem;padding:.85rem;display:grid}.slice-header{grid-area:header;align-items:center;gap:.7rem;display:flex}.slice-header h2,.slice-header p{margin:0}.slice-header h2{color:var(--ink);font:800 1rem/1.1 var(--sans)}.plane-swatch{border-radius:999px;flex:none;block-size:.85rem;inline-size:.85rem;box-shadow:0 0 0 5px #15202d0f}.section-preview{background:#121821;border-radius:8px;grid-area:preview;place-items:center;min-block-size:12rem;display:grid}.section-preview svg{aspect-ratio:1;inline-size:min(100%,12rem)}.preview-ring{fill:none;stroke:#ffffff24;stroke-dasharray:3 9;stroke-width:2px}.preview-shape{fill-opacity:.78;stroke-linejoin:round;stroke-width:4px}.stats{grid-area:stats;grid-template-columns:repeat(2,minmax(0,1fr));gap:.55rem;margin:0;display:grid}.stats div{border:1px solid var(--line);border-radius:8px;min-block-size:4.5rem;padding:.7rem}.stats dd{color:var(--ink);font:700 1.2rem/1.1 var(--sans);text-transform:capitalize;margin:.35rem 0 0}.height-control{grid-area:slider;gap:.75rem;display:grid}.height-control input{cursor:pointer;inline-size:100%}.button-row{grid-area:buttons;grid-template-columns:repeat(3,minmax(0,1fr));gap:.55rem;display:grid}.button-row button{color:#fffaf2;cursor:pointer;font:700 .88rem/1 var(--sans);background:#1d2632;border:0;border-radius:8px;min-block-size:2.75rem;transition:background .16s,transform .16s}.button-row button:hover{background:#f75c4a;transform:translateY(-1px)}@media (width<=980px){.intro,.workspace,.readouts{grid-template-columns:1fr}.workspace{min-height:0}.control-panel{order:-1;max-block-size:none;overflow:visible}.readout{justify-items:start}}@media (width<=700px){.app-shell{gap:.65rem;padding:.65rem}.intro{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.65rem}.readout{min-width:0;padding:.55rem .65rem}.readout span{font-size:1.25rem}.readout small{letter-spacing:.08em;font-size:.58rem}.workspace{gap:.65rem}.stage-panel,.control-panel{box-shadow:0 14px 38px #18202d1a}.three-stage{block-size:clamp(18rem,44svh,24rem)}.drag-hint{padding:.35rem .5rem;font-size:.72rem;top:.65rem;left:.65rem}.control-panel{gap:.6rem;padding:.65rem}.slice-card{grid-template-columns:minmax(0,1fr) 5.7rem;grid-template-areas:"header preview""slider preview""buttons buttons""stats stats";align-items:center;gap:.6rem;padding:.65rem}.slice-header{gap:.55rem}.slice-header h2{font-size:.95rem}.plane-swatch{block-size:.7rem;inline-size:.7rem}.section-preview{min-block-size:5.7rem}.section-preview svg{inline-size:5.2rem}.stats{grid-template-columns:repeat(4,minmax(0,1fr));gap:.4rem}.stats div{min-block-size:3.3rem;padding:.45rem}.stats dt,.height-control span,.slice-header p{letter-spacing:.08em;font-size:.62rem}.stats dd{margin-block-start:.22rem;font-size:.9rem}.height-control{gap:.45rem}.button-row{gap:.4rem}.button-row button{min-block-size:2.25rem;font-size:.78rem}}@media (width<=430px){.stats{grid-template-columns:repeat(2,minmax(0,1fr))}}