:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#000;--fg:#e8e8e8;--box:#1c1c1c;--accent:#7cc4ff;--planet:#6a6a6a;--globe:#ff8c1a;--stem:#0b6623;--blurb:#9a9a9a;--gutter:24px;--content:640px;--pad:56px;--dock-top:40px;--dock-gap:14px;--peek:72px;--name:min(64px, 6.5vh, 13vw);--focus-ms:.4s;--focus-ease:cubic-bezier(.34, 1.4, .64, 1);--box-gap:56px;--box-out:200px;--box-grow:64px;--side:220px;--tile-gap:12px;--streak:#5a5a5a}html{scrollbar-gutter:stable;overflow-anchor:none}html,body{background:var(--bg);color:var(--fg);margin:0}body{-webkit-font-smoothing:antialiased}header{box-sizing:border-box;min-height:calc(100svh - var(--peek));padding:max(8vh, 24px) var(--gutter) 48px;text-align:center;flex-direction:column;display:flex}.planet{color:var(--planet);font-size:min(16px, calc((100vw - 2 * var(--gutter)) / 40));opacity:0;flex-direction:column;flex:1;justify-content:center;align-items:center;gap:14px;padding-top:32px;transition:opacity 1.2s;display:flex}.about{letter-spacing:.04em;text-align:center;margin:0;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:1em;font-weight:400}.planet .globe{color:var(--globe)}.planet .stem{color:var(--stem)}.planet.on{opacity:1}.planet{position:relative}.star{pointer-events:none;animation:twinkle var(--t) ease-in-out var(--d) infinite alternate;font-family:ui-monospace,Menlo,Consolas,monospace;line-height:1;position:absolute}@keyframes twinkle{to{opacity:.2}}@media (prefers-reduced-motion:reduce){.star{animation:none}}h1{font-size:var(--name);visibility:hidden;margin:0 0 32px;font-weight:700;line-height:1}h1 .ch{visibility:visible}h1 a{color:inherit;text-decoration:none}h1 a>span{white-space:nowrap;letter-spacing:.1em;padding-left:.1em;display:block}nav{letter-spacing:.12em;visibility:hidden;flex-wrap:wrap;justify-content:center;gap:12px 56px;font-size:14px;font-weight:500;line-height:1.2;display:flex}.fly{letter-spacing:.12em;color:inherit;white-space:nowrap;will-change:transform;font-size:14px;font-weight:500;line-height:1.2;text-decoration:none;position:fixed;top:0;left:0}.ch{white-space:pre;display:inline-block;position:relative}.ch.scramble{color:#0000}.ch.scramble:after{content:attr(data-g);color:var(--glyph,var(--fg));text-align:center;position:absolute;inset:0}.ch.hidden{color:#0000}.marker{pointer-events:none;will-change:transform;font-size:14px;font-weight:500;line-height:1.2;position:fixed;top:0;left:0}.marker span{opacity:0;transition:opacity .25s,transform .25s;display:block;transform:translate(-6px)}.marker.on span{opacity:1;transform:none}.side-title{letter-spacing:.12em;white-space:nowrap;text-align:right;transition:color var(--focus-ms) ease;margin:0;font-size:14px;font-weight:500;line-height:1.2;position:fixed;top:0;left:0}.side-title.focus{color:var(--accent);--glyph:var(--accent)}.blurb{color:var(--blurb);--glyph:var(--blurb);text-align:right;opacity:0;pointer-events:none;margin:0;font-size:16px;line-height:1.5;transition:opacity .25s;position:fixed;top:0;left:0}.blurb.on{opacity:1}.blurb.box-shape{text-align:justify;text-align-last:right}.blurb .word{white-space:nowrap;display:inline-block}main{max-width:var(--content);padding:0 var(--gutter) 120px;margin:0 auto;position:relative;container-type:inline-size}.hint{--room:max(0px, (100vw - 100cqw) / 2 - var(--side));bottom:100%;left:calc(var(--gutter) - max(0px, min(var(--box-out), var(--room) - var(--box-grow))));letter-spacing:.04em;color:var(--planet);opacity:0;margin:0 0 18px;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:13px;transition:opacity .7s;position:absolute}main:has(.box.on) .hint{opacity:1}@media (hover:none){.hint{display:none}}.box{background:var(--box);--room:max(0px, (100vw - 100cqw) / 2 - var(--side));--wide:max(0px, min(var(--box-out), var(--room) - var(--box-grow)));width:calc(100cqw + 2 * var(--wide));height:calc((100cqw + 2 * var(--wide)) * 9 / 32);margin:0 calc(-1 * var(--wide)) var(--box-gap);opacity:0;transition:opacity .7s ease, width var(--focus-ms) var(--focus-ease), margin var(--focus-ms) var(--focus-ease), height var(--focus-ms) var(--focus-ease);display:block;overflow:hidden}.box.on{opacity:1}.box video,.box img{object-fit:cover;width:100%;height:100%;display:block}.box.focus{--wide:min(var(--box-out) + var(--box-grow), var(--room));height:calc((100cqw + 2 * var(--wide)) * 9 / 16);outline:1px solid var(--accent);outline-offset:6px}html{overflow-x:clip}.marquee{opacity:0;width:100vw;height:100px;margin:120px 0 0 calc(50% - 50vw);transition:opacity .7s}.marquee.on{opacity:1}.marquee{letter-spacing:.12em;white-space:pre;font-size:32px;font-weight:500;line-height:1;position:relative}@media (max-width:767px){.marquee{font-size:18px}}.marquee span{transform-origin:0 0;will-change:transform;position:absolute;top:0;left:0}header,main,footer,.fly,.marker,.side-title{translate:var(--shake-x,0) var(--shake-y,0)}.mosaic{grid-template-columns:repeat(2,1fr);grid-auto-rows:calc((100cqw - var(--tile-gap)) / 2 * 9 / 16);gap:var(--tile-gap);margin-top:96px;display:grid;position:relative}.tile{background:var(--box);box-shadow:0 calc(3px + 9px * var(--lift,0)) calc(10px + 20px * var(--lift,0)) rgb(0 0 0/calc(.45 + .2 * var(--lift,0)));opacity:0;visibility:hidden;border-radius:6px;transition:opacity .7s;display:block;overflow:hidden}.tile:focus-visible{outline:2px solid var(--accent);outline-offset:3px}.tile img{object-fit:cover;pointer-events:none;width:100%;height:100%;display:block}.tile.on{opacity:1;visibility:visible}.tile.loose{transform-origin:50%;will-change:transform;touch-action:none;cursor:grab;grid-area:auto;position:absolute;top:0;left:0}.tile.loose.drag{cursor:grabbing}.streaks{z-index:-1;pointer-events:none;width:100vw;height:calc(100% + 320px);position:absolute;top:-200px;bottom:-120px;left:calc(50% - 50vw)}.press{z-index:10000;transform-origin:0 0;font:inherit;letter-spacing:.12em;color:var(--fg);background:var(--bg);border:1px solid var(--fg);cursor:pointer;opacity:0;padding:12px 20px;font-size:14px;font-weight:500;transition:opacity .7s,background .15s,color .15s;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.press.on{opacity:1}.press:hover{background:var(--fg);color:var(--bg)}
