body{background:#f1f3ee}.uno-layout{grid-template-rows:auto minmax(210px,1fr) auto auto;grid-template-columns:minmax(0,1fr);gap:clamp(10px,1.5dvh,16px);width:min(1040px,100% - 40px);height:calc(100dvh - 68px);margin:0 auto;padding:14px 0 12px;display:grid;overflow:hidden}.uno-status{text-align:center}.uno-status p,.uno-status h2,.hand-heading p,.active-color span,.opponent-area p{margin:0}#turn-kicker{color:#d54238;text-transform:uppercase;font-size:.78rem;font-weight:850}.uno-status h2{margin-top:3px;font-size:clamp(1.35rem,3dvh,1.8rem);line-height:1.2}.player-strip{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;width:min(100%,720px);margin-top:8px;margin-left:auto;margin-right:auto;display:flex}.player-chip{color:#73766f;text-align:left;grid-template-columns:auto 1fr auto;align-items:center;gap:7px;min-width:178px;font-size:.8rem;font-weight:750;display:grid}.player-chip strong{color:#9a9d96;font-size:.74rem}.player-chip.is-current{color:#202229}.player-chip.is-current strong{color:#d54238}.player-chip.is-winner,.player-chip.is-winner strong{color:#16835d}.player-dot{border-radius:50%;width:10px;height:10px}.player-dot-0{background:#e34c43}.player-dot-1{background:#296fd1}.player-dot-2{background:#e0a822}.player-dot-3{background:#17875f}.versus{color:#a5a8a0;font-size:.68rem;font-weight:850}.uno-table{background:repeating-linear-gradient(0deg,#ffffff09 0 1px,#0000 1px 6px),#28745c;border:8px solid #184a3a;border-radius:8px;grid-template-rows:1fr auto;width:100%;min-width:0;min-height:0;margin-top:0;padding:16px 30px 14px;display:grid;position:relative;box-shadow:0 9px #11392d,0 24px 45px #1742342e}.opponent-area{flex-direction:column;align-items:center;gap:8px;min-height:84px;display:flex}.opponent-area p,.pile-label,.draw-pile>span:last-child,.active-color span,.color-picker>span{color:#ffffffd6;font-size:.72rem;font-weight:800}.opponent-hand{width:min(240px,62vw);height:80px;position:relative}.mini-card-back{bottom:0;left:calc((var(--index,0) * 14px));color:#fff6df;width:54px;height:78px;transform:rotate(calc((var(--index,0) - (var(--card-count) - 1) / 2) * 4deg));transform-origin:bottom;background:#de453d;border:3px solid #fff6df;border-radius:6px;place-items:center;display:grid;position:absolute;box-shadow:0 3px #12302652}.mini-card-back:before,.card-back:before{content:"";border:2px solid #fff6df;border-radius:50%;position:absolute;inset:6px;transform:rotate(-24deg)}.mini-card-back b,.card-back b{z-index:1;font-size:.8rem;font-style:italic;position:relative}.opponent-hand .mini-card-back:first-child{--index:0}.opponent-hand .mini-card-back:nth-child(2){--index:1}.opponent-hand .mini-card-back:nth-child(3){--index:2}.opponent-hand .mini-card-back:nth-child(4){--index:3}.opponent-hand .mini-card-back:nth-child(5){--index:4}.opponent-hand .mini-card-back:nth-child(6){--index:5}.opponent-hand .mini-card-back:nth-child(7){--index:6}.opponent-hand .mini-card-back:nth-child(8){--index:7}.opponent-hand .mini-card-back:nth-child(9){--index:8}.opponent-hand .mini-card-back:nth-child(10){--index:9}.opponent-hand .mini-card-back:nth-child(11){--index:10}.opponent-hand .mini-card-back:nth-child(12){--index:11}.table-center{grid-template-columns:124px 124px;justify-content:center;align-items:end;gap:30px;min-width:0;display:grid}.draw-pile,.discard-area{flex-direction:column;align-items:center;gap:8px;min-width:0;display:flex}.draw-pile{cursor:pointer;background:0 0;border:0;padding:0}.draw-pile:disabled{cursor:default}.card-back{color:#fff6df;background:#de453d;border:4px solid #fff6df;border-radius:8px;place-items:center;width:94px;height:132px;display:grid;position:relative;overflow:hidden;box-shadow:5px 5px #14382c61}.draw-pile:not(:disabled):hover .card-back{transform:translateY(-4px)rotate(-2deg)}.discard-pile{place-items:center;width:100px;height:138px;display:grid}.active-color{align-items:center;gap:7px;display:flex;position:absolute;bottom:23px;right:23px}.active-color i{border:2px solid #ffffffbf;border-radius:50%;width:15px;height:15px}[data-color=red]{--card-color:#e2463e}[data-color=yellow]{--card-color:#f0bb31}[data-color=green]{--card-color:#248d62}[data-color=blue]{--card-color:#3177d1}.active-color i[data-color],.color-picker button[data-color-choice]{background:var(--card-color)}.active-color i[data-color=red],.color-picker button[data-color-choice=red]{--card-color:#e2463e}.active-color i[data-color=yellow],.color-picker button[data-color-choice=yellow]{--card-color:#f0bb31}.active-color i[data-color=green],.color-picker button[data-color-choice=green]{--card-color:#248d62}.active-color i[data-color=blue],.color-picker button[data-color-choice=blue]{--card-color:#3177d1}.color-picker{align-items:center;gap:9px;display:flex;position:absolute;bottom:49px;right:24px}.color-picker[hidden]{display:none}.color-picker>div{gap:6px;display:flex}.color-picker button{cursor:pointer;border:2px solid #ffffffb3;border-radius:50%;width:24px;height:24px;padding:0}.color-picker button:hover{transform:scale(1.15)}.hand-area{min-height:0;margin-top:0}.hand-heading{color:#3f433d;justify-content:space-between;align-items:center;font-size:.82rem;font-weight:800;display:flex}.hand-heading span{color:#898d85;font-size:.76rem}.own-hand{scrollbar-width:none;grid-template-rows:minmax(0,1fr);grid-auto-columns:76px;grid-auto-flow:column;justify-content:safe center;gap:8px;height:clamp(82px,16dvh,118px);min-height:0;max-height:clamp(82px,16dvh,118px);margin-top:7px;padding:0 4px 8px;display:grid;overflow:auto hidden}.own-hand::-webkit-scrollbar{display:none}.uno-card{background:var(--card-color);color:#fff;border:3px solid #fff8e8;border-radius:8px;place-items:center;width:76px;min-width:76px;height:min(100%,106px);padding:0;display:grid;position:relative;overflow:hidden;box-shadow:0 4px #24282433}button.uno-card{cursor:pointer}button.uno-card:disabled{cursor:default;opacity:.55}button.uno-card.is-playable:not(:disabled):hover,button.uno-card.is-selected{transform:translateY(-8px);box-shadow:0 10px #2428242e}button.uno-card.is-selected{outline-offset:3px;outline:3px solid #202229}.discard-pile .uno-card{width:94px}.uno-card:before{content:"";background:#fff8e8;border-radius:50%;width:142%;height:64%;position:absolute;transform:rotate(-30deg)}.uno-card[data-color=wild]{--card-color:#25282a}.uno-card[data-color=wild]:before{background:conic-gradient(from 40deg, #e2463e 0 25%, #f0bb31 25% 50%, #248d62 50% 75%, #3177d1 75% 100%)}.card-corner,.card-main{z-index:1;text-shadow:0 1px #1f23203d;font-weight:900;line-height:1;position:relative}.card-corner{font-size:clamp(.62rem,1.4vw,.86rem);position:absolute;top:7px;left:7px}.card-corner-bottom{inset:auto 7px 7px auto;transform:rotate(180deg)}.card-main{color:var(--card-color);font-size:clamp(1.45rem,3.5vw,2.45rem)}.uno-card[data-color=wild] .card-main{color:#fff}.uno-footer{flex-direction:column;align-items:center;min-height:0;display:flex}.uno-footer p{color:#71756d;text-align:center;min-height:21px;margin:0;font-size:.84rem}.rematch-action{color:#fff;cursor:pointer;background:#202229;border:1px solid #202229;border-radius:6px;min-width:156px;min-height:46px;padding:0 20px;font-weight:800;box-shadow:0 4px #050506}.rematch-action:disabled{cursor:not-allowed;opacity:.45;box-shadow:none}@media (width<=620px){.uno-layout{grid-template-rows:auto minmax(190px,1fr) auto auto;gap:9px;width:calc(100% - 24px);height:calc(100dvh - 62px);padding:10px 0 8px}.uno-status h2{font-size:1.55rem}.player-chip{grid-template-columns:auto 1fr;min-width:0}.player-chip strong{grid-column:2}.uno-table{border-width:6px;min-height:0;padding:12px 16px}.table-center{grid-template-columns:108px 108px;gap:17px}.card-back,.discard-pile .uno-card{width:82px}.card-back{height:116px}.discard-pile{width:88px;height:122px}.active-color{bottom:15px;right:15px}.color-picker{bottom:42px;right:14px}.color-picker>span{display:none}.own-hand{grid-auto-columns:48px;gap:5px;height:clamp(68px,14dvh,96px);max-height:clamp(68px,14dvh,96px);margin-top:5px;padding-bottom:5px}.uno-card{border-width:2px;border-radius:6px;width:48px;min-width:48px;height:min(100%,67px)}.card-corner{font-size:.56rem;top:4px;left:4px}.card-corner-bottom{inset:auto 4px 4px auto}.card-main{font-size:1.35rem}}@media (width<=390px){.player-strip{gap:7px}.uno-table{margin-top:0}.table-center{grid-template-columns:96px 96px;gap:8px}.opponent-area{min-height:98px}}