:root {
  --ink: #11120f;
  --paper: #f4f1e9;
  --white: #fffef9;
  --lime: #d8ff3e;
  --orange: #ff6846;
  --blue: #79b8ff;
  --muted: #77786f;
  --line: rgba(17, 18, 15, 0.15);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: Arial, Helvetica, sans-serif; }
button, input, textarea, select { font: inherit; }
button, summary, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
button { cursor: pointer; }

.brand { display: inline-flex; align-items: center; gap: 11px; font-size: 14px; font-weight: 900; letter-spacing: .07em; }
.brand-mark { width: 38px; height: 38px; display: grid; place-items: center; background: var(--lime); color: var(--ink); border-radius: 50%; transform: rotate(-7deg); }
.kicker, .eyebrow { margin: 0; font-size: 11px; font-weight: 900; letter-spacing: .16em; }
.primary-button, .secondary-button, .nav-login { min-height: 44px; border: 1px solid var(--ink); display: inline-flex; align-items: center; justify-content: center; gap: 9px; padding: 0 17px; font-size: 13px; font-weight: 800; transition: transform .18s, box-shadow .18s, background .18s; }
.primary-button { background: var(--lime); color: var(--ink); }
.primary-button:hover { transform: translate(-2px, -2px); box-shadow: 4px 4px 0 var(--ink); }
.secondary-button { background: transparent; color: inherit; }
.secondary-button:hover { background: var(--ink); color: var(--white); }
.full { width: 100%; }

