:root{color-scheme:dark;--paper:#f5ead8;--muted:#baafa0;--gold:#d8b97e;--red:#c83245;--duration:.45s}*{box-sizing:border-box}body{margin:0;background:radial-gradient(ellipse at top,#302426,#100f12 65%);color:var(--paper);font:16px/1.5 system-ui,Segoe UI,sans-serif}button,input,select{font:inherit}button,a,input,select{touch-action:manipulation}button{border:1px solid #60534e;border-radius:9px;background:#292329;color:var(--paper);padding:11px 17px;cursor:pointer;min-height:46px;transition:background .2s,transform .2s}button:hover{background:#45343a}button:disabled{opacity:.4;cursor:default}button:focus-visible,a:focus-visible,select:focus-visible,input:focus-visible{outline:3px solid #ffe09d;outline-offset:4px}button.primary{background:#bc263b;border-color:#e76673;font-weight:700}button.primary:hover{background:#db3b51}a{color:var(--gold)}header{padding:20px 5vw;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #463032;gap:15px}.brand{font-size:18px;letter-spacing:3px;text-decoration:none;color:#f4e4d3;font-weight:750}.brand span{color:#e25665}.header-actions{display:flex;gap:8px}.header-actions button{font-size:14px;background:transparent}main{max-width:1400px;margin:auto;padding:30px 4vw}h1,h2{font-family:Georgia,serif;font-weight:400}h1{font-size:54px;line-height:1.13;margin:12px 0 22px}h1 em{color:#f06a79;font-style:normal}h2{font-size:25px}.eyebrow{font-size:11px;letter-spacing:3px;color:var(--gold);font-weight:700}.lead{font-size:20px;color:#d2c5b7}.panel{background:linear-gradient(125deg,#292024,#17161a);border:1px solid #54413f;border-radius:20px;padding:35px 40px;position:relative;overflow:hidden}.panel>*:not(.hero-cards){position:relative;z-index:1}.hero-cards{position:absolute;right:8%;top:70px;display:flex;transform:rotate(9deg);opacity:.85;pointer-events:none}.hero-cards .card{width:125px;height:185px;margin-left:-30px;font-size:75px}.hero-cards .card:first-child{transform:rotate(-23deg) translateY(10px)}.hero-cards .card:last-child{transform:rotate(13deg) translateY(10px)}.modes{display:flex;gap:10px;margin:28px 0}.modes .chosen{border-color:var(--gold);background:#554335}.setup-line{display:flex;gap:20px;align-items:end;flex-wrap:wrap;margin:20px 0}label{display:inline-flex;flex-direction:column;gap:6px;color:#e4d4c1}input,select{background:#19171a;border:1px solid #665453;color:var(--paper);padding:10px;border-radius:7px;min-height:45px}input[type=checkbox]{min-height:20px;width:22px;accent-color:#e35066}.seat-row{display:flex;gap:10px;margin:8px 0;align-items:center;flex-wrap:wrap}.seat-row input{width:190px}.seat-row span{min-width:30px;color:var(--gold)}#seatsSetup{margin-bottom:25px;max-width:700px}.rules-note{font-size:13px;color:var(--muted);margin-top:25px}#formatHelp{font-size:14px;color:var(--muted);max-width:630px}footer{text-align:center;border-top:1px solid #3b3032;padding:25px;font-size:14px;color:#c9b69d}footer small{display:block;font-size:11px;margin-top:10px;color:#9f9390}.table-heading{display:flex;justify-content:space-between;align-items:center}.table-heading h1{font-size:40px;margin:5px 0 20px}.table-heading h1 span{font:15px system-ui;color:var(--muted);margin-left:15px}#direction{font-size:14px;color:var(--gold)}.opponents{display:grid;grid-template-columns:repeat(auto-fit,minmax(115px,1fr));gap:8px;margin:5px 0 18px}.seat{border:1px solid #4e4140;background:#211e21;border-radius:12px;padding:12px;font-size:13px;min-width:0}.seat strong{display:block;overflow-wrap:anywhere}.seat small{color:var(--muted);display:block}.seat.active{border-color:#e4c58a;background:#463d2d;box-shadow:0 0 15px #d9b77320}.seat .count{font-size:21px;font-weight:700;color:#f1d8a4}.table{border:13px solid #5c3529;border-radius:60px;background:radial-gradient(ellipse at center,#205345,#103329);box-shadow:0 0 0 2px #976746,inset 0 0 0 3px #b0805060,inset 0 0 55px #041910,0 20px 30px #0005;min-height:360px;position:relative;padding:32px 25px 22px;text-align:center;overflow:hidden}.table:before{content:'';position:absolute;inset:10px;border:1px solid #ceba7130;border-radius:40px;pointer-events:none}.table-mark{font-size:10px;letter-spacing:5px;color:#c9d6b05c;margin:0 0 14px}.table-mark span{display:block;font-size:7px;letter-spacing:3px}.piles{display:flex;align-items:center;justify-content:center;gap:35px}.card{width:98px;height:145px;border:5px solid #f2e5d2;border-radius:13px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff8e7;text-shadow:0 2px 1px #0005;box-shadow:0 5px 9px #0005,inset 0 0 0 1px #fff4;position:relative;font-size:47px;font-weight:800;line-height:1.15;flex-shrink:0;overflow:hidden;padding:8px;background:#34313b}.card:before{content:'';position:absolute;inset:22px 5px;border:2px solid #fff8;border-radius:50%;transform:rotate(-30deg);pointer-events:none}.card small{font-size:10px;letter-spacing:.5px;z-index:1}.card b{z-index:1}.card .corner{position:absolute;left:5px;top:4px;font-size:15px}.red{background:linear-gradient(130deg,#eb4054,#a1172e)}.yellow{background:linear-gradient(130deg,#ffdc60,#ce950e);color:#382500;text-shadow:none}.green{background:linear-gradient(130deg,#319676,#126149)}.blue{background:linear-gradient(130deg,#4598e2,#2054a2)}.wild{background:conic-gradient(from 45deg,#b73144,#d7af30,#287b5c,#245fa1,#b73144)}.back{background:repeating-linear-gradient(45deg,#231f27,#231f27 5px,#302832 5px,#302832 7px);outline:1px solid #a07754;outline-offset:3px}.back span{font:italic 35px Georgia;color:#e5c68e}.back small{margin-top:5px}.pile-label{font-size:9px;letter-spacing:3px;margin:7px 0 0;color:#b9cab5}.piles>button{margin-top:-21px}.color-badge{width:90px;height:90px;border-radius:50%;border:2px solid #f3deaa;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;text-transform:uppercase;box-shadow:0 0 30px #0003}#pileCount{font-size:11px;color:#9cbaa8;margin:0}#message{font-size:16px;min-height:35px;margin:12px auto 3px;max-width:800px}#responses button,#catchControls button{margin:7px}.hand-panel{margin:20px 0;background:#211d20;border:1px solid #4c3c3e;border-radius:16px;padding:18px 24px}.hand-title{display:flex;justify-content:space-between;align-items:center;gap:10px}.hand-title h2{margin:0 0 12px}.hand-title button{font-size:13px;padding:8px 12px}.hand{display:flex;gap:10px;overflow-x:auto;padding:16px 8px 13px;min-height:182px;scrollbar-color:#916c54 #181517}.hand .card{opacity:.55;transition:transform .2s}.hand .card.legal{opacity:1;box-shadow:0 0 0 2px #d9c794,0 6px 9px #0006}.hand .card.selected{transform:translateY(-10px);outline:3px solid #ffdc88;outline-offset:3px}.hand .card:hover{transform:translateY(-6px)}.turn-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap}.uno{background:#e5be72;color:#241d19;font-size:21px;font-weight:900;letter-spacing:1px}.uno.armed{background:#f2e1a5;box-shadow:0 0 0 4px #e6c57955}#selectedText,#unoHelp{text-align:center;color:var(--muted);font-size:13px;min-height:19px}details{margin:20px 0;border-top:1px solid #443738;padding-top:15px}summary{cursor:pointer;color:var(--gold)}#scores{display:flex;gap:20px;flex-wrap:wrap;margin:15px 0}#events{font-size:13px;color:var(--muted)}dialog{background:#262025;color:var(--paper);border:1px solid #a58667;border-radius:20px;max-width:560px;width:calc(100% - 28px);padding:28px;box-shadow:0 30px 70px #000b}dialog::backdrop{background:#080a0df2}dialog h2{font-size:30px}dialog label{display:flex;margin:20px 0}dialog button{margin:5px}.color-choices{display:flex;flex-wrap:wrap;gap:12px}.color-choices button{min-width:100px;font-weight:750}.reveal{background:#1f202a;border:1px solid #d8b97e;padding:14px;border-radius:10px;margin:12px}#toast{position:fixed;bottom:18px;left:50%;transform:translateX(-50%);max-width:90vw;background:#512b33;color:#fff;padding:14px 22px;border-radius:10px;z-index:100;display:none;border:1px solid #cc7d86}.animate{animation:cardIn var(--duration) ease-out}.event-reverse #direction{animation:pulse var(--duration) 2}.event-skip .seat.active,.event-uno .uno{animation:pulse var(--duration) 2}.event-penalty .back{animation:pulse var(--duration) 2}.event-victory .table{box-shadow:0 0 35px #edcb79}.event-color .color-badge{animation:pulse var(--duration) 2}.event-draw .hand .card:last-child{animation:cardIn var(--duration)}.event-deal .hand .card{animation:cardIn var(--duration)}@keyframes cardIn{from{transform:translate(-75px,-25px) rotate(-15deg);opacity:0}to{transform:translate(0) rotate(0);opacity:1}}@keyframes pulse{50%{filter:brightness(1.6);transform:scale(1.03)}}body.reduced *,body.reduced *:before{animation:none!important;transition:none!important}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}[hidden]{display:none!important}@media(max-width:850px){.hero-cards{right:3%;opacity:.25}.panel{padding:25px}.opponents{grid-template-columns:repeat(5,1fr)}.seat{padding:8px;font-size:11px}}@media(max-width:560px){header{padding:15px;flex-wrap:wrap}.header-actions{width:100%;justify-content:space-between}.header-actions button{font-size:12px;flex:1;padding:7px}main{padding:16px 12px}.panel{padding:22px 18px}h1{font-size:38px}.lead{font-size:17px}.hero-cards{display:none}.modes{gap:5px}.modes button{padding:9px;font-size:13px}.seat-row{gap:6px}.seat-row input{width:128px}.seat-row select{max-width:110px}.seat-row span{min-width:15px}.opponents{grid-template-columns:repeat(3,1fr)}.table{border-width:8px;border-radius:28px;padding:20px 10px;min-height:330px}.table:before{border-radius:18px}.piles{gap:18px}.color-badge{width:60px;height:60px;font-size:11px}.card{width:83px;height:126px;font-size:38px}.hand .card{width:96px;height:143px}.hand{margin:0 -12px;min-height:178px}.hand-panel{padding:15px}.hand-title h2{font-size:21px}.hand-title button{font-size:11px;padding:6px 8px}.turn-actions{gap:6px}.turn-actions button{flex:1 1 43%;padding:10px}.table-heading h1{font-size:32px}#direction{font-size:11px;max-width:105px}footer{font-size:12px;padding:20px 15px}#message{font-size:14px}.setup-line{gap:10px}.setup-line input{max-width:175px}}