:root{--red:#e33b4e;--yellow:#f2b705;--green:#27a844;--blue:#2d6ee0;--bg:#14162b;--bg-soft:#1e2140;--panel:#262a4d;--text:#f2f3fa;--muted:#9aa0c3;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body,#root{height:100%;margin:0}body{background:radial-gradient(circle at 50% 20%, #1d2144 0%, var(--bg) 70%);color:var(--text);overscroll-behavior:none;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}button{font:inherit;color:inherit;cursor:pointer}h1{text-align:center;margin:.5rem 0;font-size:1.5rem}h2{margin:.4rem 0;font-size:1.2rem}.btn{background:var(--panel);color:var(--text);border:0;border-radius:12px;padding:.7rem 1.4rem;font-size:1rem;font-weight:700;box-shadow:0 2px #00000059}.btn:disabled{opacity:.45;cursor:default}.btn.primary{background:var(--blue)}.btn.danger{background:var(--red)}.btn.uno{background:var(--yellow);color:#222}.btn.uno.urgent{animation:.7s infinite alternate pulse}.btn.big{width:100%;padding:.9rem;font-size:1.1rem}.link-btn{color:var(--muted);background:0 0;border:0;padding:.5rem;text-decoration:underline}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.08)}}.field{flex-direction:column;gap:.3rem;width:100%;display:flex}.field span{color:var(--muted);font-size:.85rem}.field input{background:var(--bg-soft);color:var(--text);border:1px solid #3a3f6e;border-radius:10px;padding:.7rem .9rem;font-size:1rem}.code-input{text-transform:uppercase;letter-spacing:.4em;text-align:center;font-weight:800}.error{color:#ff8b98;text-align:center}.hint,.waiting,.link-preview{color:var(--muted);text-align:center;overflow-wrap:anywhere;font-size:.9rem}.points{text-align:center;font-size:1.2rem}.center-screen{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:.9rem;min-height:100dvh;padding:1.5rem;display:flex}.center-screen .btn.big{max-width:320px}.spinner{border:4px solid var(--panel);border-top-color:var(--blue);border-radius:50%;width:34px;height:34px;animation:.9s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.overlay{z-index:40;background:#080914bf;justify-content:center;align-items:center;padding:1.5rem;display:flex;position:fixed;inset:0}.panel{background:var(--panel);text-align:center;border-radius:18px;flex-direction:column;align-items:center;gap:.9rem;width:100%;max-width:340px;padding:1.4rem;display:flex;box-shadow:0 12px 40px #00000080}.row{gap:.7rem;display:flex}.toasts{top:max(.8rem, env(safe-area-inset-top));z-index:60;pointer-events:none;flex-direction:column;gap:.4rem;display:flex;position:fixed;left:50%;transform:translate(-50%)}.toast{background:var(--panel);border-radius:10px;padding:.55rem 1rem;font-size:.9rem;font-weight:600;animation:.2s ease-out toast-in;box-shadow:0 4px 14px #00000073}.toast.error{background:#7c2733}@keyframes toast-in{0%{opacity:0;transform:translateY(-8px)}}.reconnect-banner{background:var(--yellow);color:#222;text-align:center;z-index:50;padding:.35rem;font-weight:700;position:fixed;top:0;left:0;right:0}.home{flex-direction:column;justify-content:center;gap:1rem;max-width:380px;min-height:100dvh;margin:0 auto;padding:1.5rem;display:flex}.brand{flex-direction:column;align-items:center;margin:.6rem 0 1.2rem;display:flex}.brand-arc{filter:drop-shadow(0 2px 6px #0000008c);width:300px;max-width:90%;height:auto;margin-bottom:-4px;overflow:visible}.brand-arc-text{fill:var(--text);letter-spacing:2.5px;font-family:Arial Black,system-ui,sans-serif;font-size:19px;font-weight:900}.brand-arc-text .amp{fill:var(--yellow)}.logo{justify-content:center;align-items:flex-end;display:flex}.logo-card{background:var(--tint);transform-origin:bottom;border:3px solid #fff;border-radius:14px;width:74px;height:106px;animation:.5s cubic-bezier(.34,1.56,.64,1) backwards logo-pop;position:relative;box-shadow:0 12px 24px #00000080}.logo-card.red{--tint:var(--red);--ink:var(--red)}.logo-card.yellow{--tint:var(--yellow);--ink:var(--yellow)}.logo-card.blue{--tint:var(--blue);--ink:var(--blue)}.logo-heart{width:calc(100% - 2px);height:calc(100% - 6px);position:absolute;inset:3px 1px}.logo-card:after{content:attr(data-letter);color:var(--ink);place-items:center;font-size:3rem;font-weight:900;display:grid;position:absolute;inset:0}.logo-card .corner{z-index:1;color:#fff;text-shadow:0 1px 2px #0006;font-size:.9rem;font-style:normal;font-weight:800;position:absolute}.logo-card .corner.tl{top:5px;left:8px}.logo-card .corner.br{bottom:5px;right:8px;transform:rotate(180deg)}.logo-card:first-child{z-index:1;margin-right:-10px;animation-delay:30ms;transform:rotate(-9deg)}.logo-card:nth-child(2){z-index:3;animation-delay:.11s;transform:translateY(-10px)rotate(0)}.logo-card:nth-child(3){z-index:2;margin-left:-10px;animation-delay:.19s;transform:rotate(9deg)}@keyframes logo-pop{0%{opacity:0;transform:translateY(16px)rotate(0)scale(.8)}}@media (prefers-reduced-motion:reduce){.logo-card{animation:none}}.card-panel{background:var(--bg-soft);border-radius:16px;flex-direction:column;gap:.7rem;padding:1.1rem;display:flex}.divider{text-align:center;color:var(--muted)}.options{flex-direction:column;gap:.5rem;display:flex}.toggle{align-items:center;gap:.6rem;font-size:.95rem;display:flex}.toggle input{width:1.15rem;height:1.15rem;accent-color:var(--blue)}.room-code{letter-spacing:.25em;background:var(--bg-soft);border-radius:16px;padding:.6rem 1rem .6rem 1.35rem;font-size:3.4rem;font-weight:900}.card{color:#fff;-webkit-user-select:none;user-select:none;background:#333;border:3px solid #fff;border-radius:10px;flex-shrink:0;width:62px;height:92px;padding:0;transition:transform .12s ease-out,filter .12s;position:relative;box-shadow:0 2px 6px #00000073}.card-svg{pointer-events:none;clip-path:inset(0 round 7px);width:100%;height:100%;display:block;position:absolute;inset:0}.card.red{background:var(--red)}.card.yellow{background:var(--yellow)}.card.green{background:var(--green)}.card.blue{background:var(--blue)}.card.wild{background:#1c1c24}.card.back{background:#141420}.card.dim{filter:brightness(.45)saturate(.7)}.card.selected{outline-offset:2px;outline:3px solid #fff;transform:translateY(-16px)}.order-badge{color:#222;background:#fff;border-radius:50%;place-items:center;width:20px;height:20px;font-size:.75rem;font-weight:800;display:grid;position:absolute;top:-8px;right:-6px;box-shadow:0 1px 4px #0006}.top-marker{background:var(--yellow);color:#222;text-transform:uppercase;border-radius:6px;padding:1px 5px;font-size:.6rem;font-weight:900;position:absolute;bottom:-9px;left:50%;transform:translate(-50%)}.game{height:100dvh;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);flex-direction:column;display:flex;position:relative}.board-flash{z-index:50;pointer-events:none;flex-direction:column;justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.board-flash-inner{text-align:center;filter:drop-shadow(0 8px 16px #0000008c);flex-direction:column;align-items:center;gap:.5rem;animation:1.8s ease-out forwards flash-pop;display:flex}.board-flash-text{letter-spacing:.06em;color:#fff;paint-order:stroke fill;font-size:clamp(4rem,22vw,11rem);font-weight:900;line-height:.9}.board-flash-sub{letter-spacing:.02em;color:#fff;max-width:90vw;font-size:clamp(1rem,5vw,2rem);font-weight:800}.board-flash.tone-uno .board-flash-text{color:var(--yellow);-webkit-text-stroke:6px #171717}.board-flash.tone-custom .board-flash-text{color:#fff;text-transform:uppercase;-webkit-text-stroke:5px #171717}.board-flash.tone-custom .board-flash-sub{color:var(--yellow)}@keyframes flash-pop{0%{opacity:0;transform:scale(.4)rotate(-6deg)}18%{opacity:1;transform:scale(1.12)rotate(-2deg)}32%{transform:scale(1)rotate(0)}72%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(1.05)}}@media (prefers-reduced-motion:reduce){.board-flash-inner{animation:1.8s ease-out forwards flash-fade}@keyframes flash-fade{0%,80%{opacity:1}to{opacity:0}}}.opponent-bar{background:#00000040;border-bottom:2px solid #0000;flex-direction:column;gap:.35rem;padding:.7rem 1rem .5rem;display:flex}.opponent-bar.active{border-bottom-color:var(--yellow)}.opp-row{align-items:center;gap:.5rem;display:flex}.opp-name{font-weight:800}.scores{color:var(--muted);margin-left:auto;font-weight:700}.badge{border-radius:6px;padding:2px 6px;font-size:.7rem;font-weight:800}.badge.offline{background:#444}.badge.uno-badge{background:var(--yellow);color:#222}.opp-count-badge{color:var(--muted);border:1.5px solid #34395f;border-radius:6px;padding:2px 7px;font-size:.72rem;font-weight:800}.opponent-hand-area{background:#00000040;padding:.5rem 0 .3rem}.opponent-hand-area .hand{pointer-events:none;padding:.4rem 1rem}.table{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:.8rem;min-height:0;display:flex}.piles{align-items:center;gap:2rem;display:flex}.draw-pile{background:0 0;border:0;flex-direction:column;align-items:center;gap:.35rem;display:flex}.draw-pile:disabled{opacity:.6;cursor:default}.pile-label{color:var(--muted);font-size:.8rem;font-weight:700}.draw-pile:not(:disabled) .pile-label{color:var(--text)}.discard{border-radius:14px;padding:6px;position:relative}.glow-red{box-shadow:0 0 26px 6px #e33b4e8c}.glow-yellow{box-shadow:0 0 26px 6px #f2b7058c}.glow-green{box-shadow:0 0 26px 6px #27a8448c}.glow-blue{box-shadow:0 0 26px 6px #2d6ee08c}.active-color{border:2px solid #fff;border-radius:50%;width:18px;height:18px;position:absolute;top:-6px;right:-6px}.dot-red{background:var(--red)}.dot-yellow{background:var(--yellow)}.dot-green{background:var(--green)}.dot-blue{background:var(--blue)}.pending-badge{background:var(--red);border-radius:10px;padding:.25rem .8rem;font-weight:900}.turn-indicator{color:var(--muted);font-weight:700}.turn-indicator.yours{color:var(--yellow)}.actions{justify-content:center;align-items:center;gap:.7rem;min-height:3.4rem;padding:.4rem 1rem;display:flex}.hand-area{background:#00000040;padding:.3rem 0 .9rem}.hand-area,.opponent-hand-area{transition:background .35s,box-shadow .35s}.hand-area.active-turn,.opponent-hand-area.active-turn{background:#f2b70517;animation:2.4s ease-in-out infinite turn-glow}@keyframes turn-glow{0%,to{box-shadow:0 0 16px 2px #f2b7054d}50%{box-shadow:0 0 26px 6px #f2b70580}}.hand{scrollbar-width:none;padding:1.6rem 1rem .2rem;display:flex;overflow-x:auto}.hand::-webkit-scrollbar{display:none}.hand .card:not(:first-child){margin-left:-20px}.hand .card{scroll-snap-align:center}.uno-safe{text-align:center;color:var(--yellow);padding-top:.3rem;font-size:.85rem;font-weight:800}.drawn-card{justify-content:center;display:flex}.color-grid{grid-template-columns:repeat(2,74px);gap:.7rem;display:grid}.color-swatch{border:3px solid #fff;border-radius:16px;width:74px;height:74px;box-shadow:0 3px 8px #0006}.color-swatch.red{background:var(--red)}.color-swatch.yellow{background:var(--yellow)}.color-swatch.green{background:var(--green)}.color-swatch.blue{background:var(--blue)}.color-swatch:active{transform:scale(.94)}.score-table{border-collapse:collapse;background:var(--bg-soft);border-radius:12px;min-width:240px;overflow:hidden}.score-table td{text-align:left;padding:.6rem 1rem}.score-table tr+tr td{border-top:1px solid #34395f}.score-num{font-weight:900;text-align:right!important}.custom-fo{box-sizing:border-box;justify-content:center;align-items:center;width:100%;height:100%;padding:0 2px;display:flex}.effect-icon{color:#fff;filter:drop-shadow(0 1px 2px #00000080);width:40px;height:40px}.custom-fo .effect-icon{color:#1c1c24;filter:none;width:68px;height:68px}.custom-text-only{text-align:center;text-transform:uppercase;letter-spacing:.02em;-webkit-line-clamp:4;text-shadow:0 1px 2px #0009;-webkit-box-orient:vertical;max-width:100%;font-size:.62rem;font-weight:800;line-height:1.15;display:-webkit-box;overflow:hidden}.custom-fo .custom-text-only{color:#1c1c24;text-shadow:none;font-size:14px;line-height:1.15}.legend-btn{top:calc(env(safe-area-inset-top) + .5rem);z-index:40;background:var(--bg-soft);width:30px;height:30px;color:var(--text);cursor:pointer;border:2px solid #4a4f78;border-radius:50%;font-size:1rem;font-weight:900;line-height:1;position:absolute;right:.6rem}.legend-panel{text-align:left;max-width:min(92vw,420px)}.legend-list{flex-direction:column;gap:.7rem;margin:.4rem 0 1rem;padding:0;list-style:none;display:flex}.legend-item{align-items:center;gap:.7rem;display:flex}.legend-icon{background:linear-gradient(135deg, #0006, #0000009e), conic-gradient(from 45deg, var(--red), var(--yellow), var(--green), var(--blue), var(--red));border-radius:10px;flex-shrink:0;place-items:center;width:40px;height:40px;display:grid}.legend-icon .effect-icon{width:24px;height:24px}.legend-icon.text-only{color:#fff;font-size:1.4rem;font-weight:900;line-height:1}.legend-text{flex-direction:column;display:flex}.legend-label{font-weight:800}.legend-desc{color:var(--muted);font-size:.82rem}.custom-config{flex-direction:column;gap:.7rem;margin-top:.4rem;display:flex}.custom-config-intro{color:var(--muted);margin:0;font-size:.8rem;line-height:1.35}.custom-row{background:#00000038;border:1px solid #34395f;border-radius:12px;align-items:stretch;gap:.8rem;padding:.7rem;display:flex}.custom-preview{flex-shrink:0;place-items:center;display:grid}.custom-preview .card{cursor:default}.custom-fields{flex-direction:column;flex:1;gap:.4rem;min-width:0;display:flex}.custom-row-num{text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-size:.68rem;font-weight:800}.custom-field{align-items:center;gap:.5rem;display:flex}.custom-field-label{width:3.1rem;color:var(--muted);flex-shrink:0;font-size:.75rem;font-weight:700}.custom-field select,.custom-field input{min-width:0;font:inherit;background:var(--bg-soft);color:var(--text);border:1px solid #4a4f78;border-radius:8px;flex:1;padding:.4rem .55rem;font-size:.85rem}.custom-field select:focus,.custom-field input:focus{border-color:var(--yellow);outline:none}.custom-row-desc{color:var(--muted);font-size:.74rem;line-height:1.3}@media (width>=700px){.card{width:76px;height:112px}.hand{justify-content:center}}.gallery{flex-direction:column;align-items:flex-start;gap:1.4rem;min-height:100dvh;padding:1.2rem;display:flex}.gallery-head{flex-wrap:wrap;align-items:center;gap:1rem;display:flex}.gallery-head h1{margin:0;font-size:1.3rem}.gallery h2{text-transform:uppercase;letter-spacing:.06em;color:var(--muted);margin:0 0 .5rem;font-size:.9rem}.gallery-row{flex-wrap:wrap;gap:8px;margin-bottom:8px;display:flex}.gallery .card{cursor:default;width:62px;height:92px}.gallery.size-lg .card{width:76px;height:112px}.gallery.size-xl .card{border-radius:24px;width:186px;height:276px}.gallery.size-xl .card-svg{clip-path:inset(0 round 18px)}.gallery-item{flex-direction:column;align-items:center;gap:4px;margin:0;display:flex}.gallery-item figcaption{color:var(--muted);font-size:.65rem}