@font-face{font-family:DM Sans;font-style:normal;font-weight:100 1000;font-display:swap;src:url(/fonts/dmsans.ttf) format("truetype")}@font-face{font-family:Manrope;font-style:normal;font-weight:200 800;font-display:swap;src:url(/fonts/manrope.ttf) format("truetype")}:root{font-family:DM Sans,sans-serif;color:#e2ecf0;background:#080e17;font-synthesis:none;color-scheme:dark;font-size:14px;--mint: #b6e0ce;--muted: #94a7b6;--line: #a6c9de22}*{box-sizing:border-box}body{margin:0;overflow:hidden}button,input,select{font:inherit}button,a,input,select{-webkit-tap-highlight-color:transparent}button{cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid #c2f5de;outline-offset:5px}button{border:0}button:disabled{opacity:.5}svg{width:24px;height:24px}a{color:inherit;text-decoration:none}[hidden]{display:none!important}#app{position:relative;width:100%;height:100dvh;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 82% 12%,#21474c44,transparent 50%),radial-gradient(ellipse at 24% 96%,#32305250,transparent 57%),#080e17}#app:after{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;background:radial-gradient(ellipse at center,transparent 40%,#03081055)}#world{position:absolute;inset:0;z-index:2;pointer-events:none}#world canvas{display:block;width:100%;height:100%}#playground{position:absolute;inset:0;z-index:1}.masthead{position:absolute;top:max(28px,env(safe-area-inset-top));left:40px;right:40px;display:flex;align-items:center;justify-content:space-between;z-index:4}.wordmark{display:flex;align-items:center;gap:12px;font-size:12px;letter-spacing:2px;font-weight:600}.brand-mark{font-family:Georgia,serif;font-size:29px;font-style:italic;letter-spacing:-4px;padding-right:5px;color:var(--mint)}.edition{color:#7f95a4;font-size:10px;margin-left:6px}.quiet-button{height:44px;min-width:84px;display:flex;gap:10px;align-items:center;justify-content:center;background:#24323e60;border:1px solid var(--line);border-radius:9px;font-size:12px}.quiet-button:hover{background:#34475788}.intro{position:absolute;top:15%;left:7%;pointer-events:none}.eyebrow{font-size:9px;letter-spacing:2.2px;font-weight:600;color:var(--mint);display:flex;align-items:center;gap:8px}.live-dot{width:5px;height:5px;border-radius:50%;background:#b6e0ce;display:inline-block;box-shadow:0 0 12px #a8e0c877}h1{font-family:Manrope,sans-serif;font-size:clamp(38px,5.1vw,76px);font-weight:500;line-height:1.08;letter-spacing:-3px;margin:24px 0 18px;color:#e1ebef}h1 em{font-family:Georgia,serif;font-weight:400;color:var(--mint)}.intro p{font-size:13px;line-height:1.8;color:var(--muted)}#surfaces{position:absolute;inset:0;pointer-events:none}.floating-surface{position:absolute;top:0;left:0;padding:16px 18px;display:flex;flex-direction:column;align-items:stretch;gap:10px;background:linear-gradient(135deg,#6a9b9e20,#49677010);border:1px solid #bedee535;border-radius:12px;text-align:left;box-shadow:0 12px 40px #00000018,inset 0 1px #c9f2ff08;pointer-events:auto;touch-action:none;-webkit-user-select:none;user-select:none;will-change:transform;cursor:grab;contain:layout style}.surface-1{background:linear-gradient(145deg,#7f8da129,#3c496511)}.surface-2{background:linear-gradient(145deg,#8b90b527,#51577815)}.surface-3{background:linear-gradient(145deg,#62948828,#46646715)}.surface-code{font-size:9px;letter-spacing:1px;color:#a6c6cd;display:flex;justify-content:space-between}.surface-code span{font-size:13px}.surface-title{font-size:12px;letter-spacing:.1px;color:#d1e1e6}.surface-line{display:block;width:25px;height:1px;background:#b6e0ce55}.floating-surface[data-dragging=true]{cursor:grabbing;border-color:#d0f7eb99;background:#36545877}.scene-footer{position:absolute;bottom:max(28px,env(safe-area-inset-bottom));left:40px;right:40px;display:flex;justify-content:space-between;gap:16px;font-size:9px;color:#8ba1b0;letter-spacing:1.5px}#widget{position:absolute;top:0;left:0;z-index:15;width:200px;height:64px;padding:12px 14px;display:flex;align-items:center;gap:12px;text-align:left;background:linear-gradient(140deg,#29413eea,#192831eb);border:1px solid #b6e0ce55;border-radius:12px;box-shadow:0 8px 30px #0007,inset 0 1px #ffffff0c;touch-action:none;-webkit-user-select:none;user-select:none;will-change:transform;contain:layout style;cursor:grab}#widget>svg{color:var(--mint);width:22px}#widget>span{font-weight:550;font-size:13px}.widget-hint{display:block;font-weight:400;font-size:9px;color:#b1c4ca;margin-top:5px;white-space:nowrap}.widget-dot{width:5px;height:5px;background:var(--mint);border-radius:50%;margin-left:auto}#widget[data-dragging=true]{cursor:grabbing;border-color:#d4ffea;box-shadow:0 10px 34px #0009}#overlay{position:absolute;inset:0;z-index:20;display:flex;align-items:center;justify-content:center;padding:20px;background:#03080e70;opacity:0;pointer-events:none;transition:opacity .22s ease}#overlay[data-phase=closed]{visibility:hidden}#overlay[data-phase=open]{opacity:1;pointer-events:auto}#overlay[data-phase=closing]{opacity:0;transition:opacity 2s linear;pointer-events:none}.panel{width:430px;max-width:100%;max-height:calc(100dvh - 40px);border:1px solid #9bc1c637;border-radius:20px;background:linear-gradient(150deg,#1d3038ed,#121d2aee);box-shadow:0 30px 100px #0009;overflow:hidden;display:flex;flex-direction:column;position:relative}.panel-head{display:flex;justify-content:space-between;align-items:center;padding:25px 26px 18px}.panel-head .eyebrow{font-size:8px;letter-spacing:2px}h2{font-family:Manrope,sans-serif;font-size:29px;font-weight:500;letter-spacing:-1.1px;margin:8px 0 0}.icon-button{width:44px;height:44px;background:#e2f3ff06;border:1px solid #b5cad51a;border-radius:10px;font-size:25px;font-weight:400;color:#b8cbd2}.icon-button:hover{background:#e2f3ff12}.panel-scroll{overflow-y:auto;overscroll-behavior:contain;padding:0 26px 20px;scrollbar-width:thin;scrollbar-color:#5e7b8155 transparent;min-height:0;touch-action:pan-y}#preview{height:116px;position:relative;overflow:hidden;border:1px solid #9bc1c624;border-radius:12px;background:radial-gradient(ellipse at 25% 40%,#29666c66,transparent 70%),#0c1725}#preview-world{position:absolute;inset:0}#preview-world canvas{display:block;position:absolute;inset:0}.preview-caption{position:absolute;left:14px;bottom:12px;display:flex;align-items:center;gap:7px;color:#b8d2d5;font-size:7px;letter-spacing:1.5px}.preview-orbit{position:absolute;top:32px;right:68px;width:61px;height:35px;border:1px solid #b5e4d944;transform:rotate(-13deg);border-radius:8px;background:#a9d9c80c;pointer-events:none}.panel-description{font-size:12px;line-height:1.7;color:#afc0c9;margin:17px 0 23px}.section-label{font-size:8px;letter-spacing:1.6px;font-weight:600;color:#b7c8d0;display:flex;justify-content:space-between;margin:20px 0 13px}.section-label span{font-size:9px;letter-spacing:0;color:#829ba7;font-weight:400}.effect-list{border-top:1px solid var(--line)}.effect-row{display:flex;align-items:center;gap:12px;min-height:66px;border-bottom:1px solid var(--line);cursor:pointer}.effect-number{font-size:10px;color:#86a8ae;font-variant-numeric:tabular-nums}.effect-row strong{display:block;font-size:12px;font-weight:500}.effect-row small{display:block;font-size:10px;color:#9bb0bd;margin-top:4px}.switch{appearance:none;position:relative;flex-shrink:0;width:38px;height:24px;padding:0;min-height:0;border:1px solid #617981;background:#263b48;border-radius:20px;margin:0 0 0 auto;cursor:pointer;transition:background .16s}.switch:before{content:"";position:absolute;top:4px;left:4px;width:14px;height:14px;border-radius:50%;background:#95aab4;transition:transform .16s,background .16s}.switch:checked{background:#adcdbf;border-color:#adcdbf}.switch:checked:before{transform:translate(14px);background:#19332d}.range-label{display:flex;justify-content:space-between;font-size:11px;color:#d0dee4;margin-top:18px}.range-label output{font-size:10px;color:var(--mint);font-variant-numeric:tabular-nums}input[type=range]{display:block;width:100%;height:44px;margin:4px 0 0;accent-color:#b6e0ce;cursor:pointer;touch-action:pan-y}.field-hint{font-size:10px;color:#9bb0bd;line-height:1.6;margin:0 0 8px}.two-columns{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0 10px}.select-label{font-size:10px;color:#a9bec9}select{display:block;width:100%;height:44px;margin-top:8px;background:#1a2b37;border:1px solid #a6c9de26;border-radius:8px;color:#e0ebef;padding:0 10px;font-size:11px}.compact-row{display:flex;align-items:center;justify-content:space-between;font-size:11px;min-height:44px}.restart-button{margin-top:12px;min-height:44px;width:100%;border:1px solid #a6c9de2b;border-radius:9px;background:#ffffff04;font-size:11px;color:#c1d2da}.panel-footer{padding:17px 26px 21px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:10px;flex-shrink:0;background:#17252cd9}.panel-footer>span{font-size:11px;color:#cfdee3}.panel-footer small{display:block;color:#91a8b3;font-size:9px;margin-top:5px}.primary-button{background:var(--mint);color:#173129;min-height:44px;padding:0 15px;border-radius:9px;font-size:11px;font-weight:600;white-space:nowrap}.primary-button span{margin-left:12px}#error{position:absolute;left:20px;right:20px;top:80px;margin:auto;max-width:540px;z-index:30;padding:14px 18px;background:#162932f5;border:1px solid #a5cfcf77;border-radius:12px;font-size:12px;line-height:1.6}#error button{min-height:44px;display:block;background:transparent;color:var(--mint);text-decoration:underline}@media(min-width:1000px){.intro{top:17%}.floating-surface{box-shadow:0 15px 55px #0002}.surface-title{font-size:13px}}@media(max-width:600px){.masthead{left:22px;right:22px;top:max(18px,env(safe-area-inset-top))}.wordmark{font-size:10px;gap:9px;letter-spacing:1.5px}.edition{font-size:8px}.intro{top:15%;left:25px}.intro .eyebrow{font-size:7px;letter-spacing:1.5px}h1{font-size:44px;letter-spacing:-2px;margin:19px 0 13px}.intro p{font-size:11px;line-height:1.7}.floating-surface{padding:11px 13px;gap:7px}.surface-code{font-size:8px}.surface-title{font-size:10px}.scene-footer{left:22px;right:22px;bottom:max(19px,env(safe-area-inset-bottom));font-size:7px;letter-spacing:1px}.scene-footer>span:first-child{max-width:100px;line-height:1.6}#overlay{padding:14px}.panel{max-height:calc(100dvh - 28px)}.panel-head{padding:20px 21px 16px}.panel-scroll{padding:0 21px 15px}.panel-footer{padding:14px 21px 17px}h2{font-size:26px}#preview{height:100px}.panel-description{margin:13px 0 18px}.panel-footer small{font-size:8px}#widget{width:190px;height:62px}.widget-hint{font-size:8px}}@media(prefers-reduced-motion:reduce){.switch,.switch:before{transition:none}}