:root{--desktop:#e6e2d6;--paper:#f4f0e5;--bezel:#dedace;--mac-ink:#343d50;--mac-line:#777b82;--phosphor:#146ef5;--dim:#637088;--line:#2038582b;--wash:#146ef510;--glow:#146ef522;--blue:#146ef5;--display:'VT323',monospace;--ui:'IBM Plex Mono',monospace;--ink:#252f43;--gray:#637088;--faint:#293c501a;--faint2:#293c5033;color-scheme:light}
:root[data-theme=white]{--desktop:#e5e8ec;--paper:#fff;--bezel:#edf0f3;--mac-ink:#22314b;--phosphor:#146ef5;--dim:#68758a;--display:'IBM Plex Mono',monospace;--ui:'IBM Plex Mono',monospace}
:root[data-theme=dark]{--desktop:#211c18;--paper:#2b241f;--bezel:#44392f;--mac-ink:#e7dece;--mac-line:#807260;--phosphor:#9fcaff;--dim:#b3a693;--line:#c5b9a333;--wash:#a2caff12;--glow:#91bfff22;--blue:#9fcaff;--ink:#e7dece;--gray:#b3a693;--faint:#d0c0a41a;--faint2:#d0c0a433;--display:'VT323',monospace;color-scheme:dark}
:root[data-theme=classic]{--desktop:#c9c9c3;--paper:#efefe7;--bezel:#deded6;--mac-ink:#171717;--mac-line:#4b4b47;--phosphor:#174eb6;--dim:#5b5b55;--line:#0003;--wash:#174eb615;--glow:transparent;--display:Tahoma,Geneva,sans-serif;--ui:Tahoma,Geneva,sans-serif;--ink:#171717}
html{background:var(--desktop)}body{background-color:var(--desktop);background-image:radial-gradient(#6a6c681d .7px,transparent .7px);background-size:4px 4px;color:var(--phosphor);font-family:var(--ui);padding-top:94px;padding-bottom:48px;transition:background-color .2s,color .2s}
.desktop-bar{position:fixed;top:0;left:0;right:0;height:42px;z-index:60;display:flex;align-items:center;gap:18px;padding:0 28px;background:var(--paper);color:var(--mac-ink);border-bottom:1px solid var(--mac-line);box-shadow:0 1px 0 #ffffff70;font:11px var(--ui)}.desktop-brand{display:flex;align-items:center;gap:11px;font-weight:500;flex-shrink:0}.rainbow-mark{display:inline-block;width:14px;height:18px;background:linear-gradient(#57a346 0 16.66%,#efd34e 16.66% 33.33%,#ee9840 33.33% 50%,#d85561 50% 66.66%,#9668be 66.66% 83.33%,#3886c4 83.33%);clip-path:polygon(20% 0,100% 0,100% 22%,40% 22%,40% 38%,90% 38%,90% 100%,0 100%,0 78%,60% 78%,60% 62%,10% 62%,10% 10%)}.theme-options{margin-left:auto;display:flex;height:100%;align-items:center;gap:2px}.theme-options button{font:10px var(--ui);color:var(--mac-ink);padding:7px 12px;border:1px solid transparent;min-height:30px;background:transparent;cursor:pointer}.theme-options button:hover{border-color:var(--line)}.theme-options button[aria-pressed=true]{color:var(--paper);background:var(--phosphor);border-color:var(--phosphor)}.desktop-bar a:focus-visible,.desktop-bar button:focus-visible{outline:2px solid var(--phosphor);outline-offset:1px}
.monitor{position:relative;overflow:visible;padding:13px 13px 0;border-radius:9px;border:1px solid var(--mac-line);background:var(--bezel);box-shadow:2px 2px 0 #353c4c33,0 18px 45px #252c3d16,inset 1px 1px #fff8}.screen{background:var(--paper);color:var(--phosphor);border-radius:4px;padding:0 42px 23px;min-height:min(730px,calc(100svh - 200px));box-shadow:0 0 0 1px var(--mac-line),inset 1px 1px #fff8;text-shadow:0 0 12px var(--glow)}.screen::before{opacity:.22;background:repeating-linear-gradient(0deg,#2c4f7817 0 1px,transparent 1px 3px)}.screen::after{background:linear-gradient(115deg,#fff3,transparent 40%);box-shadow:inset 0 0 25px #5166880a}.screen-top{margin:0 -42px;padding:0 16px;height:34px;flex-shrink:0;gap:12px;background:var(--bezel);border-bottom:1px solid var(--mac-line);position:relative;color:var(--mac-ink);text-shadow:none}.screen-top::before{content:"";position:absolute;left:12px;right:12px;top:7px;bottom:7px;background:repeating-linear-gradient(to bottom,var(--mac-line) 0 1px,transparent 1px 4px);opacity:.6;z-index:-1}.screen-top>a{background:var(--bezel);padding:0 8px;display:flex;align-items:center;gap:9px}.screen-top>a::before{content:"";display:block;width:9px;height:9px;border:1px solid var(--mac-line);background:var(--paper);box-shadow:inset 1px 1px #fff9}.screen-top>span{position:absolute;left:50%;transform:translateX(-50%);background:var(--bezel);padding:0 12px;white-space:nowrap;color:var(--mac-ink);font-size:9px}.screen-top>button{background:var(--bezel);padding:1px 6px;font-size:14px;border:1px solid var(--mac-line)}.home-view{padding:33px 0 38px}.title h1{font-family:var(--display);text-shadow:0 0 2px var(--glow),0 0 18px var(--glow);letter-spacing:-.035em}.selection{background:var(--wash);border-left-color:var(--phosphor);border-radius:1px}.menu-link{border-bottom-color:var(--line)}.menu-name{font-family:var(--ui)}.section-label{font-family:var(--ui)}.github-link{color:var(--dim)}.preview canvas{opacity:.95}.monitor-bottom{height:46px;padding:0 7px;gap:18px}.chassis-brand{color:var(--mac-ink);text-shadow:none;font:12px var(--display);letter-spacing:.03em;display:flex;align-items:center;gap:9px}.chassis-brand::before{content:"";width:30px;height:5px;background:linear-gradient(90deg,#57a346 0 16.66%,#efd34e 16.66% 33.33%,#ee9840 33.33% 50%,#d85561 50% 66.66%,#9668be 66.66% 83.33%,#3886c4 83.33%)}.monitor-controls>button{color:var(--mac-ink);border:1px solid var(--mac-line);border-radius:2px;min-height:25px;padding:4px 8px}.monitor-controls>button:hover,.monitor-controls>button[aria-pressed=true]:not(.color-btn){color:var(--phosphor);background:var(--paper);border-radius:2px}.power-led{background:var(--phosphor);box-shadow:0 0 5px var(--glow);width:4px;height:4px}.command-panel{left:42px;right:42px;bottom:74px;background:var(--paper);color:var(--mac-ink);border:1px solid var(--mac-line);box-shadow:3px 3px 0 #22314b33;z-index:12}.command-panel input{color:var(--phosphor)}.command-help,.command-heading{color:var(--dim)}.command-panel label{color:var(--phosphor)}.screen-footer{color:var(--dim)}.detail-view h1{font-family:var(--display)}.detail-back:hover{color:var(--phosphor);text-decoration:underline}
:root[data-theme=white] .title h1{font-size:clamp(70px,10vw,118px);padding:15px 0;letter-spacing:-.09em}:root[data-theme=classic] .title h1{font-size:clamp(70px,10vw,118px);padding:14px 0;font-weight:bold;letter-spacing:-.08em}:root[data-theme=classic] .screen,:root[data-theme=classic] .title h1{text-shadow:none}:root[data-theme=classic] .screen::before{display:none}:root[data-theme=classic] .menu-name{font-size:20px}:root[data-theme=dark] .screen::after{background:linear-gradient(115deg,#c1dcff08,transparent 40%)}:root[data-theme=dark] .monitor{box-shadow:2px 2px 0 #0009,0 18px 45px #0006,inset 1px 1px #ffffff10}
.edge-ball{position:absolute;left:0;top:0;width:60px;height:60px;border:0;border-radius:50%;padding:0;background:transparent;z-index:25;cursor:grab;touch-action:none;will-change:transform;filter:drop-shadow(2px 4px 3px #1d315333)}.edge-ball:active{cursor:grabbing}.edge-ball:focus-visible{outline:2px solid var(--phosphor);outline-offset:3px}.edge-ball canvas{display:block;width:100%;height:100%;pointer-events:none}.edge-ball-hint{position:absolute;right:12px;top:-26px;font:9px var(--ui);color:var(--dim);opacity:0;transition:opacity .15s;pointer-events:none}.monitor:has(.edge-ball:focus-visible) .edge-ball-hint,.monitor:has(.edge-ball:hover) .edge-ball-hint{opacity:1}
body.media-page{display:block;min-height:100svh;color:var(--ink);font-family:var(--ui);padding:0;isolation:isolate;--mono:var(--ui);--doto:var(--ui);--disp:var(--display)}.media-page .wrap{padding-top:125px}.media-page h1{font-family:var(--display);font-weight:400;color:var(--phosphor);font-size:clamp(40px,9vw,74px);letter-spacing:-.04em;line-height:1.05;text-shadow:0 0 14px var(--glow)}.media-page h1 .yy{color:inherit}.media-page .hero-clip{margin-bottom:48px}:root[data-theme=classic] .media-page h1,:root[data-theme=white] .media-page h1{font-size:clamp(30px,6vw,48px);letter-spacing:-.07em}.media-page .sec-access{background:var(--paper);border:1px solid var(--mac-line);box-shadow:3px 3px 0 #26334b1b;padding:24px}.media-page .sec-access input{background:var(--paper);color:var(--ink);border-color:var(--mac-line);border-radius:1px}.media-page .sec-access h2,.media-page h2,.media-page .back{color:var(--phosphor)}.media-page .sec-access button,.media-page .sec-access a#access-invite{background:var(--phosphor);color:var(--paper);border:1px solid var(--phosphor);border-radius:2px;font-size:12px}.media-page .sec-access label{font-size:13px}.media-page #access-status{font-size:13px}.media-page .steps li{color:var(--ink);font-size:12px}.media-page .steps a{color:var(--phosphor)}.media-page .links a{border-radius:2px}.media-page .links a.fill{background:var(--phosphor);color:var(--paper)}.media-page .links a.line{color:var(--phosphor);border-color:var(--phosphor)}.media-page .links a:hover{background:var(--phosphor);color:var(--paper);filter:brightness(.94)}.media-page .corner{color:var(--dim)}.media-page .c-tl{display:none}.media-page .xv,.media-page .xh{background:var(--faint)}.media-page .ruler{opacity:.5}.media-page .chrome{z-index:-1}.media-page .goo{z-index:-2}
@media(max-width:760px){body{padding:78px 20px 28px}.desktop-bar{padding:0 14px;gap:10px;height:42px}.desktop-brand{gap:8px;font-size:10px}.theme-options{gap:0}.theme-options button{font-size:8px;padding:8px 8px}.monitor{padding:9px 9px 0}.screen{padding:0 22px 20px;border-radius:3px;min-height:calc(100svh - 160px)}.screen-top{margin:0 -22px;height:32px;padding:0 8px}.screen-top>a{font-size:8px;padding:0 4px}.screen-top>span{font-size:8px;padding:0 8px}.home-view{padding:35px 0 30px}.title h1{font-size:23vw;margin-bottom:30px}.monitor-bottom{height:42px}.chassis-brand{font-size:11px}.monitor-controls{gap:5px}.monitor-controls>button{font-size:7px;min-height:28px;padding:4px 6px}.command-panel{left:22px;right:22px;bottom:75px}.edge-ball{width:42px;height:42px}.edge-ball-hint{display:none}:root[data-theme=white] .title h1,:root[data-theme=classic] .title h1{font-size:18vw;padding:8px 0}:root[data-theme=classic] .menu-name{font-size:19px}.media-page .wrap{padding-top:108px}.media-page .sec-access{padding:20px}.detail-view{padding-top:34px}.detail-view h1{font-size:15vw}}
@media(max-width:380px){body{padding:70px 16px 25px}.desktop-bar{padding:0 10px}.theme-options button{padding:8px 6px;font-size:8px}.desktop-brand{font-size:9px}.rainbow-mark{width:11px;height:15px}.screen-top>span{max-width:48%;overflow:hidden}.screen{padding-left:18px;padding-right:18px}.screen-top{margin-left:-18px;margin-right:-18px}}
.screen-top{isolation:isolate}
@media(prefers-reduced-motion:reduce){body,.edge-ball-hint{transition:none}.edge-ball{will-change:auto}}
