@font-face{font-family:VT323;src:url(/font/VT323-Regular.ttf)format("truetype");font-weight:400;font-style:normal;font-display:block}:root{--frame:#36404d;--drive-face:#3d4147;--drive-bay:#06070a;--drive-bay-shadow:#000;--tint-amount:28%;--shade-amount:60%;--grain-strength:.65;--font-primary:ui-monospace, "SF Mono", Menlo, Consolas, monospace;--font-screen:"VT323", var(--font-primary)}:root[data-theme=light]{--frame:#a19b86;--tint-amount:45%;--frame-tint:color-mix(in srgb, var(--frame), #242424 var(--tint-amount));--drive-face:color-mix(in srgb, var(--frame), black 15%);--drive-bay:color-mix(in srgb, var(--frame), black 52%);--drive-bay-shadow:#0000004d;--shade-amount:22%}:root{--frame-tint:color-mix(in srgb, var(--frame), white var(--tint-amount));--frame-shade:color-mix(in srgb, var(--frame), black var(--shade-amount));--housing:color-mix(in srgb, var(--frame), black 62%);--red:#eb445a;--red-glow:#ff8a99;--amber:#ffc409;--amber-glow:#ffe58f;--green:#1c6f2f;--green-glow:#48a155;--power-start:#f06d0c;--power-end:#803107;--power-light:color-mix(in srgb, var(--power-start), white 30%);--power-dark:color-mix(in srgb, var(--power-end), black 40%);--reset-start:#3d3d3d;--reset-end:#1d1d1d;--reset-light:color-mix(in srgb, var(--reset-start), white 30%);--reset-dark:color-mix(in srgb, var(--reset-end), black 40%);--side-w:clamp(10rem, 10vw, 10.9375rem);--header-h:clamp(5rem, 12vh, 6.5625rem);--footer-h:clamp(7.5rem, 15vh, 9.375rem);--screen-radius:1.875rem;--screen-lip:.7rem;--holes-h:5rem}html{font-size:max(16px,min(.917vw,1.693dvh))}html,body{background:var(--frame);height:100%;font-family:var(--font-primary);margin:0}.pc{grid-template-columns:var(--side-w) minmax(0, 1fr) var(--side-w);grid-template-rows:var(--header-h) minmax(0, 1fr) var(--footer-h);box-sizing:border-box;background:var(--frame);grid-template-areas:"left header right""left screen right""left footer right";width:100%;height:100dvh;display:grid;overflow:hidden}.pc__side{--side-gap:clamp(.75rem, 2.4vh, 2rem);padding:calc(var(--header-h) + .625rem) .4375rem 3rem;box-sizing:border-box;flex-direction:column;display:flex}.pc__side>*+*{margin-top:var(--side-gap)}.pc__side .panel+.panel{margin-top:1rem}.pc__side .panel--fader{margin-bottom:1rem}.pc__side>.pc__side-bottom,.pc__side>.bevel-lines--vent{margin-top:auto}.pc__side-bottom{flex-direction:column;gap:.875rem;display:flex}.pc__side--left{grid-area:left}.pc__side--right{grid-area:right}.pc__header,.pc__footer{box-sizing:border-box;align-items:center;gap:clamp(1rem,3vw,3.125rem);padding:0 1.5625rem;display:flex}.pc__header{padding-top:calc(var(--header-h) * .24);grid-area:header}.pc__footer{grid-area:footer;justify-content:space-between;align-items:flex-start;padding-block:1.25rem 0}html[data-fill] .pc{grid-template:"screen"minmax(0,1fr)/minmax(0,1fr)}html[data-fill] .pc__side,html[data-fill] .pc__header,html[data-fill] .pc__footer,html[data-fill] .screw,html[data-fill] .pc:before{display:none}html[data-fill] .screen-frame,html[data-fill] .screen{box-shadow:none;border-radius:0}@media screen and (width<=768px){.pc{grid-template:"screen"minmax(0,1fr)/minmax(0,1fr)}.pc__side,.pc__header,.pc__footer,.screw{display:none}}.bevel-lines{flex-direction:column;gap:.625rem;padding:.625rem 0;display:flex}.bevel-lines>i{height:.3125rem;box-shadow:-.0625rem -.0625rem .125rem var(--frame-tint), .125rem .125rem .1875rem var(--frame-shade);display:block}.bevel-lines--vertical{flex-direction:row;align-items:center;gap:.625rem;padding:0}.bevel-lines--vertical>i{background:var(--frame);width:.3125rem;height:3.4375rem}.panel{background:var(--frame);box-shadow:inset -.1875rem -.1875rem .375rem var(--frame-tint), inset .25rem .25rem .5rem var(--frame-shade);box-sizing:border-box;border-radius:.5rem;padding:.75rem}.holes{width:round(down,100%,1rem);height:var(--holes-h);background-image:radial-gradient(circle, #000 .2125rem, var(--frame-shade) .25rem, transparent .2812rem), radial-gradient(circle, #000 .2125rem, var(--frame-shade) .25rem, transparent .2812rem);background-position:-.25rem -.5rem,.25rem .5rem;background-size:1rem 2rem;margin-inline:auto}.plate{white-space:nowrap;box-shadow:-.0625rem -.0625rem .1875rem var(--frame-tint), .125rem .125rem .25rem var(--frame-shade);border-radius:.25rem;margin:0;padding:0 .9375rem}.plate--title{box-shadow:-.125rem -.125rem .25rem var(--frame-tint), .1875rem .1875rem .375rem var(--frame-shade);border-radius:.5rem}.plate__text{color:var(--frame);text-shadow:-.0625rem -.0625rem .125rem var(--frame-tint), .125rem .125rem .125rem var(--frame-shade);margin:0;font-size:clamp(1em,1.6vw,1.5em);line-height:1.5em}.plate--title .plate__text{font-size:clamp(1em,1.8vw,1.5em);line-height:1.7em}.lights{margin-left:auto;display:flex}.light{border:.0625rem solid var(--frame-shade);width:1.25rem;height:1.25rem;box-shadow:inset -.125rem -.125rem .25rem var(--frame-tint), inset .125rem .125rem .25rem var(--frame-shade);filter:brightness(.5)saturate(1.5)contrast(2);box-sizing:border-box;border-radius:100%;margin:0 .3125rem;transition:all .1s}.light--red{background:radial-gradient(var(--red-glow) 0%, var(--red) 100%);--glow:var(--red-glow)}.light--amber{background:radial-gradient(var(--amber-glow) 0%, var(--amber) 100%);--glow:var(--amber-glow)}.light.active{border-color:var(--frame-tint);box-shadow:inset -.0625rem -.0625rem .125rem var(--frame-tint), inset .0625rem .0625rem .125rem var(--frame-shade);filter:drop-shadow(0 0 .625rem var(--glow)) brightness(.75) saturate(1.5) contrast(2)}.buttons{background:var(--frame);box-shadow:inset -.125rem -.125rem .25rem var(--frame-tint), inset .1875rem .1875rem .375rem var(--frame-shade);box-sizing:border-box;border-radius:.375rem;justify-content:space-evenly;gap:.75rem;margin-top:.75rem;padding:.625rem;display:flex}.btn{cursor:pointer;background:0 0;border:0;flex:1;min-width:0;max-width:4rem;padding:0}.btn__cap{aspect-ratio:1;box-sizing:border-box;color:#222;border-radius:.375rem;width:100%;padding:24%;display:block}.btn__cap svg{width:100%;height:100%;display:block}.btn--power .btn__cap{background:radial-gradient(circle, var(--power-start) 20%, var(--power-end) 100%);border:.0625rem solid var(--power-dark);box-shadow:-.0625rem -.0625rem .125rem var(--power-light), .0625rem .0625rem .125rem var(--power-dark);filter:brightness(.5)saturate()contrast();transition:all .5s ease-in-out}.btn--power .btn__cap.active{color:#fff;box-shadow:inset -.0625rem -.0625rem .125rem var(--power-light), inset .0625rem .0625rem .125rem var(--power-dark);filter:brightness(1.1) saturate(1.1) contrast(1.1) drop-shadow(0 0 .4rem var(--power-light))}.btn--reset .btn__cap{background:radial-gradient(circle, var(--reset-start) 20%, var(--reset-end) 100%);border:.0625rem solid var(--reset-dark);box-shadow:.0625rem .0625rem .125rem var(--frame-shade), -.0625rem -.0625rem .125rem var(--frame-tint);filter:brightness(.2)saturate(2)contrast(1.3);transition:all .2s ease-in-out}:root[data-power=on] .btn--reset .btn__cap{filter:none}.btn--reset .btn__cap.active{color:var(--power-start);box-shadow:inset -.0625rem -.0625rem .125rem var(--reset-light), inset .0625rem .0625rem .125rem var(--reset-dark)}.drive-bay{background:var(--drive-bay);width:clamp(18.75rem,28vw,31.5rem);box-shadow:inset .0625rem .0625rem .1875rem var(--drive-bay-shadow), .0625rem .0625rem 0 var(--frame-tint), -.0625rem -.0625rem 0 var(--frame-shade);box-sizing:border-box;border-radius:.125rem;padding:.25rem}.drive{background:var(--drive-face);border-radius:.125rem;grid-template-columns:minmax(0,1fr) auto;align-content:center;column-gap:1.5rem;height:5.25rem;padding:0 1.5rem;display:grid;box-shadow:inset .0625rem .0625rem #ffffff1a,inset -.0625rem -.0625rem #00000073}.drive__slot{--bar:.625rem;filter:drop-shadow(0 .0625rem #ffffff24);grid-area:1/1;height:1.5rem;position:relative}.drive__slot:before{content:"";clip-path:polygon(0 0, 100% 0, 100% var(--bar), 67.5% var(--bar), 67.5% 100%, 32.5% 100%, 32.5% var(--bar), 0 var(--bar));background:linear-gradient(#000,#0a0b0d);position:absolute;inset:0}.drive__eject{background:color-mix(in srgb, var(--drive-face), black 25%);border-radius:.1875rem;grid-area:1/2/span 2;align-self:center;place-items:center;width:1.875rem;height:3.25rem;display:grid;box-shadow:inset .125rem .125rem .25rem #000000b3,inset -.0625rem -.0625rem .0625rem #ffffff14,0 .0625rem #ffffff1a}.drive__eject i{background:#0a0a0a;width:.875rem;height:2.25rem;box-shadow:inset 0 .0625rem #fff3,.0625rem .125rem .1875rem #000000b3}.drive__led{background:var(--green);filter:brightness(.35)saturate(1.5);border-radius:.0625rem;grid-area:2/1;justify-self:start;width:.75rem;height:.5rem;margin-top:.625rem;transition:all .1s;box-shadow:inset 0 0 0 .0625rem #00000080}.drive__led.active{filter:drop-shadow(0 0 .375rem var(--green-glow)) brightness(1) saturate(1.3)}.screw{z-index:1;background:radial-gradient(circle at 35% 30%, var(--frame-tint), var(--frame) 55%, var(--frame-shade));width:.875rem;height:.875rem;box-shadow:-.0625rem -.0625rem .125rem var(--frame-tint), .125rem .125rem .1875rem var(--frame-shade);border-radius:50%;position:absolute}.screw:before{content:"";background:var(--frame-shade);height:.125rem;box-shadow:0 .0625rem 0 var(--frame-tint);transform:rotate(var(--r,0deg));margin-top:-.0625rem;position:absolute;top:50%;left:.125rem;right:.125rem}.pc>.screw{background:color-mix(in srgb, var(--frame), black 60%);width:1.375rem;height:1.375rem;box-shadow:inset .125rem .125rem .25rem #000000d9, .0625rem .0625rem 0 var(--frame-tint), -.0625rem -.0625rem 0 var(--frame-shade)}.pc>.screw:before{background:radial-gradient(circle at 35% 30%,#9aa0a8,#5b5f66 55%,#33363b);border-radius:50%;height:auto;margin:0;inset:.25rem;transform:none;box-shadow:0 .0625rem .125rem #000000b3}.pc>.screw:after{content:"";height:.125rem;transform:rotate(var(--r,0deg));background:#1c1e22;margin-top:-.0625rem;position:absolute;top:50%;left:.375rem;right:.375rem;box-shadow:0 .0625rem #ffffff38}.screw--tl{--r:35deg;top:.875rem;left:.875rem}.screw--tr{--r:-20deg;top:.875rem;right:.875rem}.screw--bl{--r:80deg;bottom:.875rem;left:.875rem}.screw--br{--r:10deg;bottom:.875rem;right:.875rem}.switches{grid-template-columns:repeat(4,1fr);display:grid}.switch-unit{color:var(--frame-tint);text-shadow:.0625rem .0625rem .0625rem var(--frame-shade);flex-direction:column;align-items:center;gap:.375rem;font-size:.5rem;display:flex}.switch-unit__led{background:var(--amber);filter:brightness(.35)saturate(1.5);border-radius:.0625rem;width:.5rem;height:.3125rem;transition:all .1s;box-shadow:inset 0 0 0 .0625rem #00000080}.switch-unit:has(.switch[aria-checked=true]) .switch-unit__led{filter:drop-shadow(0 0 .3125rem var(--amber-glow)) brightness(1) saturate(1.2)}.switch{background:color-mix(in srgb, var(--frame), black 55%);width:1.625rem;height:2.875rem;box-shadow:inset .125rem .125rem .25rem #000c, 0 .0625rem 0 var(--frame-tint);perspective:5rem;box-sizing:border-box;cursor:pointer;border:0;border-radius:.1875rem;padding:.1875rem;position:relative}.switch i{background:linear-gradient(#0000 25%,#ffffff47 50%,#0000 75%) 0 75%/100% 200% no-repeat,linear-gradient(#34373c,#1c1d20);border-radius:.125rem;width:100%;height:100%;transition:transform .2s cubic-bezier(.3,1.5,.5,1),background-position .2s cubic-bezier(.3,1.5,.5,1);display:block;position:relative;transform:rotateX(-14deg);box-shadow:0 .125rem .1875rem #000000b3}.switch[aria-checked=true] i{background-position:0 25%,0 0;transform:rotateX(14deg)}@media (prefers-reduced-motion:reduce){.switch i{transition:none}}.switch i:before{content:"";background:#ececec;width:.125rem;height:24%;margin-left:-.0625rem;position:absolute;top:20%;left:50%}.switch i:after{content:"";box-sizing:border-box;border:.125rem solid #ececec;border-radius:50%;width:.5rem;height:.5rem;margin-left:-.25rem;position:absolute;bottom:18%;left:50%}.panel--fader{padding:.75rem .9rem .5rem}.fader{--cap-w:2.1rem;cursor:ew-resize;touch-action:none;height:2.9rem;position:relative}.fader:before,.fader:after{content:"";left:calc(var(--cap-w) / 2);right:calc(var(--cap-w) / 2);background:linear-gradient(90deg, var(--frame-shade) .0625rem, transparent .0625rem) 0 0 / calc((100% - .0625rem) / 12) 100% repeat-x;border-right:.0625rem solid var(--frame-shade);height:.4rem;position:absolute}.fader:before{top:0}.fader:after{bottom:0}.fader__slot{height:.5rem;box-shadow:inset 0 .1875rem .25rem #000, 0 .0625rem 0 var(--frame-tint);background:#050608;border-radius:.25rem;margin-top:-.25rem;position:absolute;top:50%;left:0;right:0}.fader__cap{z-index:1;top:50%;left:calc(var(--t,0) * (100% - var(--cap-w)));width:var(--cap-w);background:linear-gradient(#666a72,#3a3d43 40%,#2b2d32);border-radius:.25rem;height:1.8rem;margin-top:-.9rem;position:absolute;box-shadow:0 .3rem .4rem #000000bf,0 .0625rem .0625rem #000000e6,inset 0 .0625rem #fff6,inset 0 -.125rem .0625rem #00000073}.fader__cap:before{content:"";background:linear-gradient(#34373c,#45484f);border-radius:.2rem;position:absolute;inset:.28rem .32rem;box-shadow:inset 0 .0625rem .125rem #000000b3,0 .0625rem #ffffff1f}.fader__cap:after{content:"";background:#f0f0f0;border-radius:.0625rem;width:.125rem;margin-left:-.0625rem;position:absolute;top:.4rem;bottom:.4rem;left:50%}.fader__label{text-align:center;color:var(--frame-tint);text-shadow:.0625rem .0625rem .0625rem var(--frame-shade);margin-top:.15rem;font-size:.5625rem;display:block}.fader,.knob__dial{outline:none}.fader:focus-visible,.knob__dial:focus-visible{outline:.125rem solid var(--frame-tint);outline-offset:.2rem;border-radius:.3rem}.knob__dial:focus-visible{border-radius:50%}.nameplate{color:#1c1d20;font-family:var(--font-primary);box-shadow:inset 0 .0625rem 0 #ffffffb3, inset 0 -.0625rem .0625rem #00000059, -.0625rem -.0625rem .125rem var(--frame-tint), .125rem .1875rem .3125rem var(--frame-shade);background:repeating-linear-gradient(90deg,#ffffff12 0 .0625rem,#0000000f .0625rem .125rem),linear-gradient(#99a7b9,#5e6571 50%,#7c8797);border-radius:.1875rem;flex-direction:column;gap:.1875rem;padding:.625rem 1.125rem;font-size:.5625rem;line-height:1.2;display:flex;position:relative}.nameplate .screw{background:radial-gradient(circle at 35% 30%,#eceef1,#8c9096);width:.5rem;height:.5rem;box-shadow:0 .0625rem .0625rem #00000080}.nameplate .screw:before{height:.0625rem;box-shadow:none;background:#4a4d52;margin-top:-.0312rem;left:.0625rem;right:.0625rem}.nameplate .screw:first-child{--r:30deg;top:.25rem;left:.25rem}.nameplate .screw:nth-child(2){--r:-50deg;top:.25rem;right:.25rem}.nameplate .screw:nth-child(3){--r:75deg;bottom:.25rem;left:.25rem}.nameplate .screw:nth-child(4){--r:5deg;bottom:.25rem;right:.25rem}.knobs{justify-content:space-around;margin-top:.875rem;display:flex}.knob{color:var(--frame-tint);text-shadow:.0625rem .0625rem .0625rem var(--frame-shade);flex-direction:column;align-items:center;gap:.3125rem;font-size:.5625rem;display:flex}.knob__dial{cursor:ns-resize;touch-action:none;background:repeating-conic-gradient(#3b3e44 0 5deg, #1b1d21 5deg 10deg);width:2.875rem;height:2.875rem;box-shadow:-.0625rem -.0625rem .125rem var(--frame-tint), .1875rem .25rem .4375rem var(--frame-shade);border-radius:50%;position:relative}.knob__dial:before{content:"";background:radial-gradient(circle at 35% 30%,#5a5e66,#2a2c31 70%,#17181b);border-radius:50%;position:absolute;inset:14%;box-shadow:0 0 .1875rem .0625rem #0009}.knob__dial:after{content:"";background:radial-gradient(circle at 35% 30%,#fff,#e6e7e9 55%,#b9bcc1);border-radius:50%;position:absolute;inset:30%;box-shadow:0 .0625rem .125rem #0009,inset 0 -.0625rem .0625rem #00000040}.knob__dial i{z-index:1;transform:rotate(var(--angle,0deg));position:absolute;inset:0}.knob__dial i:before{content:"";background:#f0f0f0;border-radius:.0625rem;width:.1875rem;height:22%;margin-left:-.0938rem;position:absolute;top:3%;left:50%}.bevel-lines--vent{padding-block:0}.bevel-lines--vent>i{background:color-mix(in srgb, var(--frame-shade), black 45%);height:.375rem;box-shadow:inset 0 .125rem .1875rem #000000b3, 0 .0625rem 0 var(--frame-tint);border-radius:.1875rem}@media screen and (width<=1300px){.drive-bay{display:none}}@media screen and (height<=929px){.nameplate{display:none}}@media screen and (height<=849px){.pc__side--left .bevel-lines--vent>i:nth-child(n+3),.pc__side--right .bevel-lines--vent>i:nth-child(n+4){display:none}}@media screen and (height<=799px){.pc{--holes-h:3rem}.pc__side .panel+.panel{margin-top:.75rem}.pc__side--right .bevel-lines--vent>i:nth-child(n+3){display:none}}@media screen and (height<=719px){.bevel-lines--vent{display:none}}.screen-frame{z-index:2;border-radius:var(--screen-radius);box-shadow:.1875rem .1875rem .375rem var(--frame-tint), -.1875rem -.1875rem .375rem var(--frame-shade);grid-area:screen;position:relative}.screen{border-radius:var(--screen-radius);background:#000;position:absolute;inset:0;overflow:hidden}.screen:after{content:"";z-index:1;border-radius:inherit;pointer-events:none;box-shadow:inset 0 0 0 var(--screen-lip) var(--housing), inset 0 0 1rem var(--screen-lip) #0009;position:absolute;inset:0}.screen:fullscreen{border-radius:0}.screen canvas{touch-action:none;background:#000;width:100%;height:100%;display:block;position:absolute;inset:0}@media screen and (width<=768px){.screen-frame,.screen{box-shadow:none;border-radius:0}.screen:after{display:none}}.screen canvas.cursor-hidden{cursor:none!important}.pc{isolation:isolate;position:relative}.pc:before{content:"";z-index:1;pointer-events:none;mix-blend-mode:soft-light;opacity:var(--grain-strength);background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='256' height='256'%3E%3Cfilter id='n' x='0' y='0' width='100%25' height='100%25' color-interpolation-filters='sRGB'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0.467 0.467 0.467 0 -0.2 0.467 0.467 0.467 0 -0.2 0.467 0.467 0.467 0 -0.2 0 0 0 0 1'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-size:16rem 16rem;position:absolute;inset:0}@media screen and (width<=768px){.pc:before{display:none}}