:root{font-family:Arial,Helvetica,sans-serif;color:#253d36;background:#f2eee4;font-synthesis:none}*{box-sizing:border-box}body{margin:0}button,input,textarea{font:inherit}button{cursor:pointer;border:1px solid #b9c2b3;background:#f8f5ec;color:#294438;border-radius:6px;padding:10px 13px;min-height:40px}button:hover:not(:disabled){background:#dfe8d7}button:disabled{cursor:not-allowed;opacity:.5}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:3px solid #bd5635;outline-offset:3px}.app{background:#f2eee4;min-height:100vh}.app:fullscreen{overflow:auto}header{padding:24px 5%;border-bottom:1px solid #d9ddce;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none;font-weight:800;letter-spacing:2px;font-size:13px}.brand small{font-size:10px;letter-spacing:1px;font-weight:500}.mark{display:grid;place-items:center;background:#284f41;color:#eee8d8;width:36px;height:36px;border-radius:50%;font-family:Georgia;font-size:28px}.header-right{display:flex;gap:20px;align-items:center}.pill{font-size:9px;letter-spacing:1.4px;border:1px solid #b9c3b1;padding:7px 10px;border-radius:20px}main{max-width:1440px;margin:auto;padding:0 5%}.intro{display:flex;justify-content:space-between;align-items:center;padding:55px 0 40px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:700;color:#728170}h1{font-family:Georgia,serif;font-size:clamp(36px,4.8vw,67px);font-weight:400;line-height:1.04;letter-spacing:-2px;margin:15px 0 20px}h1 em{color:#7d926a;font-weight:400}p{font-size:13px;line-height:1.7;color:#667366}.intro p{max-width:460px}.intro-note{display:grid;gap:13px;border-left:1px solid #cbd2c0;padding-left:28px;font-size:10px;letter-spacing:1px}.intro-note p{font-size:11px;letter-spacing:0}.workspace{display:grid;grid-template-columns:minmax(0,1fr) 310px;gap:24px;align-items:start}.studio{border:1px solid #d3d9c9;border-radius:12px;background:#fbf9f2;overflow:hidden}.studio-top{display:flex;justify-content:space-between;align-items:center;padding:25px}h2{font-family:Georgia,serif;font-weight:400;font-size:28px;margin:8px 0;overflow-wrap:anywhere}.segmented{display:flex;gap:2px;background:#e7ebdf;border-radius:6px;padding:3px}.segmented button{border:0;background:transparent;font-size:11px;min-height:34px;padding:8px}.segmented button[aria-pressed=true]{background:#fffdf8;box-shadow:0 1px 3px #b9c3b1}.canvas{background:radial-gradient(#b6c2af80 .6px,transparent .6px);background-size:18px 18px;min-height:430px;padding:25px;position:relative}.canvas-note{font-size:9px;color:#87957e;letter-spacing:1.5px;margin-bottom:18px}.cell-grid{display:grid;grid-template-columns:repeat(16,1fr);aspect-ratio:1;max-width:370px;margin:auto;gap:2px}.cell{padding:0;min-height:0;border-radius:22%;border:1px solid #799b78;box-shadow:inset 2px 2px 3px #e5edda;background:#b5cfa6;aspect-ratio:1;opacity:1!important}.cell.locked{background:#d8bd82;border-color:#bea069;box-shadow:inset 2px 2px 3px #f1dfb9}.cell.void{background:#294f46;border-color:#294f46;box-shadow:inset 3px 3px 5px #19372f}.cell.merged{background:#d6a582;border-color:#b1744d}.cell.selected{background:#f7e8a0;border:3px solid #315b4a}.cell:hover:not(:disabled){transform:scale(1.08)}.axis{display:block;text-align:center;font-size:10px;color:#8b967e;margin-top:15px}.legend{display:flex;justify-content:center;flex-wrap:wrap;gap:14px;margin-top:25px;font-size:10px;color:#78846e}.legend span{display:flex;gap:5px;align-items:center}.legend i{width:8px;height:8px;display:inline-block;border-radius:2px}.shell{background:#d8bd82}.solid{background:#b5cfa6}.hole{background:#294f46}.join{background:#d6a582}.slice-controls{display:flex;align-items:center;gap:15px;padding:20px 25px;border-top:1px solid #e1e4d9;font-size:11px}.slice-controls label{display:flex;align-items:center;gap:12px;flex:1}.slice-controls input{min-width:40px;width:100%;accent-color:#476c50}.slice-controls button{font-size:10px}.metrics{display:grid;grid-template-columns:repeat(4,1fr);padding:23px;border-top:1px solid #e1e4d9;gap:12px}.metrics div{display:grid;gap:7px}.metrics strong{font-family:Georgia;font-size:26px;font-weight:400}.metrics span{font-size:9px;text-transform:uppercase;letter-spacing:.5px;color:#7a8773}.volume-preview{border-top:1px solid #e1e4d9;padding:10px 20px}.volume-preview svg{width:100%;height:140px}.volume-preview p{font-size:10px;margin:0;text-align:center}aside{display:grid;gap:18px}.panel{background:#fcfaf4;padding:23px;border:1px solid #d6dccd;border-radius:10px}h3{font-size:17px;font-weight:500;margin:13px 0}.panel p{font-size:11px}.panel small{font-size:10px;color:#78846e;line-height:1.6;display:block}.presets{display:grid;gap:8px;margin:18px 0 13px}.presets button{display:flex;gap:12px;align-items:center;text-align:left;font-size:12px;background:#f2f2e8}.presets svg{width:28px;height:28px;fill:#9ab18a}.presets small{margin-left:auto}.wide{width:100%;margin:4px 0;font-size:11px}.primary{background:#315541;color:#f7f5e9;border-color:#315541}.primary:hover:not(:disabled){background:#416e54}.secondary{background:transparent}.text-button{border:0;background:transparent;font-size:11px;text-decoration:underline;padding-left:0}.paper{background:#e9eedf}.exports{display:grid;grid-template-columns:1fr 1fr;gap:8px}.exports button{font-size:10px;padding:9px}.authoring{display:grid;grid-template-columns:1fr 1fr;gap:40px;margin:40px 0;padding:30px;border:1px solid #d0d8c5;border-radius:10px}.authoring h2{font-size:26px}.authoring p{font-size:11px}.coordinate{display:flex;gap:8px;align-items:end;flex-wrap:wrap}.coordinate label{font-size:10px;display:grid;gap:5px}.coordinate input{width:55px;border:1px solid #bac8af;padding:10px;border-radius:4px;background:#fcfaf4}.coordinate button,.storage button,.draft-buttons button{font-size:11px}.note{color:#8a7252}.storage{display:flex;gap:7px;flex-wrap:wrap}.authoring label[for]{font-size:11px;display:flex;justify-content:space-between}.authoring label span{font-size:9px;color:#7f8a6f}textarea{width:100%;height:290px;margin:12px 0;border:1px solid #c3cdb6;border-radius:6px;resize:vertical;font-family:monospace;font-size:11px;line-height:1.5;background:#fbfaf3;padding:15px;color:#47634a}.draft-buttons{display:flex;gap:8px}.status{position:sticky;bottom:12px;z-index:4;background:#294b3e;color:#f7f5e9;border-radius:8px;padding:15px 20px;font-size:12px;display:flex;gap:12px;box-shadow:0 3px 18px #18302320}.status.error{background:#774831}footer{display:flex;justify-content:space-between;align-items:start;padding:40px 0;gap:30px}footer p{font-size:10px}footer details{max-width:450px;font-size:11px}footer button{font-size:10px;margin-right:8px}.drawing-grid{display:grid;grid-template-columns:repeat(17,1fr);max-width:390px;margin:auto;aspect-ratio:1}.drawing-grid button{min-height:0;padding:0;border:0;background:transparent;color:#708567;font-size:20px}.drawing-grid button:hover{background:#d4dfc6}@media(max-width:950px){.workspace{grid-template-columns:minmax(0,1fr) 270px}.studio-top{display:block}.segmented{width:max-content;margin-top:14px}.canvas{padding:15px;min-height:340px}.panel{padding:17px}.slice-controls{flex-wrap:wrap}.slice-controls label{min-width:80%}.metrics{padding:18px;gap:7px}.metrics span{font-size:8px}.brand small{display:none}}@media(max-width:720px){header{padding:15px 5%}.pill{display:none}.intro{padding:35px 0 20px}.intro-note{display:none}.workspace{grid-template-columns:1fr}aside{grid-template-columns:1fr}.authoring{grid-template-columns:1fr;padding:20px;gap:20px}.canvas{min-height:400px}.cell-grid,.intro p{max-width:330px}footer{display:block}.status{bottom:5px;font-size:11px}.brand{font-size:11px;letter-spacing:1px}.header-right button{font-size:10px}.studio-top{display:flex}.segmented{margin:0}h2{font-size:24px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}.cell:hover{transform:none!important}}.drawing-grid{position:relative}.draft-shape{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.drawing-grid button{z-index:1;position:relative}
