:root {
    --font: "Segoe UI", "Selawik", -apple-system, BlinkMacSystemFont, "Helvetica Neue", Arial, sans-serif;
    --ease: cubic-bezier(.2, .8, .2, 1);
    --lime:
        radial-gradient(130% 55% at 70% -5%, rgba(255, 255, 225, .9), rgba(255, 255, 210, 0) 60%),
        linear-gradient(180deg, #eef3a2 0%, #cfe64c 16%, #a9cd1f 46%, #86b313 68%, #5d860d 84%, #3a5507 100%);
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html,
body {
    height: 100%;
    overflow: hidden;
    background: #44700c;
}

body {
    font-family: var(--font);
    color: #fff;
    -webkit-font-smoothing: antialiased;
    user-select: none;
    -webkit-user-select: none;
    -webkit-tap-highlight-color: transparent;
    touch-action: none;
}

button {
    font: inherit;
    color: inherit;
    background: none;
    border: 0;
    cursor: pointer;
}
button:focus-visible { outline: none; }

.sr {
    position: absolute;
    width: 1px;
    height: 1px;
    overflow: hidden;
    clip: rect(0 0 0 0);
    white-space: nowrap;
}

#bg {
    position: fixed;
    inset: 0;
    width: 100%;
    height: 100%;
    display: block;
}

#stage {
    position: absolute;
    left: 0;
    top: 0;
    width: 1280px;
    height: 720px;
    transform-origin: 0 0;
}

/* ── channels ───────────────────────────────────────────── */
#channels {
    position: absolute;
    left: 96px;
    top: 0;
    width: 900px;
    height: 224px;
}
.ch {
    position: absolute;
    left: 0;
    bottom: 0;
    font-size: 44px;
    font-weight: 600;
    line-height: 1;
    white-space: nowrap;
    transform-origin: 0 100%;
    text-shadow: 0 1px 3px rgba(20, 40, 0, .35);
}

/* ── tile row ───────────────────────────────────────────── */
#rows {
    position: absolute;
    left: 96px;
    top: 248px;
    width: 420px;
    height: 320px;
}
.row {
    position: absolute;
    inset: 0;
}
.tile {
    position: absolute;
    left: 0;
    top: 0;
    width: 420px;
    height: 320px;
    border-radius: 5px;
    overflow: hidden;
    color: #fff;
    text-decoration: none;
    text-align: left;
    transform-origin: 0 50%;
    background:
        radial-gradient(circle at 16% 62%, transparent 0 26px, rgba(255, 255, 255, .16) 27px 29px, transparent 30px 40px, rgba(255, 255, 255, .12) 41px 43px, transparent 44px 54px, rgba(255, 255, 255, .08) 55px 57px, transparent 58px),
        radial-gradient(circle at 88% 28%, transparent 0 14px, rgba(255, 255, 255, .14) 15px 17px, transparent 18px 26px, rgba(255, 255, 255, .1) 27px 29px, transparent 30px),
        radial-gradient(circle at 56% 84%, rgba(255, 255, 255, .1) 0 10px, transparent 11px),
        radial-gradient(circle at 34% 22%, rgba(255, 255, 255, .14) 0 6px, transparent 7px),
        radial-gradient(circle at 74% 60%, rgba(255, 255, 255, .08) 0 18px, transparent 19px),
        var(--lime);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75), inset 0 0 0 1px rgba(255, 255, 255, .12);
    -webkit-box-reflect: below 3px linear-gradient(transparent 78%, rgba(255, 255, 255, .16));
    transition: transform .45s var(--ease), opacity .3s ease, filter .2s ease;
}
.row.no-anim .tile { transition: none; }
.tile:not(.focus):hover { filter: brightness(1.06); }

.t-title,
.t-sub,
.t-label {
    position: absolute;
    white-space: nowrap;
    text-shadow: 0 1px 2px rgba(40, 70, 0, .45);
}
.t-title { left: 19px; top: 24px; font-size: 28px; }
.t-sub { left: 19px; top: 60px; font-size: 22px; opacity: .92; }
.t-label { left: 16px; bottom: 38px; font-size: 24px; }

