:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--font-body:"Schibsted Grotesk", "Avenir Next", "Segoe UI Variable Text", system-ui, sans-serif;--text:oklch(97% .008 250);--text-muted:oklch(84% .022 252);--text-subtle:oklch(68% .035 256);--glass:oklch(22% .035 260/.5);--glass-strong:oklch(26% .04 260/.78);--glass-hover:oklch(42% .05 258/.32);--field:oklch(15% .025 262/.55);--border:oklch(52% .05 255/.3);--rim-warm:oklch(90% .12 78/.9);--rim-cool:oklch(80% .1 240/.5);--light:oklch(86% .12 78);--light-bright:oklch(94% .07 85);--light-soft:oklch(86% .12 78/.16);--light-rim:oklch(86% .12 78/.45);--danger:oklch(70% .17 25);--tool-attract:oklch(82% .1 250);--tool-repel:oklch(70% .17 25);--tool-swirl:oklch(74% .14 300);--axis-x:oklch(70% .16 25);--axis-y:oklch(80% .14 145);--axis-z:oklch(72% .12 250);--ease-glass:cubic-bezier(.22, 1, .36, 1);--dur-1:.14s;--dur-2:.28s;--dur-3:.56s;--radius-lg:16px;--radius-md:11px;--radius-sm:7px;--gap:12px;--dock-height:52px;--panel-width:316px;--compass:84px}@media (prefers-reduced-motion:reduce){:root{--dur-1:1ms;--dur-2:1ms;--dur-3:1ms}}html,body{height:100%;color:var(--text);font:13px/1.45 var(--font-body);-webkit-font-smoothing:antialiased;background:#000;margin:0;overflow:hidden}#view{cursor:none;touch-action:none;width:100vw;height:100vh;display:block}#view.plain-cursor,body.ui-hidden #view{cursor:crosshair}body.ui-hidden.idle #view{cursor:none}kbd{background:var(--field);min-width:1.5em;box-shadow:inset 0 0 0 1px var(--border), inset 0 -1px 0 oklch(0% 0 0/.35);color:var(--text-muted);font:600 11px/18px var(--font-body);text-align:center;border-radius:5px;padding:0 5px;display:inline-block}.glass{background:var(--glass);-webkit-backdrop-filter:blur(18px)saturate(1.4);backdrop-filter:blur(18px)saturate(1.4);position:relative;box-shadow:inset 0 1px oklch(100% 0 0/.06),0 12px 32px -14px oklch(0% 0 0/.7)}.glass:before{content:"";border-radius:inherit;background:linear-gradient(225deg, var(--rim-warm), var(--border) 30%, var(--border) 70%, var(--rim-cool));-webkit-mask-composite:xor;opacity:.6;pointer-events:none;padding:1px;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#000 0 0),linear-gradient(#000 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.chrome{transition:opacity var(--dur-3) var(--ease-glass), transform var(--dur-3) var(--ease-glass), visibility 0s}body.booting .chrome,body.ui-hidden .chrome{opacity:0;visibility:hidden;pointer-events:none}body.ui-hidden .chrome{transition:opacity var(--dur-2) var(--ease-glass), transform var(--dur-2) var(--ease-glass), visibility 0s linear var(--dur-2)}#hud{transition-delay:0s}#nav{transition-delay:35ms}#dock{transition-delay:70ms}#panel{transition-delay:.14s}#help{transition-delay:.21s}body.booting #hud,body.ui-hidden #hud,body.booting #nav,body.ui-hidden #nav{transform:translateY(-8px)}body.booting #panel,body.ui-hidden #panel{transform:translate(16px)}body.booting #dock,body.ui-hidden #dock{transform:translate(-50%,14px)}[data-tip]:after{content:attr(data-tip);border-radius:var(--radius-sm);background:var(--glass-strong);box-shadow:inset 0 0 0 1px var(--border);color:var(--text);font:500 12px/1.3 var(--font-body);white-space:nowrap;opacity:0;transition:opacity var(--dur-1) var(--ease-glass), transform var(--dur-2) var(--ease-glass);pointer-events:none;padding:5px 10px;position:absolute;bottom:calc(100% + 12px);left:50%;transform:translate(-50%,4px)}[data-tip]:hover:after{opacity:1;transition-delay:.45s;transform:translate(-50%)}:is(#dock,#nav) button{border-radius:var(--radius-md);height:40px;color:var(--text-muted);font:500 13px var(--font-body);cursor:pointer;transition:background-color var(--dur-2) var(--ease-glass), color var(--dur-2) var(--ease-glass), box-shadow var(--dur-2) var(--ease-glass);background:0 0;border:0;align-items:center;gap:8px;padding:0 10px 0 9px;display:inline-flex;position:relative}:is(#dock,#nav) button:hover{background:var(--glass-hover);color:var(--text)}:is(#dock,#nav) button:focus-visible{outline:2px solid var(--light);outline-offset:1px}:is(#dock,#nav,#reveal) button svg,#reveal svg{fill:none;stroke:currentColor;stroke-width:1.7px;stroke-linecap:round;stroke-linejoin:round;width:20px;height:20px;transition:transform var(--dur-3) var(--ease-glass);flex:none}:is(#dock,#nav) button svg .fill{fill:currentColor;stroke:none}:is(#dock,#nav) [aria-pressed=true]{color:var(--light)}#hud{top:var(--gap);left:var(--gap);border-radius:var(--radius-md);max-width:calc(100vw - var(--panel-width) - var(--compass) - 5 * var(--gap));box-sizing:border-box;color:var(--text-subtle);font-variant-numeric:tabular-nums;white-space:nowrap;pointer-events:none;flex-wrap:wrap;align-items:center;gap:3px 14px;padding:7px 12px;font-size:12.5px;display:flex;position:fixed}#hud b{color:var(--text);font-weight:600}.badge{background:var(--light-soft);box-shadow:inset 0 0 0 1px var(--light-rim);color:var(--light-bright);border-radius:999px;padding:1px 9px;font-weight:600}@media (width<=640px){#hud{max-width:calc(100vw - 2 * var(--gap))}}#panel{top:var(--gap);right:var(--gap);width:var(--panel-width);max-height:calc(100vh - 3 * var(--gap) - var(--dock-height));border-radius:var(--radius-lg);--tp-base-background-color:transparent;--tp-base-shadow-color:transparent;--tp-base-border-radius:var(--radius-md);--tp-base-font-family:var(--font-body);--tp-blade-border-radius:6px;--tp-blade-horizontal-padding:6px;--tp-blade-value-width:156px;--tp-container-unit-size:22px;--tp-container-unit-spacing:5px;--tp-container-vertical-padding:5px;--tp-button-background-color:oklch(38% .05 258/.7);--tp-button-background-color-hover:oklch(46% .06 256/.75);--tp-button-background-color-focus:oklch(46% .06 256/.75);--tp-button-background-color-active:oklch(52% .07 254/.8);--tp-button-foreground-color:var(--text);--tp-container-background-color:oklch(32% .04 258/.3);--tp-container-background-color-hover:oklch(38% .05 258/.38);--tp-container-background-color-focus:oklch(38% .05 258/.38);--tp-container-background-color-active:oklch(44% .05 258/.42);--tp-container-foreground-color:var(--text);--tp-groove-foreground-color:oklch(62% .05 255/.22);--tp-input-background-color:var(--field);--tp-input-background-color-hover:oklch(20% .03 262/.62);--tp-input-background-color-focus:oklch(22% .035 262/.7);--tp-input-background-color-active:oklch(24% .04 262/.72);--tp-input-foreground-color:var(--text);--tp-label-foreground-color:var(--text-subtle);--tp-monitor-background-color:oklch(13% .022 262/.5);--tp-monitor-foreground-color:var(--text-muted);display:flex;position:fixed;overflow:hidden}#panel-scroll{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:oklch(62% .05 255/.35) transparent;flex:1;padding:4px;overflow-y:auto}#panel .tp-rotv{font-size:12px;font-weight:450}#panel .tp-rotv_b,#panel .tp-fldv_b{letter-spacing:.01em;font-weight:600}#panel .tp-ckbv_w,#panel .tp-txtv_i,#panel .tp-lstv_s{box-shadow:inset 0 0 0 1px oklch(62% .05 255/.22)}#panel .tp-ckbv_w svg path{stroke:var(--light)}#panel .tp-sldv_k:before{background-color:oklch(86% .12 78/.65)}#panel .tp-sldv_k:after{background-color:var(--light);box-shadow:0 0 10px -2px var(--light);border-radius:50%}#panel :focus-visible{outline:2px solid var(--light-rim);outline-offset:1px}@media (width<=640px){#panel{top:calc(2 * var(--gap) + 34px);left:var(--gap);width:auto;max-height:calc(100vh - 5 * var(--gap) - 34px - var(--dock-height))}}#dock{left:50%;bottom:var(--gap);height:var(--dock-height);box-sizing:border-box;border-radius:var(--radius-lg);align-items:center;gap:3px;padding:6px;display:flex;position:fixed;transform:translate(-50%)}.tools{gap:3px;display:flex}.tools [data-tool="0"] svg{color:var(--tool-attract)}.tools [data-tool="1"] svg{color:var(--tool-repel)}.tools [data-tool="2"] svg{color:var(--tool-swirl)}.tools [aria-checked=true]{box-shadow:inset 0 0 0 1px var(--light-rim), 0 0 24px -8px oklch(86% .12 78/.7);color:var(--text);background:linear-gradient(oklch(86% .12 78/.2),oklch(86% .12 78/.07))}.tools [aria-checked=true] kbd{color:var(--light-bright)}#dock svg.reversed{transform:scaleX(-1)}#dock .icon{justify-content:center;width:40px;padding:0}#dock .pins{font-variant-numeric:tabular-nums;gap:5px;width:auto;padding:0 11px 0 9px}#dock #btn-help[aria-pressed=true]{color:var(--text)}#btn-pause .when-paused,body.paused #btn-pause .when-running,#btn-fullscreen .when-fullscreen,body.fullscreen #btn-fullscreen .when-windowed{display:none}body.paused #btn-pause .when-paused,body.fullscreen #btn-fullscreen .when-fullscreen{display:block}#dock #btn-fullscreen[aria-pressed=true]{color:var(--text-muted)}#dock [hidden]{display:none}.divider{background:var(--border);width:1px;height:24px;margin:0 5px}@media (width<=900px){.tools .label,.tools kbd{display:none}#dock button{padding:0 10px}}@media (width<=640px){#dock .divider,#dock #btn-help,#dock #btn-fullscreen{display:none}#dock button,#dock .icon{width:36px;padding:0 8px}#dock .pins{width:auto}}#nav{top:var(--gap);right:calc(var(--panel-width) + 2 * var(--gap));width:var(--compass);flex-direction:column;align-items:center;gap:8px;display:flex;position:fixed}.compass{width:var(--compass);height:var(--compass);transition:background-color var(--dur-2) var(--ease-glass);background:oklch(22% .035 260/.32);border-radius:50%}.compass:hover{background:var(--glass)}#nav-compass{touch-action:none;cursor:grab;-webkit-user-select:none;user-select:none;width:100%;height:100%;display:block;overflow:visible}#nav-compass:active{cursor:grabbing}#nav-compass .axis{cursor:pointer}.axis-x{color:var(--axis-x)}.axis-y{color:var(--axis-y)}.axis-z{color:var(--axis-z)}#nav-compass .stem{stroke:currentColor;stroke-width:2.4px;stroke-linecap:round}#nav-compass circle{fill:currentColor;stroke:#0000;stroke-width:2px;transition:stroke var(--dur-1) var(--ease-glass)}#nav-compass .neg circle{fill-opacity:.22;stroke:currentColor;stroke-width:1.6px}#nav-compass text{fill:oklch(18% .03 262);font:700 11px var(--font-body);pointer-events:none}#nav-compass .axis:hover circle{stroke:var(--text)}.nav-buttons{border-radius:var(--radius-lg);flex-direction:column;gap:2px;padding:4px;display:flex}#nav button{touch-action:none;justify-content:center;width:34px;height:34px;padding:0}#nav button svg{width:18px;height:18px}#nav-pan{cursor:grab}#nav-pan:active{cursor:grabbing}#nav [data-tip]:after{inset:50% calc(100% + 10px) auto auto;transform:translate(4px,-50%)}#nav [data-tip]:hover:after{transform:translateY(-50%)}@media (width<=640px){#nav{--compass:72px;top:auto;right:var(--gap);bottom:calc(2 * var(--gap) + var(--dock-height))}}#help{left:var(--gap);bottom:calc(2 * var(--gap) + var(--dock-height));width:min(640px, calc(100vw - var(--panel-width) - 3 * var(--gap)));box-sizing:border-box;border-radius:var(--radius-lg);color:var(--text-subtle);grid-template-columns:repeat(auto-fit,minmax(176px,1fr));gap:12px 22px;padding:13px 16px 14px;font-size:12.5px;display:grid;position:fixed}#help h3{color:var(--text-muted);letter-spacing:.06em;text-transform:uppercase;margin:0 0 7px;font-size:11px;font-weight:650}#help ul{gap:5px;margin:0;padding:0;list-style:none;display:grid}#help b{color:var(--text-muted);font-weight:550}body.help-hidden #help{opacity:0;visibility:hidden;pointer-events:none;transition:opacity var(--dur-2) var(--ease-glass), transform var(--dur-2) var(--ease-glass), visibility 0s linear var(--dur-2);transform:translateY(10px)}#reveal{left:50%;bottom:var(--gap);height:38px;color:var(--text-muted);font:500 13px var(--font-body);cursor:pointer;opacity:0;visibility:hidden;transition:opacity var(--dur-2) var(--ease-glass), transform var(--dur-2) var(--ease-glass), color var(--dur-2) var(--ease-glass), visibility 0s linear var(--dur-2);border:0;border-radius:999px;align-items:center;gap:8px;padding:0 10px 0 12px;display:inline-flex;position:fixed;transform:translate(-50%,8px)}body.ui-hidden.hint #reveal,body.ui-hidden.peek:not(.idle) #reveal,body.ui-hidden #reveal:hover{opacity:1;visibility:visible;transition-delay:0s;transform:translate(-50%)}#reveal:hover{color:var(--text)}#reveal:focus-visible{outline:2px solid var(--light);outline-offset:2px}#reveal svg{width:18px;height:18px}@media (hover:none){#reveal kbd{display:none}}#toast{left:50%;bottom:calc(2 * var(--gap) + var(--dock-height));max-width:min(520px, calc(100vw - 2 * var(--gap)));background:var(--glass-strong);-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);box-shadow:inset 0 0 0 1px var(--border), 0 10px 26px -12px oklch(0% 0 0/.7);color:var(--text);white-space:nowrap;opacity:0;transition:opacity var(--dur-2) var(--ease-glass), transform var(--dur-3) var(--ease-glass);pointer-events:none;border-radius:999px;padding:8px 15px;font-weight:500;position:fixed;transform:translate(-50%,8px)}#toast.show{opacity:1;transform:translate(-50%)}#error{z-index:10;border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(18px);backdrop-filter:blur(18px);color:oklch(92% .04 30);max-width:640px;height:fit-content;font:13px/1.55 var(--font-body);white-space:pre-wrap;background:oklch(20% .04 25/.85);margin:auto;padding:18px 22px;position:fixed;inset:0;box-shadow:inset 0 0 0 1px oklch(70% .17 25/.5)}@media (width<=640px){#help{display:none}}
