@import url('https://fonts.googleapis.com/css2?family=Oswald:wght@500;600;700&family=Anton&family=Inter:wght@400;500;600;700&family=JetBrains+Mono:wght@500;600&display=swap');

:root{
  --bg:#0A0D12; --bg-elevated:#10141B;
  --surface:#161B23; --surface-2:#1E2530; --surface-3:#262E3B;
  --border:rgba(255,255,255,.08); --border-strong:rgba(255,255,255,.16);
  --text-primary:#F4F6F8; --text-secondary:#98A2B3; --text-muted:#5B6472;
  --accent:#2FE87A; --accent-strong:#17C765; --accent-glow:rgba(47,232,122,.35); --on-accent:#04170C;
  --gold:#FFC53D; --gold-soft:rgba(255,197,61,.14); --gold-text:#FFD874;
  --silver:#C6CCD6; --silver-soft:rgba(198,204,214,.12); --silver-text:#D9DEE6;
  --bronze:#D69264; --bronze-soft:rgba(214,146,100,.16); --bronze-text:#E3A97C;
  --platinum:#6FB7D9; --platinum-soft:rgba(111,183,217,.14); --platinum-text:#9ED4EE;
  --diamond:#9B8CFF; --diamond-soft:rgba(155,140,255,.16); --diamond-text:#BBAEFF;
  --danger:#FF4B67; --danger-soft:rgba(255,75,103,.14);
  --radius:6px; --radius-lg:12px;
}

*{ box-sizing:border-box; }
html,body{ margin:0; padding:0; }
body{
  font-family:'Inter', system-ui, sans-serif;
  background:var(--bg); color:var(--text-primary);
  line-height:1.6; -webkit-font-smoothing:antialiased;
  background-image:
    radial-gradient(ellipse 900px 500px at 15% -10%, rgba(47,232,122,.10), transparent 60%),
    radial-gradient(ellipse 700px 500px at 100% 0%, rgba(255,197,61,.06), transparent 55%);
  background-repeat:no-repeat;
}
h1,h2,h3{ font-family:'Oswald', sans-serif; font-weight:600; text-transform:uppercase; letter-spacing:.01em; margin:0; text-wrap:balance; color:var(--text-primary); }
.impact{ font-family:'Anton', sans-serif; font-weight:400; text-transform:none; letter-spacing:.01em; }
a{ color:var(--accent); text-decoration:none; }
a:hover{ text-decoration:underline; }
.eyebrow{ font-family:'JetBrains Mono', monospace; font-size:11px; letter-spacing:.14em; color:var(--accent); text-transform:uppercase; font-weight:600; }
.mono{ font-family:'JetBrains Mono', monospace; font-variant-numeric:tabular-nums; }
.container{ max-width:1120px; margin:0 auto; padding:0 24px; }
.narrow{ max-width:640px; }

