.account-gate{min-height:100svh;display:grid;place-content:center;text-align:center;padding:32px;gap:24px;background:radial-gradient(ellipse at top,var(--pitch),var(--bg))}.account-gate h1{font-size:clamp(30px,6vw,60px);max-width:800px}.account-gate .experience{justify-content:center}.account-gate .ball{margin:auto;width:64px;height:64px}.account-gate p{max-width:650px}.account-gate .top-actions{justify-content:center}
:root[data-theme=night]{--bg:#08111e;--pitch:#14283e;--pitch-2:#102237;--surface:#101f32;--surface-2:#1a3048;--accent:#9fe8ed;--accent-ink:#092930;--muted:#a4bed0;--line:#2a4359;--chalk:#779ab844}
[data-theme=night] .hero{background:radial-gradient(ellipse at 10% 0%,#c4e9ff44,transparent 45%),radial-gradient(ellipse at 90% 0%,#c4e9ff44,transparent 45%),var(--pitch)}[data-theme=night] .hero::before{border-radius:50% 50% 8px 8px}[data-theme=night] .ticket{border-radius:22px;box-shadow:0 8px 22px #050e1a80}[data-theme=night] .perf{border:0;height:2px;background:var(--accent)}
:root[data-theme=royal]{--bg:#181425;--pitch:#2c2344;--pitch-2:#382b52;--surface:#261f39;--surface-2:#332947;--accent:#e2c58c;--accent-ink:#29200d;--muted:#c0b4d0;--line:#50405f;--chalk:#e2c58c44}
[data-theme=royal] .hero{background:linear-gradient(135deg,var(--pitch),var(--bg))}[data-theme=royal] h1,[data-theme=royal] h2{font-style:normal;letter-spacing:.03em}[data-theme=royal] .ticket{border:1px solid var(--accent);border-radius:50px 50px 5px 5px}[data-theme=royal] .board{border:double 5px var(--accent);box-shadow:none}[data-theme=royal] .hero::after{border:double 8px var(--chalk)}
:root[data-theme=derby]{--bg:#200e10;--pitch:#711d27;--pitch-2:#942637;--surface:#34151c;--surface-2:#4a2028;--accent:#ffe4cc;--accent-ink:#51131c;--muted:#d0a8ae;--line:#64303a;--chalk:#ffcabb44}
[data-theme=derby] .hero{background:repeating-linear-gradient(115deg,var(--pitch) 0 90px,var(--pitch-2) 90px 180px)}[data-theme=derby] .ticket{border-radius:0;border-left:7px solid var(--accent)}[data-theme=derby] .board{transform:rotate(-2deg)}[data-theme=derby] .btn{border-radius:0}[data-theme=derby] .section-head{border-left:6px solid var(--accent);padding-left:18px}
:root[data-theme=azzurri]{--bg:#f1f5f8;--pitch:#1755a0;--pitch-2:#2368b8;--surface:#fff;--surface-2:#e1eaf4;--fg:#152e48;--muted:#45627d;--accent:#1755a0;--accent-ink:#fff;--line:#bccddd;--chalk:#8aa4bf77;color-scheme:light}
[data-theme=azzurri] .hero{color:#fff}[data-theme=azzurri] .hero .eyebrow{color:#ffe1a5}[data-theme=azzurri] .hero .eyebrow:before{background:#ffe1a5}[data-theme=azzurri] .hero .btn-ghost{color:#fff;border-color:#ffffff77}[data-theme=azzurri] .hero .btn-primary{background:#fff;color:#1755a0}[data-theme=azzurri] .ticket{border-radius:16px;border-top:6px solid var(--accent)}[data-theme=azzurri] .board{background:#fff;border-color:#b6cce8;color:var(--fg);box-shadow:0 10px 0 #063871}[data-theme=azzurri] .digits span{background:#e1eaf4;text-shadow:none}[data-theme=azzurri] .hero .wrap{grid-template-columns:1fr 1fr}
:root[data-theme=samba]{--bg:#0d2923;--pitch:#1f6440;--pitch-2:#327b42;--surface:#173c2c;--surface-2:#224f38;--accent:#f2d64a;--accent-ink:#193b29;--muted:#b2d0b0;--line:#3e6543;--chalk:#f2d64a55}
[data-theme=samba] .hero{background:conic-gradient(from 45deg at 70% 50%,var(--pitch) 0 25%,var(--pitch-2) 0 50%,var(--pitch) 0 75%,var(--pitch-2) 0)}[data-theme=samba] .hero::after{background:#173861aa;border:12px solid var(--chalk)}[data-theme=samba] .ticket{border-radius:28px 4px 28px 4px}[data-theme=samba] .btn{border-radius:40px}[data-theme=samba] .section-head h2{color:var(--accent)}
:root[data-theme=classic]{--bg:#f0e8d6;--pitch:#3b5949;--pitch-2:#496b55;--surface:#faf4e7;--surface-2:#e6dbc6;--fg:#2a392e;--muted:#596653;--accent:#83442d;--accent-ink:#fff6e6;--line:#b7b49d;--chalk:#b6bba788;--display:Georgia,serif;color-scheme:light}
[data-theme=classic] .hero{color:#fff4d9;background:var(--pitch)}[data-theme=classic] .hero .eyebrow{color:#f0dba8}[data-theme=classic] h1,[data-theme=classic] h2{font-style:normal;text-transform:none}[data-theme=classic] .ticket{border:double 4px var(--line);border-radius:0;box-shadow:5px 5px 0 var(--surface-2)}[data-theme=classic] .board{background:#243a2e;border:4px solid #b09e72;color:#fff4d9}[data-theme=classic] .board .muted,[data-theme=classic] .board-top{color:#c3d4b7}[data-theme=classic] .digits span{color:#f0dba8;text-shadow:none}[data-theme=classic] .btn{border-radius:0}
:root[data-theme=tactics]{--bg:#112d2b;--pitch:#1b423d;--pitch-2:#234b44;--surface:#163632;--surface-2:#23463e;--accent:#e1e8cb;--accent-ink:#213a30;--muted:#a4c0af;--line:#4c7060;--chalk:#a9c9b455;--display:'Courier New',monospace}
[data-theme=tactics] .hero{background:linear-gradient(#d2ecda11 1px,transparent 1px),linear-gradient(90deg,#d2ecda11 1px,transparent 1px),var(--pitch);background-size:32px 32px}[data-theme=tactics] .ticket{border:2px dashed var(--chalk);border-radius:0}[data-theme=tactics] .board{box-shadow:none;background:transparent;border:2px dashed var(--accent)}[data-theme=tactics] h1{font-size:clamp(36px,6vw,65px)}[data-theme=tactics] .btn{border-radius:2px}[data-theme=tactics] .hero::after{border-style:dashed}
:root[data-theme=terrace]{--bg:#171b20;--pitch:#283b41;--pitch-2:#334e56;--surface:#252c32;--surface-2:#343d45;--accent:#e2a366;--accent-ink:#301d0c;--muted:#bac3c8;--line:#505c63;--chalk:#c2c9ce55}
[data-theme=terrace] .hero{background:repeating-linear-gradient(0deg,var(--pitch) 0 28px,var(--pitch-2) 28px 32px)}[data-theme=terrace] .hero .wrap{grid-template-columns:1fr;text-align:center}[data-theme=terrace] .hero .lead{margin-inline:auto}[data-theme=terrace] .hero .actions,[data-theme=terrace] .chips{justify-content:center}[data-theme=terrace] .board{max-width:500px;width:100%;margin:auto;box-shadow:10px 10px 0 #101519}[data-theme=terrace] .ticket{border-radius:2px;border-bottom:8px solid var(--accent)}
:root[data-theme=final]{--bg:#181a18;--pitch:#35382c;--pitch-2:#424634;--surface:#242821;--surface-2:#353b2e;--accent:#d8bd75;--accent-ink:#2a2416;--muted:#b9bea7;--line:#535b41;--chalk:#d8bd7555}
[data-theme=final] .hero{background:radial-gradient(ellipse at top,#d8bd7540,transparent 65%),var(--bg)}[data-theme=final] .hero::before{border:1px solid var(--accent);inset:15px}[data-theme=final] .hero::after{border:double 8px var(--chalk);width:220px;height:220px;transform:translateY(40px)}[data-theme=final] .hero .wrap{grid-template-columns:1fr 1.25fr}[data-theme=final] .board{order:-1;background:var(--surface);border-radius:60px 60px 8px 8px;border:2px solid var(--accent);padding-top:40px;box-shadow:none}[data-theme=final] .ticket{border:0;border-top:2px solid var(--accent);border-bottom:2px solid var(--accent);border-radius:0}[data-theme=final] .btn-primary{background:linear-gradient(110deg,#b79a53,#f0dfaa,#b79a53)}
@media(max-width:700px){[data-theme] .hero .wrap{grid-template-columns:1fr}[data-theme=final] .board{order:0}.account-gate{padding:20px}.preference-status{flex-basis:100%}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* Til va dizayn — sayt pastida */
.experience{display:flex;align-items:flex-end;gap:14px 22px;flex-wrap:wrap}
.pref{display:grid;gap:6px;min-width:0}
.pref-label{font:700 12px/1 var(--display);letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.pref-btn,.select-wrap{position:relative;display:inline-flex;align-items:center;gap:10px;min-height:44px;padding:0 14px;border:1.5px solid var(--line);border-radius:10px;background:var(--surface);color:var(--fg);cursor:pointer;font:600 15px/1 var(--body);transition:border-color .15s ease}
.pref-btn:hover,.select-wrap:hover,.lang-menu[open] .pref-btn{border-color:var(--accent)}
.pref-btn .chev,.select-wrap .chev{width:16px;height:16px;color:var(--accent);transition:transform .2s ease}
.lang-menu{position:relative}
.lang-menu > summary{list-style:none}
.lang-menu > summary::-webkit-details-marker{display:none}
.lang-menu[open] .pref-btn .chev{transform:rotate(180deg)}
.flag{font-size:18px;line-height:1}
.lang-list{position:absolute;bottom:calc(100% + 8px);left:0;z-index:20;min-width:200px;display:grid;gap:2px;padding:6px;background:var(--surface);border:1.5px solid var(--accent);border-radius:12px;box-shadow:0 18px 40px rgba(0,0,0,.45);animation:langIn .16s ease}
@keyframes langIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.lang-list button{display:flex;align-items:center;gap:10px;width:100%;padding:11px 12px;border:0;border-radius:8px;background:transparent;color:var(--fg);font:600 15px/1 var(--body);cursor:pointer;text-align:left}
.lang-list button:hover{background:var(--surface-2)}
.lang-list button[aria-checked=true]{background:var(--accent);color:var(--accent-ink)}
.lang-list .tick{margin-left:auto;font-weight:800}
.select-wrap{padding-right:38px}
.select-wrap select{appearance:none;-webkit-appearance:none;background:transparent;border:0;color:inherit;font:inherit;padding:0;cursor:pointer;max-width:220px;outline:none}
.select-wrap select option{background:var(--surface);color:var(--fg)}
.select-wrap .chev{position:absolute;right:12px;pointer-events:none}
.account-gate .experience{justify-content:center}
.account-gate .lang-list{bottom:auto;top:calc(100% + 8px)}
@media (max-width:600px){.experience{gap:12px}.pref{flex:1 1 150px}.pref-btn,.select-wrap{width:100%;min-height:42px;font-size:14px}.select-wrap select{max-width:none;width:100%}}
details.lang-menu{border:0;padding:0}
.lang-menu > summary.pref-btn{font:600 15px/1 var(--body);text-transform:none;letter-spacing:0;justify-content:flex-start}
.lang-menu > summary.pref-btn::after,details[open].lang-menu > summary.pref-btn::after{content:none;display:none}
.lang-menu > summary .chev{margin-left:auto}
@media (max-width:600px){.lang-menu > summary.pref-btn{font-size:14px}}

/* Real Madrid ranglari: oq, oltin, to'q siyoh */
:root[data-theme=madrid]{--bg:#f6f4ee;--pitch:#ffffff;--pitch-2:#f3eedf;--surface:#ffffff;--surface-2:#efe9d8;--fg:#1d1a3f;--muted:#5d5a78;--accent:#c39b2f;--accent-ink:#1d1a3f;--line:#ddd3ba;--chalk:#c39b2f66;--ok:#1d8a52;color-scheme:light}
[data-theme=madrid] .hero{background:repeating-linear-gradient(90deg,#ffffff 0 70px,#f7f2e4 70px 140px);color:var(--fg)}
[data-theme=madrid] .hero .lead{color:#3c3960}
[data-theme=madrid] .hero h1{color:#1d1a3f}
[data-theme=madrid] .hero .eyebrow{color:#a8801c}[data-theme=madrid] .hero .eyebrow:before{background:#a8801c}
[data-theme=madrid] .board{background:#1d1a3f;border-color:#c39b2f;color:#fff;box-shadow:0 18px 40px #1d1a3f33}
[data-theme=madrid] .board .board-label,[data-theme=madrid] .board .handle code{color:#fff}
[data-theme=madrid] .board-sub{color:#cfcbe8}[data-theme=madrid] .board-sub b{color:#fff}
[data-theme=madrid] .digits span{background:#2a2660;color:#e7c766;text-shadow:0 0 16px #e7c76655}
[data-theme=madrid] .copy{background:#2a2660;color:#fff}
[data-theme=madrid] .chip{background:#fff;color:var(--fg);border-color:#ddd3ba}
[data-theme=madrid] .ticket{border-top:4px solid #c39b2f;box-shadow:0 8px 24px #1d1a3f12}
[data-theme=madrid] .btn-ghost{color:var(--fg);border-color:#cfc4a6}
[data-theme=madrid] .topbar,[data-theme=madrid] footer{background:#1d1a3f;color:#fff}
[data-theme=madrid] .topbar .brand,[data-theme=madrid] footer .wrap{color:#fff}
[data-theme=madrid] .topbar .hello{color:#cfcbe8}[data-theme=madrid] .topbar .hello b{color:#fff}
[data-theme=madrid] footer .pref-label{color:#cfcbe8}

/* Barselona ranglari: ko'k va to'q qizil chiziqlar, sariq urg'u */
:root[data-theme=barca]{--bg:#0a1233;--pitch:#004d98;--pitch-2:#a50044;--surface:#111c4a;--surface-2:#1a2766;--fg:#f4f6ff;--muted:#b5bfe0;--accent:#edbb00;--accent-ink:#1a1200;--line:#2b3878;--chalk:#ffffff38}
[data-theme=barca] .hero{background:repeating-linear-gradient(90deg,#004d98 0 76px,#a50044 76px 152px)}
[data-theme=barca] .hero .lead{color:#e6e9ff}
[data-theme=barca] .board{background:#0a1233ee;border-color:#edbb00}
[data-theme=barca] .digits span{background:#1a2766;color:#edbb00}
[data-theme=barca] .ticket{border-color:#2b3878;border-left:6px solid #a50044;background:linear-gradient(180deg,#111c4a,#0e1740)}
[data-theme=barca] .ticket .app-badge{background:linear-gradient(135deg,#004d98 50%,#a50044 50%);color:#fff}
[data-theme=barca] .section-head h2{background:linear-gradient(90deg,#5d9be6,#ff5c93);-webkit-background-clip:text;background-clip:text;color:transparent}
[data-theme=barca] .steps li::before{background:#a50044}

/* Manchester Siti ranglari: osmon-ko'k, to'q ko'k, oq */
:root[data-theme=city]{--bg:#eef6fc;--pitch:#6cabdd;--pitch-2:#80b9e4;--surface:#ffffff;--surface-2:#e1eef9;--fg:#1c2c5b;--muted:#4b6488;--accent:#1c2c5b;--accent-ink:#ffffff;--line:#c4dcef;--chalk:#ffffff99;--ok:#1d8a52;color-scheme:light}
[data-theme=city] .hero{background:repeating-linear-gradient(90deg,#6cabdd 0 80px,#7cb6e2 80px 160px);color:#fff}
[data-theme=city] .hero .lead{color:#f2f8ff}
[data-theme=city] .hero .eyebrow{color:#1c2c5b}[data-theme=city] .hero .eyebrow:before{background:#1c2c5b}
[data-theme=city] .hero .btn-primary{background:#1c2c5b;color:#fff}
[data-theme=city] .hero .btn-ghost{color:#fff;border-color:#ffffffaa}
[data-theme=city] .board{background:#1c2c5b;border-color:#6cabdd;color:#fff}
[data-theme=city] .board-sub{color:#c9dcf2}[data-theme=city] .board-sub b,[data-theme=city] .board .handle code{color:#fff}
[data-theme=city] .digits span{background:#26396f;color:#9fd0f5;text-shadow:0 0 16px #6cabdd88}
[data-theme=city] .copy{background:#26396f;color:#fff}
[data-theme=city] .chip{background:#ffffffcc;color:#1c2c5b;border-color:#ffffff}
[data-theme=city] .ticket{border-radius:16px;border:1.5px solid #c4dcef;box-shadow:0 10px 24px #1c2c5b14}
[data-theme=city] .ticket .bonus strong{color:#1c2c5b}
[data-theme=city] .ticket .app-badge{background:#6cabdd;color:#fff}
[data-theme=city] .btn-ghost{color:var(--fg);border-color:#a9c9e6}
[data-theme=city] .topbar{background:#1c2c5b}[data-theme=city] .topbar .brand{color:#fff}
[data-theme=city] .topbar .hello{color:#c9dcf2}[data-theme=city] .topbar .hello b{color:#fff}
[data-theme=city] footer{background:#1c2c5b;color:#fff}[data-theme=city] footer .wrap{color:#d7e6f6}[data-theme=city] footer .pref-label{color:#a9c4e2}
[data-theme=madrid] .board-top,[data-theme=city] .board-top{color:#c9cbe6}
[data-theme=city] .board-top{color:#b9d3ee}