@import url('https://fonts.googleapis.com/css2?family=Barlow+Condensed:wght@600;700;800;900&family=DM+Sans:wght@400;500;600;700&display=swap');
:root{--bg:#101512;--panel:#1a211c;--lime:#d4f86b;--muted:#8c998e;--orange:#f49165}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:#f4f6ed;font-family:'DM Sans',sans-serif}button,select,input{font:inherit}button{cursor:pointer;color:inherit}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:2px solid var(--lime);outline-offset:4px}header{height:88px;border-bottom:1px solid #2c342c;display:flex;align-items:center;justify-content:space-between;padding:0 5%}.brand{color:#fff;text-decoration:none;display:flex;gap:12px;align-items:center}.brand img{width:53px;height:43px;object-fit:cover}.brand b{font-size:20px;letter-spacing:1px}.brand span{display:block;font-size:8px;letter-spacing:2px;color:var(--muted);margin-top:3px}.edition{font-size:10px;letter-spacing:2px;color:var(--muted)}header button,#controls,#fullscreen{background:none;border:1px solid #3b453d;border-radius:5px;padding:10px 15px;font-size:12px}main{max-width:1480px;margin:auto;padding:37px 5% 0}.titlebar{display:flex;justify-content:space-between;align-items:center;margin-bottom:26px}.eyebrow{font-size:10px;letter-spacing:2px;color:var(--muted)}i.lime,.eyebrow i,.tablefooter i{display:inline-block;background:var(--lime);width:7px;height:7px;border-radius:50%;margin-right:8px}h1{font-family:'Barlow Condensed',Impact,sans-serif;font-size:64px;line-height:1;margin:11px 0 0;letter-spacing:-1px}h1 span{color:var(--lime);margin-left:12px}.titlebar p{font-size:12px;color:var(--muted);line-height:1.7}.arena{border:1px solid #424d40;border-radius:12px;overflow:hidden;box-shadow:0 25px 60px #0005}.scorebar{height:86px;background:#1e261f;display:flex;align-items:center;justify-content:center;gap:40px;position:relative}.team{display:flex;gap:15px;align-items:center;font-size:10px;letter-spacing:1px}.team b{font:700 46px 'Barlow Condensed',sans-serif;color:var(--lime)}.team.away b{color:var(--orange)}i.orange{background:var(--orange);width:7px;height:7px;border-radius:50%}.match{text-align:center;display:flex;flex-direction:column;gap:3px}.match span{font-size:8px;letter-spacing:2px;color:var(--muted)}.match strong{font-size:15px}.match small{font-size:8px;letter-spacing:1px;color:var(--muted)}#pause{position:absolute;right:20px;background:none;border:1px solid #465044;border-radius:5px;padding:9px 12px}.tablewrap{position:relative;background:#152e23}canvas{display:block;width:100%;aspect-ratio:2/1}.overlay{position:absolute;inset:0;background:linear-gradient(90deg,#101b14ed,#101b14db);display:flex;align-items:center;justify-content:center;backdrop-filter:blur(5px)}.hidden{display:none!important}.menucontent{width:82%;max-width:890px}.tag{font-size:9px;letter-spacing:2px;color:var(--lime)}h2{font:800 clamp(30px,4.5vw,65px)/.98 'Barlow Condensed',Impact,sans-serif;margin:15px 0}h2 em{font-style:normal;color:var(--lime)}.menucontent>p{color:#a4b2a7;font-size:12px;margin:15px 0 22px}.modes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.mode{text-align:left;padding:17px;background:#263128aa;border:1px solid #4b594a;border-radius:7px;transition:.2s}.mode:hover{transform:translateY(-3px);border-color:var(--lime)}.mode.active{background:#d4f86b;color:#172015;border-color:var(--lime)}.mode span{font-size:8px;letter-spacing:1px}.mode b{font-size:19px;display:block;margin:13px 0 9px}.mode small{font-size:10px;opacity:.7}.launch{display:flex;justify-content:space-between;align-items:center;margin-top:18px}.launch label{font-size:9px;letter-spacing:1px;color:var(--muted)}select{margin-left:10px;color:#f2f7eb;background:#263128;border:1px solid #4c594a;padding:8px;border-radius:4px}.primary{border:0;border-radius:5px;padding:13px 25px;background:var(--lime);color:#1b2416;font-size:12px;font-weight:800;letter-spacing:1px}.primary span{margin-left:35px}.tablefooter{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;background:#1b231c;font-size:8px;letter-spacing:1px;color:#a5b19e}.tablefooter i{width:5px;height:5px}.tablefooter #fullscreen{border:0;padding:0;font-size:10px}.bottom{display:flex;justify-content:space-between;align-items:center;padding:23px 0}.bottom>div{display:flex;align-items:center;gap:5px}.key{display:inline-flex;align-items:center;justify-content:center;border:1px solid #455044;border-bottom:3px solid #455044;border-radius:5px;width:29px;height:29px;font-size:12px;color:#c1cbb8}.bottom p{font-size:8px;letter-spacing:1px;color:var(--muted);margin:0 14px 0 8px}footer{border-top:1px solid #2e372e;padding:20px 0;display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.2px;color:#7e8a7d}footer i{color:var(--lime);font-size:15px;margin:0 10px}.dialog{width:540px;max-width:90%;background:#1d291f;border:1px solid #5a6b4e;border-radius:12px;padding:30px;box-shadow:0 20px 70px #0008}.dialog h2{font-size:40px}.dialog p{font-size:13px;line-height:1.7;color:#bdc8b8}.dialog button{margin:6px 8px 0 0;padding:10px 18px;border-radius:5px;border:1px solid #53634b;background:#2c3b2c}.dialog button.primary{background:var(--lime);color:#192211}.dialog input{width:100%;background:#101b13;color:white;border:1px solid #6d805d;border-radius:5px;padding:12px;margin:7px 0}.roomcode{color:var(--lime);font-size:22px;letter-spacing:3px;user-select:all}#toast{position:absolute;top:20%;left:50%;transform:translateX(-50%);font:800 45px 'Barlow Condensed',sans-serif;color:var(--lime);text-shadow:0 3px 20px #000;pointer-events:none;white-space:nowrap}@media(max-width:800px){header{height:68px}.edition{display:none}main{padding:25px 3% 0}h1{font-size:44px}.titlebar p{display:none}.scorebar{gap:18px;height:68px}.team{gap:7px;font-size:8px}.team b{font-size:32px}#pause{right:7px;padding:6px}.tablewrap{min-height:440px}canvas{height:440px;object-fit:contain}.menucontent{width:90%}h2{font-size:42px}.mode{padding:12px 8px}.mode b{font-size:14px}.mode small{display:none}.bottom{flex-wrap:wrap;gap:15px}.bottom p{font-size:7px}.key{width:24px;height:25px}footer span:first-child{display:none}.tablefooter>span:nth-child(2){display:none}}
#toast.away-goal{color:var(--orange)}
