/* A CSS-built CRT: no model, render sequence, or third-party runtime. */
.crt-intro:not([open]){display:none}
html[data-crt=pending] body> :not(.crt-intro){visibility:hidden}
html[data-crt=active],html[data-crt=zooming]{overflow:hidden}
.crt-intro{position:fixed;inset:0;max-width:none;max-height:none;width:100%;height:100%;height:100dvh;margin:0;padding:0;border:0;overflow:hidden;background:#180bc1;color:#f5f3ff;color-scheme:dark;font-family:var(--font);isolation:isolate}
.crt-intro[open]{display:grid;place-items:center}
.crt-intro::backdrop{background:transparent}
.crt-room{position:absolute;inset:0;background:radial-gradient(ellipse at 50% 43%,#4938ef90,transparent 58%),radial-gradient(ellipse at 50% 100%,#0a006950,transparent 65%);pointer-events:none}
.crt-room::after{content:'';position:absolute;inset:65% -50% -60%;background:repeating-linear-gradient(90deg,#ffffff05 0 1px,transparent 1px 90px),repeating-linear-gradient(0deg,#ffffff05 0 1px,transparent 1px 90px);transform:perspective(420px) rotateX(62deg);mask-image:radial-gradient(ellipse,#000,transparent 65%)}
.crt-topline{position:absolute;top:clamp(24px,4vw,52px);left:clamp(24px,4vw,56px);right:clamp(24px,4vw,56px);display:flex;align-items:center;justify-content:space-between;font-size:15px;z-index:2}
.crt-topline p{margin:0;letter-spacing:-.025em}
.crt-skip{font:inherit;color:#e1dcff;border:1px solid #ffffff30;background:#ffffff08;border-radius:99px;padding:11px 17px;cursor:pointer}
.crt-skip:hover{color:#fff;background:#ffffff0c}
.crt-scene{position:relative;perspective:1000px;width:340px;height:390px;scale:.66;transform:translateY(-12px);--rx:-5deg;--ry:-14deg}
.crt-camera{position:absolute;inset:0;transform-origin:50% 43%;transform-style:preserve-3d}
.crt-computer{position:absolute;inset:0;transform-style:preserve-3d;transform:rotateX(var(--rx)) rotateY(var(--ry));transition:transform 480ms cubic-bezier(.2,.7,.2,1)}
.crt-front,.crt-back,.crt-side,.crt-top{position:absolute;box-sizing:border-box;backface-visibility:hidden}
.crt-front{inset:0;transform:translateZ(42px);border-radius:25px 25px 20px 20px;border:1px solid #ffe17d;background:linear-gradient(120deg,#f6ca36 0%,#eeb900 13%,#c68a00 49%,#dda300 78%,#f2be17);box-shadow:inset 2px 3px 3px #fff0c7a3,inset -4px -6px 9px #80600bb0,0 0 1px #000;display:flex;flex-direction:column;padding:22px 22px 0}
.crt-front::after{content:'';position:absolute;inset:5px;border-radius:20px 20px 16px 16px;border:1px solid #ffffff14;pointer-events:none}
.crt-back{inset:8px 8px 8px;transform:translateZ(-42px) rotateY(180deg);background:#b78000;border-radius:24px}
.crt-side{top:18px;bottom:18px;width:84px;right:-42px;transform:rotateY(90deg);background:linear-gradient(90deg,#d59a00,#a88413);border-radius:8px;box-shadow:inset 0 2px 1px #ffffff45}
.crt-side::after{content:'';position:absolute;inset:40px 18px 55px;background:repeating-linear-gradient(0deg,#6e5713 0 3px,#fff1a630 3px 4px,transparent 4px 9px);border-radius:3px}
.crt-side-left{right:auto;left:-42px;transform:rotateY(-90deg);background:linear-gradient(90deg,#ba9415,#e3aa00)}
.crt-top{height:84px;left:18px;right:18px;top:-42px;transform:rotateX(90deg);background:linear-gradient(#dcb123,#f6ca36);border-radius:9px}
.crt-bezel{position:relative;flex:1;min-height:0;border-radius:24px / 30px;padding:11px;background:linear-gradient(130deg,#121620,#38404b 45%,#151922 83%);box-shadow:inset 3px 5px 7px #000d,inset -2px -2px 2px #e4eaff5c,0 2px 1px #edf2ff55}
.crt-screen{position:relative;width:100%;height:100%;padding:0;border:0;display:block;overflow:hidden;border-radius:42% / 7%;background:#080d13;color:white;cursor:pointer;box-shadow:inset 0 0 26px 9px #000,0 0 13px #a9cdf922;text-align:left;transform:translateZ(1px)}
.crt-screen::before{content:'';position:absolute;z-index:3;inset:0;background:repeating-linear-gradient(0deg,transparent 0 2px,#0005 2px 3px);pointer-events:none;opacity:.45}
.crt-screen::after{content:'';position:absolute;z-index:4;inset:0;border-radius:inherit;background:linear-gradient(125deg,#ffffff22 0%,#ffffff07 25%,transparent 26% 69%,#acc9fb0c),radial-gradient(ellipse at center,transparent 45%,#000a 100%);box-shadow:inset 0 0 16px 6px #000a;pointer-events:none}
.crt-page{position:absolute;inset:0;padding:19px 16px;filter:saturate(.7);transform:scale(1.015);background:radial-gradient(at 80% 10%,#353753,#0b1019 55%);text-shadow:1px 0 #75bfff55,-1px 0 #ff848433;pointer-events:none}
.crt-page-nav{display:flex;justify-content:space-between;font-size:5px;border-bottom:1px solid #ffffff20;padding-bottom:9px;opacity:.8}
.crt-page-title{font-size:31px;font-weight:500;letter-spacing:-1.7px;line-height:1.05;margin:21px 0 7px}
.crt-page-caption{font-size:6px;color:#aaaeba;margin:0 0 19px}
.crt-thumbnails{display:grid;grid-template-columns:1fr 1fr;gap:7px}
.crt-thumbnails img{display:block;width:100%;height:64px;object-fit:cover;object-position:top;border-radius:3px;border:1px solid #ffffff14}
.crt-enter-label{position:absolute;z-index:5;left:50%;top:53%;transform:translate(-50%,-50%);font-size:12px;white-space:nowrap;background:#dbe7e8eb;color:#101819;border:1px solid #fff9;padding:11px 17px;border-radius:99px;box-shadow:0 5px 24px #0008,0 0 18px #c3fce62e;transition:background .2s,box-shadow .2s}
.crt-screen:hover .crt-enter-label{background:#b6ffdc;box-shadow:0 5px 24px #0008,0 0 25px #8fffc662}
.crt-chin{height:70px;flex:none;display:flex;align-items:center;gap:16px;padding:0 9px}
.crt-brand{font-size:9px;letter-spacing:.015em;color:#662300;text-shadow:0 1px #ffd09380;white-space:nowrap}
.crt-drive{height:6px;flex:1;background:#151922;border-radius:2px;box-shadow:0 1px 1px #ffffff65,inset 0 2px 2px #0009}
.crt-led{height:7px;width:7px;border-radius:50%;background:#a8ffd0;box-shadow:0 0 3px #dcffeb,0 0 12px #5aff9c}
.crt-foot{position:absolute;left:18%;right:18%;bottom:-17px;height:26px;background:linear-gradient(#9c3207,#e66a14 50%,#a13b09);transform:translateZ(-3px);border-radius:4px 4px 10px 10px;box-shadow:0 15px 20px #0008}
.crt-shadow{position:absolute;left:-20%;right:-20%;bottom:-55px;height:64px;background:radial-gradient(ellipse,#000c,transparent 67%);filter:blur(8px);pointer-events:none}
.crt-instruction{position:absolute;bottom:max(8%,28px);left:20px;right:20px;text-align:center;font-size:12px;color:#c4beff;letter-spacing:.015em;margin:0}
.crt-instruction span{display:block;color:#f5f3ff;margin-bottom:9px;font-size:14px;letter-spacing:-.02em}
.crt-intro button:focus-visible{outline:2px solid #b6ffdc;outline-offset:6px}
.crt-replay{display:inline-flex;align-items:center;gap:7px;margin:18px 0 0;padding:8px 0;background:none;color:var(--muted);border:0;font:inherit;font-size:12px;cursor:pointer}
.crt-replay[hidden]{display:none}
.crt-replay:hover{color:var(--text)}
.crt-intro[data-leaving] .crt-enter-label{opacity:0}
@media(max-width:600px){.crt-scene{width:260px;height:310px;scale:.74}.crt-front{padding:18px 18px 0}.crt-bezel{padding:9px}.crt-chin{height:59px;padding:0 4px;gap:12px}.crt-page{padding:16px 12px}.crt-page-title{font-size:26px;margin-top:14px}.crt-page-caption{margin-bottom:12px}.crt-thumbnails img{height:44px}.crt-enter-label{font-size:11px;padding:10px 14px}.crt-instruction{bottom:9%}.crt-brand{font-size:8px}.crt-topline{font-size:14px}}
@media(max-height:590px){.crt-scene{scale:.52}.crt-instruction{bottom:18px}.crt-instruction span{display:none}.crt-topline{top:18px}}
@media(prefers-reduced-motion:reduce){.crt-computer,.crt-enter-label{transition:none}}
/* Square, deep fallback enclosure; the enhanced version uses a lit WebGL model. */
.crt-scene{width:360px;height:330px;perspective:1200px;--rx:-7deg;--ry:-24deg}
.crt-front{transform:translateZ(105px);border-radius:16px;padding:20px 20px 0}
.crt-front::after{border-radius:13px}.crt-back{transform:translateZ(-105px) rotateY(180deg);border-radius:12px}
.crt-side{width:210px;right:-105px;border-radius:4px}.crt-side-left{left:-105px;right:auto}
.crt-top{height:210px;top:-105px;border-radius:4px}.crt-bezel{border-radius:16px;padding:10px}.crt-chin{height:54px}
.crt-webgl{position:absolute;inset:0;pointer-events:none;z-index:1}.crt-webgl canvas{display:block;width:100%;height:100%}
.crt-intro[data-renderer=webgl] .crt-scene{visibility:hidden;pointer-events:none}
.crt-activate{position:absolute;z-index:3;left:50%;top:50%;width:230px;height:210px;transform:translate(-50%,-50%);border:0;background:transparent;cursor:pointer;border-radius:20px;display:grid;place-items:center}
.crt-activate span{font:11px var(--font);color:#fff6df;background:#111521c9;backdrop-filter:blur(8px);border:1px solid #fff3;border-radius:4px;padding:10px 14px;opacity:0;transition:opacity .2s}
.crt-activate:hover span,.crt-activate:focus-visible span{opacity:1}
.crt-intro .crt-activate:focus-visible{outline:1px solid #fff8;outline-offset:8px}
.crt-topline{z-index:4;font-family:Georgia,'Times New Roman',serif;font-size:22px;text-shadow:0 0 9px #f0e2ff42}
.crt-topline p{font-size:25px}.crt-skip{font-family:inherit;font-size:17px;background:transparent;border:0;border-radius:0;padding:8px 0;text-decoration:underline;text-underline-offset:5px}
.crt-instruction{font-family:Georgia,'Times New Roman',serif;z-index:4;text-shadow:0 0 8px #f0e2ff30;font-size:13px}.crt-instruction span{font-size:19px}
.crt-intro::after{content:'';position:absolute;inset:0;z-index:5;pointer-events:none;background:url('../assets/analog-grain.svg');opacity:.12;mix-blend-mode:soft-light}
@media(max-width:600px){.crt-scene{width:300px;height:280px;scale:.65}.crt-chin{height:48px}.crt-activate{width:220px;height:190px}.crt-activate span{opacity:1;font-size:10px;padding:9px 12px}.crt-topline p{font-size:21px}.crt-skip{font-size:15px}}
@media(max-height:590px){.crt-scene{scale:.52}.crt-activate{height:160px;width:180px}}
.crt-intro .crt-activate:focus-visible{outline:none}
.crt-intro[data-keyboard] .crt-activate:focus-visible{outline:1px solid #fff8}

/* Keep the native dialog compositing layer stable across repeated entry/replay. */
.crt-intro{background:#180bc1}
.crt-room{background-color:#180bc1}

.crt-intro[data-leaving] .crt-topline,.crt-intro[data-leaving] .crt-instruction,.crt-intro[data-leaving] .crt-activate{visibility:hidden}

/* Soft shell and rabbit ears also remain visible without WebGL. */
.crt-topline{justify-content:flex-end}
.crt-front{border-radius:38px}.crt-front::after{border-radius:34px}
.crt-back{border-radius:34px}.crt-bezel{border-radius:28px;padding:12px}
.crt-antennas{position:absolute;left:50%;top:0;transform:translateZ(-35px);transform-style:preserve-3d}
.crt-antennas i{position:absolute;bottom:-4px;width:5px;height:150px;border-radius:5px;background:linear-gradient(90deg,#768195,#f4f7ff 45%,#8c96a8);transform-origin:50% 100%;transform:translateX(-36px) rotate(-31deg)}
.crt-antennas i+i{transform:translateX(36px) rotate(31deg)}
.crt-antennas i::before{content:'';position:absolute;bottom:-3px;left:-10px;width:25px;height:15px;border-radius:50% 50% 4px 4px;background:#24232a}
.crt-antennas i::after{content:'';position:absolute;top:-3px;left:-2px;width:9px;height:9px;border-radius:50%;background:#d5deed}

.crt-intro{touch-action:none;user-select:none;cursor:grab}
.crt-intro[data-dragging],.crt-intro[data-dragging] *{cursor:grabbing!important}
.crt-intro[data-dragging] .crt-activate span{opacity:0}
.crt-intro[data-dragging] .crt-computer{transition:none}

/* Avoid full-screen blend layers over the rotating canvas. */
.crt-intro::after{display:none}

.crt-loading{position:absolute;z-index:4;bottom:9%;left:20px;right:20px;margin:0;text-align:center;font:13px var(--font);color:#e1dcff}