:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#f3f0e8;--ink:#f3f0e8;--muted:#9ca7a8;--line:#283137;--accent:#d9ff57;--panel:#151b1f;background:#0d1114;font-family:Inter,ui-sans-serif,system-ui,sans-serif}*{box-sizing:border-box}body{background:radial-gradient(circle at 82% 5%,#293520 0,#0000 28rem),#0d1114;min-width:320px;min-height:100vh;margin:0}button,input{font:inherit}button{cursor:pointer}button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}.nav,.game-nav{justify-content:space-between;align-items:center;max-width:1180px;margin:auto;padding:1.4rem 2rem;display:flex}.brand{color:var(--ink);letter-spacing:-.04em;font-size:1.1rem;font-weight:850;text-decoration:none}.text-button,.back{color:var(--muted);background:0 0;border:0;padding:.6rem}.text-button:hover,.back:hover{color:var(--ink)}.floating{z-index:2;position:fixed;top:1rem;left:1rem}.hero{grid-template-columns:1.45fr .55fr;align-items:center;gap:4rem;max-width:1180px;min-height:67vh;margin:auto;padding:5rem 2rem 4rem;display:grid}.eyebrow{color:var(--accent);text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;font-weight:800}h1{letter-spacing:-.07em;margin:1rem 0 1.5rem;font-size:clamp(3rem,7vw,6.5rem);line-height:.91}h1 em{color:var(--accent);font-style:normal}h2{letter-spacing:-.03em}.lede{color:#bdc5c3;max-width:42rem;font-size:clamp(1.05rem,2vw,1.35rem);line-height:1.6}.actions{flex-wrap:wrap;gap:.8rem;margin:2rem 0 1rem;display:flex}.primary,.secondary{border:1px solid var(--accent);border-radius:999px;padding:.9rem 1.3rem;font-weight:800}.primary{background:var(--accent);color:#11160e}.primary:hover{background:#edffad}.secondary{color:var(--ink);background:0 0;border-color:#536064}.secondary:hover{border-color:var(--ink)}.primary:disabled,.secondary:disabled{opacity:.45;cursor:not-allowed}.disclaimer{color:#879394;font-size:.8rem}.hero-card{aspect-ratio:.7;text-align:center;color:#0c100b;text-shadow:0 1px #e9ff8c;background:repeating-linear-gradient(135deg,#b9dc3d 0 2px,#1b241a 2px 14px);border:2px solid #647339;border-radius:1.2rem;place-content:center;justify-self:center;width:min(100%,240px);display:grid;transform:rotate(8deg);box-shadow:0 25px 80px #0008,inset 0 0 0 8px #121813}.hero-card span{letter-spacing:-.12em;font-size:3rem;font-weight:950}.hero-card b{letter-spacing:.3em;font-size:1rem}.features{background:var(--line);border:1px solid var(--line);grid-template-columns:repeat(3,1fr);gap:1px;max-width:1180px;margin:auto;padding:0 2rem 5rem;display:grid}.features article{background:#101519;padding:2rem}.features span{color:var(--accent);font-family:monospace}.features p{color:var(--muted);line-height:1.6}.board{max-width:1040px;margin:auto;padding:1rem 2rem 5rem}.table-header{justify-content:space-between;align-items:flex-start;gap:2rem;display:flex}.table-header h1{font-size:clamp(2.4rem,6vw,5rem)}.turn-status{color:var(--muted)}.mode{text-transform:uppercase;letter-spacing:.1em;border:1px solid;border-radius:999px;padding:.35rem .6rem;font-size:.65rem;font-weight:850;display:inline-block}.mode-simulation{color:#ffcb6b}.mode-hosted{color:var(--accent)}.connection{color:var(--muted);white-space:nowrap;font-size:.8rem}.dot{background:#ff6961;border-radius:50%;width:.55rem;height:.55rem;margin-right:.5rem;display:inline-block}.dot.ok{background:var(--accent)}.players{grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:.6rem;display:grid}.player{border:1px solid var(--line);color:var(--muted);border-radius:.7rem;flex-direction:column;gap:.25rem;padding:.9rem;display:flex}.player strong{color:var(--ink)}.player.active{border-color:var(--accent);background:#20281d}.uno-call{color:var(--accent);font-weight:900}.play-area{justify-content:center;align-items:center;gap:2rem;min-height:18rem;padding:2rem;display:flex}.card,.draw-pile{color:#fff;text-align:left;border:2px solid #fff5;border-radius:.75rem;flex-direction:column;flex:0 0 7.2rem;justify-content:space-between;width:7.2rem;height:10.3rem;padding:.7rem;transition:transform .15s,filter .15s;display:flex;box-shadow:0 8px 20px #0006}.card span,.draw-pile span{font-size:1.7rem;font-weight:950}.card small,.draw-pile small{text-transform:uppercase;letter-spacing:.08em;font-size:.62rem}.card:not(:disabled):hover{transform:translateY(-10px)}.card:disabled{opacity:.5;cursor:not-allowed;filter:saturate(.6)}.top-card{transform:rotate(5deg)}.draw-pile{color:var(--accent);background:repeating-linear-gradient(135deg,#202a2c 0 4px,#0c1112 4px 9px)}.card-red,.color-red{background:#bd3a42}.card-yellow,.color-yellow{color:#10140d;background:#d39b23}.card-green,.color-green{background:#298557}.card-blue,.color-blue{background:#2d68a2}.card-wild{background:conic-gradient(#bd3a42,#b68013,#298557,#2d68a2,#bd3a42)}.hand{border-top:1px solid var(--line);padding-top:1rem}.hand-heading{justify-content:space-between;align-items:center;display:flex}.cards{scroll-snap-type:x mandatory;gap:.5rem;padding:1rem .25rem 1.5rem;display:flex;overflow-x:auto}.cards .card{scroll-snap-align:center}.color-picker{text-align:center;background:var(--panel);border-radius:1rem;padding:1rem}.color-picker div{flex-wrap:wrap;justify-content:center;gap:.5rem;margin-top:.8rem;display:flex}.color{color:#fff;text-transform:capitalize;border:0;border-radius:999px;padding:.65rem 1rem;font-weight:800}.color:disabled{cursor:not-allowed;opacity:.45}.toast{z-index:5;background:#20282c;border:1px solid #526066;border-radius:999px;padding:.7rem 1rem;position:fixed;bottom:1rem;left:50%;transform:translate(-50%);box-shadow:0 8px 40px #000}.toast.error{border-color:#ff6961}.loading{text-align:center;place-content:center;gap:1rem;min-height:100vh;display:grid}.loader{border:3px solid #333;border-top-color:var(--accent);border-radius:50%;width:2rem;height:2rem;margin:auto;animation:1s linear infinite spin}.modal{width:min(100% - 2rem,550px);max-height:calc(100vh - 2rem);color:inherit;background:0 0;border:0;padding:0;overflow:auto}.modal::backdrop{background:#000b}.modal-close{color:var(--muted);z-index:2;background:0 0;border:0;font-size:2rem;position:absolute;top:1rem;right:1rem}.panel{background:#151b1f;border:1px solid #394349;border-radius:1rem;padding:clamp(1.5rem,5vw,2.5rem);box-shadow:0 30px 80px #000}.panel h2{font-size:2rem}.panel label{color:#c6cecc;gap:.5rem;margin:1rem 0;font-weight:700;display:grid}.panel input{color:#fff;background:#0b0f11;border:1px solid #4c585c;border-radius:.5rem;padding:.8rem}.panel .check{align-items:center;font-weight:400;display:flex}.warning{border-left:3px solid var(--accent);color:#d9ddca;background:#26281b;padding:.8rem;font-size:.87rem;line-height:1.45}.panel details{border-top:1px solid var(--line);color:var(--muted);margin-top:1.5rem;padding-top:1rem}.panel summary{cursor:pointer}.legal{max-width:760px;margin:auto;padding:7rem 2rem}.legal h1{font-size:clamp(3rem,8vw,5rem)}.legal h2{margin-top:2.5rem}.legal p{color:#b8c1bf;line-height:1.75}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=700px){.nav,.game-nav{padding:1rem}.hero{grid-template-columns:1fr;min-height:auto;padding:4rem 1.2rem 3rem}.hero-card{display:none}.features{background:0 0;border:0;grid-template-columns:1fr;gap:.7rem;padding:0 1.2rem 3rem}.features article{border:1px solid var(--line)}.board{padding:1rem 1rem 5rem}.table-header{flex-direction:column;gap:0}.players{display:flex;overflow-x:auto}.player{min-width:145px}.play-area{gap:1rem;min-height:15rem;padding:1rem}.card,.draw-pile{flex-basis:5.6rem;width:5.6rem;height:8.2rem}.card span,.draw-pile span{font-size:1.3rem}.hand-heading h2{font-size:1.1rem}.hand-heading .secondary{padding:.55rem .75rem}.cards{margin-right:-1rem}.toast{text-align:center;width:calc(100% - 2rem)}.legal{padding:5rem 1.2rem}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}