/* Landing */
.landing { min-height: 100vh; background: var(--ink); color: var(--white); overflow: hidden; }
.landing-nav { width: min(1320px, calc(100% - 48px)); height: 88px; margin: 0 auto; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid rgba(255,255,255,.16); }
.landing .nav-login { border-color: rgba(255,255,255,.45); }
.landing .nav-login:hover { background: var(--lime); color: var(--ink); border-color: var(--lime); }
.landing-hero { width: min(1320px, calc(100% - 48px)); min-height: 650px; margin: 0 auto; padding: 70px 0 92px; position: relative; border-bottom: 1px solid rgba(255,255,255,.16); }
.hero-badge { display: flex; align-items: center; gap: 10px; color: #b8baaf; font-size: 11px; font-weight: 800; letter-spacing: .16em; }
.hero-badge span { width: 8px; height: 8px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 5px rgba(216,255,62,.13); }
.landing-hero h1 { max-width: 900px; margin: 31px 0 0; font-size: clamp(64px, 8.3vw, 132px); line-height: .82; letter-spacing: -.07em; font-weight: 950; }
.landing-hero h1 em { color: var(--lime); font-style: italic; font-weight: inherit; }
.landing-sub { margin: 47px 0 0 4px; width: 360px; display: flex; flex-direction: column; gap: 15px; }
.landing-sub p { margin: 0 0 5px; color: #c5c6be; font-size: 16px; line-height: 1.55; }
.landing-sub a { width: max-content; background: var(--lime); color: var(--ink); padding: 15px 18px; display: flex; align-items: center; gap: 30px; font-weight: 900; font-size: 13px; }
.landing-sub small { color: #8d8e87; }
.orbit { position: absolute; right: 4%; top: 120px; width: 390px; height: 390px; border: 1px solid rgba(255,255,255,.19); border-radius: 50%; }
.orbit::before, .orbit::after { content: ""; position: absolute; inset: 50%; width: 125%; height: 1px; background: rgba(255,255,255,.13); transform: translate(-50%,-50%) rotate(35deg); }
.orbit::after { transform: translate(-50%,-50%) rotate(-35deg); }
.orbit-center { position: absolute; inset: 50%; width: 118px; height: 118px; transform: translate(-50%,-50%) rotate(7deg); background: var(--orange); display: grid; place-items: center; border-radius: 50%; z-index: 2; }
.orbit > span { position: absolute; width: 50px; height: 50px; display: grid; place-items: center; border-radius: 50%; background: var(--white); color: var(--ink); font-size: 12px; font-weight: 950; z-index: 3; }
.orbit-one { top: 9px; right: 58px; }.orbit-two { bottom: 40px; left: 10px; }.orbit-three { bottom: 3px; right: 75px; background: var(--lime)!important; }
.how-it-works { width: min(1320px, calc(100% - 48px)); margin: 0 auto; padding: 90px 0 110px; display: grid; grid-template-columns: .85fr 1.4fr; gap: 80px; }
.how-it-works .kicker { color: var(--lime); }
.how-it-works h2 { margin: 15px 0 0; font-size: clamp(40px, 5vw, 68px); line-height: .95; letter-spacing: -.055em; }
.how-it-works ol { margin: 0; padding: 0; list-style: none; }
.how-it-works li { display: grid; grid-template-columns: 62px 1fr; gap: 20px; padding: 22px 0; border-top: 1px solid rgba(255,255,255,.19); }
.how-it-works li > span { color: var(--lime); font-size: 12px; font-weight: 900; }
.how-it-works strong { font-size: 21px; }
.how-it-works li p { margin: 7px 0 0; color: #a6a79f; line-height: 1.5; }
.landing footer, .app-shell footer { width: min(1320px, calc(100% - 48px)); margin: 0 auto; padding: 24px 0; display: flex; justify-content: space-between; border-top: 1px solid currentColor; font-size: 10px; font-weight: 800; letter-spacing: .14em; opacity: .65; }

/* Auth gates */
.gate { min-height: 100vh; padding: 70px 24px; display: grid; place-items: center; background-color: var(--ink); color: var(--white); background-image: radial-gradient(circle at 15% 10%, rgba(216,255,62,.16), transparent 26%), radial-gradient(circle at 85% 90%, rgba(255,104,70,.15), transparent 27%); }
.gate-card { width: min(100%, 520px); padding: 45px; background: var(--white); color: var(--ink); border: 1px solid var(--ink); box-shadow: 12px 12px 0 var(--lime); }
.gate-symbol { width: 56px; height: 56px; display: grid; place-items: center; background: var(--lime); border-radius: 50%; margin-bottom: 35px; }
.gate-card .kicker { color: #62645b; }
.gate-card h1 { margin: 13px 0 18px; font-size: clamp(40px, 7vw, 62px); line-height: .92; letter-spacing: -.06em; }
.gate-card h1 em { color: #658f00; font-style: normal; }
.gate-card > p:not(.kicker) { color: #64665e; line-height: 1.55; }
.gate-card > small { display: block; margin: 22px 0; padding: 10px 12px; background: #efede5; font-size: 12px; }
.gate-card form { display: grid; gap: 15px; margin-top: 25px; }
.gate-card label, .profile-popover label, .battle-form label { display: grid; gap: 7px; }
.gate-card label span, .profile-popover label span, .battle-form label > span, .battle-form legend { font-size: 11px; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.gate-card input, .profile-popover input, .battle-form input, .battle-form textarea, .apply-row select { width: 100%; border: 1px solid rgba(17,18,15,.28); background: #fff; padding: 13px; outline: none; border-radius: 0; }
.gate-card input:focus, .profile-popover input:focus, .battle-form input:focus, .battle-form textarea:focus, .apply-row select:focus { border-color: var(--ink); box-shadow: inset 3px 0 0 var(--lime); }
.invitation-gate { position: relative; }
.invitation-brand { position: absolute; left: 32px; top: 28px; }

/* App */
.app-shell { min-height: 100vh; }
.topbar { height: 78px; padding: 0 max(24px, calc((100vw - 1320px)/2)); background: var(--ink); color: var(--white); display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; position: sticky; top: 0; z-index: 20; }
.topbar nav { display: flex; gap: 36px; font-size: 12px; font-weight: 800; }
.topbar nav a { opacity: .65; transition: opacity .15s; }.topbar nav a:hover { opacity: 1; }
.profile-menu { justify-self: end; position: relative; }
.profile-menu summary { list-style: none; display: flex; align-items: center; gap: 10px; cursor: pointer; font-size: 13px; font-weight: 800; }
.profile-menu summary::-webkit-details-marker { display: none; }
.profile-avatar { width: 34px; height: 34px; display: grid; place-items: center; background: var(--lime); color: var(--ink); border-radius: 50%; font-size: 13px; font-weight: 950; text-transform: uppercase; }
.profile-popover { position: absolute; right: 0; top: 51px; width: 300px; padding: 22px; color: var(--ink); background: var(--white); border: 1px solid var(--ink); box-shadow: 7px 7px 0 var(--lime); }
.popover-heading { display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px; }
.popover-heading div { display: grid; gap: 3px; }.popover-heading small { color: var(--muted); }.popover-heading > span { font-size: 11px; font-weight: 900; background: var(--lime); padding: 6px 8px; }
.profile-popover form { display: grid; gap: 12px; }
.profile-popover .secondary-button { width: 100%; margin-top: 3px; }
.signout { display: flex; align-items: center; gap: 8px; justify-content: center; margin-top: 16px; padding-top: 15px; border-top: 1px solid var(--line); color: #777; font-size: 12px; }
.profile-popover .profile-logout { display: block; margin: 16px 0 0; padding-top: 15px; border-top: 1px solid var(--line); }
.profile-logout input[type="hidden"] { display: none; }
.profile-logout .signout { width: 100%; min-height: 38px; margin: 0; padding: 0 10px; border: 0; background: transparent; color: #6d6f67; font-weight: 750; cursor: pointer; transition: background .15s, color .15s; }
.profile-logout .signout:hover { background: #efede5; color: var(--ink); }
.dashboard-hero { min-height: 380px; padding: 75px max(24px, calc((100vw - 1320px)/2)); background: var(--ink); color: var(--white); display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; position: relative; overflow: hidden; }
.dashboard-hero::after { content: ""; position: absolute; width: 500px; height: 500px; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; right: 4%; top: -230px; box-shadow: 0 0 0 90px rgba(255,255,255,.025), 0 0 0 180px rgba(255,255,255,.018); }
.eyebrow { display: flex; align-items: center; gap: 8px; color: var(--lime); }
.dashboard-hero h1 { margin: 18px 0 13px; font-size: clamp(50px, 6.2vw, 88px); line-height: .87; letter-spacing: -.065em; position: relative; z-index: 1; }
.dashboard-hero h1 em { color: var(--lime); font-style: italic; }
.hero-copy { margin: 0; color: #a6a89f; font-size: 14px; }
.scoreboard { display: grid; grid-template-columns: repeat(3, 110px); position: relative; z-index: 2; }
.scoreboard > div { display: flex; flex-direction: column; border-left: 1px solid rgba(255,255,255,.2); padding-left: 18px; }
.scoreboard strong { font-size: 38px; line-height: 1; letter-spacing: -.04em; }.scoreboard span { color: #93958d; margin-top: 8px; font-size: 10px; text-transform: uppercase; letter-spacing: .08em; }
.flash { width: min(1320px, calc(100% - 48px)); margin: 24px auto 0; min-height: 52px; padding: 12px 15px; display: flex; align-items: center; gap: 11px; border: 1px solid var(--ink); font-size: 13px; font-weight: 700; }
.flash.ok { background: var(--lime); }.flash.error { background: #ffd0c4; }.flash a { margin-left: auto; font-size: 20px; }
.dashboard-grid { width: min(1320px, calc(100% - 48px)); margin: 0 auto; padding: 75px 0 110px; display: grid; grid-template-columns: minmax(0, 1.65fr) minmax(320px, .75fr); gap: 65px; align-items: start; }
.section-heading { display: flex; justify-content: space-between; align-items: flex-end; padding-bottom: 22px; border-bottom: 2px solid var(--ink); }
.section-heading .kicker { color: #6f7169; }.section-heading h2 { margin: 8px 0 0; font-size: 37px; letter-spacing: -.045em; }.section-heading > span { font-size: 11px; font-weight: 900; background: var(--lime); padding: 7px 10px; }
.battle-list { display: grid; }
.battle-card { display: grid; grid-template-columns: 58px 1fr; border-bottom: 1px solid var(--ink); }
.battle-index { padding: 31px 12px 0 0; color: #92938b; font-size: 11px; font-weight: 900; }
.battle-main { padding: 29px 0 31px; }
.battle-title-row { display: flex; justify-content: space-between; align-items: flex-start; gap: 20px; }
.status { font-size: 9px; letter-spacing: .12em; font-weight: 950; padding: 5px 7px; background: var(--orange); }.status.confirmed { background: var(--blue); }
.battle-title-row h3 { margin: 10px 0 0; font-size: clamp(24px, 3vw, 36px); letter-spacing: -.045em; }
.candidate-count { display: flex; align-items: center; gap: 6px; color: var(--muted); font-size: 12px; }
.battle-note { margin: 13px 0 0; color: #696b64; font-size: 14px; line-height: 1.5; }
.versus { margin: 22px 0 17px; padding: 18px 20px; display: grid; grid-template-columns: 1fr 45px 1fr; align-items: center; background: #e8e5dc; }
.player { display: flex; align-items: center; gap: 11px; min-width: 0; }
.player > span { flex: 0 0 auto; width: 42px; height: 42px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: var(--white); font-weight: 950; }.player > span.accent { background: var(--lime); color: var(--ink); }
.player > div { min-width: 0; display: grid; grid-template-columns: minmax(0, auto) auto; column-gap: 8px; }.player small { grid-column: 1/-1; color: #7b7d75; font-size: 9px; text-transform: uppercase; letter-spacing: .1em; }.player strong { overflow: hidden; text-overflow: ellipsis; }.player em { align-self: center; padding: 2px 5px; background: rgba(17,18,15,.08); color: #5f615a; font-size: 9px; font-style: normal; font-weight: 900; white-space: nowrap; }
.open-player { opacity: .55; }.vs { justify-self: center; font-size: 12px; font-style: italic; font-weight: 950; }
.date-options { display: flex; flex-wrap: wrap; gap: 7px; }.date-options > span { padding: 8px 10px; border: 1px solid var(--line); background: var(--white); font-size: 11px; font-weight: 750; }
.confirmed-time { display: flex; align-items: center; gap: 9px; padding: 11px 13px; background: #dbeaff; font-size: 12px; }.confirmed-time span { color: #5e6876; }.confirmed-time strong { margin-left: auto; }
.candidate-panel { margin-top: 18px; border: 1px solid var(--ink); }.candidate-panel > p { margin: 0; padding: 10px 12px; background: var(--ink); color: var(--white); font-size: 10px; text-transform: uppercase; letter-spacing: .11em; font-weight: 900; }
.candidate { display: grid; grid-template-columns: 35px 1fr auto; align-items: center; gap: 10px; padding: 11px 12px; border-top: 1px solid var(--line); }.candidate:first-of-type { border-top: 0; }.mini-avatar { width: 32px; height: 32px; display: grid; place-items: center; border-radius: 50%; background: var(--lime); font-size: 12px; font-weight: 900; }.candidate > div { display: grid; }.candidate small { color: var(--muted); margin-top: 2px; font-size: 10px; }.candidate button { border: 0; background: transparent; display: flex; gap: 7px; align-items: center; font-size: 11px; font-weight: 900; }
.apply-row { display: grid; grid-template-columns: 1fr auto; gap: 9px; margin-top: 18px; }.apply-row select { min-width: 0; }.apply-row .primary-button { min-width: 155px; }
.my-status, .watch-row { margin-top: 16px; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 11px 13px; background: var(--lime); font-size: 11px; font-weight: 800; }.my-status > span, .watch-row > div { display: flex; align-items: center; gap: 8px; }.my-status button { border: 0; background: transparent; text-decoration: underline; font-size: 10px; font-weight: 800; }
.watch-row { background: transparent; padding: 15px 0 0; border-top: 1px solid var(--line); }.watch-row .secondary-button { min-height: 36px; font-size: 10px; }
.watcher-dots { display: flex; margin-left: 4px; }.watcher-dots i { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: var(--white); border: 2px solid var(--paper); margin-left: -7px; font-style: normal; font-size: 9px; }
.cancel-row { display: flex; justify-content: flex-end; margin-top: 13px; }.cancel-row button { display: flex; gap: 5px; align-items: center; border: 0; background: transparent; color: #777970; font-size: 10px; }
.empty-state { padding: 55px 30px; text-align: center; border-bottom: 1px solid var(--ink); }.empty-state > span { width: 54px; height: 54px; display: grid; place-items: center; margin: 0 auto; border-radius: 50%; background: var(--lime); }.empty-state h3 { margin: 18px 0 7px; font-size: 25px; }.empty-state p { margin: 0; color: var(--muted); }
.side-column { display: grid; gap: 28px; }
.create-card { position: relative; padding: 32px; background: var(--ink); color: var(--white); overflow: hidden; }.card-number { position: absolute; right: -10px; top: -35px; color: rgba(255,255,255,.055); font-size: 160px; font-weight: 950; line-height: 1; }.create-card .kicker { color: var(--lime); position: relative; }.create-card h2, .invite-card h2 { margin: 10px 0 14px; font-size: 48px; line-height: .88; letter-spacing: -.06em; position: relative; }.create-card > p:not(.kicker), .invite-card > p:not(.kicker) { color: #9b9d94; font-size: 13px; line-height: 1.5; position: relative; }
.battle-form { margin-top: 27px; display: grid; gap: 17px; position: relative; }.battle-form label > span, .battle-form legend { color: #c5c6bf; }.battle-form em { color: #707169; font-style: normal; }.battle-form input, .battle-form textarea { background: #24251f; color: var(--white); border-color: #464840; resize: vertical; }.battle-form input:focus, .battle-form textarea:focus { border-color: var(--lime); box-shadow: none; }.battle-form fieldset { border: 0; padding: 0; margin: 0; }.battle-form legend { margin-bottom: 8px; }.slot-stack { display: grid; gap: 7px; }.slot-row { display: grid; grid-template-columns: minmax(0,1fr) 92px 42px; gap: 6px; }.slot-row select { min-width: 0; border: 1px solid #464840; background: #24251f; color: var(--white); padding: 13px 8px; }.icon-button { width: 42px; border: 1px solid #464840; background: transparent; color: #b8b9b2; display: grid; place-items: center; }.text-button { margin-top: 10px; padding: 0; border: 0; background: transparent; color: var(--lime); display: flex; align-items: center; gap: 6px; font-size: 11px; font-weight: 800; }
.invite-card { padding: 31px; border: 1px solid var(--ink); background: var(--lime); }.invite-card .kicker { margin-top: 22px; }.invite-card > p:not(.kicker) { color: #55584e; }.invite-icon { width: 46px; height: 46px; display: grid; place-items: center; border-radius: 50%; background: var(--ink); color: var(--white); }.invite-link { margin-top: 22px; border: 1px solid var(--ink); background: var(--white); }.invite-link code { display: block; padding: 13px; overflow: hidden; text-overflow: ellipsis; font-size: 11px; }.invite-link button { width: 100%; border: 0; border-top: 1px solid var(--ink); background: var(--ink); color: var(--white); padding: 11px; display: flex; justify-content: center; align-items: center; gap: 8px; font-size: 11px; font-weight: 900; }
.chat-card { border: 1px solid var(--ink); background: var(--white); }
.chat-head { padding: 24px 25px 18px; border-bottom: 1px solid var(--ink); display: flex; align-items: flex-end; justify-content: space-between; gap: 14px; }
.chat-head h2 { margin: 6px 0 0; font-size: 31px; letter-spacing: -.045em; }
.chat-live { display: flex; align-items: center; gap: 7px; font-size: 9px; font-weight: 900; letter-spacing: .1em; }
.chat-live::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 0 4px rgba(216,255,62,.2); }
.chat-messages { height: 340px; overflow-y: auto; padding: 18px 18px 10px; display: flex; flex-direction: column; gap: 13px; scrollbar-width: thin; }
.chat-empty { margin: auto; padding: 50px 20px; text-align: center; color: var(--muted); font-size: 12px; line-height: 1.5; }
.chat-message { display: grid; grid-template-columns: 31px 1fr; gap: 9px; align-items: start; }
.chat-message.mine { grid-template-columns: 1fr 31px; }
.chat-message.mine .chat-avatar { grid-column: 2; }
.chat-message.mine .chat-bubble { grid-column: 1; grid-row: 1; text-align: right; background: var(--lime); }
.chat-avatar { width: 31px; height: 31px; border-radius: 50%; display: grid; place-items: center; background: var(--ink); color: var(--white); font-size: 10px; font-weight: 950; }
.chat-bubble { min-width: 0; padding: 9px 11px; background: #e8e5dc; }
.chat-meta { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 4px; }
.chat-meta strong { font-size: 10px; }
.chat-meta time { color: var(--muted); font-size: 8px; }
.chat-bubble p { margin: 0; white-space: pre-wrap; overflow-wrap: anywhere; font-size: 12px; line-height: 1.42; }
.chat-form { border-top: 1px solid var(--ink); padding: 12px; display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.chat-form input[type="hidden"] { display: none; }
.chat-form textarea { width: 100%; min-height: 46px; max-height: 110px; border: 1px solid var(--line); padding: 11px; resize: vertical; background: var(--paper); font-size: 12px; }
.chat-form button { width: 46px; min-height: 46px; padding: 0; }
.chat-error { display: none; margin: 0; padding: 0 13px 10px; color: #a62d19; font-size: 10px; }
.chat-error.visible { display: block; }
.app-shell footer { border-color: var(--ink); }

.auth-section { width: min(1040px, calc(100% - 48px)); margin: 0 auto; padding: 86px 0; display: grid; grid-template-columns: 1fr 1fr; gap: 90px; align-items: start; border-top: 1px solid rgba(255,255,255,.18); }
.auth-section h2 { margin: 13px 0 0; font-size: clamp(42px, 6vw, 72px); line-height: .9; letter-spacing: -.06em; }
.auth-section .kicker { color: var(--lime); }
.auth-section > div > p:not(.kicker) { color: #a6a79f; line-height: 1.5; max-width: 340px; }
.auth-form { display: grid; gap: 16px; padding: 30px; background: var(--white); color: var(--ink); box-shadow: 9px 9px 0 var(--lime); }
.auth-form label { display: grid; gap: 7px; }
.auth-form label span { font-size: 11px; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
.auth-form input { width: 100%; border: 1px solid rgba(17,18,15,.28); background: #fff; padding: 13px; outline: none; border-radius: 0; }
.auth-form input:focus { border-color: var(--ink); box-shadow: inset 3px 0 0 var(--lime); }
.auth-section.founder { border-top-color: var(--lime); }

@media (max-width: 1000px) {
  .orbit { right: -120px; opacity: .72; }
  .dashboard-grid { grid-template-columns: 1fr; }.side-column { grid-template-columns: 1fr 1fr; }.chat-card { grid-column: 1 / -1; }.scoreboard { grid-template-columns: repeat(3, 90px); }
}

@media (max-width: 720px) {
  .landing-nav, .landing-hero, .how-it-works, .landing footer, .app-shell footer, .dashboard-grid, .flash { width: calc(100% - 32px); }
  .landing-nav { height: 72px; }.nav-login { min-height: 38px; padding: 0 12px; }.landing-hero { min-height: 610px; padding: 55px 0 70px; }.landing-hero h1 { font-size: clamp(52px, 17vw, 78px); }.landing-sub { width: min(100%, 330px); }.orbit { width: 260px; height: 260px; top: 360px; right: -115px; }.orbit-center { width: 85px; height: 85px; }.how-it-works { grid-template-columns: 1fr; gap: 45px; padding: 70px 0; }
  .topbar { height: 70px; grid-template-columns: 1fr auto; }.topbar nav { display: none; }.brand { font-size: 12px; }.brand-mark { width: 34px; height: 34px; }.profile-menu summary > span:last-child { display: none; }.profile-popover { position: fixed; top: 70px; right: 16px; width: calc(100% - 32px); }
  .dashboard-hero { min-height: 390px; padding: 62px 16px 35px; display: block; }.dashboard-hero h1 { font-size: 53px; }.hero-copy { max-width: 300px; }.scoreboard { margin-top: 45px; grid-template-columns: repeat(3, 1fr); }.scoreboard strong { font-size: 28px; }.scoreboard span { font-size: 8px; }
  .dashboard-grid { padding: 55px 0 80px; gap: 48px; }.side-column { grid-template-columns: 1fr; }.chat-card { grid-column: auto; }.chat-messages { height: 310px; }.battle-card { grid-template-columns: 1fr; }.battle-index { padding: 24px 0 0; }.battle-main { padding-top: 12px; }.versus { padding: 14px 12px; grid-template-columns: 1fr 30px 1fr; }.player > span { width: 35px; height: 35px; }.player strong { font-size: 12px; }.player em { display: inline-block; padding: 2px 4px; font-size: 8px; }.apply-row { grid-template-columns: 1fr; }.apply-row .primary-button { width: 100%; }.watch-row { align-items: flex-start; flex-direction: column; }.candidate { grid-template-columns: 32px 1fr; }.candidate form { grid-column: 2; }.section-heading h2 { font-size: 31px; }
  .gate { padding: 85px 16px 40px; }.gate-card { padding: 31px 24px; box-shadow: 7px 7px 0 var(--lime); }.invitation-brand { top: 23px; left: 18px; }.gate-card h1 { font-size: 44px; }.slot-row { grid-template-columns: minmax(0,1fr) 82px 38px; gap: 4px; }.slot-row input,.slot-row select { padding: 11px 6px; }
  .auth-section { width: calc(100% - 32px); grid-template-columns: 1fr; gap: 35px; padding: 65px 0; }.auth-form { padding: 24px; box-shadow: 6px 6px 0 var(--lime); }
}

@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto!important; transition: none!important; } }