:root {
    --bg: #030403;
    --bg-soft: #070907;
    --panel: #080b09;
    --panel-strong: #0c100d;
    --panel-gold: #171006;
    --gold: #d99613;
    --gold-bright: #ffd76a;
    --gold-pale: #fff0b0;
    --orange: #ff6a00;
    --red: #ee3f24;
    --red-dark: #8f180d;
    --green: #64d616;
    --green-soft: #a2ff55;
    --text: #f7f0dc;
    --muted: #9d9d91;
    --line: rgba(221, 158, 30, .35);
    --line-soft: rgba(221, 158, 30, .15);
    --shadow: 0 18px 60px rgba(0, 0, 0, .7);
    color-scheme: dark;
}

* {
    box-sizing: border-box;
}

html {
    font-size: 17px;
    scroll-behavior: smooth;
    background: #000;
}

body {
    margin: 0;
    color: var(--text);
    background:
        radial-gradient(circle at 50% -10%, rgba(206, 134, 12, .14), transparent 35rem),
        linear-gradient(180deg, #010201, #050605 36%, #020302);
    font-family: "Leelawadee UI", Tahoma, Arial, sans-serif;
    line-height: 1.48;
}

body::before {
    position: fixed;
    z-index: -1;
    inset: 0;
    background-image:
        linear-gradient(rgba(255,255,255,.012) 1px, transparent 1px),
        linear-gradient(90deg, rgba(255,255,255,.012) 1px, transparent 1px);
    background-size: 32px 32px;
    content: "";
    pointer-events: none;
}

a {
    color: inherit;
    text-decoration: none;
}

button,
input {
    font: inherit;
}

button,
a {
    -webkit-tap-highlight-color: transparent;
}

.event-shell {
    width: min(1480px, calc(100% - 24px));
    margin: 14px auto 30px;
    overflow: hidden;
    border: 1px solid rgba(221, 149, 14, .58);
    border-radius: 11px;
    background:
        linear-gradient(180deg, rgba(8, 9, 8, .98), rgba(2, 3, 2, .99)),
        var(--bg);
    box-shadow:
        0 0 0 4px rgba(0, 0, 0, .76),
        0 0 32px rgba(213, 137, 4, .12),
        var(--shadow);
}

.event-hero {
    position: relative;
    isolation: isolate;
    min-height: 410px;
    padding: 22px clamp(18px, 4vw, 64px) 25px;
    overflow: hidden;
    text-align: center;
    background:
        linear-gradient(180deg, rgba(0, 0, 0, .18), rgba(0, 0, 0, .78)),
        radial-gradient(ellipse at 50% 10%, rgba(174, 107, 0, .28), transparent 54%);
}

.event-hero::after {
    position: absolute;
    z-index: -1;
    right: 0;
    bottom: 0;
    left: 0;
    height: 1px;
    background: linear-gradient(90deg, transparent, var(--gold), transparent);
    box-shadow: 0 0 18px rgba(255, 181, 30, .5);
    content: "";
}

.hero-rays {
    position: absolute;
    z-index: -2;
    top: -390px;
    left: 50%;
    width: 900px;
    height: 900px;
    transform: translateX(-50%);
    border-radius: 50%;
    opacity: .64;
    background:
        repeating-conic-gradient(
            from 0deg,
            rgba(255, 180, 22, .12) 0deg,
            transparent 2deg,
            transparent 8deg
        );
    mask-image: radial-gradient(circle, #000 0, transparent 64%);
}

.home-link {
    position: absolute;
    z-index: 3;
    top: 18px;
    left: 22px;
    padding: 8px 13px;
    border: 1px solid var(--line);
    border-radius: 5px;
    color: #c9b788;
    background: rgba(0, 0, 0, .52);
    font-size: .86rem;
    transition: border-color .2s ease, color .2s ease;
}

.home-link:hover {
    border-color: var(--gold);
    color: var(--gold-bright);
}

.event-logo {
    display: block;
    width: clamp(104px, 10vw, 150px);
    height: clamp(104px, 10vw, 150px);
    margin: -4px auto 2px;
    object-fit: contain;
    filter:
        drop-shadow(0 7px 9px rgba(0, 0, 0, .9))
        drop-shadow(0 0 17px rgba(255, 176, 26, .4));
}

.event-kicker {
    margin: 2px 0 3px;
    color: #d59c31;
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .23em;
}

.event-hero h1 {
    margin: 0;
    color: var(--gold-pale);
    font-size: clamp(1.95rem, 3.4vw, 3.1rem);
    line-height: 1.12;
    text-shadow:
        0 2px 0 #5d3500,
        0 0 20px rgba(255, 186, 32, .28);
}

.event-hero h1 span {
    color: #eeb54b;
    white-space: nowrap;
}

.event-summary {
    max-width: 760px;
    margin: 9px auto 14px;
    color: #c7c0ae;
    font-size: 1.03rem;
}

.event-meta {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    gap: 10px;
    margin: 0 auto;
    color: #c8b688;
    font-size: 1rem;
}

.event-meta > span,
.rules-shortcut {
    min-height: 48px;
    padding: 12px 16px;
    border: 1px solid rgba(183, 132, 32, .28);
    border-radius: 6px;
    background: rgba(4, 5, 4, .7);
}

.event-meta strong {
    color: #f0c65f;
    font-weight: 700;
}

.auto-update {
    color: var(--green-soft);
}

.auto-update i {
    display: inline-block;
    width: 8px;
    height: 8px;
    margin-right: 5px;
    border: 1px solid #b9ff85;
    border-radius: 50%;
    background: #3bbf13;
    box-shadow: 0 0 8px #52d51d;
    animation: status-pulse 1.8s ease-in-out infinite;
}

.rules-shortcut {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    border-color: rgba(224, 156, 25, .65);
    color: var(--gold-bright);
    background: linear-gradient(180deg, rgba(56, 37, 4, .9), rgba(16, 11, 2, .95));
    box-shadow:
        inset 0 0 18px rgba(255, 178, 26, .1),
        0 0 15px rgba(255, 174, 17, .13);
    cursor: pointer;
}

.rules-shortcut .rules-mark {
    color: #ffd963;
    font-size: 1.45rem;
    line-height: 1;
}

.rules-shortcut > span:last-child {
    text-align: left;
}

.rules-shortcut strong,
.rules-shortcut small {
    display: block;
}

.rules-shortcut strong {
    font-size: 1.02rem;
}

.rules-shortcut small {
    margin-top: 1px;
    color: #ad9561;
    font-size: .72rem;
}

.rules-shortcut:hover {
    border-color: var(--gold-bright);
    transform: translateY(-1px);
    box-shadow: 0 0 22px rgba(255, 180, 25, .31);
}

.hero-enrollment {
    display: grid;
    grid-template-columns: minmax(0, 1.45fr) minmax(280px, .8fr);
    gap: 12px;
    max-width: 1120px;
    margin: 16px auto 0;
}

.hero-register-cta,
.hero-verify-cta {
    position: relative;
    display: flex;
    align-items: center;
    gap: 13px;
    min-height: 82px;
    padding: 13px 17px;
    overflow: hidden;
    border: 1px solid;
    border-radius: 8px;
    text-align: left;
    transition: transform .2s ease, filter .2s ease, box-shadow .2s ease;
}

.hero-register-cta {
    border-color: #ffbb31;
    color: #fff6d8;
    background:
        radial-gradient(circle at 12% 50%, rgba(255, 208, 74, .23), transparent 28%),
        linear-gradient(125deg, #8b1706, #3d0d04 54%, #160701);
    box-shadow:
        inset 0 0 28px rgba(255, 111, 0, .2),
        0 0 0 3px rgba(129, 19, 3, .5),
        0 0 22px rgba(255, 94, 0, .26);
    animation: enrollment-glow 1.55s ease-in-out infinite;
}

.hero-register-cta::after {
    position: absolute;
    top: -35%;
    bottom: -35%;
    left: -32%;
    width: 24%;
    transform: skewX(-18deg);
    background: linear-gradient(90deg, transparent, rgba(255, 240, 175, .6), transparent);
    content: "";
    pointer-events: none;
    animation: enrollment-sweep 2.6s ease-in-out infinite;
}

.hero-verify-cta {
    border-color: rgba(95, 215, 33, .65);
    color: #e6ffd1;
    background:
        radial-gradient(circle at 15% 50%, rgba(101, 226, 40, .18), transparent 30%),
        linear-gradient(125deg, #174d08, #092104 58%, #040d02);
    box-shadow: inset 0 0 24px rgba(86, 217, 27, .09), 0 0 14px rgba(65, 194, 16, .12);
}

.hero-register-cta:hover,
.hero-verify-cta:hover {
    transform: translateY(-2px);
    filter: brightness(1.12);
}

.hero-cta-icon {
    position: relative;
    z-index: 1;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 48px;
    width: 48px;
    height: 48px;
    border: 1px solid currentColor;
    border-radius: 50%;
    color: #ffdc71;
    background: rgba(0, 0, 0, .36);
    box-shadow: 0 0 16px rgba(255, 178, 26, .18);
    font-size: 1.45rem;
}

.hero-verify-cta .hero-cta-icon {
    color: #9aff5e;
}

.hero-cta-copy {
    position: relative;
    z-index: 1;
    flex: 1;
    min-width: 0;
}

.hero-cta-copy small,
.hero-cta-copy strong,
.hero-cta-copy em {
    display: block;
}

.hero-cta-copy small {
    color: #ffc264;
    font-size: .7rem;
    font-weight: 900;
    letter-spacing: .09em;
}

.hero-verify-cta .hero-cta-copy small {
    color: #8ee24c;
}

.hero-cta-copy strong {
    margin-top: 1px;
    color: #fff0ae;
    font-size: clamp(1.22rem, 2vw, 1.65rem);
    line-height: 1.15;
    text-shadow: 0 0 14px rgba(255, 197, 59, .48);
}

.hero-register-cta .hero-cta-copy strong {
    animation: enrollment-text 1.1s ease-in-out infinite;
}

.hero-cta-copy em {
    margin-top: 3px;
    overflow: hidden;
    color: #dcc8a1;
    font-size: .79rem;
    font-style: normal;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.hero-register-cta > b {
    position: relative;
    z-index: 1;
    flex: 0 0 auto;
    padding: 8px 11px;
    border: 1px solid rgba(255, 213, 104, .62);
    border-radius: 4px;
    color: #2c1001;
    background: linear-gradient(135deg, #ffe28e, #d58d13);
    font-size: .8rem;
}

.phase-banner {
    display: flex;
    align-items: center;
    gap: 13px;
    max-width: 1040px;
    margin: 14px auto 0;
    padding: 10px 16px;
    border: 1px solid rgba(244, 109, 20, .55);
    border-radius: 5px;
    text-align: left;
    background:
        radial-gradient(circle at 20% 50%, rgba(215, 60, 10, .12), transparent 44%),
        rgba(27, 8, 3, .78);
    box-shadow: inset 0 0 20px rgba(225, 58, 5, .07);
}

.phase-banner.live {
    border-color: rgba(91, 208, 29, .48);
    background: rgba(10, 27, 5, .78);
}

.phase-banner.closed {
    border-color: rgba(174, 174, 164, .35);
    background: rgba(18, 18, 17, .82);
}

.phase-icon {
    flex: 0 0 auto;
    color: #ff8a32;
    font-size: 1.75rem;
    line-height: 1;
    text-shadow: 0 0 13px currentColor;
}

.phase-banner.live .phase-icon {
    color: var(--green);
}

.phase-banner strong {
    color: #ffd49c;
    font-size: .94rem;
}

.phase-banner.live strong {
    color: #c8ff99;
}

.phase-banner p {
    margin: 2px 0 0;
    color: #cfb8a4;
    font-size: .77rem;
}

main {
    padding: 0 clamp(16px, 2.2vw, 30px) 28px;
}

.event-tabs {
    display: flex;
    gap: 4px;
    margin: 0 0 7px;
    padding-top: 12px;
    border-bottom: 1px solid rgba(200, 137, 24, .35);
}

.event-tabs button {
    position: relative;
    min-width: 196px;
    padding: 11px 20px;
    border: 1px solid rgba(178, 128, 33, .26);
    border-bottom: 0;
    border-radius: 5px 5px 0 0;
    color: #9f9888;
    background: linear-gradient(180deg, #0d100e, #070807);
    cursor: pointer;
}

.event-tabs button::after {
    position: absolute;
    right: 0;
    bottom: -1px;
    left: 0;
    height: 2px;
    background: transparent;
    content: "";
}

.event-tabs button:hover {
    color: #e9d6a5;
}

.event-tabs button.active {
    color: var(--gold-bright);
    border-color: rgba(230, 163, 30, .75);
    background:
        linear-gradient(180deg, rgba(74, 47, 4, .58), rgba(8, 9, 8, .98));
    box-shadow: inset 0 1px 0 rgba(255, 218, 128, .15);
}

.event-tabs button.active::after {
    background: var(--gold);
    box-shadow: 0 0 10px var(--gold);
}

.event-tabs b {
    margin-left: 5px;
    color: var(--green-soft);
}

.reward-section {
    padding-top: 5px;
}

.reward-heading,
.section-heading {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 20px;
}

.reward-heading {
    margin: 10px 0 8px;
}

.reward-heading p,
.section-heading p,
.lookup-copy > p {
    margin: 0 0 1px;
    color: #b77a17;
    font-size: .76rem;
    font-weight: 900;
    letter-spacing: .18em;
}

.reward-heading h2,
.section-heading h2,
.lookup-copy h2 {
    margin: 0;
    color: #efce80;
    font-size: 1.18rem;
}

.reward-heading > strong {
    color: var(--gold-bright);
    font-size: 1.3rem;
    text-shadow: 0 0 14px rgba(255, 180, 33, .25);
}

.reward-grid {
    display: grid;
    grid-template-columns: 1.12fr repeat(3, .9fr) 1.05fr;
    gap: 10px;
}

.reward-card {
    position: relative;
    min-height: 105px;
    padding: 11px 12px 10px;
    overflow: hidden;
    border: 1px solid rgba(218, 149, 17, .7);
    border-radius: 7px;
    text-align: center;
    background:
        radial-gradient(circle at 50% 20%, rgba(214, 145, 18, .13), transparent 64%),
        linear-gradient(145deg, #0b0d0b, #050605);
    box-shadow:
        inset 0 0 17px rgba(210, 145, 18, .05),
        0 5px 17px rgba(0, 0, 0, .35);
}

.reward-card::before {
    position: absolute;
    top: 0;
    left: 10%;
    width: 80%;
    height: 1px;
    background: linear-gradient(90deg, transparent, #ffe492, transparent);
    content: "";
}

.reward-card.champion {
    border-color: #ff8a19;
    background:
        radial-gradient(circle at 50% 5%, rgba(255, 133, 0, .32), transparent 60%),
        linear-gradient(145deg, #220801, #090602 60%);
    box-shadow:
        inset 0 0 26px rgba(240, 72, 0, .17),
        0 0 17px rgba(236, 85, 0, .16);
    animation: champion-reward-glow 2.8s ease-in-out infinite;
}

.reward-card.total {
    background:
        radial-gradient(circle at 55% 12%, rgba(255, 181, 26, .3), transparent 57%),
        linear-gradient(145deg, #171004, #060705);
    animation: total-reward-glow 3.4s ease-in-out infinite;
}

.reward-medal {
    display: inline-grid;
    place-items: center;
    min-width: 33px;
    height: 27px;
    margin-bottom: 1px;
    color: #ffd261;
    font-size: 1.35rem;
    font-weight: 900;
    line-height: 1;
    text-shadow: 0 0 12px rgba(255, 180, 27, .62);
}

.reward-medal.silver {
    color: #c6c9c8;
    text-shadow: 0 0 10px rgba(222, 230, 230, .42);
}

.reward-medal.bronze {
    color: #cf8b2a;
    font-size: .93rem;
}

.reward-card small {
    display: block;
    color: #c6ab73;
    font-size: .82rem;
}

.reward-card strong {
    display: inline-block;
    margin-top: 1px;
    color: #ffc943;
    font-family: Georgia, "Times New Roman", serif;
    font-size: clamp(1.55rem, 2.2vw, 2.25rem);
    line-height: 1;
    text-shadow: 0 2px 0 #4e2c00, 0 0 13px rgba(255, 161, 18, .28);
}

.reward-card p {
    display: inline-block;
    margin: 0 0 0 4px;
    color: #e4bd60;
    font-size: .82rem;
}

.coin-stack {
    display: block;
    height: 29px;
    color: #ffc22c;
    font-size: 1.3rem;
    letter-spacing: -8px;
    text-shadow:
        0 4px 0 #925200,
        0 8px 0 #4f2b00,
        0 0 13px rgba(255, 185, 30, .55);
}

.event-facts {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    margin: 10px 0 8px;
    border: 1px solid rgba(201, 139, 27, .43);
    border-radius: 6px;
    background: rgba(4, 6, 4, .83);
}

.event-facts article {
    position: relative;
    display: flex;
    align-items: center;
    gap: 11px;
    min-height: 86px;
    padding: 11px 14px;
    text-align: left;
}

.event-facts article + article {
    border-left: 1px solid rgba(198, 137, 27, .26);
}

.event-facts article > div > span,
.event-facts small {
    display: block;
    color: #9c9586;
    font-size: .79rem;
}

.event-facts article > div {
    flex: 1;
    min-width: 0;
}

.event-facts strong {
    display: block;
    margin: 2px 0 0;
    color: var(--green-soft);
    font-size: 1.08rem;
    letter-spacing: .04em;
}

.event-facts .fact-icon {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 44px;
    width: 44px;
    height: 44px;
    border: 1px solid rgba(234, 170, 43, .58);
    border-radius: 50%;
    color: #ffc43f;
    background:
        radial-gradient(circle, rgba(230, 155, 20, .18), transparent 66%),
        #0c0d08;
    box-shadow: 0 0 13px rgba(233, 154, 18, .13);
}

.fact-icon svg {
    width: 28px;
    height: 28px;
    fill: none;
    stroke: currentColor;
    stroke-width: 1.8;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.event-facts button,
.event-facts a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    flex: 0 0 auto;
    min-height: 31px;
    padding: 5px 8px;
    border: 1px solid rgba(218, 153, 30, .5);
    border-radius: 3px;
    color: #f0c45f;
    background: rgba(57, 38, 4, .48);
    font-size: .76rem;
    cursor: pointer;
}

.network-notice {
    display: flex;
    align-items: center;
    gap: 14px;
    margin: 0 0 10px;
    padding: 10px 16px;
    border: 1px solid rgba(238, 72, 24, .62);
    border-radius: 5px;
    background:
        radial-gradient(circle at 24% 40%, rgba(223, 51, 7, .12), transparent 34%),
        rgba(29, 7, 2, .74);
}

.public-data-error {
    display: grid;
    gap: 3px;
    margin: 0 0 10px;
    padding: 12px 16px;
    border: 1px solid rgba(240, 68, 29, .7);
    border-radius: 5px;
    color: #d9a18b;
    background:
        radial-gradient(circle at 20% 0, rgba(231, 56, 17, .16), transparent 40%),
        #190806;
}

.public-data-error strong {
    color: #ff7b50;
    font-size: 1rem;
}

.public-data-error span {
    font-size: .84rem;
}

.network-notice > span {
    color: #ffb22e;
    font-size: 2rem;
    line-height: 1;
    text-shadow: 0 0 12px rgba(255, 103, 0, .55);
}

.network-notice strong {
    color: #ff7f45;
    font-size: .98rem;
}

.network-notice p {
    margin: 2px 0 0;
    color: #d7a98c;
    font-size: .84rem;
}

.tab-panel {
    display: none;
    scroll-margin-top: 12px;
    padding: 13px 14px 15px;
    border: 1px solid rgba(198, 137, 24, .35);
    border-radius: 6px;
    background:
        linear-gradient(180deg, rgba(8, 11, 8, .97), rgba(4, 6, 4, .97));
    box-shadow: inset 0 0 25px rgba(210, 145, 20, .025);
}

.tab-panel.active {
    display: block;
    animation: panel-enter .22s ease both;
}

.section-heading {
    margin: 0 0 10px;
    padding: 0 2px 8px;
    border-bottom: 1px solid rgba(199, 137, 24, .2);
}

.section-heading > span {
    color: #a29b8e;
    font-size: .84rem;
}

.table-wrap {
    max-width: 100%;
    overflow: auto;
    border: 1px solid rgba(192, 130, 20, .28);
    border-radius: 5px;
    background: #030504;
    scrollbar-color: #8d6116 #080a08;
    scrollbar-width: thin;
}

table {
    width: 100%;
    border-collapse: collapse;
}

.ranking-table {
    min-width: 1180px;
}

.verified-table {
    min-width: 1180px;
}

th,
td {
    padding: 10px 12px;
    border-right: 1px solid rgba(176, 121, 22, .14);
    border-bottom: 1px solid rgba(176, 121, 22, .15);
    text-align: left;
    vertical-align: middle;
    white-space: nowrap;
}

th:last-child,
td:last-child {
    border-right: 0;
}

th {
    position: sticky;
    z-index: 2;
    top: 0;
    color: #c9a863;
    background: linear-gradient(180deg, #11150f, #090c09);
    font-size: .82rem;
    font-weight: 700;
}

td {
    color: #c4c3b8;
    background: rgba(5, 8, 6, .84);
    font-size: .84rem;
}

tbody tr:nth-child(even) td {
    background: rgba(9, 12, 9, .88);
}

tbody tr:hover td {
    background: rgba(45, 31, 5, .42);
}

.ranking-table tr.top td {
    color: #e8d9b4;
    background:
        linear-gradient(90deg, rgba(87, 48, 2, .24), rgba(10, 11, 9, .92));
}

.ranking-table tr.top-1 td {
    background:
        linear-gradient(90deg, rgba(135, 47, 0, .3), rgba(17, 10, 5, .93));
}

.rank-badge {
    display: inline-grid;
    place-items: center;
    width: 25px;
    height: 25px;
    border: 1px solid #75591f;
    border-radius: 50%;
    color: #e5c46d;
    background: linear-gradient(145deg, #33250b, #090b09);
    font-weight: 900;
}

.top-1 .rank-badge {
    color: #fff0a1;
    border-color: #ff9b16;
    background: linear-gradient(145deg, #8f4800, #271000);
    box-shadow: 0 0 11px rgba(255, 128, 0, .42);
}

.top-2 .rank-badge {
    color: #edf2f0;
    border-color: #9da29f;
    background: linear-gradient(145deg, #5b615f, #171a19);
}

.top-3 .rank-badge {
    color: #ffe1a2;
    border-color: #af6721;
    background: linear-gradient(145deg, #693911, #1c1007);
}

.exp-cell {
    display: flex;
    align-items: center;
    gap: 8px;
    min-width: 264px;
}

.exp-cell b {
    width: 56px;
    color: var(--green-soft);
    font-size: .83rem;
    text-align: right;
}

.exp-track {
    position: relative;
    display: block;
    flex: 1;
    height: 8px;
    overflow: hidden;
    border: 1px solid rgba(80, 93, 82, .45);
    border-radius: 9px;
    background: #111512;
}

.exp-track i {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: linear-gradient(90deg, #33970a, #80db21);
    box-shadow: 0 0 8px rgba(104, 214, 23, .35);
}

.leveling-live {
    display: inline-flex;
    align-items: center;
    gap: 5px;
    min-width: 47px;
    color: #91ff4e;
    font-size: .68rem;
    font-weight: 1000;
    letter-spacing: .08em;
    text-shadow: 0 0 8px rgba(106, 255, 43, .7);
    white-space: nowrap;
}

.leveling-live::before {
    width: 7px;
    height: 7px;
    border: 1px solid #c9ff9d;
    border-radius: 50%;
    background: #65ff24;
    box-shadow:
        0 0 5px #66ff24,
        0 0 12px rgba(92, 255, 31, .8);
    content: "";
    animation: live-exp-dot 1.15s ease-in-out infinite;
}

.ranking-table tr.is-online-live td {
    box-shadow:
        inset 0 1px rgba(100, 255, 35, .13),
        inset 0 -1px rgba(100, 255, 35, .08);
}

.ranking-table tr.is-online-live td:nth-child(5) {
    background:
        radial-gradient(circle at 48% 50%, rgba(68, 255, 18, .09), transparent 76%),
        rgba(5, 17, 3, .42);
}

.ranking-table tr.is-online-live .exp-track {
    border-color: rgba(120, 255, 67, .8);
    background: #061004;
    box-shadow:
        inset 0 0 7px rgba(73, 255, 18, .2),
        0 0 7px rgba(72, 255, 20, .55),
        0 0 15px rgba(72, 255, 20, .22);
    animation: live-exp-track-glow 1.55s ease-in-out infinite;
}

.ranking-table tr.is-online-live .exp-track i {
    background:
        linear-gradient(90deg, #25a507 0%, #5ee520 35%, #b7ff51 52%, #4fd817 68%, #25a507 100%);
    background-size: 210% 100%;
    box-shadow:
        0 0 7px rgba(126, 255, 55, .75),
        0 0 15px rgba(85, 255, 24, .42);
    animation: live-exp-flow 1.3s linear infinite;
}

.ranking-table tr.is-online-live .exp-track::after {
    position: absolute;
    top: -5px;
    bottom: -5px;
    left: -42px;
    width: 32px;
    transform: skewX(-22deg);
    background: linear-gradient(90deg, transparent, rgba(236, 255, 220, .94), transparent);
    filter: blur(.3px);
    content: "";
    pointer-events: none;
    animation: live-exp-sweep 1.7s ease-in-out infinite;
}

.ranking-table tr.is-leveling .leveling-live {
    color: #d6ff67;
    text-shadow:
        0 0 8px rgba(164, 255, 67, .82),
        0 0 15px rgba(100, 255, 33, .42);
}

.prize-badge {
    display: inline-block;
    min-width: 102px;
    padding: 4px 10px;
    border: 1px solid #a96710;
    border-radius: 999px;
    color: #ffd353;
    text-align: center;
    background:
        radial-gradient(circle at 50% 0, rgba(255, 154, 13, .22), transparent 60%),
        #1a0c02;
    box-shadow: inset 0 0 9px rgba(242, 100, 0, .12);
    animation: prize-badge-glow 2.6s ease-in-out infinite;
}

.no-prize {
    color: #625f57;
}

.network-code {
    display: inline-block;
    padding: 3px 7px;
    border: 1px solid rgba(130, 138, 126, .32);
    border-radius: 3px;
    color: #b9bdb6;
    background: #0e110f;
    font-family: Consolas, "Courier New", monospace;
    font-size: .78rem;
    letter-spacing: .05em;
}

.network-cell {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    gap: 4px;
    min-width: 170px;
}

.network-status {
    display: inline-flex;
    align-items: center;
    padding: 2px 7px;
    border: 1px solid;
    border-radius: 999px;
    font-size: .69rem;
    font-weight: 900;
    white-space: nowrap;
}

.network-status.unique {
    border-color: rgba(83, 204, 28, .36);
    color: #79d743;
    background: rgba(29, 83, 9, .2);
}

.network-status.duplicate {
    border-color: rgba(242, 67, 27, .5);
    color: #ff7247;
    background: rgba(115, 23, 6, .23);
}

.network-status.unknown {
    border-color: rgba(153, 151, 141, .3);
    color: #aaa79f;
    background: rgba(70, 70, 66, .14);
}

.empty {
    padding: 34px !important;
    color: #918a7b !important;
    text-align: center !important;
}

.ranking-extra,
.verified-extra {
    display: none;
}

#ranking-list.is-expanded .ranking-extra,
#verified-list.is-expanded .verified-extra {
    display: table-row;
}

.view-all-button {
    display: block;
    min-width: 310px;
    margin: 9px auto 0;
    padding: 8px 22px;
    border: 1px solid rgba(223, 153, 24, .74);
    border-radius: 5px;
    color: var(--gold-bright);
    background:
        linear-gradient(180deg, rgba(56, 38, 5, .82), rgba(12, 9, 3, .95));
    box-shadow: inset 0 0 12px rgba(255, 183, 27, .06);
    cursor: pointer;
}

.view-all-button:hover,
.view-all-button.expanded {
    border-color: #ffd86d;
    background:
        linear-gradient(180deg, rgba(86, 56, 4, .88), rgba(17, 12, 3, .98));
}

.ranking-locked {
    padding: 42px 20px 47px;
    border: 1px dashed rgba(202, 139, 24, .34);
    border-radius: 6px;
    text-align: center;
    background:
        radial-gradient(circle at 50% 40%, rgba(198, 126, 9, .09), transparent 42%),
        #050705;
}

.lock-mark {
    display: block;
    margin-bottom: 8px;
    color: #e8a72c;
    font-size: 3rem;
    line-height: 1;
    text-shadow: 0 0 17px rgba(255, 162, 17, .35);
}

.ranking-locked h3 {
    margin: 0 0 5px;
    color: #efc36b;
    font-size: 1.16rem;
}

.ranking-locked p {
    margin: 0 auto 17px;
    color: #a69e8e;
    font-size: .8rem;
}

.ranking-locked button {
    padding: 9px 17px;
    border: 1px solid rgba(104, 208, 25, .58);
    border-radius: 4px;
    color: #bfff80;
    background: rgba(20, 56, 8, .46);
    cursor: pointer;
}

.verified-summary {
    display: grid;
    grid-template-columns: auto auto 1fr auto;
    align-items: center;
    gap: 10px;
    margin-bottom: 9px;
    padding: 10px 14px;
    border: 1px solid rgba(91, 205, 24, .3);
    border-radius: 5px;
    background: rgba(13, 30, 7, .45);
}

.verified-summary strong {
    color: var(--green-soft);
    font-size: 1.65rem;
    line-height: 1;
}

.verified-summary > span {
    color: #c3e5a8;
    font-weight: 800;
}

.verified-summary p {
    margin: 0;
    color: #93a187;
    font-size: .84rem;
    text-align: right;
}

.verified-prize-total {
    padding-left: 14px;
    border-left: 1px solid rgba(204, 140, 22, .38);
    color: #ffd65c;
    font-size: 1rem;
    white-space: nowrap;
    text-shadow: 0 0 10px rgba(255, 158, 0, .3);
}

.verified-badge {
    display: inline-block;
    padding: 3px 8px;
    border: 1px solid rgba(86, 206, 20, .46);
    border-radius: 999px;
    color: #a7ff68;
    background: rgba(22, 68, 8, .35);
    font-size: .8rem;
}

.verified-table thead th:last-child small {
    display: block;
    margin-bottom: 2px;
    color: #c99025;
    font-size: .66rem;
    font-weight: 800;
    letter-spacing: .02em;
}

.verified-table tr.verified-top td {
    color: #e8d9b4;
    background: linear-gradient(90deg, rgba(87, 48, 2, .2), rgba(10, 11, 9, .92));
}

.verified-table tr.verified-top-1 td {
    background: linear-gradient(90deg, rgba(135, 47, 0, .28), rgba(17, 10, 5, .93));
}

.verified-table tr.verified-top-1 .rank-badge {
    color: #fff0a1;
    border-color: #ff9b16;
    background: linear-gradient(145deg, #8f4800, #271000);
    box-shadow: 0 0 11px rgba(255, 128, 0, .42);
}

.verified-table tr.verified-top-2 .rank-badge {
    color: #edf2f0;
    border-color: #9da29f;
    background: linear-gradient(145deg, #5b615f, #171a19);
}

.verified-table tr.verified-top-3 .rank-badge {
    color: #ffe1a2;
    border-color: #af6721;
    background: linear-gradient(145deg, #693911, #1c1007);
}

.verified-table .rank-badge.is-projected {
    border-style: dashed;
}

.verified-table .prize-badge {
    min-width: 116px;
    padding: 5px 12px;
    font-weight: 900;
    letter-spacing: .01em;
    white-space: nowrap;
}

.verified-table .prize-tier-1 {
    color: #fff2a7;
    border-color: #ff8b19;
    background:
        radial-gradient(circle at 50% 0, rgba(255, 196, 68, .42), transparent 62%),
        linear-gradient(145deg, #8f2100, #321000);
    box-shadow:
        inset 0 0 10px rgba(255, 197, 67, .2),
        0 0 12px rgba(255, 96, 0, .42);
}

.verified-table .prize-tier-2 {
    color: #fff1bd;
    border-color: #b6a67a;
    background:
        linear-gradient(145deg, rgba(112, 119, 117, .72), rgba(29, 28, 24, .96));
    box-shadow: inset 0 0 9px rgba(255, 242, 197, .14);
}

.verified-table .prize-tier-3-6 {
    color: #ffd45e;
    border-color: #c98013;
    background:
        radial-gradient(circle at 50% 0, rgba(255, 155, 16, .2), transparent 64%),
        #241203;
}

.verified-table .prize-tier-7-12 {
    color: #f2c85c;
    border-color: #8e681c;
    background: rgba(27, 23, 12, .78);
    box-shadow: none;
    animation: none;
}

.verified-rank-cell {
    width: 64px;
    text-align: center;
}

.rank-pending,
.prize-pending {
    color: #938b7b;
    font-size: .78rem;
    white-space: nowrap;
}

.verified-network-cell {
    min-width: 190px;
}

.verified-table-note {
    margin: 10px 0 0;
    color: #aa8a49;
    font-size: .78rem;
    text-align: center;
}

.rules-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 10px;
}

.rules-grid article {
    display: flex;
    gap: 12px;
    min-height: 105px;
    padding: 14px;
    border: 1px solid rgba(204, 140, 22, .26);
    border-radius: 5px;
    background:
        linear-gradient(145deg, rgba(15, 18, 14, .96), rgba(5, 7, 5, .96));
}

.rules-grid article > span {
    flex: 0 0 auto;
    color: #b37819;
    font-family: Georgia, serif;
    font-size: 1.45rem;
    font-weight: 900;
    line-height: 1;
}

.rules-grid h3 {
    margin: 0 0 4px;
    color: #e7c370;
    font-size: 1.02rem;
}

.rules-grid p {
    margin: 0;
    color: #aaa496;
    font-size: .86rem;
}

.rules-grid b {
    color: var(--green-soft);
}

.join-actions {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 14px;
}

.button {
    min-width: 190px;
    padding: 10px 18px;
    border: 1px solid;
    border-radius: 4px;
    text-align: center;
    font-size: .94rem;
    font-weight: 800;
}

.button.primary {
    color: #190f01;
    border-color: #ffd46e;
    background: linear-gradient(135deg, #ffe191, #b87308);
}

.button.secondary {
    color: #bdff87;
    border-color: rgba(91, 210, 27, .6);
    background: linear-gradient(135deg, #1f5f08, #0a2603);
}

.lookup-section {
    margin-top: 12px;
    padding: 16px;
    border: 1px solid rgba(198, 137, 24, .34);
    border-radius: 6px;
    background:
        radial-gradient(circle at 5% 0, rgba(207, 137, 18, .08), transparent 34%),
        #070907;
}

.lookup-section::after {
    display: table;
    clear: both;
    content: "";
}

.lookup-copy {
    float: left;
    width: 38%;
    padding-right: 20px;
}

.lookup-copy > span {
    display: block;
    margin-top: 4px;
    color: #918b7d;
    font-size: .84rem;
}

.lookup-form {
    float: right;
    width: 62%;
}

.lookup-form label {
    display: block;
    margin-bottom: 5px;
    color: #b8aa8a;
    font-size: .84rem;
}

.lookup-form > div {
    display: flex;
    gap: 7px;
}

.lookup-form input {
    flex: 1;
    min-width: 0;
    padding: 10px 12px;
    border: 1px solid rgba(190, 132, 25, .45);
    border-radius: 4px;
    outline: 0;
    color: #f4e9d0;
    background: #020402;
}

.lookup-form input:focus {
    border-color: var(--gold);
    box-shadow: 0 0 0 3px rgba(218, 151, 22, .1);
}

.lookup-form button {
    min-width: 110px;
    border: 1px solid #c98613;
    border-radius: 4px;
    color: #160d01;
    background: linear-gradient(135deg, #ffd971, #b97409);
    font-weight: 900;
    cursor: pointer;
}

.personal-result {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    gap: 1px;
    clear: both;
    margin-top: 15px;
    padding-top: 13px;
    border-top: 1px solid rgba(198, 137, 24, .2);
    background: rgba(187, 126, 18, .09);
}

.personal-result > div {
    min-height: 68px;
    padding: 10px 12px;
    background: #080b08;
}

.personal-result span {
    display: block;
    color: #8e887d;
    font-size: .79rem;
}

.personal-result strong {
    display: block;
    margin-top: 3px;
    color: #e8d2a1;
    font-size: .92rem;
}

.personal-result .qualified {
    color: var(--green-soft);
}

.personal-result .waiting {
    color: #ff9855;
}

.personal-result .prestart-private {
    border-left: 2px solid #ca8513;
}

.lookup-message {
    clear: both;
    margin: 15px 0 0;
    padding: 11px 13px;
    border: 1px solid rgba(234, 76, 35, .44);
    border-radius: 4px;
    color: #ffb18d;
    background: rgba(71, 13, 4, .35);
    font-size: .9rem;
}

footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    padding: 13px 28px;
    border-top: 1px solid rgba(198, 137, 24, .25);
    color: #827b6e;
    background: #030403;
    font-size: .8rem;
}

footer span {
    color: #ad8740;
    font-weight: 900;
    letter-spacing: .12em;
}

.gm-login-overlay {
    position: fixed;
    z-index: 250;
    inset: 0;
    display: grid;
    place-items: center;
    padding: 18px;
    overflow-y: auto;
    background:
        radial-gradient(circle at 50% 34%, rgba(151, 83, 5, .18), transparent 28rem),
        rgba(0, 0, 0, .88);
    backdrop-filter: blur(7px);
}

.gm-login-dialog {
    position: relative;
    width: min(520px, 100%);
    padding: 27px;
    overflow: hidden;
    border: 1px solid rgba(232, 164, 34, .68);
    border-radius: 10px;
    text-align: center;
    background:
        radial-gradient(circle at 50% 0, rgba(224, 148, 17, .16), transparent 44%),
        linear-gradient(160deg, #0d100d, #040604 68%);
    box-shadow:
        0 0 0 4px rgba(0, 0, 0, .7),
        0 0 42px rgba(221, 137, 4, .22),
        0 26px 80px rgba(0, 0, 0, .8);
}

.gm-login-dialog::before {
    position: absolute;
    top: 0;
    right: 15%;
    left: 15%;
    height: 1px;
    background: linear-gradient(90deg, transparent, #ffe187, transparent);
    box-shadow: 0 0 18px rgba(255, 189, 51, .6);
    content: "";
}

.gm-login-close {
    position: absolute;
    top: 10px;
    right: 12px;
    display: grid;
    place-items: center;
    width: 34px;
    height: 34px;
    border: 1px solid rgba(206, 143, 25, .38);
    border-radius: 50%;
    color: #c5b48d;
    background: rgba(0, 0, 0, .42);
    font-size: 1.25rem;
}

.gm-login-emblem {
    display: grid;
    place-items: center;
    width: 72px;
    height: 72px;
    margin: 0 auto 10px;
    border: 1px solid #d89a24;
    border-radius: 50%;
    color: #ffe08a;
    background: radial-gradient(circle, #5d3605, #110d05 68%);
    box-shadow: inset 0 0 18px rgba(255, 183, 36, .16), 0 0 20px rgba(255, 163, 23, .18);
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.45rem;
    font-weight: 900;
}

.gm-login-kicker {
    margin: 0;
    color: #b77c17;
    font-size: .68rem;
    font-weight: 900;
    letter-spacing: .14em;
}

.gm-login-dialog h2 {
    margin: 3px 0 0;
    color: #ffe09a;
    font-size: 1.65rem;
}

.gm-login-description {
    max-width: 410px;
    margin: 7px auto 16px;
    color: #aaa496;
    font-size: .88rem;
}

.gm-login-alert,
.gm-login-secure-warning {
    margin: 0 0 13px;
    padding: 10px 12px;
    border: 1px solid rgba(235, 72, 35, .5);
    border-radius: 5px;
    color: #ffb18e;
    background: rgba(80, 15, 5, .34);
    font-size: .82rem;
    text-align: left;
}

.gm-login-secure-warning strong,
.gm-login-secure-warning span {
    display: block;
}

.gm-login-secure-warning strong {
    color: #ff946e;
}

.gm-login-secure-warning span {
    margin-top: 3px;
    color: #c89d8a;
}

.gm-login-form {
    display: grid;
    gap: 11px;
    text-align: left;
}

.gm-login-form label > span {
    display: block;
    margin-bottom: 5px;
    color: #b7ad97;
    font-size: .8rem;
}

.gm-login-form input {
    width: 100%;
    min-height: 46px;
    padding: 10px 12px;
    border: 1px solid rgba(211, 147, 27, .45);
    border-radius: 5px;
    outline: 0;
    color: #f7ecd4;
    background: #010301;
}

.gm-login-form input[readonly] {
    color: #a7ff67;
    background: #071006;
}

.gm-login-form input:focus {
    border-color: #e5aa34;
    box-shadow: 0 0 0 3px rgba(223, 151, 22, .12);
}

.gm-login-form button,
.gm-login-return {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    min-height: 49px;
    margin-top: 2px;
    border: 1px solid #e1a632;
    border-radius: 5px;
    color: #1c1001;
    background: linear-gradient(135deg, #ffe394, #bd790d);
    box-shadow: 0 0 18px rgba(226, 149, 21, .15);
    font-weight: 900;
    cursor: pointer;
}

.gm-login-return {
    margin-top: 11px;
}

.gm-login-note {
    display: block;
    margin-top: 12px;
    color: #77736a;
    font-size: .7rem;
}

.toast {
    position: fixed;
    z-index: 100;
    right: 24px;
    bottom: 24px;
    padding: 10px 16px;
    transform: translateY(20px);
    border: 1px solid rgba(103, 217, 27, .58);
    border-radius: 4px;
    color: #caff9d;
    background: rgba(12, 36, 5, .96);
    box-shadow: 0 10px 30px rgba(0, 0, 0, .5);
    font-size: .88rem;
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
}

.toast.show {
    transform: translateY(0);
    opacity: 1;
}

@keyframes enrollment-glow {
    0%, 100% {
        border-color: #e28f16;
        box-shadow:
            inset 0 0 24px rgba(255, 111, 0, .16),
            0 0 0 3px rgba(129, 19, 3, .42),
            0 0 14px rgba(255, 94, 0, .19);
    }
    50% {
        border-color: #ffe16e;
        box-shadow:
            inset 0 0 34px rgba(255, 139, 0, .28),
            0 0 0 4px rgba(173, 31, 5, .58),
            0 0 34px rgba(255, 114, 4, .42);
    }
}

@keyframes enrollment-sweep {
    0%, 35% {
        left: -32%;
        opacity: 0;
    }
    50% {
        opacity: .8;
    }
    72%, 100% {
        left: 120%;
        opacity: 0;
    }
}

@keyframes enrollment-text {
    0%, 100% {
        color: #fff0ae;
        text-shadow: 0 0 10px rgba(255, 197, 59, .36);
    }
    50% {
        color: #ffffff;
        text-shadow:
            0 0 9px rgba(255, 255, 255, .75),
            0 0 22px rgba(255, 183, 34, .7);
    }
}

@keyframes status-pulse {
    0%, 100% {
        opacity: .72;
        box-shadow: 0 0 4px #52d51d;
    }
    50% {
        opacity: 1;
        box-shadow: 0 0 13px #74ee3c;
    }
}

@keyframes live-exp-dot {
    0%, 100% {
        transform: scale(.82);
        opacity: .65;
    }
    50% {
        transform: scale(1.12);
        opacity: 1;
    }
}

@keyframes live-exp-track-glow {
    0%, 100% {
        filter: brightness(.92);
        box-shadow:
            inset 0 0 7px rgba(73, 255, 18, .18),
            0 0 6px rgba(72, 255, 20, .42),
            0 0 12px rgba(72, 255, 20, .16);
    }
    50% {
        filter: brightness(1.18);
        box-shadow:
            inset 0 0 9px rgba(104, 255, 45, .3),
            0 0 10px rgba(99, 255, 39, .72),
            0 0 22px rgba(72, 255, 20, .3);
    }
}

@keyframes live-exp-flow {
    from {
        background-position: 100% 0;
    }
    to {
        background-position: -110% 0;
    }
}

@keyframes live-exp-sweep {
    0%, 16% {
        left: -42px;
        opacity: 0;
    }
    30% {
        opacity: .92;
    }
    72%, 100% {
        left: calc(100% + 28px);
        opacity: 0;
    }
}

@keyframes panel-enter {
    from {
        transform: translateY(5px);
        opacity: 0;
    }
    to {
        transform: translateY(0);
        opacity: 1;
    }
}

@keyframes champion-reward-glow {
    0%, 100% {
        border-color: #ff8a19;
        box-shadow:
            inset 0 0 26px rgba(240, 72, 0, .17),
            0 0 15px rgba(236, 85, 0, .14);
    }
    50% {
        border-color: #ffd05a;
        box-shadow:
            inset 0 0 30px rgba(255, 117, 0, .27),
            0 0 25px rgba(255, 150, 16, .34);
    }
}

@keyframes total-reward-glow {
    0%, 100% {
        box-shadow: inset 0 0 17px rgba(210, 145, 18, .05);
    }
    50% {
        box-shadow:
            inset 0 0 24px rgba(255, 180, 31, .16),
            0 0 18px rgba(255, 178, 20, .18);
    }
}

@keyframes prize-badge-glow {
    0%, 100% {
        border-color: #a96710;
        filter: brightness(.96);
    }
    50% {
        border-color: #ffd15a;
        filter: brightness(1.16);
    }
}

@media (max-width: 1120px) {
    .reward-grid {
        grid-template-columns: repeat(3, 1fr);
    }

    .reward-card.total {
        grid-column: span 2;
    }

    .event-facts {
        grid-template-columns: repeat(2, 1fr);
    }

    .event-facts article:nth-child(3) {
        border-top: 1px solid rgba(198, 137, 27, .26);
        border-left: 0;
    }

    .event-facts article:nth-child(4) {
        border-top: 1px solid rgba(198, 137, 27, .26);
    }
}

@media (max-width: 760px) {
    .event-shell {
        width: calc(100% - 10px);
        margin-top: 5px;
        border-radius: 6px;
    }

    .event-hero {
        padding: 53px 13px 18px;
    }

    .home-link {
        top: 12px;
        left: 12px;
    }

    .event-logo {
        margin-top: -21px;
    }

    .event-hero h1 span {
        display: block;
        margin-top: 3px;
    }

    .event-summary {
        font-size: .95rem;
    }

    .event-meta {
        display: grid;
        grid-template-columns: 1fr;
    }

    .event-meta > span,
    .rules-shortcut {
        width: 100%;
    }

    .hero-enrollment {
        grid-template-columns: 1fr;
    }

    .hero-register-cta,
    .hero-verify-cta {
        min-height: 78px;
    }

    .phase-banner {
        align-items: flex-start;
    }

    main {
        padding: 0 8px 15px;
    }

    .event-tabs {
        overflow-x: auto;
        scrollbar-width: thin;
    }

    .event-tabs button {
        flex: 0 0 auto;
        min-width: 156px;
        padding: 10px 12px;
        font-size: .86rem;
    }

    .reward-heading {
        align-items: flex-start;
    }

    .reward-heading > strong {
        font-size: 1.05rem;
    }

    .reward-grid {
        grid-template-columns: repeat(2, 1fr);
    }

    .reward-card.total {
        grid-column: span 2;
    }

    .event-facts {
        grid-template-columns: 1fr;
    }

    .event-facts article + article,
    .event-facts article:nth-child(3) {
        border-top: 1px solid rgba(198, 137, 27, .26);
        border-left: 0;
    }

    .event-facts article {
        min-height: 78px;
    }

    .network-notice {
        align-items: flex-start;
    }

    .section-heading {
        align-items: flex-start;
        flex-direction: column;
        gap: 5px;
    }

    .view-all-button {
        width: 100%;
        min-width: 0;
    }

    .verified-summary {
        grid-template-columns: auto 1fr;
    }

    .verified-summary p {
        grid-column: 1 / -1;
        text-align: left;
    }

    .verified-prize-total {
        grid-column: 1 / -1;
        padding-top: 8px;
        padding-left: 0;
        border-top: 1px solid rgba(204, 140, 22, .3);
        border-left: 0;
    }

    .rules-grid {
        grid-template-columns: 1fr;
    }

    .join-actions {
        flex-direction: column;
    }

    .lookup-copy,
    .lookup-form {
        float: none;
        width: 100%;
        padding-right: 0;
    }

    .lookup-form {
        margin-top: 12px;
    }

    .lookup-form > div {
        flex-direction: column;
    }

    .lookup-form button {
        min-height: 43px;
    }

    footer {
        align-items: flex-start;
        flex-direction: column;
        gap: 4px;
        padding: 13px 16px;
    }

    .gm-login-dialog {
        padding: 23px 18px 20px;
    }
}

@media (max-width: 430px) {
    .reward-grid {
        grid-template-columns: 1fr;
    }

    .reward-card.total {
        grid-column: auto;
    }

    .reward-heading {
        flex-direction: column;
        gap: 4px;
    }

    .hero-register-cta,
    .hero-verify-cta {
        align-items: flex-start;
        padding: 12px;
    }

    .hero-register-cta > b {
        display: none;
    }

    .hero-cta-copy em {
        overflow: visible;
        text-overflow: clip;
        white-space: normal;
    }
}

@media (prefers-reduced-motion: reduce) {
    html {
        scroll-behavior: auto;
    }

    *,
    *::before,
    *::after {
        animation-duration: .01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: .01ms !important;
    }
}

/* Public runtime-state feedback. */
.runtime-public-state {
    border-color: rgba(227, 156, 24, .42) !important;
    color: #e9ca80 !important;
    background: rgba(20, 14, 4, .82) !important;
}

.runtime-public-state.state-live {
    border-color: rgba(94, 221, 42, .48) !important;
    color: #aaff6a !important;
    background: rgba(8, 25, 5, .84) !important;
}

.runtime-public-state.state-hold,
.runtime-public-state.state-closed {
    border-color: rgba(255, 80, 42, .55) !important;
    color: #ff9f82 !important;
    background: rgba(34, 7, 3, .86) !important;
}

.runtime-public-notice {
    display: grid;
    gap: 5px;
    margin: 10px 0 14px;
    padding: 17px 20px;
    border: 1px solid rgba(224, 154, 21, .52);
    border-radius: 7px;
    color: #c5b58f;
    background:
        radial-gradient(circle at 0 0, rgba(218, 143, 16, .1), transparent 38%),
        #0c0d09;
    line-height: 1.55;
}

.runtime-public-notice strong {
    color: #f4cd70;
    font-size: 1.02rem;
}

.runtime-public-notice.is-unavailable {
    border-color: rgba(244, 74, 37, .6);
    color: #c89b8c;
    background: #170806;
}

.runtime-public-notice.is-unavailable strong {
    color: #ff8d6b;
}

.hero-register-cta.is-disabled,
.hero-verify-cta.is-disabled,
.button.is-disabled {
    cursor: not-allowed;
    filter: grayscale(.58);
    opacity: .66;
    animation: none;
    box-shadow: none;
}

.hero-register-cta.is-disabled::after {
    display: none;
}

.hero-register-cta.is-disabled .hero-cta-copy strong {
    animation: none;
}

.hero-register-cta.is-disabled:hover,
.hero-verify-cta.is-disabled:hover {
    transform: none;
    filter: grayscale(.58);
}

.fact-action-disabled {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 31px;
    padding: 5px 8px;
    border: 1px solid rgba(124, 119, 108, .35);
    border-radius: 3px;
    color: #918b7f;
    background: rgba(32, 32, 28, .55);
    font-size: .76rem;
}