
:root{color-scheme:light;--lime:#227154;--ink:#183e36;--muted:#687a72;--green:#227154;--line:#e2e8df;--paper:#f6f7f1}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font-family:Inter,"Segoe UI",Arial,sans-serif}button,input,select{font:inherit}button,a{ -webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #ed9f39;outline-offset:4px}.shell,main{max-width:1240px;margin:auto;padding:0 40px}.review{background:#e7eddf;text-align:center;padding:9px 16px;font-size:11px;color:#4b6054;letter-spacing:.5px}header{height:94px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:13px;font-size:24px;font-weight:850;letter-spacing:-1px}.brand img{width:39px;height:44px;object-fit:contain}.brand small{display:block;font-size:10px;font-weight:600;color:var(--muted);letter-spacing:2px;margin-top:3px}nav{display:flex;align-items:center;gap:30px;font-size:13px;font-weight:650}.pill{display:inline-flex;align-items:center;gap:8px;border:1px solid #d5e2d3;border-radius:30px;padding:9px 13px;font-size:11px;background:#edf3e8}.dot{width:6px;height:6px;border-radius:50%;background:var(--green)}.hero{display:grid;grid-template-columns:1fr 1fr;gap:38px;align-items:center;padding:48px 0 42px}.eyebrow{font-size:11px;font-weight:750;letter-spacing:2px;text-transform:uppercase;color:var(--green)}h1{font-size:clamp(54px,6vw,82px);line-height:1.02;letter-spacing:-5px;margin:20px 0;font-weight:800}h1 em{font-style:normal;color:var(--green)}.intro{max-width:380px;color:var(--muted);font-size:15px;line-height:1.8}.actions{display:flex;gap:24px;align-items:center;margin:26px 0 18px}.primary{background:var(--green);border:0;border-radius:12px;color:#fff;padding:18px 29px;font-size:15px;font-weight:750;box-shadow:0 5px 0 #18553f}.primary:hover{background:#185c42}.primary span{margin-left:32px}.text-link{font-size:12px;font-weight:650}.micro{font-size:11px;color:var(--muted)}.hero-art{position:relative;background:#e4edda;border:1px solid #dce5d3;border-radius:28px;overflow:hidden;min-height:350px}.art-label{position:absolute;left:24px;top:22px;font-size:10px;letter-spacing:2px;font-weight:700}.hero-art svg{display:block;width:100%;height:350px}.art-bottom{position:absolute;bottom:20px;left:24px;right:24px;display:flex;justify-content:space-between;align-items:center;font-size:10px;letter-spacing:1px}.art-bottom b{background:#fff9;padding:9px 13px;border-radius:20px}.content{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:24px;align-items:start}.card{background:white;border:1px solid var(--line);border-radius:20px;padding:27px}.card-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}h2{font-size:24px;letter-spacing:-.8px;margin:7px 0 0}.subtle{font-size:11px;color:var(--muted)}table{width:100%;border-collapse:collapse;font-size:13px}th{font-size:10px;letter-spacing:1px;color:var(--muted);text-align:left;font-weight:600;padding:0 10px 13px}td{padding:13px 10px;border-top:1px solid #edf0e9}td:last-child,th:last-child{text-align:right}td:last-child{font-weight:750;font-variant-numeric:tabular-nums}.rank{color:#819087;width:40px}.first{background:#f3f7ed}.first .rank{color:#a27726;font-weight:800}.player{display:flex;align-items:center;gap:12px;font-weight:650}.face{width:39px;height:39px;border-radius:13px;overflow:hidden;display:block;flex-shrink:0}.face svg{width:100%;height:100%}.goals{color:var(--muted);white-space:nowrap}.table-note{font-size:11px;color:var(--muted);margin:18px 0 0}.how{background:#edf2e7}.how h2{font-size:21px;margin-bottom:24px}.step{display:flex;gap:13px;margin:23px 0}.number{width:27px;height:27px;display:grid;place-items:center;border:1px solid #cedac5;border-radius:9px;font-size:11px;flex-shrink:0}.step b{font-size:12px}.step p{font-size:11px;color:var(--muted);line-height:1.6;margin:5px 0 0}.bonus{border-top:1px solid #d5dfcc;padding-top:18px;font-size:11px;line-height:1.7;color:#577049}footer{display:flex;justify-content:space-between;padding:25px 0 30px;font-size:10px;color:var(--muted)}dialog{width:min(650px,calc(100% - 28px));max-height:90dvh;overflow:auto;border:1px solid var(--line);border-radius:24px;padding:30px;color:var(--ink);background:var(--paper)}dialog::backdrop{background:#183e3655;backdrop-filter:blur(5px)}.dialog-heading{display:flex;justify-content:space-between;align-items:start}.close{border:1px solid var(--line);background:white;border-radius:50%;width:34px;height:34px}.builder{display:grid;grid-template-columns:170px 1fr;gap:25px;margin:25px 0}.preview{width:160px;height:180px;border-radius:24px;display:grid;place-items:center}.preview svg{width:150px;height:150px}.fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}label{display:grid;gap:7px;font-size:11px;font-weight:650}.wide{grid-column:1/-1}input,select{width:100%;min-width:0;padding:11px;border:1px solid #cfdbce;border-radius:9px;background:white;color:var(--ink)}input[type=color]{height:41px;padding:4px}.shuffle{border:1px solid #cfdbce;border-radius:9px;background:white;padding:10px;margin-top:12px;width:160px;font-size:11px}.dialog-footer{display:flex;justify-content:space-between;gap:15px;align-items:center}.dialog-footer p{font-size:11px;color:var(--muted);line-height:1.5;max-width:225px}@media(max-width:800px){.shell{padding:0 20px}header{height:80px}nav .pill{display:none}.hero{grid-template-columns:1fr;gap:24px;padding:30px 0}h1{letter-spacing:-3px;font-size:60px}.intro{max-width:100%}.hero-art{min-height:280px}.hero-art svg{height:280px}.content{grid-template-columns:1fr}.card{padding:20px}footer{gap:15px}.builder{grid-template-columns:1fr}.preview{margin:auto}.shuffle{display:block;margin:12px auto}.dialog-footer{align-items:stretch;flex-direction:column}dialog{padding:22px}nav{gap:15px}.actions{gap:18px}}
.hero>*,.content>*{min-width:0}.hero-art svg{max-width:100%}@media(max-width:800px){h1{font-size:48px;letter-spacing:-2.5px}.review{line-height:1.5}.art-bottom{font-size:8px;left:16px;right:16px}td,th{padding-left:5px;padding-right:5px}.player{gap:8px}.card-heading .pill{padding:7px 10px}}

[hidden]{display:none!important}main{max-width:1240px;margin:auto;padding:0 40px}body>main>header{margin-bottom:0}.hero>*,.content>*{min-width:0}.game{margin:32px 0 24px;border:1px solid var(--line);border-radius:20px;overflow:hidden;background:white;box-shadow:0 10px 40px #183e3608}.scoreboard{height:84px;display:flex;align-items:center;justify-content:space-between;padding:0 28px;border-bottom:1px solid var(--line)}.team{display:flex;align-items:center;gap:13px}.team>b{display:grid;place-items:center;border:1px solid #cfdbce;background:#edf2e7;border-radius:10px;width:42px;height:44px;font-size:11px}.team>div{font-size:9px;letter-spacing:1px;color:var(--muted)}.team strong{display:block;color:var(--ink);font-size:26px;letter-spacing:0;margin-top:3px}.team small{font-size:10px;color:var(--muted);font-weight:400}#attempts{display:flex;gap:9px}.attempt{display:grid;place-items:center;width:29px;height:29px;border:1px solid #cddacd;border-radius:50%;font-size:11px;color:var(--muted)}.attempt.current{border:2px solid var(--green);color:var(--green)}.attempt.goal{background:var(--green);color:white;border-color:var(--green)}.attempt.miss{background:#fce9e4;color:#a93f35;border-color:#ecc7bc}#restart{background:none;border:0;color:var(--green);font-size:23px}#restart small{font-size:11px;vertical-align:middle}.game>.power{margin:14px auto;width:60%;max-width:470px;padding:10px 14px;background:#f2f5ed;border:1px solid var(--line);border-radius:10px;pointer-events:none}.power>div:first-child{display:flex;justify-content:space-between;font-size:10px;letter-spacing:1px;margin-bottom:8px;color:var(--muted)}.power b{color:var(--green)}.track{height:14px;border-radius:5px;background:#dce5d5;overflow:hidden;position:relative}.red-zone{position:absolute;inset:0 0 0 85%;background:#e9a396;border-left:2px solid #bd554c;z-index:2}#fill{position:relative;z-index:1;height:100%;width:0;background:var(--green)}.field{position:relative;aspect-ratio:1100/520;overflow:hidden;touch-action:none}canvas{display:block;width:100%;height:100%;cursor:crosshair}.venue{position:absolute;top:19px;left:24px;font-size:8px;letter-spacing:1.6px;color:#264c3c;pointer-events:none}#message{position:absolute;top:8%;left:0;width:100%;text-align:center;pointer-events:none;text-shadow:0 1px 8px #f6f7f1a0}#message label{display:block;color:#245a42;font-size:10px;letter-spacing:2px}#message strong{display:block;font-size:28px;margin-top:4px;letter-spacing:-1px}#message p{font-size:12px;color:#254736;margin-top:5px}.field-footer{position:absolute;bottom:18px;left:24px;right:24px;display:flex;justify-content:space-between;pointer-events:none;font-size:8px;letter-spacing:1.5px;color:#244632}#round{font-weight:750}#next{position:absolute;bottom:58px;left:50%;transform:translateX(-50%);border:0;background:var(--green);color:white;border-radius:10px;padding:13px 24px;font-size:12px;font-weight:700;box-shadow:0 4px 15px #183e3620}.controls{min-height:76px;padding:18px 28px;display:flex;gap:24px;align-items:center;background:#f6f8f1}.controls p{font-size:11px;color:var(--muted);flex:1}.controls em{margin:0 8px;font-style:normal}#status{font-size:9px;letter-spacing:1px;color:var(--green);white-space:nowrap}.leader-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}.leader-heading strong{font-size:11px;color:var(--green);background:#edf3e8;border-radius:20px;padding:9px 12px;white-space:nowrap}.leaderboard p{font-size:11px;color:var(--muted);line-height:1.7}.scoring{margin:14px 0;font-size:11px;color:var(--muted)}summary{cursor:pointer;padding:6px 0}.leaderboard td:first-child{color:var(--muted);width:40px}.leaderboard tbody tr:first-child{background:#f3f7ed}.leaderboard td:nth-child(2){overflow-wrap:anywhere}.leaderboard td:nth-child(3){white-space:nowrap;color:var(--muted)}.leader-player{display:flex;align-items:center;gap:12px;font-weight:650}.leader-player .leader-avatar{display:grid;place-items:center;flex:none;width:39px;height:39px;border-radius:13px;background:#527d64;overflow:hidden}.leader-avatar svg{width:100%;height:100%}#leaderboard:focus{outline:2px solid var(--green);outline-offset:4px}dialog form{display:flex;flex-direction:column;gap:14px}dialog img{align-self:center;width:42px;height:auto}dialog h2,dialog p{margin:0}dialog p{font-size:12px;color:var(--muted);line-height:1.6}dialog label{font-size:11px;color:var(--green)}dialog button{padding:13px;border:0;border-radius:10px;background:var(--green);color:white;font-weight:700}dialog button.secondary{background:white;border:1px solid #cfdbce;color:var(--ink)}button:disabled{opacity:.55;cursor:wait}#registration{width:min(760px,calc(100% - 28px))}.avatar-builder{display:grid;grid-template-columns:175px minmax(0,1fr);gap:24px;align-items:start}.avatar-preview-card{display:grid;justify-items:center;gap:10px;padding:12px;border:1px solid var(--line);border-radius:20px;background:#edf2e7;position:sticky;top:0}.avatar-preview-card small{font-size:11px;color:var(--muted)}#avatar-preview{display:grid;place-items:center;width:148px;height:160px;border-radius:17px;overflow:hidden}#avatar-preview svg{width:140px;height:140px}.avatar-options{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.avatar-options label{color:var(--ink);font-size:10px}#avatar-background{height:42px;padding:4px;cursor:pointer}#final-result{text-align:center;width:min(440px,calc(100% - 28px))}#final-points{font-size:42px;color:var(--green);overflow-wrap:anywhere}#final-player{font-size:20px;color:var(--ink);overflow-wrap:anywhere}#save-status[data-outcome="player_limit"]{color:#916117;font-weight:700}#shot-clock{position:absolute;z-index:2;top:14px;right:18px;width:124px;padding:9px 12px 10px;border:1px solid #cfdbce;border-radius:12px;background:#fafff3f2;color:var(--ink);text-align:center;pointer-events:none;box-shadow:0 4px 20px #183e3610}#shot-clock>span{display:block;font-size:8px;font-weight:700;letter-spacing:1.5px;color:var(--green)}#shot-clock strong{display:inline-block;font-size:32px;line-height:1.2;font-variant-numeric:tabular-nums}#shot-clock small{margin-left:4px;font-size:9px;color:var(--muted)}.shot-clock-track{height:5px;margin-top:5px;overflow:hidden;border-radius:5px;background:#dce5d5}#shot-clock-fill{display:block;height:100%;width:100%;background:var(--green)}#shot-clock.urgent{border-color:#b74d40;color:#a23c32}#shot-clock.urgent>span{color:#a23c32}#shot-clock.urgent #shot-clock-fill{background:#b74d40}.field.clock-running #message{top:88px}footer a{font-size:10px;text-decoration:underline;text-underline-offset:3px}
@media(max-width:800px){main{padding:0 20px}.hero{grid-template-columns:minmax(0,1fr)}.content{grid-template-columns:minmax(0,1fr)}}
@media(max-width:700px){main{padding:0 16px}.scoreboard{padding:0 14px;height:76px}#attempts{gap:5px}.attempt{width:24px;height:24px}#restart small{display:none}.field{height:clamp(380px,64svh,480px);aspect-ratio:auto}.field canvas{position:absolute;left:50%;width:700px;max-width:none;height:100%;transform:translateX(-50%);touch-action:none}.game>.power{width:85%}.venue{font-size:6px;left:14px}#message strong{font-size:22px}#message p{font-size:10px;padding:0 15px}.field-footer{left:14px;right:14px;font-size:6px}.controls{flex-wrap:wrap;padding:16px;gap:10px}.controls p{font-size:11px;line-height:1.5}.avatar-builder{grid-template-columns:1fr;gap:14px}.avatar-preview-card{position:static;grid-template-columns:90px 1fr;align-items:center;justify-items:start;padding:8px 12px}#avatar-preview{width:84px;height:84px}#avatar-preview svg{width:80px;height:80px}.avatar-options{grid-template-columns:repeat(2,minmax(0,1fr))}#shot-clock{top:11px;right:11px;width:108px;padding:7px 9px}#shot-clock strong{font-size:30px}.leaderboard{padding:18px 12px}.leader-player{gap:7px}.leader-avatar{width:32px!important;height:32px!important}.leaderboard td,.leaderboard th{padding-left:4px;padding-right:4px}.leaderboard table{font-size:12px}.leader-heading h2{font-size:22px}.leader-heading strong{font-size:9px}footer{flex-wrap:wrap;line-height:1.7}}
