:root{color:#f7f5ed;font-synthesis:none;--ink:#17221e;--cream:#fff9e9;--muted:#adc2b9;--line:#ffffff21;--glass:#0b271eb8;--glass-strong:#091f19eb;--red:#ed1c24;--yellow:#ffcb05;--green:#00a651;--blue:#0072bc;--shadow:0 24px 70px #00000057;background:#071d17;font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}html{background:#071d17;min-height:100%}body{color:#f8f5ec;background:radial-gradient(circle at 12% 0,#00a6513d,#0000 31rem),radial-gradient(circle at 94% 14%,#ffcb0521,#0000 28rem),radial-gradient(circle at 75% 92%,#ed1c241f,#0000 32rem),linear-gradient(145deg,#061813,#0b2d22 56%,#071b16);min-width:320px;min-height:100vh;margin:0}body:before{z-index:-1;content:"";opacity:.32;pointer-events:none;background-image:repeating-linear-gradient(115deg,#0000 0 20px,#ffffff06 20px 21px),repeating-linear-gradient(25deg,#0000 0 29px,#ffffff04 29px 30px);position:fixed;inset:0}button,input{font:inherit}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible{outline-offset:3px;outline:3px solid #ffd74a}a{color:inherit}h1,h2,h3,p{margin-top:0}h1,h2,h3{font-family:ui-rounded,SF Pro Rounded,Segoe UI,system-ui,sans-serif}.muted{color:var(--muted)}.eyebrow{color:#83ddb2;letter-spacing:.18em;text-transform:uppercase;margin:0 0 8px;font-size:.68rem;font-weight:900}.button{cursor:pointer;border:0;border-radius:15px;justify-content:center;align-items:center;min-height:48px;padding:11px 18px;font-weight:900;text-decoration:none;transition:transform .18s,filter .18s,opacity .18s;display:inline-flex}.button:hover:not(:disabled){filter:brightness(1.08);transform:translateY(-1px)}.button:active:not(:disabled){transform:translateY(1px)}.button:disabled{opacity:.38;cursor:not-allowed}.button--large{width:100%;min-height:54px}.button--primary{color:#fff;background:linear-gradient(145deg,#f13a3f,#c7131a);box-shadow:0 12px 28px #b8101752}.button--accent{color:#302400;background:linear-gradient(145deg,#ffdc45,#f5b908);box-shadow:0 12px 28px #c88f003b}.button--ghost{border:1px solid var(--line);background:#ffffff12}.button--danger{color:#fff;background:#b81922}.icon-button{border:1px solid var(--line);cursor:pointer;background:#ffffff12;border-radius:14px;flex:0 0 43px;place-items:center;width:43px;height:43px;font-weight:900;text-decoration:none;display:grid}.home-page{width:min(100%,590px);margin:0 auto;padding:58px 20px 44px}.hero{padding:0 8px 26px}.brand-mark{color:#fff;background:#e71920;border:5px solid #f7e94d;border-radius:50%;place-items:center;width:112px;height:82px;margin:0 0 31px 4px;display:grid;position:relative;transform:rotate(-10deg);box-shadow:0 18px 45px #00000057,inset 0 0 0 4px #fff}.brand-mark:after{content:"";background:linear-gradient(145deg,#0000 45%,#00000026);border-radius:50%;position:absolute;inset:7px}.brand-mark span{z-index:1;letter-spacing:-.1em;text-shadow:2px 3px #801015;font-family:Nunito,sans-serif;font-size:1.7rem;font-style:italic;font-weight:900;position:relative}.hero h1{letter-spacing:-.06em;margin-bottom:10px;font-size:clamp(2.5rem,10vw,4.1rem);line-height:.95}.hero>p:last-child{max-width:480px;color:var(--muted);margin:0;font-size:1.02rem;line-height:1.6}.home-panel,.leaderboard-panel{border:1px solid var(--line);box-shadow:var(--shadow), inset 0 1px 0 #ffffff1f;-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:linear-gradient(145deg,#ffffff1a,#ffffff0a);border-radius:28px;padding:20px}.segmented{border:1px solid var(--line);background:#00000029;border-radius:16px;grid-template-columns:1fr 1fr;gap:6px;margin-bottom:20px;padding:5px;display:grid}.segmented button{min-height:42px;color:var(--muted);cursor:pointer;background:0 0;border:0;border-radius:11px;font-weight:800}.segmented button.active{color:var(--ink);background:var(--cream);box-shadow:0 6px 18px #0000002b}form{gap:16px;display:grid}label{gap:7px;font-size:.78rem;font-weight:800;display:grid}input{border:1px solid var(--line);color:#fff;background:#ffffff12;border-radius:14px;width:100%;min-height:49px;padding:0 14px}input::placeholder{color:#799187}.code-input{letter-spacing:.18em;text-transform:uppercase;font-size:1.15rem;font-weight:900}.form-error{color:#ffc8ca;background:#c41d2538;border:1px solid #ff5a5f59;border-radius:12px;margin:0;padding:10px 12px;font-size:.78rem}.feature-strip{grid-template-columns:repeat(3,1fr);gap:9px;margin:16px 0 34px;display:grid}.feature-strip span{border:1px solid var(--line);text-align:center;background:#ffffff0d;border-radius:17px;gap:2px;padding:12px;display:grid}.feature-strip b{font:900 1.05rem Nunito,sans-serif}.feature-strip small{color:var(--muted);font-size:.63rem}.leaderboard-panel{margin-top:18px;padding:20px}.leaderboard-panel>header{justify-content:space-between;align-items:end;gap:12px;margin-bottom:16px;display:flex}.leaderboard-panel header small{color:#83ddb2;letter-spacing:.16em;font-size:.58rem;font-weight:900}.leaderboard-panel h2{margin:2px 0 0;font-size:1.38rem}.leaderboard-panel header em{color:#ffe273;font-size:.58rem;font-style:normal;font-weight:800}.leaderboard-panel ol{gap:8px;margin:0;padding:0;list-style:none;display:grid}.leaderboard-panel li{border:1px solid var(--line);background:#ffffff0d;border-radius:16px;grid-template-columns:25px 39px 1fr auto;align-items:center;gap:9px;padding:8px 10px;display:grid}.leaderboard-panel li>b{color:var(--muted);text-align:center}.leaderboard-panel li>i{background:linear-gradient(145deg,#1c8b61,#0e5e43);border-radius:12px;place-items:center;width:39px;height:39px;font-style:normal;font-weight:900;display:grid}.leaderboard-panel li>span{min-width:0;display:grid}.leaderboard-panel li>span strong{text-overflow:ellipsis;white-space:nowrap;font-size:.78rem;overflow:hidden}.leaderboard-panel li>span small{color:var(--muted);font-size:.58rem}.leaderboard-panel li.is-top-1{background:linear-gradient(100deg,#ffcb0526,#ffffff0a);border-color:#ffd22d6b}.leaderboard-numbers{text-align:right}.leaderboard-numbers strong{color:#ffe273}.recent-rooms{margin-top:30px}.recent-rooms h2{font-size:1.25rem}.recent-rooms>a{border:1px solid var(--line);background:#ffffff0d;border-radius:16px;justify-content:space-between;align-items:center;margin-top:9px;padding:13px 15px;text-decoration:none;display:flex}.recent-rooms>a span:first-child{display:grid}.recent-rooms small{color:var(--muted)}.home-footer{color:var(--muted);text-align:center;gap:8px;margin-top:32px;display:grid}.home-footer a{color:#fff;font-weight:800}.room-shell{min-height:100vh;padding-bottom:env(safe-area-inset-bottom)}.room-header{z-index:40;min-height:69px;padding:max(9px, env(safe-area-inset-top)) max(14px, env(safe-area-inset-right)) 9px max(14px, env(safe-area-inset-left));border-bottom:1px solid var(--line);-webkit-backdrop-filter:blur(24px);backdrop-filter:blur(24px);background:#051913db;align-items:center;gap:11px;display:flex;position:sticky;top:0;box-shadow:0 10px 30px #0000002b}.room-logo,.mini-brand{color:#fff;text-shadow:1px 2px #8b1116;background:#e81e25;border:3px solid #ffe148;border-radius:50%;place-items:center;width:48px;height:40px;font:italic 900 .77rem Nunito,sans-serif;text-decoration:none;display:grid;transform:rotate(-8deg)}.room-code{text-align:left;cursor:pointer;background:0 0;border:0;padding:0;display:grid}.room-code small{color:var(--muted);letter-spacing:.14em;font-size:.54rem}.room-code strong{letter-spacing:.15em;font-size:.84rem}.connection-status{color:var(--muted);align-items:center;gap:6px;margin-left:auto;font-size:.64rem;font-weight:800;display:flex}.connection-status i{background:#f4bd35;border-radius:50%;width:7px;height:7px;box-shadow:0 0 0 4px #f4bd3521}.connection-status--connected i{background:#57db91;box-shadow:0 0 0 4px #57db911f}.toast{z-index:90;color:#fff;width:min(90%,500px);box-shadow:var(--shadow);background:#99181ff0;border:1px solid #ffffff26;border-radius:15px;padding:11px 14px;position:fixed;top:83px;left:50%;transform:translate(-50%)}.join-page,.loading-page{place-content:center;min-height:100vh;padding:24px;display:grid}.back-link{color:var(--muted);text-decoration:none;position:fixed;top:22px;left:22px}.join-gate{border:1px solid var(--line);background:var(--glass);width:min(100vw - 40px,440px);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);border-radius:27px;padding:28px}.join-gate .mini-brand{width:76px;height:58px;margin-bottom:26px;font-size:1.1rem}.join-gate h1{margin-bottom:8px;font-size:2rem}.join-gate>p:not(.eyebrow){color:var(--muted)}.loading-page{text-align:center;justify-items:center}.loading-page .mini-brand{width:90px;height:68px;margin-bottom:25px;font-size:1.2rem;animation:1.8s ease-in-out infinite float}.lobby-page{width:min(100%,950px);margin:0 auto;padding:42px 18px 60px}.lobby-intro{text-align:center}.lobby-intro h1{margin-bottom:19px;font-size:clamp(2rem,7vw,3.2rem)}.lobby-intro>button{color:#fff;cursor:pointer;background:linear-gradient(145deg,#ffcb0529,#ffffff0d);border:1px solid #ffdc4359;border-radius:20px;min-width:min(100%,360px);padding:12px 24px;box-shadow:0 15px 38px #00000038}.lobby-intro button small{color:#ffe477;letter-spacing:.13em;font-size:.52rem;display:block}.lobby-intro button strong{letter-spacing:.22em;margin-top:4px;font-size:1.55rem;display:block}.lobby-grid{grid-template-columns:1fr 1fr;gap:16px;margin-top:34px;display:grid}.lobby-players,.room-options{border:1px solid var(--line);background:#ffffff0f;border-radius:24px;padding:18px;box-shadow:0 18px 44px #0000002b}.lobby-players>header,.room-options>header{justify-content:space-between;align-items:center;gap:12px;margin-bottom:10px;display:flex}.lobby-players h2,.room-options h2{margin:0;font-size:1.22rem}.lobby-players>header span,.room-options>header>small{color:var(--muted);font-size:.66rem}.lobby-player{border-top:1px solid var(--line);grid-template-columns:38px 1fr auto auto;align-items:center;gap:9px;min-height:58px;display:grid}.lobby-player>i{background:linear-gradient(145deg,#23976d,#116145);border-radius:12px;place-items:center;width:35px;height:35px;font-style:normal;font-weight:900;display:grid}.lobby-player>span{display:grid}.lobby-player>span strong{font-size:.76rem}.lobby-player>span small{color:var(--muted);font-size:.57rem}.lobby-player>b{color:#a7bdb4;background:#ffffff0f;border-radius:99px;padding:5px 8px;font-size:.53rem}.lobby-player>b.ready{color:#90e5b7;background:#23b76721}.remove-player{color:#ffb2b5;cursor:pointer;background:#ed1c2421;border:0;border-radius:8px;width:25px;height:25px}.room-options>label{border-top:1px solid var(--line);cursor:pointer;justify-content:space-between;align-items:center;min-height:64px;display:flex;position:relative}.room-options label>span{display:grid}.room-options label strong{font-size:.76rem}.room-options label small{color:var(--muted);font-size:.56rem}.room-options input{opacity:0;width:1px;height:1px;position:absolute}.room-options label>i{background:#ffffff1f;border-radius:99px;flex:0 0 42px;width:42px;height:25px;transition:background .2s;position:relative}.room-options label>i:after{content:"";background:#b4c5bd;border-radius:50%;width:19px;height:19px;transition:transform .2s,background .2s;position:absolute;top:3px;left:3px}.room-options input:checked+i{background:#e92d34}.room-options input:checked+i:after{background:#fff;transform:translate(17px)}.room-options input:disabled+i{opacity:.6}.lobby-actions{flex-wrap:wrap;justify-content:center;gap:11px;margin-top:22px;display:flex}.lobby-actions p{width:100%;color:var(--muted);text-align:center;font-size:.7rem}.uno-card{--card-color:#ef3340;color:#fff;background:var(--card-color);cursor:pointer;border:5px solid #fffaf0;border-radius:16px;flex:0 0 116px;width:116px;height:170px;padding:0;transition:transform .2s cubic-bezier(.2,.85,.3,1.1),filter .2s,box-shadow .2s;display:block;position:relative;overflow:hidden;box-shadow:0 12px 28px #00000057,inset 0 0 0 1px #0000002e}.uno-card:not(:disabled):hover{z-index:3;transform:translateY(-10px)rotate(-1deg);box-shadow:0 22px 35px #0000006b}.uno-card:disabled{cursor:not-allowed;filter:saturate(.55)brightness(.62)}.uno-card.is-selected{outline-offset:2px;outline:4px solid #ffe34d;transform:translateY(-9px)}.uno-card:before{content:"";border:2px solid #ffffff6b;border-radius:11px;position:absolute;inset:8px}.uno-card__oval{background:#fffaf0;border-radius:50%;place-items:center;width:86px;height:142px;display:grid;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(27deg);box-shadow:inset 0 0 0 1px #0000001a}.uno-card__oval>strong{color:var(--card-color);letter-spacing:-.12em;text-shadow:2px 3px #00000029;font:900 4.4rem/1 Nunito,sans-serif;transform:rotate(-27deg)}.uno-card__corner{z-index:3;color:#fff;text-shadow:1px 2px #00000059;justify-items:center;font:900 1.15rem/1 Nunito,sans-serif;display:grid;position:absolute}.uno-card__corner small{font-size:.42rem}.uno-card__corner--top{top:9px;left:9px}.uno-card__corner--bottom{bottom:9px;right:9px;transform:rotate(180deg)}.uno-card--wild{background:#181818}.uno-card--wild .uno-card__oval{background:#fff}.uno-card__wild-wheel{border-radius:50%;width:62px;height:102px;position:relative;overflow:hidden;transform:rotate(-27deg)}.uno-card__wild-wheel i{width:50%;height:50%;position:absolute}.uno-card__wild-wheel i:first-child{background:var(--red);top:0;left:0}.uno-card__wild-wheel i:nth-child(2){background:var(--blue);top:0;right:0}.uno-card__wild-wheel i:nth-child(3){background:var(--green);bottom:0;right:0}.uno-card__wild-wheel i:nth-child(4){background:var(--yellow);bottom:0;left:0}.uno-card__wild-wheel b{z-index:2;color:#fff;text-shadow:2px 2px #111;font:italic 900 1.7rem Nunito,sans-serif;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.uno-card--back{background:#d91920;border-color:#fff;place-items:center;display:grid;transform:rotate(-3deg);box-shadow:0 10px 24px #00000052}.uno-card--back:after{content:"";background:#ed1c24;border:3px solid #ffe23f;border-radius:50%;position:absolute;inset:15px;transform:rotate(-14deg)}.uno-card--back>i{z-index:3;text-shadow:2px 2px #831015;font:italic 900 1.5rem Nunito,sans-serif;position:relative;transform:rotate(-10deg)}.uno-card--compact{border-width:3px;border-radius:9px;flex-basis:66px;width:66px;height:94px}.uno-card--compact:before{border-width:1px;border-radius:6px;inset:4px}.uno-card--compact .uno-card__oval{width:49px;height:78px}.uno-card--compact .uno-card__oval>strong{font-size:2.4rem}.uno-card--compact .uno-card__corner{font-size:.62rem}.uno-card--compact .uno-card__corner--top{top:5px;left:5px}.uno-card--compact .uno-card__corner--bottom{bottom:5px;right:5px}.uno-card--compact .uno-card__wild-wheel{width:36px;height:58px}.uno-card--compact .uno-card__wild-wheel b{font-size:.85rem}.uno-card--compact.uno-card--back>i{font-size:.7rem}.uno-card--compact.uno-card--back:after{border-width:2px;inset:8px}.game-page{width:min(100%,1160px);margin:0 auto;padding:20px 16px 245px}.turn-banner{border:1px solid var(--line);background:#ffffff0f;border-radius:22px;justify-content:space-between;align-items:center;min-height:74px;padding:11px 13px 11px 18px;display:flex;box-shadow:0 14px 38px #0000002e}.turn-banner.is-mine{background:linear-gradient(105deg,#ffcb052b,#ffffff0d);border-color:#ffd32875}.turn-banner>span{display:grid}.turn-banner small{color:#9eb6ac;letter-spacing:.14em;font-size:.54rem;font-weight:900}.turn-banner strong{font:900 1.16rem Nunito,sans-serif}.timer{--progress:360deg;background:conic-gradient(#ffcf1f var(--progress), #ffffff1a 0);border-radius:50%;flex:0 0 53px;place-items:center;width:53px;height:53px;display:grid;position:relative}.timer:before{content:"";background:#103227;border-radius:50%;position:absolute;inset:4px}.timer b,.timer small{z-index:1;line-height:1;position:relative}.timer b{font-size:.95rem}.timer small{font-size:.42rem}.timer.is-urgent{color:#ffd0d2;background:conic-gradient(#f2383f var(--progress), #ffffff1a 0);animation:.8s infinite pulse}.opponents{scrollbar-width:thin;gap:10px;margin-top:14px;padding:2px 2px 12px;display:flex;overflow-x:auto}.opponent{border:1px solid var(--line);background:#ffffff0d;border-radius:18px;grid-template-columns:35px minmax(85px,1fr) 48px;align-items:center;gap:8px;min-width:196px;min-height:72px;padding:9px;display:grid;position:relative}.opponent.is-turn{background:#ffcb051a;border-color:#ffcb057a}.opponent-avatar{background:linear-gradient(145deg,#288c69,#12523e);border-radius:12px;place-items:center;width:35px;height:35px;font-weight:900;display:grid}.opponent>span{min-width:0;display:grid}.opponent>span strong{text-overflow:ellipsis;white-space:nowrap;font-size:.7rem;overflow:hidden}.opponent>span small{color:var(--muted);font-size:.52rem}.opponent>em{color:#321e00;background:#ffce18;border-radius:99px;padding:4px 7px;font-size:.54rem;font-style:normal;font-weight:900;position:absolute;top:-6px;right:5px}.card-stack{width:45px;height:55px;position:relative}.card-stack .uno-card{border-width:2px;border-radius:6px;width:34px;height:50px;position:absolute}.card-stack .uno-card:nth-child(2){left:4px;transform:rotate(0)}.card-stack .uno-card:nth-child(3){left:8px;transform:rotate(3deg)}.card-stack .uno-card:nth-child(4){left:12px;transform:rotate(6deg)}.card-stack .uno-card:after{border-width:1px;inset:4px}.card-stack .uno-card>i{font-size:.36rem}.card-stack b{z-index:8;color:#241900;background:#ffcf1b;border:2px solid #0e3025;border-radius:50%;place-items:center;width:22px;height:22px;font-size:.58rem;display:grid;position:absolute;bottom:-4px;right:-3px}.table-center{background:radial-gradient(#2c735247,#0517120a 68%);border:1px solid #ffffff14;border-radius:50%;grid-template-columns:120px 135px;justify-content:center;align-items:center;gap:28px;min-height:305px;margin:8px 0;display:grid;position:relative;box-shadow:inset 0 0 70px #00000029}.direction-badge{color:#9dc4b3;align-items:center;gap:6px;font-size:1.2rem;display:flex;position:absolute;top:18px;left:50%;transform:translate(-50%)}.direction-badge small{font-size:.52rem}.draw-pile{cursor:pointer;background:0 0;border:0;width:120px;height:180px;padding:0;position:relative}.draw-pile:disabled{cursor:not-allowed;opacity:.5}.draw-pile .uno-card{pointer-events:none;position:absolute;top:4px;left:3px}.draw-pile .uno-card:before{display:none}.draw-pile:before,.draw-pile:after{content:"";background:#b61016;border:3px solid #fff;border-radius:16px;width:116px;height:170px;position:absolute;top:0;left:-3px;transform:rotate(-5deg)}.draw-pile:after{left:1px;transform:rotate(-2deg)}.draw-pile .uno-card{z-index:2}.draw-pile>b{z-index:5;color:#2b2100;background:#ffcf18;border:3px solid #0c2c22;border-radius:50%;place-items:center;width:30px;height:30px;font-size:.7rem;display:grid;position:absolute;top:-4px;right:-7px}.draw-pile>small{z-index:5;white-space:nowrap;background:#04130fdb;border-radius:99px;padding:5px 9px;font-size:.54rem;font-weight:900;position:absolute;bottom:-2px;left:50%;transform:translate(-50%)}.discard-pile{justify-items:center;width:135px;min-height:190px;display:grid;position:relative}.discard-pile .uno-card{transform:rotate(5deg)}.active-color{border:1px solid var(--line);color:var(--muted);background:#0003;border-radius:99px;align-items:center;gap:5px;margin-top:3px;padding:5px 8px;font-size:.52rem;font-weight:800;display:flex}.active-color i{background:var(--active-color);width:8px;height:8px;box-shadow:0 0 0 3px color-mix(in srgb, var(--active-color) 20%, transparent);border-radius:50%}.table-actions{justify-content:center;gap:8px;display:flex;position:absolute;bottom:18px;left:16px;right:16px}.table-actions .button{min-height:38px;padding:7px 10px;font-size:.62rem}.uno-call{color:#fff;cursor:pointer;background:#e92027;border:3px solid #ffe456;border-radius:50%;min-width:80px;padding:10px 15px;font:italic 900 .95rem Nunito,sans-serif;transform:rotate(-5deg);box-shadow:0 8px 20px #00000040}.choice-panel,.penalty-banner,.catch-panel{border:1px solid var(--line);text-align:center;background:var(--glass);border-radius:18px;width:min(100%,620px);margin:0 auto 13px;padding:13px;box-shadow:0 12px 30px #00000029}.choice-panel p,.penalty-banner{margin-bottom:10px;font-size:.7rem}.penalty-banner{color:#ffd3d5;background:#a1141c3d;border-color:#ef334059}.color-choices{grid-template-columns:repeat(4,1fr);gap:8px;display:grid}.color-choices button{color:#fff;text-shadow:1px 2px #0000004d;cursor:pointer;border:3px solid #ffffffbf;border-radius:14px;place-items:center;min-height:54px;font-size:1.1rem;display:grid}.color-choices button span{font-size:.48rem;font-weight:900}.catch-panel{background:#ffcb051c;border-color:#ffcb0559;flex-wrap:wrap;justify-content:center;align-items:center;gap:8px;display:flex}.catch-panel strong{color:#ffe26b;width:100%;font-size:.68rem}.catch-panel button{color:#2b2100;cursor:pointer;background:#ffd321;border:0;border-radius:10px;padding:8px 10px;font-size:.6rem;font-weight:900}.game-log{width:min(100%,720px);margin:0 auto}.game-log details{border:1px solid var(--line);background:#ffffff0a;border-radius:15px}.game-log summary{color:var(--muted);cursor:pointer;justify-content:space-between;padding:10px 12px;font-size:.62rem;font-weight:800;display:flex}.game-log summary span{background:#ffffff14;border-radius:99px;padding:2px 6px}.game-log ol{border-top:1px solid var(--line);max-height:160px;color:var(--muted);margin:0;padding:8px 28px 10px;font-size:.58rem;overflow:auto}.game-log li{padding:3px 0}.hand-zone{z-index:30;right:max(10px, env(safe-area-inset-right));bottom:max(10px, env(safe-area-inset-bottom));left:max(10px, env(safe-area-inset-left));-webkit-backdrop-filter:blur(26px);backdrop-filter:blur(26px);background:#061a14e8;border:1px solid #ffffff2b;border-radius:24px;padding:11px 14px 12px;position:fixed;box-shadow:0 -10px 50px #0000005e,inset 0 1px #ffffff1c}.hand-zone>header{justify-content:space-between;align-items:center;margin-bottom:3px;display:flex}.hand-zone>header span{align-items:baseline;gap:7px;display:flex}.hand-zone>header small{color:var(--muted);letter-spacing:.13em;font-size:.5rem}.hand-zone>header strong{font-size:.7rem}.hand-zone>header>b{color:#2c2100;background:#ffd225;border-radius:99px;padding:5px 8px;font-size:.54rem}.hand-scroll{scroll-snap-type:x proximity;gap:10px;min-height:182px;padding:10px 5px 4px;display:flex;overflow:auto hidden}.hand-scroll .uno-card{scroll-snap-align:center}.winner-overlay{z-index:70;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#010a07b8;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.winner-card{text-align:center;width:min(100%,430px);box-shadow:var(--shadow);background:linear-gradient(145deg,#123d2d,#081e18);border:1px solid #fff3;border-radius:30px;padding:30px}.winner-card .mini-brand{width:80px;height:60px;margin:0 auto 26px;font-size:1.1rem}.winner-card h2{margin-bottom:5px;font-size:2.1rem}.winner-card>strong{color:#ffdb46;margin-bottom:14px;font:900 1.7rem Nunito,sans-serif;display:block}.winner-card>p:not(.eyebrow){color:var(--muted)}.winner-card .button{width:100%;margin-bottom:15px}.winner-card>a{color:var(--muted);font-size:.7rem}.modal-backdrop{z-index:80;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#000805b8;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.play-modal{border:1px solid var(--line);width:min(100%,450px);box-shadow:var(--shadow);background:#0d3025;border-radius:28px;justify-items:center;padding:26px;display:grid;position:relative}.play-modal>.uno-card{margin:-72px 0 18px;transform:rotate(-4deg)}.play-modal h2{margin-bottom:14px}.play-modal .color-choices,.play-modal .target-choices{width:100%}.modal-close{border:1px solid var(--line);cursor:pointer;background:#ffffff12;border-radius:12px;width:35px;height:35px;font-size:1.2rem;position:absolute;top:12px;right:12px}.target-choices{gap:7px;display:grid}.target-choices button{border:1px solid var(--line);text-align:left;cursor:pointer;background:#ffffff0f;border-radius:14px;align-items:center;gap:9px;min-height:53px;padding:7px 9px;display:flex}.target-choices button i{background:#238461;border-radius:11px;place-items:center;width:35px;height:35px;font-style:normal;font-weight:900;display:grid}.target-choices button span{font-weight:800;display:grid}.target-choices button small{color:var(--muted);font-size:.55rem}.rules-drawer{z-index:75;border-left:1px solid var(--line);background:#09241c;width:min(100%,620px);position:fixed;top:0;bottom:0;right:0;overflow-y:auto;box-shadow:-25px 0 70px #00000059}.rules-drawer>button{z-index:2;float:right;border:1px solid var(--line);cursor:pointer;background:#12382c;border-radius:12px;margin:12px;padding:9px 12px;position:sticky;top:12px}.rules-page{width:min(100%,920px);margin:0 auto;padding:25px 18px 60px}.rules-header{align-items:center;gap:13px;margin-bottom:34px;display:flex}.rules-header>span{display:grid}.rules-header small{color:var(--muted);letter-spacing:.14em;font-size:.53rem;font-weight:900}.rules-header h1{margin:0;font-size:1.45rem}.rules-header>b{color:#2c2100;background:#ffd326;border-radius:99px;margin-left:auto;padding:7px 10px;font-size:.58rem}.rules-hero{border:1px solid var(--line);box-shadow:var(--shadow);background:linear-gradient(135deg,#ed1c242b,#0072bc17 45%,#00a65124);border-radius:30px;padding:34px;position:relative;overflow:hidden}.rules-hero h2{max-width:560px;margin-bottom:10px;font-size:clamp(2rem,7vw,3.2rem);line-height:1}.rules-hero>p:not(.eyebrow){max-width:600px;color:var(--muted);line-height:1.6}.rules-card-fan{justify-content:center;margin:35px 0 5px;padding:10px 0;display:flex}.rules-card-fan .uno-card{filter:none;transform:rotate(var(--fan-angle,-4deg));margin-left:-16px}.rules-card-fan .uno-card:nth-child(2n){transform:translateY(7px)rotate(5deg)}.rules-grid{grid-template-columns:repeat(3,1fr);gap:13px;margin-top:18px;display:grid}.rules-grid article{border:1px solid var(--line);background:#ffffff0d;border-radius:21px;padding:18px}.rules-grid article>b{color:#271d00;background:#ffcf1e;border-radius:9px;place-items:center;width:29px;height:29px;display:grid}.rules-grid h3{margin:13px 0 6px;font-size:.96rem}.rules-grid p{color:var(--muted);margin:0;font-size:.68rem;line-height:1.55}.rules-section{border:1px solid var(--line);background:#ffffff0d;border-radius:26px;margin-top:18px;padding:24px}.rules-section h2{font-size:1.55rem}.rules-section dl{grid-template-columns:1fr 1fr;gap:9px;margin:0;display:grid}.rules-section dl div{border:1px solid var(--line);background:#0000001a;border-radius:15px;padding:12px}.rules-section dt{color:#ffe26b;font-weight:900}.rules-section dd{color:var(--muted);margin:4px 0 0;font-size:.65rem;line-height:1.45}.rules-section ul{gap:8px;margin:0;padding:0;list-style:none;display:grid}.rules-section li{border:1px solid var(--line);background:#0000001a;border-radius:15px;padding:12px;display:grid}.rules-section li strong{font-size:.76rem}.rules-section li span{color:var(--muted);margin-top:2px;font-size:.62rem}.rules-footer{color:var(--muted);justify-items:center;gap:12px;margin-top:24px;display:grid}.rules-footer small{font-size:.6rem}.rules-page--embedded{padding-top:72px}.centered-page{text-align:center;place-content:center;min-height:100vh;display:grid}@keyframes pulse{50%{filter:brightness(1.16);transform:scale(1.06)}}@keyframes float{50%{transform:translateY(-8px)rotate(-5deg)}}@media (width<=760px){.lobby-grid,.rules-grid{grid-template-columns:1fr}.lobby-grid{max-width:560px;margin-inline:auto}.table-center{min-height:290px}.rules-section dl{grid-template-columns:1fr}}@media (width<=520px){.home-page{padding-top:37px}.home-panel{padding:16px}.brand-mark{width:96px;height:71px}.room-header{gap:8px}.connection-status{font-size:0}.connection-status i{display:block}.game-page{padding-inline:9px;padding-bottom:224px}.opponent{grid-template-columns:32px minmax(70px,1fr) 42px;min-width:168px}.table-center{grid-template-columns:103px 118px;gap:20px;min-height:278px}.draw-pile{width:103px;height:155px;transform:scale(.88)}.discard-pile{width:118px;transform:scale(.88)}.table-actions{bottom:8px}.hand-zone{border-radius:20px;padding:9px 9px 8px;bottom:5px;left:5px;right:5px}.hand-scroll{gap:8px;min-height:158px}.hand-scroll .uno-card{border-width:4px;flex-basis:100px;width:100px;height:148px}.hand-scroll .uno-card__oval{width:74px;height:122px}.hand-scroll .uno-card__oval>strong{font-size:3.7rem}.rules-hero{padding:24px 19px}.rules-card-fan{justify-content:flex-start;padding-left:15px;overflow-x:auto}.rules-card-fan .uno-card{margin-left:-9px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
