:root{color:#f4f8ff;font-synthesis:none;text-rendering:optimizelegibility;background:#02040a;font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}html,body,#renderCanvas,.app,.viewport{width:100%;height:100%;margin:0}body{overflow:hidden}button,input{font:inherit}.app{background:radial-gradient(circle at 38%,#ff5c1c29,#0000 28%),linear-gradient(110deg,#02040a 0%,#06111b 58%,#0b0d17 100%);grid-template-columns:minmax(0,1fr) minmax(400px,480px);display:grid}.viewport{min-width:0;min-height:0;position:relative}#renderCanvas{touch-action:none;outline:none;width:100%;height:100%;display:block}.controls{z-index:10;visibility:visible;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);background:#03080ec7;border:1px solid #ff934f3d;border-radius:8px;width:min(100% - 40px,920px);padding:12px;position:absolute;bottom:18px;left:50%;transform:translate(-50%);box-shadow:0 18px 52px #0000006b,inset 0 0 22px #ff641f14}.controls-header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.controls-body{grid-template-columns:repeat(3,minmax(150px,1fr));gap:12px;display:grid}.controls h2{color:#f4f8ffeb;letter-spacing:.12em;text-transform:uppercase;margin:0;font-size:.7rem;font-weight:700;line-height:1.2}.controls-collapse{color:#f4f8ff;min-height:28px;font:inherit;letter-spacing:.08em;text-transform:uppercase;cursor:pointer;background:#f4f8ff0f;border:1px solid #f4f8ff2e;border-radius:999px;padding:0 10px;font-size:.68rem;font-weight:800;display:none}.controls-collapse:focus-visible{outline-offset:3px;outline:2px solid #f4f8ff}.control-field{gap:8px;min-width:0;display:grid}.control-header{color:#f4f8ffd1;justify-content:space-between;align-items:center;gap:12px;font-size:.72rem;line-height:1.2;display:flex}.control-header output{color:#ffb46a;font-variant-numeric:tabular-nums;text-align:right;min-width:42px}.control-field input[type=range]{accent-color:#ff7a2f;cursor:pointer;width:100%;height:18px;margin:0}.info-button{top:calc(14px + env(safe-area-inset-top));z-index:12;color:#f4f8ff;width:38px;height:38px;font:inherit;cursor:pointer;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#03080eb8;border:1px solid #f4f8ff52;border-radius:50%;font-size:1rem;font-weight:800;line-height:1;display:none;position:absolute;right:14px}.info-button:focus-visible,.info-close:focus-visible{outline-offset:3px;outline:2px solid #f4f8ff}.panel{z-index:2;visibility:visible;background:linear-gradient(#121624f2,#04070cfa),repeating-linear-gradient(0deg,#79e8ff09 0 1px,#0000 1px 7px);border-left:1px solid #ff934f3d;flex-direction:column;gap:18px;min-width:0;height:100%;padding:20px;display:flex;position:relative;overflow-y:auto;box-shadow:-18px 0 60px #00000061,inset 1px 0 #f4f8ff14}.panel:before{pointer-events:none;content:"";background:linear-gradient(90deg,#ff702426,#0000 22px),linear-gradient(#79e8ff12,#0000 190px);position:absolute;inset:0}.panel>*{position:relative}.panel h1{color:#fff7f0;letter-spacing:0;margin:0;font-size:clamp(1.45rem,2vw,1.9rem);font-weight:800;line-height:1.08}.panel p{color:#aebbe0;margin:0;font-size:.94rem;line-height:1.55}.repo-link{color:#fff1e6;background:#ff702414;border:1px solid #ff934f61;border-radius:6px;justify-content:center;align-self:flex-start;align-items:center;min-height:38px;padding:0 14px;font-size:.8rem;font-weight:800;line-height:1;text-decoration:none;transition:border-color .14s,background .14s,box-shadow .14s;display:inline-flex}.repo-link:hover,.repo-link:focus-visible{background:#ff702429;border-color:#ffb46adb;box-shadow:0 0 22px #ff702433}.repo-link:focus-visible{outline-offset:3px;outline:2px solid #f4f8ff}.panel pre{background:#02040abd;border:1px solid #f4f8ff14;border-radius:8px;min-height:0;margin:0;padding:18px;overflow:auto;box-shadow:inset 0 0 28px #00000047,0 0 28px #ff641f0f}.panel code{color:#c9d8ff;white-space:pre-wrap;font-family:Cascadia Code,SFMono-Regular,Consolas,monospace;font-size:.74rem;font-weight:700;line-height:1.58}.info-dialog{z-index:80;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#02040ab8;justify-content:center;align-items:center;padding:18px;display:none;position:fixed;inset:0}.info-dialog.is-open{visibility:visible;display:flex}.info-dialog[hidden]{display:none}.info-dialog-panel{background:linear-gradient(#121624fa,#04070cfa),repeating-linear-gradient(0deg,#79e8ff09 0 1px,#0000 1px 7px);border:1px solid #ff934f47;border-radius:10px;flex-direction:column;gap:14px;width:min(100%,520px);max-height:min(760px,100svh - 36px);padding:18px;display:flex;position:relative;overflow-y:auto;box-shadow:0 28px 72px #00000085}.info-dialog-panel h2{color:#fff7f0;margin:0;padding-right:38px;font-size:1.35rem;line-height:1.1}.info-dialog-panel p{color:#aebbe0;margin:0;font-size:.92rem;line-height:1.5}.info-dialog-panel pre{background:#02040abd;border:1px solid #f4f8ff14;border-radius:8px;margin:0;padding:14px;overflow:auto}.info-dialog-panel code{color:#c9d8ff;white-space:pre-wrap;font-family:Cascadia Code,SFMono-Regular,Consolas,monospace;font-size:.72rem;font-weight:700;line-height:1.55}.info-close{color:#f4f8ff;width:34px;height:34px;font:inherit;cursor:pointer;background:#02040ab8;border:1px solid #f4f8ff38;border-radius:50%;font-size:.92rem;font-weight:800;position:absolute;top:12px;right:12px}.loading-screen{z-index:100;opacity:1;background:radial-gradient(circle at 50% 44%,#ff581033,#0000 22%),radial-gradient(circle at 50% 52%,#79e8ff29,#0000 34%),#02040a;place-items:center;transition:opacity .52s,visibility .52s;display:grid;position:fixed;inset:0;overflow:hidden}.loading-screen:before{content:"";border:1px solid #79e8ff29;border-radius:50%;position:absolute;inset:14%;transform:rotateX(68deg)}.loading-screen.is-hidden{visibility:hidden;opacity:0;pointer-events:none}.loading-screen p{color:#f4f8ffe0;letter-spacing:.16em;text-align:center;text-transform:uppercase;margin:0;font-size:.75rem;font-weight:700;line-height:1.2;position:absolute;top:calc(50% + 82px);left:50%;transform:translate(-50%)}.loading-relic{filter:drop-shadow(0 0 24px #ff581059);width:128px;height:128px;position:relative}.loading-relic:before{content:"";background:#ff641f;border-radius:50%;position:absolute;inset:42px;box-shadow:0 0 22px #ff641fe6,0 0 64px #79e8ff47}.loading-relic span{border:2px solid #79e8ff;border-color:#79e8ff #ff641fd1 #0000 #0000;border-radius:50%;animation:1.4s linear infinite relic-spin;position:absolute;inset:0}.loading-relic span:nth-child(2){animation-duration:1.9s;animation-direction:reverse;inset:14px;transform:rotateX(62deg)}.loading-relic span:nth-child(3){border-top-color:#ffffffe6;animation-duration:1.15s;inset:28px;transform:rotateY(58deg)}@keyframes relic-spin{to{rotate:360deg}}@media (width<=980px){body{overflow:auto}.app{grid-template-rows:minmax(520px,72svh) auto;grid-template-columns:1fr;height:auto;min-height:100%}.panel{border-top:1px solid #ff934f3d;border-left:0;height:auto}.controls{width:min(100% - 28px,560px)}.controls-body{grid-template-columns:repeat(2,minmax(130px,1fr))}}@media (width<=720px){body{overflow:hidden}.app{grid-template-rows:1fr;height:100%;min-height:100%}.viewport{height:100svh}.panel{display:none}.info-button{visibility:visible;place-items:center;display:inline-grid}.controls{bottom:calc(12px + env(safe-area-inset-bottom));width:min(100% - 24px,420px);padding:12px;transition:background .18s,border-color .18s,box-shadow .18s;overflow:visible;transform:translate(-50%)}.controls.is-collapsed{box-shadow:none;-webkit-backdrop-filter:none;backdrop-filter:none;pointer-events:none;background:0 0;border-color:#0000}.controls-header{margin-bottom:0;position:absolute;bottom:calc(100% + 8px);right:12px}.controls-collapse{background:#03080ed1;justify-content:center;align-items:center;min-height:32px;display:inline-flex;box-shadow:0 10px 28px #0000005c}.controls.is-collapsed .controls-collapse{pointer-events:auto}.controls h2{display:none}.controls-body{overscroll-behavior:contain;grid-template-columns:1fr;max-height:min(52svh,380px);transition:max-height .22s,opacity .16s;overflow-y:auto}.controls.is-collapsed .controls-body{opacity:0;pointer-events:none;max-height:0;overflow:hidden}}@media (width<=560px){.app{grid-template-rows:1fr}.controls{width:calc(100% - 20px);padding:10px}.controls-header{bottom:calc(100% + 7px);right:10px}.controls-body{max-height:min(56svh,390px)}.control-field{gap:4px;min-height:0}.control-header{gap:8px;font-size:.68rem}.control-field input[type=range]{height:22px}}