.glyph {
    position: absolute;
    left: 50%;
    top: 44%;
    width: 168px;
    height: 168px;
    transform: translate(-50%, -50%);
    filter: drop-shadow(0 3px 2px rgba(40, 70, 0, .35));
}

.t-pic {
    position: absolute;
    right: 26px;
    bottom: 30px;
    width: 168px;
    height: 168px;
    border-radius: 12px;
    border: 4px solid #fff;
    box-shadow: 0 6px 16px rgba(30, 50, 0, .4);
    object-fit: cover;
}

#count {
    position: absolute;
    left: 96px;
    top: 576px;
    font-size: 18px;
    color: rgba(64, 68, 74, .92);
    text-shadow: 0 1px 0 rgba(255, 255, 255, .35);
}

#channels,
#rows,
#count {
    transition: opacity .28s ease, transform .45s var(--ease);
}
.in-screen #channels,
.in-screen #rows,
.in-screen #count {
    opacity: 0;
    transform: translateX(-140px);
    pointer-events: none;
}

/* ── screens ────────────────────────────────────────────── */
#screen {
    position: absolute;
    inset: 0;
    opacity: 0;
    visibility: hidden;
    transform: translateX(90px);
    transition: opacity .3s ease, transform .45s var(--ease), visibility 0s linear .45s;
}
.in-screen #screen {
    opacity: 1;
    visibility: visible;
    transform: none;
    transition-delay: .06s, .06s, 0s;
}
.crumb {
    position: absolute;
    left: 96px;
    top: 132px;
    font-size: 26px;
    opacity: .68;
    text-shadow: 0 1px 3px rgba(20, 40, 0, .35);
}
.title {
    position: absolute;
    left: 96px;
    top: 168px;
    font-size: 44px;
    font-weight: 600;
    line-height: 1;
    text-shadow: 0 1px 3px rgba(20, 40, 0, .35);
}
.body {
    position: absolute;
    left: 96px;
    top: 248px;
    width: 1088px;
    height: 320px;
}

.panel {
    position: absolute;
    left: 0;
    top: 0;
    width: 640px;
    height: 320px;
    border-radius: 6px;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .22), rgba(255, 255, 255, .05) 55%, rgba(0, 0, 0, .1)),
        rgba(52, 86, 8, .5);
    border: 1px solid rgba(255, 255, 255, .3);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .35), 0 10px 30px rgba(20, 40, 0, .25);
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    text-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}

