@import "https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Fraunces:opsz,wght@9..144,700;9..144,800&display=swap";:root{color:#16372b;font-synthesis:none;--green:#174c3a;--lime:#d5eb72;--cream:#f8f6ef;--orange:#e7743d;background:#f3f1e9;font-family:DM Sans,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 80% 0,#e7eccd 0,#0000 32%),#f3f1e9;min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{cursor:pointer}.shell{width:min(100% - 32px,520px);min-height:100vh;padding:28px 0 max(28px,env(safe-area-inset-bottom));margin:auto}.brand{align-items:center;gap:13px;display:flex}.brand h1{letter-spacing:-1px;margin:2px 0;font:800 34px/1 Fraunces,serif}.eyebrow{color:#708078;letter-spacing:1.6px;text-transform:uppercase;margin:0;font-size:11px;font-weight:700}.logo{background:var(--green);width:52px;height:58px;color:var(--lime);border-radius:50% 50% 12px 12px;place-items:center;display:grid;transform:rotate(-4deg);box-shadow:inset 0 -5px #0d3b2c}.logo span{border:2px solid;border-radius:50%;place-items:center;width:33px;height:33px;font:700 17px Fraunces,serif;display:grid}.hero{text-align:center;padding:48px 0 30px}.hero .kicker{text-transform:uppercase;letter-spacing:3px;margin:0;font-size:12px;font-weight:700}.hero>p:last-child{color:#6c7d76;margin:5px 0 0}.fifty{letter-spacing:-7px;color:var(--green);font:800 100px/.95 Fraunces,serif}.fifty span{letter-spacing:0;margin-left:8px;font:700 15px DM Sans}.card{background:#ffffffb8;border:1px solid #16372b1a;border-radius:24px;padding:22px;box-shadow:0 12px 35px #2240300f}.section-heading{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.section-heading h2{margin:3px 0 0;font:700 22px Fraunces,serif}.section-heading>span{color:#718078;background:#eceee5;border-radius:99px;padding:7px 10px;font-size:12px;font-weight:700}.add-form{gap:8px;display:flex}.add-form input{background:#fff;border:1px solid #cbd2c7;border-radius:13px;outline:none;flex:1;min-width:0;padding:14px 15px}.add-form input:focus{border-color:var(--green);box-shadow:0 0 0 3px #174c3a1a}.add-form button{background:var(--lime);width:50px;color:var(--green);border:0;border-radius:13px;place-items:center;display:grid}.player-list{gap:8px;margin-top:14px;display:grid}.empty{text-align:center;color:#849089;padding:24px}.empty svg{opacity:.45}.empty p{margin:8px 0 0;font-size:13px}.setup-player{background:#f5f5ef;border-radius:13px;align-items:center;gap:12px;padding:10px;display:flex}.setup-player strong{flex:1;min-width:0}.setup-player button{color:#8b9690;background:0 0;border:0;padding:7px}.player-avatar{object-fit:cover;border-radius:50%;flex:none;width:32px;height:32px}.player-avatar.placeholder{color:#7b8881;background:#e4e7de;place-items:center;display:grid}.photo-button{color:#708078;cursor:pointer;background:#e8ebe3;border-radius:50%;flex:none;place-items:center;width:30px;height:30px;display:grid}.photo-button input{display:none}.order{background:#e4e7de;border-radius:50%;flex:none;place-items:center;width:29px;height:29px;font-size:12px;font-weight:700;display:grid}.wins{color:#a75b2d;align-items:center;gap:4px;font-size:13px;font-weight:700;display:flex}.primary,.secondary{border:0;border-radius:16px;justify-content:center;align-items:center;gap:8px;width:100%;min-height:56px;font-weight:700;display:flex}.primary{background:var(--green);color:#fff;margin-top:18px;box-shadow:0 8px 20px #174c3a33}.primary:disabled{opacity:.4;cursor:not-allowed}.secondary{color:var(--green);background:#e2e6dd;margin-top:9px}.hint,.text-button{text-align:center;color:#7b8881;font-size:12px;display:block}.hint{margin:10px}.text-button{background:0 0;border:0;margin:16px auto;text-decoration:underline}.game-layout{min-height:100vh;padding-bottom:max(24px,env(safe-area-inset-bottom))}.game-header{justify-content:space-between;align-items:center;height:64px;padding:8px max(20px,50vw - 525px);display:flex}.brand.compact .logo{width:40px;height:45px}.brand.compact .logo span{width:27px;height:27px;font-size:13px}.brand.compact h1{font-size:25px}.icon-button{color:var(--green);background:#fff9;border:1px solid #d2d7ce;border-radius:50%;place-items:center;width:42px;height:42px;display:grid}.game-content{grid-template-columns:minmax(0,1.45fr) minmax(290px,.75fr);align-items:start;gap:20px;width:min(100% - 28px,1050px);margin:22px auto;display:grid}.score-panel{background:var(--cream);border:1px solid #e0e0d5;border-radius:25px;padding:24px}.score-prompt{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.score-prompt h3{margin:3px 0;font:700 23px Fraunces}.pending-score{color:#819087;background:#e6e7df;border-radius:12px;align-items:baseline;gap:5px;padding:8px 12px;display:flex}.pending-score.active{background:var(--lime);color:var(--green)}.pending-score span{text-transform:uppercase;font-size:10px;font-weight:700}.pending-score b{font-size:24px}.formation{background:linear-gradient(160deg,#ded8c2,#eae5d3);border-radius:20px;flex-direction:column;align-items:center;gap:5px;padding:19px 8px;display:flex;box-shadow:inset 0 2px 12px #544d3420}.skittle-row{justify-content:center;gap:5px;display:flex}.skittle{color:#263c31;background:linear-gradient(100deg,#eee3c4,#cdbb8e);border:0;border-radius:50% 50% 15px 15px;width:67px;height:63px;transition:transform .12s,background .12s;position:relative;box-shadow:inset -7px -5px 10px #826f4633,0 3px 2px #6d624940}.skittle b{font:800 22px Fraunces}.skittle span{width:20px;height:20px;position:absolute;top:3px;right:4px}.skittle.selected{background:var(--green);color:#fff;transform:translateY(-3px);box-shadow:0 5px #0c3528}.skittle:active{transform:scale(.95)}.rule-note{text-align:center;color:#78847e;margin:13px 0 17px;font-size:11px}.actions{grid-template-columns:.85fr 1.15fr;gap:9px;display:grid}.actions button{border:0;border-radius:15px;justify-content:center;align-items:center;gap:7px;min-height:55px;font-weight:700;display:flex}.miss-button{color:#6f5c54;background:#e8e5dc}.miss-button.chosen{color:#9d3e19;box-shadow:inset 0 0 0 2px var(--orange);background:#fee0d3}.confirm-button{background:var(--green);color:#fff}.confirm-button:disabled{opacity:.35;cursor:not-allowed}.scoreboard{padding:19px}.score-row{border-radius:13px;align-items:center;gap:11px;padding:11px 8px;display:flex}.score-row+.score-row{border-top:1px solid #e4e6df}.score-row.current{background:#e7f0bd;border:0}.score-row.current .order{background:var(--green);color:#fff}.score-row.eliminated{opacity:.45}.player-meta{flex:1;min-width:0}.player-meta strong,.player-meta small{white-space:nowrap;text-overflow:ellipsis;display:block;overflow:hidden}.player-meta small{color:#7e8983;margin-top:2px;font-size:11px}.player-score{font:700 24px Fraunces}.finish-shell{flex-direction:column;display:flex}.winner-card{text-align:center;padding:55px 0 28px}.trophy-ring{background:var(--lime);width:105px;height:105px;color:var(--green);border-radius:50%;place-items:center;margin:0 auto 22px;display:grid;box-shadow:0 0 0 12px #d5eb7244}.winner-card h2{margin:7px 0;font:800 42px Fraunces}.winner-card>p:last-child{color:#78847e;margin:0}.standings{margin-bottom:2px}.standing{align-items:center;gap:13px;padding:10px;display:flex}.standing>span{color:#9ba39e;font-size:12px}.standing strong{flex:1}.standing b{color:#a75b2d;align-items:center;gap:5px;display:flex}.scoreboard-next,.scores-toggle{display:none}@media (width<=760px){.game-content{grid-template-columns:1fr}.scoreboard{order:-1}.scoreboard .section-heading{margin-bottom:6px}.score-row{padding:8px}.game-header{padding:8px 18px}.score-panel{padding:18px 12px}.skittle{width:64px;height:61px}.game-content{margin-top:14px}.scoreboard{padding:15px}.scoreboard-next{text-overflow:ellipsis;white-space:nowrap;max-width:130px;padding:6px 8px;font-size:11px;display:block;overflow:hidden}.scoreboard-active,.score-row:not(.current){display:none}.scoreboard.expanded .score-row:not(.current){display:flex}.scores-toggle{width:100%;color:var(--green);background:0 0;border:0;border-top:1px solid #e4e6df;margin-top:8px;padding:10px 4px 2px;font-size:12px;font-weight:700;display:block}}@media (width<=370px){.skittle{width:57px;height:56px}.skittle-row{gap:3px}.score-panel{padding:15px 7px}.actions{grid-template-columns:1fr 1fr}.fifty{font-size:86px}}
