@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800;900&display=swap');
:root{--bg:#0a0d12;--line:#252e3a;--text:#f3f6fb;--muted:#929eae;--accent:#a7f36b;--accent2:#d0ffab}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(ellipse at 75% 0%,#1b2a1d 0,transparent 32%),var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif}a{color:inherit;text-decoration:none}header{height:78px;display:flex;align-items:center;justify-content:space-between;padding:0 max(6vw,22px);border-bottom:1px solid #ffffff0d}nav{display:flex;gap:28px;align-items:center;color:var(--muted);font-size:13px}nav a:hover{color:var(--text)}.brand{font-size:17px;font-weight:900;letter-spacing:1.5px}.brand span{color:var(--accent)}main{max-width:1120px;margin:auto;padding:0 24px}.hero{padding:100px 0 88px;max-width:730px}.eyebrow{font-size:10px;letter-spacing:2.6px;color:var(--accent);font-weight:800}.hero h1{font-size:clamp(50px,8vw,92px);line-height:.98;letter-spacing:-5px;margin:25px 0}.hero h1 span{color:var(--accent)}.hero p{color:#a9b4c2;line-height:1.8;max-width:510px;font-size:16px}.button{display:inline-flex;align-items:center;gap:35px;background:var(--accent);color:#0a1106;padding:17px 21px;font-weight:800;border-radius:7px;margin-top:20px;font-size:13px}.button:hover{background:var(--accent2)}.fine{font-size:11px!important;color:#758191!important;margin-top:14px}.panel{background:linear-gradient(120deg,#151d25,#10151d);border:1px solid var(--line);border-radius:14px;padding:26px;margin:20px 0 70px}.hidden{display:none!important}.section-title{display:flex;justify-content:space-between;align-items:end;gap:20px;margin:60px 0 22px}.panel .section-title{margin:0 0 24px}.section-title h2{font-size:28px;letter-spacing:-1px;margin:9px 0 0}.tabs{display:flex;gap:6px;background:#121821;padding:5px;border:1px solid var(--line);border-radius:8px}.tab,.ghost{background:transparent;border:0;color:var(--muted);padding:10px 13px;border-radius:5px;cursor:pointer;font:inherit;font-size:12px}.tab.active{background:var(--accent);color:#0a1106;font-weight:800}.pill{font-size:9px;letter-spacing:1px;border:1px solid #3d5b35;color:var(--accent);padding:8px 10px;border-radius:5px}.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:12px}.stat{padding:18px;border:1px solid var(--line);border-radius:8px}.stat small{display:block;color:var(--muted);font-size:11px;margin-bottom:9px}.stat strong{font-size:20px}.table-wrap{overflow-x:auto;border:1px solid var(--line);border-radius:10px}table{width:100%;border-collapse:collapse;text-align:left;min-width:600px}th{font-size:10px;letter-spacing:1px;color:#7e8a99;text-transform:uppercase;background:#10151c}td,th{padding:17px 20px;border-bottom:1px solid #222b35}td{font-size:13px}tbody tr:last-child td{border-bottom:0}tbody tr:hover{background:#ffffff04}.player{display:flex;align-items:center;gap:11px}.avatar{width:31px;height:31px;border-radius:6px;background:#26313e;object-fit:cover}.rating{color:var(--accent);font-weight:800}.features{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:75px 0 35px}.features article{padding:24px;border:1px solid var(--line);border-radius:10px;background:#0e131a}.feature-icon{color:var(--accent);font-weight:900;font-size:12px;letter-spacing:2px}.features h3{font-size:15px;margin:25px 0 10px}.features p,.notice p{color:var(--muted);font-size:12px;line-height:1.8}.notice{border:1px solid #66552b;background:#201c13;border-radius:9px;padding:20px;margin:35px 0 70px;font-size:13px}.notice strong{color:#f5d58c}.notice p{margin-bottom:0}footer{display:flex;justify-content:space-between;padding:25px max(6vw,22px);border-top:1px solid #ffffff0d;color:#697585;font-size:10px;letter-spacing:1px}@media(max-width:650px){header{height:65px}nav{gap:12px}nav a{display:none}.hero{padding:70px 0}.hero h1{letter-spacing:-3px}.section-title{align-items:flex-start;flex-direction:column}.features{grid-template-columns:1fr}.stats{grid-template-columns:1fr 1fr}footer{gap:12px;flex-direction:column}}
.settings{border-top:1px solid var(--line);margin-top:25px;padding-top:20px}.settings h3{font-size:15px;margin:0 0 16px}.settings form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px;align-items:end}.settings label{display:flex;flex-direction:column;gap:8px;color:var(--muted);font-size:11px}.settings input{width:100%;padding:12px;border:1px solid var(--line);border-radius:6px;background:#0b1016;color:var(--text);font:inherit}.settings .button{margin:0;justify-content:center;border:0;cursor:pointer}.settings #profileMessage{align-self:center}.calibration{height:4px;background:#26313e;border-radius:10px;overflow:hidden;margin:12px 0 8px}.calibration span{display:block;height:100%;background:var(--accent);transition:width .2s}.player-row{cursor:pointer}.player-row:focus{outline:1px solid var(--accent);outline-offset:-2px}.match-list{display:grid;gap:8px}.match-row{display:flex;gap:16px;align-items:center;flex-wrap:wrap;border:1px solid var(--line);padding:12px;border-radius:6px;font-size:12px}.match-row span,.match-row small{color:var(--muted)}@media(max-width:650px){.settings form{grid-template-columns:1fr}}
/* Theme and dedicated profile settings page */
:root{color-scheme:dark}
body[data-theme="light"]{--bg:#f4f6f8;--line:#d7dde5;--text:#17202b;--muted:#5e6a79;--accent:#4d8b21;--accent2:#72b83e;background:radial-gradient(ellipse at 75% 0%,#e2f0dc 0,transparent 32%),var(--bg);color:var(--text);color-scheme:light}
body[data-theme="light"] .panel{background:linear-gradient(120deg,#fff,#f8fafc)}body[data-theme="light"] .features article,body[data-theme="light"] .tabs,body[data-theme="light"] th{background:#edf1f5}body[data-theme="light"] td,body[data-theme="light"] th{border-bottom-color:#d7dde5}body[data-theme="light"] .settings input,body[data-theme="light"] .settings-form input{background:#fff;color:var(--text)}body[data-theme="light"] .hero p{color:#536171}body[data-theme="light"] .notice{background:#fff8e8}body[data-theme="light"] .tab.active{color:#fff}
.profile-page{max-width:800px;margin:55px auto 80px}.profile-page>h1{font-size:clamp(36px,6vw,58px);letter-spacing:-2px;margin:15px 0}.profile-page>.muted{color:var(--muted);margin-bottom:30px}.profile-page .panel{margin:22px 0;padding:26px}.profile-page .section-title{margin:0 0 24px}.settings-form{display:grid;gap:15px}.settings-form label{display:grid;gap:8px;color:var(--muted);font-size:12px}.settings-form input{width:100%;padding:13px;border:1px solid var(--line);border-radius:6px;background:#0b1016;color:var(--text);font:inherit}.settings-form .button{width:max-content;margin:0;border:0;cursor:pointer}.appearance-row{display:flex;align-items:center;justify-content:space-between;padding:15px 0;border-bottom:1px solid var(--line);font-size:13px}.appearance-row .ghost{border:1px solid var(--line)}