/* nav */
.site-header{ border-bottom:1px solid var(--border); background:rgba(10,13,18,.85); backdrop-filter:blur(10px); position:sticky; top:0; z-index:10; }
.nav-row{ display:flex; align-items:center; justify-content:space-between; padding:16px 24px; max-width:1120px; margin:0 auto; }
.brand{ display:flex; align-items:center; gap:10px; font-family:'Oswald',sans-serif; font-weight:700; font-size:16px; letter-spacing:.03em; color:var(--text-primary); text-transform:uppercase; }
.brand:hover{ text-decoration:none; }
.brand .mark{ height:19px; width:auto; display:block; flex:0 0 auto; filter:drop-shadow(0 0 9px var(--accent-glow)); }
/* wordmark echoes the mark's forward lean */
.brand .word{ display:inline-block; transform:skewX(-10deg); letter-spacing:.03em; }
.nav-links{ display:flex; gap:28px; align-items:center; }
.nav-links a{ color:var(--text-secondary); font-size:13px; font-weight:600; letter-spacing:.03em; text-transform:uppercase; font-family:'Oswald',sans-serif; padding-bottom:4px; border-bottom:2px solid transparent; }
.nav-links a:hover{ color:var(--text-primary); text-decoration:none; }
.nav-links a.active{ color:var(--accent); border-bottom-color:var(--accent); }
.nav-links .nav-account{ margin-left:10px; padding-left:22px; border-left:1px solid var(--border-strong); }
.nav-links .nav-account.is-profile{ display:inline-flex; align-items:center; justify-content:center; width:38px; height:38px; padding:8px; border:1px solid var(--border-strong); border-radius:50%; background:var(--surface-2); color:var(--accent); box-shadow:0 0 18px -9px var(--accent-glow); }
.nav-links .nav-account.is-profile:hover{ border-color:var(--accent); background:var(--surface-3); }
.profile-nav-icon{ width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.nav-cta{ background:var(--accent); color:var(--on-accent) !important; padding:9px 18px !important; border-radius:var(--radius); font-size:13px; font-weight:700; border-bottom:none !important; box-shadow:0 0 0 1px var(--accent), 0 4px 20px -6px var(--accent-glow); }
.nav-cta:hover{ background:var(--accent-strong); text-decoration:none; }

/* footer */
.site-footer{ border-top:1px solid var(--border); margin-top:72px; padding:32px 24px 48px; background:var(--bg-elevated); }
.site-footer .container{ display:flex; flex-direction:column; gap:12px; }
.legal-note{ font-size:12px; color:var(--text-muted); max-width:720px; line-height:1.7; }

/* Wise donation */
.wise-donation-card{ --wise-panel-width:420px; display:flex; flex-direction:column; align-items:center; padding:28px; text-align:center; }
.wise-donation-card h2{ margin-top:4px; font-size:24px; }
.wise-donation-card > p{ max-width:460px; margin:0 auto 4px; }
.wise-qr-frame{ width:min(100%,var(--wise-panel-width)); margin-inline:auto; padding:14px; border-radius:24px; background:#EEF0EC; box-shadow:0 18px 50px -30px rgba(0,0,0,.8); }
.wise-qr-frame img{ display:block; width:100%; height:auto; border-radius:18px; }
.wise-handle{ display:flex; align-items:center; justify-content:space-between; gap:20px; width:min(100%,var(--wise-panel-width)); margin-inline:auto; padding:13px 16px; border:1px solid var(--border); border-radius:var(--radius); background:var(--surface-2); text-align:left; }
.wise-handle strong{ color:var(--accent); font-size:14px; }
.wise-check{ width:min(100%,var(--wise-panel-width)); margin:4px auto 0; text-align:left; }

@media (max-width:520px){
  .wise-donation-card{ padding:20px; }
  .wise-qr-frame{ padding:10px; border-radius:18px; }
  .wise-qr-frame img{ border-radius:13px; }
  .wise-handle{ align-items:flex-start; flex-direction:column; gap:3px; }
}

/* buttons */
.btn{ display:inline-flex; align-items:center; justify-content:center; gap:6px; padding:12px 22px; border-radius:var(--radius); font-size:13.5px; font-weight:700; font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.04em; border:1px solid var(--border-strong); background:var(--surface-2); color:var(--text-primary); cursor:pointer; transition:transform .12s ease; }
.btn:hover{ background:var(--surface-3); text-decoration:none; }
.btn:active{ transform:scale(.98); }
.btn-primary{ background:var(--accent); border-color:var(--accent); color:var(--on-accent); box-shadow:0 4px 24px -6px var(--accent-glow); }
.btn-primary:hover{ background:var(--accent-strong); border-color:var(--accent-strong); }
.btn-block{ width:100%; }
.btn:disabled{ opacity:.45; cursor:not-allowed; box-shadow:none; }

/* cards */
.card{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:20px; }

/* pills / badges */
.pill{ display:inline-flex; align-items:center; gap:5px; font-family:'JetBrains Mono',monospace; font-size:10.5px; padding:4px 10px; border-radius:4px; font-weight:600; letter-spacing:.04em; white-space:nowrap; text-transform:uppercase; }
.pill-accent{ background:rgba(47,232,122,.14); color:var(--accent); }
.pill-danger{ background:var(--danger-soft); color:var(--danger); }
.pill-muted{ background:var(--surface-3); color:var(--text-secondary); }
.pill-warn{ background:var(--gold-soft); color:var(--gold-text); }

/* tier badge: bronze / silver / gold, shield-shaped like a rating card */
.tier-badge{ display:inline-flex; align-items:center; gap:6px; font-family:'JetBrains Mono',monospace; font-size:10.5px; font-weight:700; letter-spacing:.06em; text-transform:uppercase; padding:5px 10px 5px 8px; border-radius:4px; }
.tier-badge .chip{ width:8px; height:8px; clip-path:polygon(50% 0%, 100% 38%, 82% 100%, 18% 100%, 0% 38%); }
.tier-bronze{ background:var(--bronze-soft); color:var(--bronze-text); }
.tier-bronze .chip{ background:var(--bronze); }
.tier-silver{ background:var(--silver-soft); color:var(--silver-text); }
.tier-silver .chip{ background:var(--silver); }
.tier-gold{ background:var(--gold-soft); color:var(--gold-text); }
.tier-gold .chip{ background:var(--gold); box-shadow:0 0 8px rgba(255,197,61,.6); }
.tier-platinum{ background:var(--platinum-soft); color:var(--platinum-text); }
.tier-platinum .chip{ background:var(--platinum); box-shadow:0 0 8px rgba(111,183,217,.55); }
.tier-diamond{ background:var(--diamond-soft); color:var(--diamond-text); }
.tier-diamond .chip{ background:var(--diamond); box-shadow:0 0 10px rgba(155,140,255,.7); }

/* hero */
.hero{ position:relative; padding:96px 24px 120px; text-align:center; overflow:hidden; background:linear-gradient(180deg, var(--bg-elevated), var(--bg) 70%); clip-path:polygon(0 0, 100% 0, 100% 92%, 0 100%); }
.hero h1{ font-size:clamp(38px,6vw,64px); max-width:820px; margin:0 auto; line-height:1.04; }
.hero h1 .hl{ color:var(--accent); text-shadow:0 0 30px var(--accent-glow); }
.hero p{ font-size:17px; color:var(--text-secondary); max-width:520px; margin:20px auto 32px; font-weight:400; }
.hero-actions{ display:flex; gap:14px; justify-content:center; flex-wrap:wrap; position:relative; z-index:1; }

/* grids */
.grid{ display:grid; gap:18px; }
.grid-2{ grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); }
.grid-3{ grid-template-columns:repeat(auto-fit,minmax(240px,1fr)); }
.grid-4{ grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); }

