@import"https://fonts.googleapis.com/css2?family=Fredoka:wght@400;600;700;800&display=swap";*{box-sizing:border-box}html,body,#app{width:100%;min-height:100%;margin:0}body{font-family:Fredoka,Segoe UI,system-ui,sans-serif;background:radial-gradient(ellipse 120% 80% at 50% 40%,#132036,#0b141e 45%,#05080e);color:#fff;min-height:100vh}.uno-backdrop:before,.uno-backdrop:after{content:"";position:fixed;width:120px;height:168px;border-radius:12px;opacity:.12;z-index:0;pointer-events:none}.uno-backdrop:before{left:4%;top:22%;background:linear-gradient(145deg,#c62828,#8e0000);transform:rotate(-12deg)}.uno-backdrop:after{right:6%;bottom:18%;background:linear-gradient(145deg,#1565c0,#0d47a1);transform:rotate(8deg)}.screen{min-height:100vh;position:relative;z-index:1}.top-bar{position:fixed;top:max(.65rem,env(safe-area-inset-top,0px));right:max(.65rem,env(safe-area-inset-right,0px));z-index:50}.lang-wrap{display:inline-flex;align-items:center;gap:.35rem;background:#0a121ed9;border:1px solid rgba(255,255,255,.22);border-radius:999px;padding:.4rem .75rem;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.lang-icon{font-size:1rem}.lang-select{background:transparent;color:#fff;border:none;font-family:inherit;font-weight:600;font-size:.9rem;cursor:pointer}.uno-menu{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:4rem 1.25rem 2rem;text-align:center}.uno-kicker{font-size:.78rem;font-weight:700;letter-spacing:.35em;color:#f4d35a;text-transform:uppercase;margin-bottom:.35rem}.uno-logo{font-size:clamp(3.2rem,14vw,5.5rem);font-weight:800;line-height:1;margin:0 0 .75rem;background:linear-gradient(180deg,#ffe566,#f4d35a 35%,#f28e2b);-webkit-background-clip:text;background-clip:text;color:transparent;filter:drop-shadow(0 4px 12px rgba(0,0,0,.45))}.uno-tagline{font-size:.95rem;opacity:.88;margin:0 0 2.25rem;max-width:320px}.uno-menu-actions{display:flex;flex-direction:column;gap:.9rem;width:min(300px,100%)}.uno-menu--lobby-pick{max-width:420px;margin:0 auto}.lobby-pick-lead{margin-bottom:.5rem!important}.lobby-pick-hint{max-width:360px;margin:0 auto 1rem!important;text-align:center;line-height:1.45;font-size:.88rem}.lobby-pick-list{width:100%;max-height:min(52vh,420px);overflow-y:auto;margin:0 0 1rem;padding:0 .15rem;display:flex;flex-direction:column;gap:.65rem}.lobby-pick-empty{text-align:center;opacity:.82;font-size:.9rem;padding:1rem .5rem;line-height:1.45}.lobby-pick-card{display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap;padding:.75rem .85rem;border-radius:14px;background:#08101ceb;border:1px solid rgba(255,255,255,.14);box-shadow:0 4px 14px #00000059}.lobby-pick-card-main{display:flex;flex-direction:column;gap:.2rem;min-width:0;flex:1}.lobby-pick-name{font-weight:700;font-size:1rem}.lobby-pick-sub{font-size:.78rem;opacity:.75}.lobby-pick-join{flex-shrink:0;padding:.55rem .85rem!important;font-size:.88rem!important}.lobby-code-row{display:flex;flex-direction:column;gap:.65rem;width:100%;margin-bottom:1rem}.lobby-code-input{font-family:inherit;font-size:1.05rem;font-weight:700;letter-spacing:.12em;text-align:center;text-transform:uppercase;padding:.85rem 1rem;border-radius:12px;border:1px solid rgba(255,255,255,.2);background:#00000059;color:#fff;width:100%;box-sizing:border-box}.uno-share-code{text-align:center;margin:0 0 .75rem;font-size:.95rem;line-height:1.4}.uno-share-code-label{display:block;opacity:.85;font-size:.82rem;margin-bottom:.25rem}.uno-share-code-value{display:inline-block;font-weight:800;font-size:1.35rem;letter-spacing:.2em;padding:.35rem .75rem;border-radius:10px;background:#0006;border:1px solid rgba(255,215,80,.45)}.btn-uno-primary{font-family:inherit;font-size:1.05rem;font-weight:800;color:#1a1400;background:linear-gradient(180deg,#ffe566,#f4d35a 45%,#e8b800);border:none;border-radius:14px;padding:1rem 1.25rem;cursor:pointer;box-shadow:0 4px #b89400,0 8px 24px #00000059}.btn-uno-primary:active{transform:translateY(2px);box-shadow:0 2px #b89400}.btn-uno-secondary{font-family:inherit;font-size:1rem;font-weight:700;color:#fff;background:#0c1626e6;border:2px solid rgba(255,255,255,.45);border-radius:14px;padding:.95rem 1.25rem;cursor:pointer}.btn-uno-secondary:hover{background:#142337f2}.center-panel{min-height:100vh;display:flex;align-items:center;justify-content:center;padding:2rem;text-align:center}.muted{opacity:.85;font-size:.95rem;max-width:360px;margin:.75rem auto 1.25rem}.btn-uno-primary.btn-inline{box-shadow:0 3px #b89400}.game-panel{padding:4.25rem 1rem 1.5rem;max-width:640px;margin:0 auto}.game-hud{text-align:center;margin-bottom:1rem}.game-hud .status{font-size:1rem;font-weight:600}.lobby-code-row{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:.5rem;margin-top:.5rem;font-size:.78rem;opacity:.85;word-break:break-all}.lobby-code-row code{background:#00000059;padding:.2rem .45rem;border-radius:6px;font-size:.72rem;max-width:100%}.pile-area{display:flex;align-items:center;justify-content:center;gap:1.5rem;margin:1.25rem 0}.pile-stack{text-align:center}.pile-label{font-size:.75rem;opacity:.75;margin-bottom:.35rem}.discard-card,.deck-faux{width:72px;height:102px;border-radius:10px;margin:0 auto;display:flex;align-items:center;justify-content:center;font-weight:800;font-size:1.1rem;box-shadow:0 6px 16px #0006;border:2px solid rgba(255,255,255,.35)}.deck-faux{background:repeating-linear-gradient(45deg,#1a237e,#1a237e 6px,#0d1642 6px,#0d1642 12px);color:#fff;font-size:.75rem}.hand-section{margin-top:1.25rem}.hand-title{font-size:.88rem;margin-bottom:.5rem;opacity:.9}.hand-row{display:flex;flex-wrap:wrap;gap:.4rem;justify-content:center}.hand-card{min-width:52px;padding:.45rem .35rem;border-radius:8px;border:2px solid rgba(0,0,0,.35);font-weight:800;font-size:.82rem;cursor:pointer;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.5)}.hand-card:disabled{opacity:.45;cursor:not-allowed}.hand-card--playable{box-shadow:0 0 0 3px #f4d35a}.hand-card.c-red,.discard-card.c-red{background:linear-gradient(180deg,#e53935,#b71c1c)}.hand-card.c-blue,.discard-card.c-blue{background:linear-gradient(180deg,#1e88e5,#0d47a1)}.hand-card.c-green,.discard-card.c-green{background:linear-gradient(180deg,#43a047,#1b5e20)}.hand-card.c-yellow,.discard-card.c-yellow{background:linear-gradient(180deg,#fdd835,#f9a825)}.hand-card.c-wild,.discard-card.c-wild{background:linear-gradient(135deg,#e53935 25%,#fdd835 25%,#fdd835 50%,#43a047 50%,#43a047 75%,#1e88e5 75%);color:#fff}.game-actions{display:flex;flex-wrap:wrap;gap:.5rem;justify-content:center;margin-top:1rem}.game-actions button{font-family:inherit;font-weight:700;padding:.6rem 1rem;border-radius:10px;border:none;cursor:pointer;background:#ffffff26;color:#fff}.game-actions button:disabled{opacity:.45;cursor:not-allowed}.btn-back-ghost{display:block;margin:1.25rem auto 0;background:transparent;color:#ffffffbf;border:none;font-family:inherit;text-decoration:underline;cursor:pointer}.color-modal-back{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;z-index:100;display:flex;align-items:center;justify-content:center;padding:1rem}.color-modal{background:#132036;border:1px solid rgba(255,255,255,.2);border-radius:16px;padding:1.25rem;max-width:320px;width:100%;text-align:center}.color-modal h3{margin:0 0 1rem;font-size:1.05rem}.color-picks{display:grid;grid-template-columns:repeat(2,1fr);gap:.6rem}.color-picks button{padding:.85rem;border:none;border-radius:10px;font-weight:800;cursor:pointer;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.4)}.winner-banner{text-align:center;font-size:1.35rem;font-weight:800;color:#f4d35a;margin:.5rem 0}.game-panel--table{max-width:520px;padding:4.5rem .85rem calc(1rem + env(safe-area-inset-bottom,0px))}.uno-table-turn{text-align:center;font-size:clamp(1.15rem,4.2vw,1.45rem);font-weight:700;margin:0 0 1rem;letter-spacing:.02em}.uno-table-muted{opacity:.55;text-align:center;width:100%;padding:1rem}.uno-opponent-block{display:flex;flex-direction:column;align-items:center;gap:.45rem;margin-bottom:1.1rem}.uno-opponent-avatar{border-radius:50%;border:2px solid rgba(255,255,255,.35);box-shadow:0 4px 12px #00000059}.uno-opponent-avatar--ph{width:48px;height:48px;background:#ffffff14}.uno-opponent-text{display:flex;flex-direction:column;align-items:center;gap:.1rem}.uno-opponent-name{font-weight:700;font-size:1.02rem}.uno-opponent-cards{font-size:.86rem;opacity:.72}.uno-opponent-row{display:flex;flex-wrap:wrap;gap:.32rem;justify-content:center;margin-top:.25rem}.uno-card-back{width:42px;height:60px;border-radius:10px;border:2px solid #fff;background:#0a0a0a;box-shadow:0 4px 10px #0006;flex-shrink:0}.uno-piles-row{display:flex;justify-content:center;align-items:flex-start;gap:clamp(1.25rem,8vw,2.5rem);margin:.85rem 0 1.35rem}.uno-pile-block{display:flex;flex-direction:column;align-items:center;text-align:center}.uno-pile-label{font-size:.7rem;font-weight:600;letter-spacing:.08em;opacity:.7;margin-bottom:.25rem}.uno-draw-arrow{color:#ffeb3b;font-size:1.5rem;line-height:1;margin-bottom:.2rem;filter:drop-shadow(0 2px 4px rgba(0,0,0,.5));animation:uno-draw-arrow-bob .9s ease-in-out infinite}@keyframes uno-draw-arrow-bob{0%,to{transform:translateY(0)}50%{transform:translateY(5px)}}.uno-pile-card-slot{min-height:118px;display:flex;align-items:center;justify-content:center}.uno-deck-hit{padding:0;border:none;background:transparent;cursor:pointer;-webkit-tap-highlight-color:transparent}.uno-deck-hit:disabled,.uno-deck-hit--off{cursor:default;opacity:.62}.uno-deck-hit:not(:disabled):active .uno-deck-visual{transform:rotate(-4deg) scale(.96)}.uno-deck-visual{width:74px;height:106px;border-radius:14px;border:3px solid #fff;background:#050505;box-shadow:0 8px 22px #00000080;display:flex;align-items:center;justify-content:center;transform:rotate(-5deg);transition:transform .12s ease}.uno-deck-brand{font-weight:900;font-size:1.05rem;letter-spacing:-.03em;background:linear-gradient(180deg,#ffeb3b,#ffc107 40%,#e53935);-webkit-background-clip:text;background-clip:text;color:transparent}.uno-deck-num{margin-top:.35rem;font-size:.92rem;font-weight:600;opacity:.88}.uno-discard-slot{min-height:118px;display:flex;align-items:center;justify-content:center}.uno-card-face{position:relative;width:74px;height:106px;border-radius:14px;border:3px solid #fff;box-shadow:0 8px 22px #0000007a;flex-shrink:0}.uno-card-face--r{background:#d32f2f}.uno-card-face--b{background:#1976d2}.uno-card-face--g{background:#388e3c}.uno-card-face--y{background:#fbc02d}.uno-card-face--wild{background:linear-gradient(135deg,#c62828,#f9a825 35%,#2e7d32 65%,#1565c0)}.uno-face-corner{position:absolute;font-weight:800;font-size:.62rem;line-height:1;color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.25)}.uno-face-corner--tl{top:6px;left:7px}.uno-face-corner--br{bottom:6px;right:7px;transform:rotate(180deg)}.uno-face-oval{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:58%;height:48%;background:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center}.uno-face-oval-text{font-weight:800;font-size:1.28rem;line-height:1;color:inherit}.uno-card-face--r .uno-face-oval-text{color:#c62828}.uno-card-face--b .uno-face-oval-text{color:#0d47a1}.uno-card-face--g .uno-face-oval-text{color:#1b5e20}.uno-card-face--y .uno-face-oval-text{color:#f57f17}.uno-card-face--y .uno-face-corner{color:#4e342e;text-shadow:none}.uno-card-face--wild .uno-face-oval-text{color:#37474f}.uno-card-face--wild .uno-face-corner{color:#fff}.uno-my-hand-row{display:flex;flex-wrap:wrap;gap:.42rem;justify-content:center;align-items:flex-end;min-height:122px;padding:.25rem 0}.uno-hand-card{padding:0;margin:0;border:none;background:transparent;cursor:pointer;border-radius:16px;-webkit-tap-highlight-color:transparent;transition:transform .14s ease}.uno-hand-card:disabled,.uno-hand-card--disabled{cursor:not-allowed;opacity:.42}.uno-hand-card--playable:not(:disabled){box-shadow:0 0 0 3px #ffeb3bf2;border-radius:17px}.uno-hand-card--playable:not(:disabled):hover{transform:translateY(-10px)}.uno-table-footer{display:flex;gap:.65rem;justify-content:center;margin-top:1.15rem}.uno-footer-btn{flex:1;max-width:168px;font-family:inherit;font-weight:700;font-size:.95rem;padding:.78rem 1rem;border-radius:12px;border:2px solid rgba(255,255,255,.48);background:#060c16eb;color:#fff;cursor:pointer}.uno-footer-btn:hover:not(:disabled){background:#101c30f2}.uno-footer-btn:disabled{opacity:.38;cursor:not-allowed}