:root{font-family:Inter,ui-sans-serif,system-ui,sans-serif;background:#0b1920;color:#e8eee6;font-synthesis:none;font-size:14px}*{box-sizing:border-box}body{margin:0}main{min-height:100dvh}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid #45616a;background:#18313a;color:#e8eee6;padding:10px 12px;border-radius:6px;text-align:left}button:hover{background:#294951}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:3px solid #f4bb81;outline-offset:2px}button:disabled{opacity:.4;cursor:not-allowed}.selected{border-color:#a3f6d6!important;background:#254b49!important}header{padding:20px 3vw;border-bottom:1px solid #2b4149;display:flex;justify-content:space-between;align-items:center}.brand{font-weight:800;letter-spacing:2px}.brand span{display:block;font-size:10px;color:#96b0b5;letter-spacing:3px;margin-top:7px}.intro{padding:32px 3vw 24px;display:grid;grid-template-columns:1fr 1.4fr 1fr;align-items:end;gap:24px}.eyebrow{font-size:10px;letter-spacing:3px;color:#9af2d0;line-height:1.8}h1{font-family:Georgia,serif;font-weight:400;font-size:clamp(35px,4vw,66px);line-height:1.02;margin:0}.intro>p:last-child{line-height:1.8;color:#a7b9ba}.workspace{display:grid;grid-template-columns:minmax(230px,1fr) minmax(360px,2.6fr) minmax(240px,1.05fr);border-top:1px solid #2b4149}aside{padding:22px;background:#0f2028}.center{padding:20px;border-inline:1px solid #2b4149}h2{font-size:12px;letter-spacing:1.5px;text-transform:uppercase;color:#a1c2c4;margin:8px 0 18px}h3{font-size:12px}p{line-height:1.6}.muted,small{color:#93aaaf;font-size:12px}label{display:block;font-size:11px;letter-spacing:.3px;color:#acc7cb;margin-bottom:12px}input,select,textarea{display:block;width:100%;color:#eff6ed;background:#0a1820;border:1px solid #35515b;border-radius:4px;padding:9px;margin-top:5px}textarea{min-height:310px;resize:vertical;font:11px/1.6 ui-monospace,monospace}.slice-list{display:grid;gap:7px;margin:18px 0}.slice-list button span{display:block;font-size:10px;color:#a3c7c5;margin-top:6px}.slice-list button b{font-size:12px}.editor{margin-top:22px}.radii{display:grid;grid-template-columns:1fr 1fr;gap:8px}.radii label{margin:0}.editor>button{margin-top:12px}.tabs{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:12px}.tabs button{font-size:11px}.stage{position:relative;background:#10232b;border:1px solid #33525c;border-radius:12px;overflow:hidden}.stage canvas{width:100%;height:420px;display:block}.stage p{font-size:10px;padding:0 15px;color:#a9bec0;min-height:30px}.stamp{position:absolute;pointer-events:none;right:20px;top:20px;color:#e2b59a;font:10px/1.5 ui-monospace,monospace;letter-spacing:2px}.stamp strong{font-size:16px}.view-controls{display:flex;gap:8px;align-items:center;margin:12px 0}.view-controls span{font-size:10px;margin-left:auto;color:#b6a799}.view-controls button{padding:7px 12px;font-size:11px}.legend{display:flex;justify-content:space-between;gap:10px;font:10px ui-monospace,monospace;color:#9af2d0;padding:14px 0}.legend b:last-child{color:#e7ad8c}.section-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-bottom:28px}.section-grid>div{background:#142b33;padding:10px;border:1px solid #2b474f;border-radius:5px}.section-grid svg{width:100%;display:block;aspect-ratio:1}.section-grid b,.section-grid small{display:block;overflow-wrap:anywhere;font-size:10px;margin-top:5px}.hyp-controls{display:grid;grid-template-columns:1fr 1fr;gap:12px}.actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.actions button{font-size:11px}.draft{font:10px ui-monospace,monospace;color:#e9be8e}.danger{margin:14px 0;border-color:#88694e;color:#f1c69e}details{font-size:11px;line-height:1.7;color:#9cb4b6}details button{margin:5px;font-size:10px}footer{position:sticky;bottom:0;background:#e4ede0;color:#142329;padding:12px 3vw;font-size:12px;z-index:10}@media(max-width:1050px){.workspace{grid-template-columns:240px 1fr}.workspace>aside:last-child{grid-column:1/-1}.intro{grid-template-columns:1fr 2fr}.intro>p:last-child{grid-column:2}}@media(max-width:650px){.workspace{display:flex;flex-direction:column}.center{order:-1;border:0}.intro{display:block}.intro>*{margin-bottom:18px}h1{font-size:44px}.stage canvas{height:340px}.section-grid{grid-template-columns:repeat(2,1fr)}header{padding:15px}.brand span{font-size:8px}.legend{font-size:9px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important;animation:none!important}}.focus .intro{display:none}.focus .workspace{min-height:calc(100dvh - 110px)}.focus .stage canvas{height:65dvh}