/* league card — styled after a rated player card */
.league-card{ position:relative; background:linear-gradient(155deg, var(--surface-2), var(--surface) 55%); border:1px solid var(--border); border-radius:var(--radius-lg); padding:22px; display:flex; flex-direction:column; gap:14px; overflow:hidden; transition:border-color .15s ease, transform .15s ease; }
.league-card::before{ content:""; position:absolute; top:0; right:0; width:120px; height:120px; background:radial-gradient(circle, var(--accent-glow), transparent 70%); opacity:.5; pointer-events:none; }
.league-card:hover{ border-color:var(--border-strong); transform:translateY(-2px); }
.league-card h3{ font-size:17px; line-height:1.35; min-height:2.7em; text-transform:none; letter-spacing:.005em; text-wrap:balance; }
.league-meta-row{ display:grid; grid-template-columns:minmax(92px,.8fr) minmax(0,1.2fr); align-items:start; gap:6px 16px; font-family:'JetBrains Mono',monospace; font-size:12px; line-height:1.6; color:var(--text-muted); }
.league-meta-row > span:first-child:not(:only-child){ font-size:10px; letter-spacing:.06em; line-height:1.9; text-transform:uppercase; }
.league-meta-row > span:only-child{ grid-column:1 / -1; min-height:3.2em; color:var(--text-secondary); overflow-wrap:anywhere; }
.league-meta-row .v{ color:#A9B9D0; font-weight:600; text-align:right; overflow-wrap:anywhere; }
.stat-strip{ display:flex; gap:24px; margin-top:auto; padding-top:14px; border-top:1px solid var(--border); position:relative; }
.stat-strip .stat:last-child{ margin-left:auto; text-align:right; }
.stat{ display:flex; flex-direction:column; gap:3px; }
.stat .label{ font-family:'JetBrains Mono',monospace; font-size:9.5px; line-height:1.4; letter-spacing:.1em; color:#68758A; text-transform:uppercase; }
.stat .value{ font-family:'Anton',sans-serif; font-size:19px; letter-spacing:.01em; }
.stat .value.accent{ color:var(--accent); }

/* how it works — interactive process rail */
.process-flow{ background:var(--surface); border:1px solid var(--border); border-radius:var(--radius-lg); padding:28px; }
.process-rail{ position:relative; display:grid; grid-template-columns:repeat(4,1fr); gap:0; margin-bottom:26px; }
.process-rail-fill{ position:absolute; top:19px; left:0; height:2px; background:var(--border-strong); width:100%; z-index:0; }
.process-rail-fill::after{ content:""; position:absolute; top:0; left:0; height:100%; width:var(--process-fill,12.5%); background:var(--accent); box-shadow:0 0 10px var(--accent-glow); transition:width .35s cubic-bezier(.4,0,.2,1); }
.process-node{ position:relative; z-index:1; display:flex; flex-direction:column; align-items:center; gap:10px; background:none; border:none; cursor:pointer; padding:0 4px 10px; font-family:inherit; }
.process-node-num{ width:38px; height:38px; border-radius:50%; background:var(--surface-2); border:2px solid var(--border-strong); display:flex; align-items:center; justify-content:center; font-family:'JetBrains Mono',monospace; font-size:12px; font-weight:700; color:var(--text-muted); transition:all .2s ease; }
.process-node-label{ font-family:'Oswald',sans-serif; font-size:12.5px; font-weight:600; letter-spacing:.02em; text-transform:uppercase; color:var(--text-muted); transition:color .2s ease; text-align:center; }
.process-node:hover .process-node-num{ border-color:var(--accent); color:var(--accent); }
.process-node.active .process-node-num{ background:var(--accent); border-color:var(--accent); color:var(--on-accent); box-shadow:0 0 16px var(--accent-glow); }
.process-node.active .process-node-label{ color:var(--text-primary); }
.process-node.done .process-node-num{ border-color:var(--accent); color:var(--accent); }
.process-detail{ min-height:96px; }
.process-detail-inner{ display:flex; align-items:flex-start; gap:20px; flex-wrap:wrap; animation:process-fade-in .3s ease; }
@keyframes process-fade-in{ from{ opacity:0; transform:translateY(6px); } to{ opacity:1; transform:translateY(0); } }
.process-detail-text{ flex:1 1 320px; min-width:0; }
.process-detail-text h3{ font-size:16px; margin-bottom:8px; }
.process-detail-text p{ font-size:13.5px; color:var(--text-secondary); line-height:1.6; }
.process-detail-visual{ flex:0 0 auto; }
@media (max-width:720px){
  .process-rail{ grid-template-columns:repeat(2,1fr); row-gap:20px; }
  .process-rail-fill{ display:none; }
}

/* section */
.section{ padding:56px 0; }
.section-head{ display:flex; justify-content:space-between; align-items:flex-end; margin-bottom:22px; flex-wrap:wrap; gap:8px; }

/* table — scoreboard style */
table{ width:100%; border-collapse:collapse; font-size:13.5px; }
th{ text-align:left; font-family:'JetBrains Mono',monospace; font-size:10.5px; letter-spacing:.08em; color:var(--text-muted); font-weight:600; padding:12px 14px; border-bottom:1px solid var(--border-strong); text-transform:uppercase; background:var(--bg-elevated); }
td{ padding:13px 14px; border-bottom:1px solid var(--border); vertical-align:middle; color:var(--text-secondary); }
.tblwrap{ overflow-x:auto; border:1px solid var(--border); border-radius:var(--radius-lg); background:var(--surface); }
tr:last-child td{ border-bottom:none; }
tr.clickable{ cursor:pointer; }
tr.clickable:hover{ background:var(--surface-2); }
tr:hover td{ color:var(--text-primary); }

/* bracket — scoreboard */
.bracket{ display:flex; gap:32px; overflow-x:auto; padding:8px 4px 16px; align-items:flex-start; }
.round{ display:flex; flex-direction:column; width:230px; flex:0 0 230px; }
.round-label{ font-family:'JetBrains Mono',monospace; font-size:10.5px; color:var(--text-muted); letter-spacing:.08em; text-transform:uppercase; margin-bottom:14px; }
.round-body{ position:relative; width:100%; }
.match{ position:absolute; left:0; right:0; height:104px; background:var(--surface); border:1px solid var(--border); border-radius:var(--radius); overflow:hidden; display:flex; flex-direction:column; }
.match-row{ flex:1 1 auto; display:flex; justify-content:space-between; align-items:center; padding:0 14px; font-size:13px; color:var(--text-secondary); border-left:2px solid transparent; }
.match-row + .match-row{ border-top:1px solid var(--border); }
.match-row.winner{ font-weight:600; color:var(--text-primary); border-left-color:var(--accent); }
.match-row .score{ font-family:'Anton',sans-serif; font-size:16px; }
.match-status{ flex:0 0 46px; font-size:10px; padding:6px 12px; text-align:center; font-family:'JetBrains Mono',monospace; letter-spacing:.06em; text-transform:uppercase; background:var(--bg-elevated); border-top:1px solid var(--border); display:flex; flex-direction:column; justify-content:center; align-items:center; gap:3px; line-height:1.3; }

/* tabs */
.tabs{ display:flex; gap:4px; border-bottom:1px solid var(--border); margin-bottom:22px; }
.tab{ padding:11px 18px; font-size:13px; font-weight:700; font-family:'Oswald',sans-serif; text-transform:uppercase; letter-spacing:.04em; color:var(--text-muted); cursor:pointer; border-bottom:2px solid transparent; }
.tab.active{ color:var(--text-primary); border-bottom-color:var(--accent); }
.tab-panel{ display:none; }
.tab-panel.active{ display:block; }

/* stepper */
.stepper{ display:flex; align-items:center; gap:0; margin:26px 0; }
.stepper-item{ flex:1; text-align:center; position:relative; }
.stepper-item .circle{ width:30px; height:30px; border-radius:50%; background:var(--surface-2); border:2px solid var(--border-strong); display:flex; align-items:center; justify-content:center; margin:0 auto 8px; font-family:'JetBrains Mono',monospace; font-size:11px; color:var(--text-muted); }
.stepper-item.done .circle{ background:var(--accent); border-color:var(--accent); color:var(--on-accent); box-shadow:0 0 14px var(--accent-glow); }
.stepper-item.current .circle{ border-color:var(--accent); color:var(--accent); }
.stepper-item .label{ font-size:11px; color:var(--text-muted); font-family:'JetBrains Mono',monospace; letter-spacing:.03em; text-transform:uppercase; }
.stepper-item.done .label, .stepper-item.current .label{ color:var(--text-primary); }
.stepper-line{ position:absolute; top:15px; left:-50%; width:100%; height:2px; background:var(--border-strong); z-index:-1; }
.stepper-item:first-child .stepper-line{ display:none; }
.stepper-item.done .stepper-line{ background:var(--accent); }

/* callout */
.callout{ border-left:3px solid var(--danger); background:var(--danger-soft); border-radius:0 var(--radius-lg) var(--radius-lg) 0; padding:16px 20px; }
.callout.info{ border-left-color:var(--accent); background:rgba(47,232,122,.08); }
.invite-code-row{ display:flex; align-items:stretch; gap:8px; margin:10px 0 12px; }
.invite-code{ display:flex; align-items:center; flex:1; min-width:0; padding:11px 14px; border:1px solid rgba(47,232,122,.4); border-radius:var(--radius); background:rgba(47,232,122,.1); color:var(--accent); font-family:'JetBrains Mono',monospace; font-size:19px; font-weight:700; letter-spacing:.12em; line-height:1; user-select:all; }
.copy-invite-btn{ display:inline-flex; align-items:center; justify-content:center; gap:7px; min-width:100px; padding:10px 13px; border:1px solid var(--border-strong); border-radius:var(--radius); background:var(--surface-2); color:var(--text-primary); font-family:'Oswald',sans-serif; font-size:12px; font-weight:600; letter-spacing:.04em; text-transform:uppercase; cursor:pointer; }
.copy-invite-btn:hover{ border-color:var(--accent); background:var(--surface-3); }
.copy-invite-btn:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.copy-invite-btn.copied{ border-color:var(--accent); color:var(--accent); }
.copy-invite-btn svg{ width:17px; height:17px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.callout.gold{ border-left-color:var(--gold); background:var(--gold-soft); }
.callout h4{ font-family:'Oswald',sans-serif; font-size:13.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; margin:0 0 5px; color:var(--danger); }
.callout.info h4{ color:var(--accent); }
.callout.gold h4{ color:var(--gold-text); }
.callout p{ margin:0; font-size:13.5px; color:var(--text-secondary); }

@media (max-width:420px){
  .invite-code-row{ align-items:stretch; flex-direction:column; }
  .copy-invite-btn{ width:100%; }
}

/* upload */
.upload-box{ border:1.5px dashed var(--border-strong); border-radius:var(--radius-lg); padding:36px; text-align:center; background:var(--surface); cursor:pointer; }
.upload-box:hover{ border-color:var(--accent); background:rgba(47,232,122,.05); }
.upload-box i{ font-size:26px; color:var(--text-muted); font-style:normal; }

/* forms */
label{ display:block; font-size:11px; font-weight:600; margin-bottom:8px; color:var(--text-muted); font-family:'JetBrains Mono',monospace; letter-spacing:.06em; text-transform:uppercase; }
select, input[type=text], input[type=search], input[type=password], input[type=email], input[type=number], input[type=datetime-local]{ width:100%; padding:11px 12px; border-radius:var(--radius); border:1px solid var(--border-strong); background:var(--surface-2); color:var(--text-primary); font-size:14px; font-family:'Inter',inherit; }
input[type=search]::-webkit-search-cancel-button{ filter:invert(1); opacity:.55; }

.league-filter-grid{ display:grid; grid-template-columns:minmax(260px,2fr) minmax(180px,1fr) minmax(180px,1fr); gap:18px; }
.private-leagues-section{ margin-bottom:38px; padding:22px; border:1px solid rgba(47,232,122,.28); border-radius:var(--radius-lg); background:linear-gradient(135deg,rgba(47,232,122,.075),rgba(47,232,122,.015)); }
.private-leagues-head{ margin-bottom:18px; }
.private-leagues-head h2,.public-leagues-head h2{ margin-top:5px; font-size:21px; }
.public-leagues-head{ margin:0 0 18px; }
.private-card-label{ margin-top:4px; }

@media (max-width:720px){
  .league-filter-grid{ grid-template-columns:1fr; }
  .private-leagues-section{ padding:16px; }
}
.password-field{ position:relative; }
.password-field input{ padding-right:48px; }
.password-toggle{ position:absolute; top:50%; right:7px; width:36px; height:36px; padding:7px; transform:translateY(-50%); border:0; border-radius:5px; background:transparent; color:var(--text-muted); cursor:pointer; }
.password-toggle:hover{ background:var(--surface-3); color:var(--text-primary); }
.password-toggle:focus-visible{ outline:2px solid var(--accent); outline-offset:1px; }
.password-toggle svg{ display:block; width:100%; height:100%; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
.password-toggle .eye-closed{ display:none; }
.password-toggle[aria-pressed="true"] .eye-open{ display:none; }
.password-toggle[aria-pressed="true"] .eye-closed{ display:block; }
.stripe-input{ width:100%; padding:12px; border-radius:var(--radius); border:1px solid var(--border-strong); background:var(--surface-2); }
.stripe-input.StripeElement--focus{ border-color:var(--accent); }
.stripe-input.StripeElement--invalid{ border-color:var(--danger); }

/* page header */
.page-head{ padding:44px 0 8px; }
.page-head .kicker{ display:flex; gap:10px; align-items:center; margin-bottom:12px; flex-wrap:wrap; }
.back-link{ font-size:12px; color:var(--text-muted); font-family:'JetBrains Mono',monospace; letter-spacing:.03em; }
.back-link:hover{ color:var(--text-secondary); }

/* avatar */
.avatar{ width:30px; height:30px; border-radius:4px; background:var(--surface-3); color:var(--accent); display:flex; align-items:center; justify-content:center; font-size:11px; font-weight:700; font-family:'JetBrains Mono',monospace; border:1px solid var(--border); }
.profile-avatar{ display:flex; align-items:center; justify-content:center; width:74px; height:74px; margin:0 auto 16px; border:1px solid rgba(47,232,122,.35); border-radius:50%; background:rgba(47,232,122,.1); color:var(--accent); box-shadow:0 0 34px -16px var(--accent-glow); }
.profile-avatar svg{ width:38px; height:38px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round; }
.profile-details{ max-width:460px; margin:0 auto 24px; padding:8px 20px; text-align:left; }
.profile-detail-row{ display:grid; grid-template-columns:minmax(110px,.8fr) minmax(0,1.2fr); gap:18px; padding:14px 0; border-bottom:1px solid var(--border); font-size:13px; align-items:start; }
.profile-detail-row:last-child{ border-bottom:0; }
.profile-detail-row > span{ color:var(--text-muted); }
.profile-detail-row > strong{ color:var(--text-primary); font-weight:600; overflow-wrap:anywhere; text-align:right; }
.profile-detail-row > strong.accent{ color:var(--accent); }
.uid-value{ display:flex; align-items:center; justify-content:flex-end; gap:10px; }
.copy-uid-btn{ flex:0 0 auto; padding:6px 9px; border:1px solid var(--border-strong); border-radius:6px; background:var(--surface-2); color:var(--text-secondary); font-family:'Oswald',sans-serif; font-size:10px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; cursor:pointer; }
.copy-uid-btn:hover:not(:disabled),.copy-uid-btn:focus-visible{ border-color:var(--accent); color:var(--accent); }
.copy-uid-btn:focus-visible{ outline:2px solid var(--accent); outline-offset:2px; }
.copy-uid-btn:disabled{ opacity:.4; cursor:not-allowed; }
.copy-uid-btn.copied{ border-color:var(--accent); color:var(--accent); }

/* utility */
.flex{ display:flex; }
.between{ justify-content:space-between; }
.center{ align-items:center; }
.gap-8{ gap:8px; } .gap-12{ gap:12px; } .gap-16{ gap:16px; }
.muted{ color:var(--text-secondary); }
.small{ font-size:13px; }
.mt-0{margin-top:0;} .mb-0{margin-bottom:0;}

.nav-toggle-input{ display:none; }
.nav-toggle{ display:none; }

@media (max-width:720px){
  .steps{ grid-template-columns:repeat(2,1fr); }
  .hero{ padding:64px 20px 88px; }
  .nav-row{ position:relative; }

  .nav-toggle{ display:flex; flex-direction:column; justify-content:center; gap:5px; width:32px; height:32px; cursor:pointer; }
  .nav-toggle span{ display:block; height:2px; width:100%; background:var(--text-primary); border-radius:2px; transition:transform .15s ease, opacity .15s ease; }
  .nav-toggle-input:checked ~ .nav-toggle span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
  .nav-toggle-input:checked ~ .nav-toggle span:nth-child(2){ opacity:0; }
  .nav-toggle-input:checked ~ .nav-toggle span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

  .nav-links{
    display:none;
    position:absolute; top:100%; left:0; right:0; z-index:20;
    flex-direction:column; align-items:center; gap:18px;
    background:var(--surface); border-bottom:1px solid var(--border);
    padding:24px 20px; box-shadow:0 16px 32px -12px rgba(0,0,0,.5);
  }
  .nav-toggle-input:checked ~ .nav-links{ display:flex; }
  .nav-links .nav-account{ margin-left:0; padding-left:0; border-left:0; }
  .nav-links .nav-cta{ width:100%; text-align:center; order:99; }
}
.rating-verification-card{margin-top:18px;text-align:left}.rating-verification-card h2{font-size:20px;margin:10px 0}.rating-verification-card p{font-size:14px;line-height:1.65;margin:0 0 18px}.rating-upload{display:flex;align-items:center;gap:14px;padding:18px;border:1px dashed #465264;border-radius:10px;background:#111820;cursor:pointer;transition:border-color .2s,background .2s}.rating-upload:hover{border-color:var(--accent);background:rgba(42,230,126,.05)}.rating-upload svg{width:28px;height:28px;fill:none;stroke:var(--accent);stroke-width:1.8}.rating-upload span{display:flex;flex-direction:column;gap:4px}.rating-upload small{color:var(--text-secondary)}#rating-scan-status{min-height:20px;margin-top:12px}.rating-error{color:var(--danger)}.rating-value{color:var(--text-primary);margin-right:10px}.verified-badge{display:inline-flex;padding:4px 8px;border-radius:5px;background:rgba(42,230,126,.12);color:var(--accent);font-family:'JetBrains Mono',monospace;font-size:11px;text-transform:uppercase;letter-spacing:.08em}.rating-entry-status{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:14px;padding:12px 14px;border-radius:7px;font-size:13px}.rating-entry-status.is-verified{background:rgba(42,230,126,.09);color:var(--text-primary)}.rating-entry-status.is-missing{background:rgba(255,176,56,.09);color:#ffd08a}.rating-entry-status a{white-space:nowrap;font-weight:700}