.list {
    position: absolute;
    left: 680px;
    top: 0;
    width: 408px;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.list.wide { left: 0; width: 640px; }
.item {
    height: 58px;
    padding: 0 22px;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    font-size: 24px;
    text-align: left;
    background: linear-gradient(180deg, rgba(255, 255, 255, .2), rgba(255, 255, 255, .06)), rgba(52, 86, 8, .35);
    border: 1px solid rgba(255, 255, 255, .24);
    text-shadow: 0 1px 2px rgba(0, 0, 0, .35);
    transition: transform .15s ease, box-shadow .15s ease;
}
.item.sel {
    background: var(--lime);
    border-color: rgba(255, 255, 220, .85);
    box-shadow: 0 0 18px rgba(200, 255, 80, .45);
    transform: translateX(6px);
}

.gamercard {
    display: flex;
    gap: 28px;
    padding: 28px;
}
.gc-pic {
    flex-shrink: 0;
    width: 200px;
    height: 200px;
    border-radius: 12px;
    border: 4px solid #fff;
    object-fit: cover;
    box-shadow: 0 8px 20px rgba(0, 0, 0, .3);
}
.gc-tag {
    font-size: 42px;
    font-weight: 600;
    line-height: 1.1;
}
.gc-status {
    margin-top: 6px;
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 20px;
}
.dot {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: radial-gradient(circle at 35% 30%, #f2ffc4, #8fd11c);
    box-shadow: 0 0 8px rgba(190, 255, 80, .9);
}
.gc-info dl {
    margin-top: 24px;
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px 18px;
    font-size: 20px;
}
.gc-info dt { opacity: .7; }

.player {
    display: flex;
    align-items: center;
    gap: 28px;
    padding: 28px;
}
.art {
    position: relative;
    flex-shrink: 0;
    width: 200px;
    height: 200px;
    border-radius: 6px;
    background: var(--lime);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .75), 0 8px 20px rgba(0, 0, 0, .25);
}
.art .glyph { width: 120px; height: 120px; top: 50%; }
.pl-info { flex: 1; min-width: 0; }
.pl-title {
    font-size: 36px;
    font-weight: 600;
    line-height: 1.15;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.pl-sub { margin-top: 4px; font-size: 20px; opacity: .8; }
.pl-bar {
    margin-top: 26px;
    height: 10px;
    border-radius: 5px;
    background: rgba(0, 0, 0, .28);
    box-shadow: inset 0 1px 2px rgba(0, 0, 0, .35);
    overflow: hidden;
}
.pl-bar i {
    display: block;
    width: 0;
    height: 100%;
    border-radius: 5px;
    background: linear-gradient(180deg, #f4f9b0, #b8dd2c 50%, #86b313);
    box-shadow: 0 0 10px rgba(200, 255, 80, .6);
}
.pl-time {
    margin-top: 8px;
    display: flex;
    justify-content: space-between;
    font-size: 18px;
    font-variant-numeric: tabular-nums;
    opacity: .85;
}

/* ── legend, orb, toast ─────────────────────────────────── */
#legend {
    position: absolute;
    left: 96px;
    top: 636px;
    display: flex;
    gap: 30px;
}
#legend button {
    display: inline-flex;
    align-items: center;
    gap: 9px;
    font-size: 18px;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .45);
}
#legend button[hidden] { display: none; }
.pad {
    display: inline-grid;
    place-items: center;
    width: 26px;
    height: 26px;
    border-radius: 50%;
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .5);
    border: 1px solid rgba(255, 255, 255, .55);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .5), 0 2px 4px rgba(0, 0, 0, .35);
}
.pad-a { background: radial-gradient(circle at 35% 28%, #d6f7a0, #5aa818 55%, #2f6a08); }
.pad-b { background: radial-gradient(circle at 35% 28%, #ffb4a8, #d8352a 55%, #8c140c); }
.pad-y { background: radial-gradient(circle at 35% 28%, #fff4b0, #e8b10f 55%, #9a6c00); }
.pad-x { background: radial-gradient(circle at 35% 28%, #b9dcff, #2a7ad8 55%, #0d3f86); }

/* ── channel bullet ─────────────────────────────────────── */
.ch.cur::before {
    content: "";
    position: absolute;
    left: -17px;
    top: 50%;
    width: 9px;
    height: 9px;
    background: #fff;
    box-shadow: 0 1px 3px rgba(20, 40, 0, .35);
}

/* ── top-right gamercard ────────────────────────────────── */
#gamercard {
    position: absolute;
    left: calc(var(--view-r, 1280px) - var(--edge, 72px));
    top: 40px;
    display: flex;
    align-items: center;
    gap: 14px;
    transform: translateX(-100%);
    text-shadow: 0 1px 3px rgba(20, 40, 0, .5);
}
.tr-text { text-align: right; white-space: nowrap; }
.tr-name { font-size: 24px; line-height: 1.15; }
.tr-score {
    margin-top: 3px;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 6px;
    font-size: 20px;
}
.tr-pic {
    width: 76px;
    height: 76px;
    border-radius: 6px;
    object-fit: cover;
    border: 2px solid rgba(255, 255, 255, .85);
    box-shadow: 0 4px 12px rgba(0, 0, 0, .3);
}
.gcoin {
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    filter: drop-shadow(0 1px 2px rgba(20, 40, 0, .45));
}

/* ── gamercard tile + avatar ────────────────────────────── */
.t-score {
    position: absolute;
    left: 19px;
    top: 60px;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 22px;
    text-shadow: 0 1px 2px rgba(40, 70, 0, .45);
}
.t-mini,
.t-status,
.t-loc {
    position: absolute;
    left: 19px;
    white-space: nowrap;
    text-shadow: 0 1px 2px rgba(40, 70, 0, .45);
}
.t-mini { top: 116px; font-size: 15px; opacity: .92; }
.t-status { bottom: 62px; max-width: 250px; font-size: 21px; line-height: 1.15; white-space: normal; }
.t-loc { bottom: 38px; font-size: 15px; opacity: .92; }
.t-socials {
    position: absolute;
    left: 19px;
    top: 140px;
    display: flex;
    gap: 6px;
}
.t-soc {
    position: relative;
    width: 46px;
    height: 46px;
    border-radius: 4px;
    display: grid;
    place-items: center;
    background:
        linear-gradient(180deg, rgba(255, 255, 255, .38), rgba(255, 255, 255, .08) 50%, rgba(0, 0, 0, .14)),
        rgba(40, 70, 0, .5);
    border: 1px solid rgba(255, 255, 255, .45);
    box-shadow: 0 2px 4px rgba(30, 50, 0, .3);
}
.t-soc svg { width: 22px; height: 22px; fill: #fff; }
.t-soc i {
    position: absolute;
    top: 100%;
    left: 50%;
    margin-top: 4px;
    transform: translateX(-50%);
    font-style: normal;
    font-size: 13px;
    white-space: nowrap;
}

.avatar-layer {
    position: absolute;
    inset: 0;
    z-index: 70;
    pointer-events: none;
}
/* Box is the avatar's 320x500 capture frame at .869 scale; the feet sit at (140, 418). */
.avatar {
    position: absolute;
    left: 0;
    top: 0;
    width: 278px;
    height: 435px;
    transform-origin: 0 0;
    transition: transform .45s var(--ease), opacity .3s ease;
}
.avatar::before {
    content: "";
    position: absolute;
    left: 140px;
    top: 409px;
    width: 120px;
    height: 18px;
    transform: translateX(-50%);
    border-radius: 50%;
    background: radial-gradient(closest-side, rgba(20, 30, 10, .4), rgba(20, 30, 10, 0));
}
.av-still,
.av-anim {
    position: absolute;
    left: 65.2px;
    top: 27.8px;
    width: 149.5px;
    height: 391px;
}
.av-anim { opacity: 0; }
.avatar.live .av-anim { opacity: 1; }
.avatar.live .av-still { opacity: 0; }
.av-src {
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    pointer-events: none;
}

/* ── disc tile ──────────────────────────────────────────── */
.t-disc {
    background:
        linear-gradient(180deg, rgba(14, 16, 17, 0) 44%, rgba(14, 16, 17, .92) 68%, #0e1011 74%),
        var(--art, none) top center / 100% auto no-repeat,
        #0e1011;
}
.game-art { background: var(--art, none) center / cover no-repeat, #1b1d1e; }
.t-wrap {
    width: 290px;
    white-space: normal;
    line-height: 1.15;
}
.disc-badge {
    position: absolute;
    right: 22px;
    bottom: 24px;
    width: 56px;
    height: 56px;
    border-radius: 6px;
    background: var(--lime);
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .8), 0 3px 8px rgba(0, 0, 0, .45);
}
.disc-badge::after {
    content: "";
    position: absolute;
    inset: 9px;
    border-radius: 50%;
    background:
        radial-gradient(circle, #6d9612 0 13%, #ffffff 15% 27%, rgba(255, 255, 255, .7) 29% 31%, #f3f7ec 33%);
    box-shadow: 0 1px 3px rgba(40, 70, 0, .55);
}

/* ── profile + game screens ─────────────────────────────── */
.list.compact { gap: 6px; }
.list.compact .item { height: 50px; font-size: 21px; }
.list-head {
    font-size: 20px;
    opacity: .85;
    text-shadow: 0 1px 2px rgba(0, 0, 0, .35);
}
.lbl {
    display: flex;
    align-items: center;
    gap: 12px;
}
.ico { flex-shrink: 0; width: 22px; height: 22px; fill: #fff; }
.val { font-size: 17px; opacity: .88; white-space: nowrap; }
.gc-score {
    margin-top: 4px;
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 22px;
}
.pl-title.wrap { white-space: normal; }

#orb {
    position: absolute;
    left: 1133px;
    top: 608px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background: radial-gradient(circle at 40% 28%, #ffffff 0 9%, #eef3ec 20%, #b9c4bb 48%, #7f8b82 74%, #59645b 100%);
    box-shadow: inset 0 -5px 9px rgba(40, 90, 10, .45), 0 5px 10px rgba(0, 0, 0, .35);
}
#orb::after {
    content: "";
    position: absolute;
    inset: 14px;
    border-radius: 50%;
    background: radial-gradient(circle at 45% 40%, #f4ffd0, #9be22a 45%, #3f8a06 100%);
    box-shadow: 0 0 10px rgba(170, 255, 60, .85);
}

#toast {
    position: absolute;
    left: 50%;
    top: 606px;
    min-width: 380px;
    height: 58px;
    padding: 0 24px 0 14px;
    display: flex;
    align-items: center;
    gap: 14px;
    border-radius: 10px;
    background: linear-gradient(180deg, rgba(78, 84, 90, .96), rgba(30, 34, 38, .96));
    border: 1px solid rgba(255, 255, 255, .25);
    box-shadow: 0 10px 24px rgba(0, 0, 0, .35), inset 0 1px 0 rgba(255, 255, 255, .2);
    font-size: 20px;
    white-space: nowrap;
    opacity: 0;
    transform: translate(-50%, 30px);
    transition: opacity .3s ease, transform .4s var(--ease);
    pointer-events: none;
}
#toast.show { opacity: 1; transform: translate(-50%, 0); }
#toast i {
    width: 30px;
    height: 30px;
    border-radius: 50%;
    background: radial-gradient(circle at 45% 40%, #f4ffd0, #9be22a 45%, #3f8a06 100%);
    box-shadow: 0 0 10px rgba(170, 255, 60, .7), inset 0 0 0 2px rgba(255, 255, 255, .5);
}

.nojs {
    position: relative;
    margin: 40px;
    list-style: none;
    font-size: 20px;
    line-height: 2;
}
.nojs a { color: #fff; }

/* ── video preview screens ──────────────────────────────── */
.panel.embed {
    width: 640px;
    height: 360px;
    overflow: hidden;
    background: #000;
}
.panel.embed iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: 0;
}

/* ── live on twitch ──────────────────────────────────────── */
.live-badge {
    position: absolute;
    top: 18px;
    right: 18px;
    display: none;
    padding: 3px 10px 4px;
    border-radius: 4px;
    font-size: 18px;
    font-weight: 700;
    letter-spacing: .08em;
    color: #fff;
    text-shadow: 0 1px 1px rgba(0, 0, 0, .35);
    background: linear-gradient(180deg, #ff7a6e, #e0281c 55%, #b5160c);
    box-shadow: 0 2px 6px rgba(80, 0, 0, .4), inset 0 1px 0 rgba(255, 255, 255, .5);
}
.is-live .live-badge {
    display: block;
    animation: live-glow 1.6s ease-in-out infinite;
}
.is-live .gc-status .dot,
.is-live .tr-name::before {
    background: radial-gradient(circle at 35% 30%, #ffd2cc, #ff3b2e);
    box-shadow: 0 0 8px rgba(255, 60, 40, .9);
}
.is-live .tr-name::before {
    content: "";
    display: inline-block;
    width: 10px;
    height: 10px;
    margin-right: 8px;
    border-radius: 50%;
    vertical-align: 2px;
    animation: live-glow 1.6s ease-in-out infinite;
}
@keyframes live-glow {
    50% { box-shadow: 0 0 16px rgba(255, 60, 40, .95), inset 0 1px 0 rgba(255, 255, 255, .5); }
}

/* ── boot screen ─────────────────────────────────────────── */
.boot {
    position: fixed;
    inset: 0;
    z-index: 200;
    display: grid;
    place-items: center;
    background: radial-gradient(circle at 50% 45%, #ffffff 0%, #f1f3f1 40%, #d4d9d5 100%);
    cursor: pointer;
    transition: opacity .6s ease;
}
.boot.out { opacity: 0; pointer-events: none; }
.boot-stage {
    position: relative;
    width: 320px;
    height: 320px;
    display: grid;
    place-items: center;
    perspective: 800px;
}
.boot-orb {
    position: relative;
    width: 166px;
    height: auto;
    filter: drop-shadow(0 0 16px rgba(150, 230, 60, .5));
    animation: boot-pulse 2.4s ease-in-out infinite;
    -webkit-user-drag: none;
}
.boot-ring {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 300px;
    height: 300px;
    margin: -150px 0 0 -150px;
    border-radius: 50%;
    border: 4px solid transparent;
    border-top-color: rgba(150, 235, 50, .95);
    border-left-color: rgba(200, 255, 140, .5);
    filter: drop-shadow(0 0 8px rgba(150, 235, 50, .8));
    opacity: 0;
}
.boot-ring.r1 { --tilt: rotateX(68deg); }
.boot-ring.r2 { --tilt: rotateY(68deg); }
.boot-ring.r3 { --tilt: rotateX(58deg) rotateY(42deg); }
.boot-flash {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 140px;
    height: 140px;
    margin: -70px 0 0 -70px;
    border-radius: 50%;
    background: radial-gradient(circle, #fff, rgba(220, 255, 170, .6) 40%, rgba(255, 255, 255, 0) 70%);
    opacity: 0;
}
.boot-name {
    position: absolute;
    top: 100%;
    left: 0;
    right: 0;
    text-align: center;
    font-size: 30px;
    letter-spacing: .32em;
    padding-left: .32em;
    color: #5d6a60;
    opacity: 0;
}
.boot-prompt {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 14%;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    font-size: 18px;
    color: #5d6a60;
    animation: boot-blink 2s ease-in-out infinite;
}
.boot.play .boot-prompt { opacity: 0; animation: none; transition: opacity .3s ease; }
.boot.play .boot-orb { animation: boot-orb 1.6s cubic-bezier(.3, 0, .2, 1) forwards; }
.boot.play .boot-ring { animation: boot-ring 1.5s cubic-bezier(.5, 0, .3, 1) forwards; }
.boot.play .boot-ring.r2 { animation-delay: .12s; }
.boot.play .boot-ring.r3 { animation-delay: .24s; }
.boot.play .boot-flash { animation: boot-flash .9s ease-out 1.4s forwards; }
.boot.play .boot-name { animation: boot-name .8s ease 1.65s forwards; }
@keyframes boot-pulse {
    50% { filter: drop-shadow(0 0 32px rgba(150, 230, 60, .9)); }
}
@keyframes boot-blink { 50% { opacity: .45; } }
@keyframes boot-ring {
    0% { transform: var(--tilt) rotateZ(0deg) scale(1.7); opacity: 0; }
    25% { opacity: 1; }
    100% { transform: var(--tilt) rotateZ(600deg) scale(.38); opacity: 0; }
}
@keyframes boot-orb {
    0% { transform: scale(1); filter: drop-shadow(0 0 16px rgba(150, 230, 60, .5)) brightness(1); }
    70% { transform: scale(.82); filter: drop-shadow(0 0 10px rgba(150, 230, 60, .4)) brightness(1); }
    85% { transform: scale(1.12); filter: drop-shadow(0 0 40px rgba(170, 255, 80, 1)) brightness(1.5); }
    100% { transform: scale(1); filter: drop-shadow(0 0 22px rgba(150, 230, 60, .65)) brightness(1.05); }
}
@keyframes boot-flash {
    0% { transform: scale(.4); opacity: 0; }
    20% { opacity: 1; }
    100% { transform: scale(4.5); opacity: 0; }
}
@keyframes boot-name {
    from { opacity: 0; transform: translateY(8px); }
    to { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after {
        transition-duration: .01s !important;
        animation-duration: .01s !important;
    }
}