button, a { -webkit-tap-highlight-color: transparent; }
button { font-family: inherit; }
button:focus-visible, a:focus-visible, input:focus-visible { outline: 3px solid #fff200; outline-offset: 3px; }
[hidden] { display: none !important; }
.y2k-header { grid-template-columns: 100px minmax(0, 1fr) 100px; }
.y2k-wordart { font-size: clamp(32px, 5vw, 56px); }
.y2k-wordart span { animation: y2k-hue 8s linear infinite; }
.y2k-burst { border: 0; width: 90px; height: 90px; font-size: 15px; }
.y2k-new { animation: y2k-blink 2.5s steps(1) infinite; }
.y2k-frame:hover { transform: scale(1.02); }
.y2k-welcome { grid-template-columns: minmax(0, 1fr) 200px; }
.y2k-frame { margin: 0; }
.portrait { width: 200px; }
.photo-button { display: block; width: 100%; padding: 3px; border: 3px outset silver; background: #100020; color: white; cursor: zoom-in; }
.photo-button img, .y2k-album img { display: block; width: 100%; height: auto; object-fit: contain; }
.portrait .photo-button { padding: 0; border: 0; }
.primary { display: inline-block; padding: 10px 12px; text-decoration: none; color: white !important; box-shadow: 0 0 12px #ff2bd6; }
.tiny { font-size: 10px; }
.silver { padding: 5px 7px; border: 2px outset #ccc; color: #000; background: linear-gradient(#fff, #999); font: bold 11px/1.3 Verdana, sans-serif; cursor: pointer; }
.silver:active { border-style: inset; }
.icon { display: inline-block; width: 16px; height: 16px; vertical-align: middle; }
.control-stack { display: grid; gap: 7px; }
.control-stack .y2k-button { width: 100%; padding: 6px 4px; }
.control-stack .icon { margin-right: 5px; }
.y2k-pet { border: 0; padding: 0; color: inherit; background: transparent; width: 100%; }
h3 { font: bold 14px/1.3 "Comic Sans MS", Verdana, sans-serif; color: #00f0ff; margin: 5px 0 8px; }
.circus-stage { height: 220px; position: relative; background: repeating-linear-gradient(0deg, #130029 0 22px, #190038 22px 23px); border: 2px inset #666; overflow: hidden; }
.circus-item { position: absolute; padding: 8px 10px; border: 3px outset #ffaaff; background: #6d005c; font-size: 11px; font-weight: bold; transition: left .5s ease, top .5s ease, width .5s ease, background .5s ease; }
.circus-item:nth-child(1) { left: 3%; top: 15px; width: 165px; }
.circus-item:nth-child(2) { left: 42%; top: 38px; width: 145px; background: #252b91; }
.circus-item:nth-child(3) { left: 14%; top: 85px; width: 155px; background: #065849; }
.circus-item:nth-child(4) { left: 62%; top: 108px; width: 110px; background: #66168a; }
.circus-item:nth-child(5) { left: 30%; top: 159px; width: 145px; background: #7d3800; }
.circus-result { position: absolute; bottom: 10px; left: 5%; width: 90%; padding: 10px; background: #39ff14; border: 3px outset #ccffbb; color: #000; text-align: center; font-weight: bold; opacity: 0; transform: translateY(50px); transition: .5s ease; }
.circus-stage.assembled .circus-item { left: 5%; width: 90%; padding: 4px 8px; background: #003c55; border-color: #00f0ff; }
.circus-stage.assembled .circus-item:nth-child(1) { top: 5px; }
.circus-stage.assembled .circus-item:nth-child(2) { top: 35px; }
.circus-stage.assembled .circus-item:nth-child(3) { top: 65px; }
.circus-stage.assembled .circus-item:nth-child(4) { top: 95px; }
.circus-stage.assembled .circus-item:nth-child(5) { top: 125px; }
.circus-stage.assembled .circus-result { opacity: 1; transform: none; }
.actions { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 8px; }
.actions .y2k-button { padding: 6px 9px; }
.events { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.event { border: 1px solid #7a1cff; padding: 7px; background: #150025; }
.event h3 { min-height: 38px; }
.poster { max-width: 200px; margin: 0 auto; }
.event .poster { min-height: 260px; display: grid; align-content: center; }
.event p { font-size: 11px; }
.lime { color: #39ff14; }
.pink { color: #ff2bd6; }
.feature-event { display: flow-root; margin-top: 14px; }
.feature-event .photo-button { float: left; width: 210px; margin-right: 12px; }
.feature-event .zoom-poster { width: 150px; min-height: 150px; }
.unavailable { display: grid; place-content: center; min-height: 140px; color: #fff200; background: #130025; font-weight: bold; text-align: center; }
.sports-photos { display: grid; grid-template-columns: 160px minmax(0, 1fr); gap: 10px; align-items: center; }
.sports-photos figure, .life-album figure { margin: 0; min-width: 0; }
.sports-photos figcaption, .life-album figcaption { margin: 5px 0; text-align: center; color: #00f0ff; font: 11px/1.4 "Comic Sans MS", Verdana, sans-serif; }
.head-photo img { transition: transform .5s ease; }
.head-photo.upside-down img { transform: rotate(180deg); }
.run-game { padding: 10px; margin-top: 12px; border: 2px dashed #39ff14; background: #001d18; }
.run-track { height: 45px; position: relative; border-bottom: 4px dashed #fff; margin-bottom: 10px; }
.run-track span { position: absolute; left: 0; bottom: 0; font-size: 27px; transition: left .15s ease; }
.run-track span img { width: 32px; height: 32px; filter: invert(1); }
.run-track b { float: right; color: #fff200; font-size: 10px; }
progress { width: 100%; height: 18px; accent-color: #39ff14; }
.merch { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.merch button { background: #100020; align-self: start; }
.life-album { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; align-items: start; }
.life-album figure:last-child { max-width: 215px; justify-self: center; }
.guest-content { background: repeating-linear-gradient(45deg, #230032 0 8px, #1c002a 8px 16px); }
.guest-content a { display: inline-block; text-decoration: none; }
.smile-line { color: #fff200; font-size: 23px; }
blockquote { margin: 4px 0 12px; color: #fff200; font: bold 14px/1.5 "Comic Sans MS", Verdana, sans-serif; }
.y2k-window { transition: none; max-width: calc(100vw - 24px); }
.y2k-window.is-open { transform: none; }
.y2k-window-bar { touch-action: none; }
.y2k-window-bar .icon { filter: invert(1); width: 14px; }
.text-button { background: none; border: 0; color: #33ccff; text-decoration: underline; font: inherit; cursor: pointer; }
#lightbox { padding: 8px; border: 4px ridge silver; background: #110023; color: white; max-width: calc(100vw - 24px); max-height: calc(100dvh - 24px); overflow: auto; }
#lightbox::backdrop { background: #000d; }
.lightbox-bar { display: flex; align-items: center; gap: 12px; justify-content: space-between; margin-bottom: 8px; }
.lightbox-bar b { color: #fff200; font-size: 12px; }
.lightbox-image { display: grid; justify-items: center; }
.lightbox-image img { display: block; width: auto; max-width: min(600px, calc(100vw - 56px)); max-height: calc(100dvh - 160px); object-fit: contain; }
.lightbox-controls { display: flex; align-items: center; justify-content: space-between; margin-top: 8px; font-size: 11px; }
body.paused, body.paused *, body.paused::before, body.paused *::before { animation-play-state: paused !important; }
body.paused .y2k-spark { display: none; }
body.paused .y2k-marquee span, body.paused .y2k-track span { padding-left: 0; transform: none; }
@media (max-width: 760px) {
.y2k-header { grid-template-columns: 48px minmax(0, 1fr) 48px; }
.y2k-wordart { font-size: clamp(27px, 6.5vw, 45px); }
.y2k-wordart span { -webkit-text-stroke: .6px #fff; }
.y2k-wordart span + span { font-size: .57em; letter-spacing: 0; }
.y2k-burst { width: 48px; height: 48px; font-size: 9px; }
.y2k-globe { width: 43px; height: 43px; }
.y2k-tagline { font-size: 11px; }
.y2k-clock { font-size: 9px; }
.y2k-layout > aside, .y2k-layout > main { display: block; }
.y2k-layout > main { order: 0; }
.y2k-layout > aside:first-child { display: contents; }
.y2k-layout > aside:first-child > nav { order: -1; }
.y2k-layout > aside:first-child > section, .y2k-layout > aside:first-child > div { order: 1; }
.y2k-layout > aside:last-child { order: 2; }
.y2k-nav { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.y2k-nav a { padding: 6px 3px; font-size: 10px; min-height: 35px; }
.y2k-nav a::before { display: none; }
.y2k-new { font-size: 7px; margin-left: 2px; }
.y2k-welcome { grid-template-columns: minmax(0, 1fr); }
.portrait { width: 230px; }
.y2k-box h2 { font-size: 11px; }
.y2k-construction strong { font-size: 10px; text-align: center; }
.circus-item:nth-child(2) { left: 49%; width: 137px; }
.circus-item:nth-child(4) { left: 57%; }
.event { padding: 5px; }
.event h3 { font-size: 12px; }
.event .poster { min-height: 210px; }
.feature-event .photo-button { width: 160px; }
.sports-photos { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); }
.head-photo { max-width: 160px; margin: auto; }
.silver, .y2k-player-controls button { min-height: 34px; }
.y2k-window { top: auto; right: auto; bottom: 12px; left: 12px; width: 260px; }
.y2k-album.merch { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.life-album figure:last-child { max-width: 170px; }
.y2k-toast { max-width: calc(100vw - 30px); font-size: 13px; text-align: center; }
}
@media (prefers-reduced-motion: reduce) {
*, *::before, *::after { animation: none !important; transition: none !important; }
.y2k-marquee span, .y2k-track span { padding-left: 0; }
}
