:root{--bg-0:#04120d;--bg-1:#08221a;--bg-2:#0d3b2c;--felt:#12513b;--ink:#f2f5ef;--ink-2:#c3d2c8;--muted:#8fa89a;--line:#ffffff17;--line-2:#ffffff29;--glass:#ffffff0e;--glass-2:#ffffff17;--lime:#b6f25c;--green:#45d483;--gold:#ffc94d;--gold-2:#f59f0b;--coral:#ff6b5b;--sky:#5cc8ff;--violet:#a78bfa;--card-face:#fffefa;--card-red:#d4153a;--card-black:#15171c;--back-1:#0f4a37;--back-2:#0a3427;--radius:18px;--shadow:0 10px 30px #00000059;--cw-sm:clamp(22px, min(7vw, 5vh), 48px);--cw-md:clamp(36px, min(15vw, 7.2vh), 80px);--cw-lg:clamp(44px, min(19vw, 9.8vh), 100px);color:var(--ink);-webkit-tap-highlight-color:transparent;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;font-family:Outfit,Segoe UI,system-ui,-apple-system,Roboto,sans-serif}*{box-sizing:border-box}html,body,#root{min-height:100%;margin:0}body{background:var(--bg-0);overflow-x:hidden}button,input,select{font:inherit;color:inherit;touch-action:manipulation}h2,h3{letter-spacing:-.01em;margin:0}.app{background:radial-gradient(900px 500px at 50% -10%, #b6f25c1f, transparent 70%), radial-gradient(1200px 800px at 50% 40%, var(--bg-2) 0%, var(--bg-1) 55%, var(--bg-0) 100%);min-height:100dvh}.muted{color:var(--muted)}.small{font-size:.85rem}.block{display:block}.card{--cw:var(--cw-md);width:var(--cw);height:calc(var(--cw) * 1.4);border-radius:calc(var(--cw) * .1);-webkit-user-select:none;user-select:none;touch-action:manipulation;flex:none;transition:transform .18s cubic-bezier(.2,.8,.2,1),box-shadow .18s,filter .18s;position:relative;box-shadow:0 1px 1px #00000040,0 6px 14px #0000004d}.card-sm{--cw:var(--cw-sm)}.card-lg{--cw:var(--cw-lg)}.card.clickable{cursor:pointer}.card.front{background:linear-gradient(160deg, #fff 0%, var(--card-face) 60%, #f3efe4 100%);color:var(--card-black);border:1px solid #0000001f}.card.front.red{color:var(--card-red)}.corner{flex-direction:column;align-items:center;font-weight:800;line-height:.95;display:flex;position:absolute;top:4%;left:7%}.corner .r{font-size:calc(var(--cw) * .22);letter-spacing:-.05em}.corner .s{font-size:calc(var(--cw) * .17)}.corner.br{inset:auto 7% 4% auto;transform:rotate(180deg)}.pips{position:absolute;inset:13% 24%}.pip{font-size:calc(var(--cw) * .2);line-height:1;position:absolute;transform:translate(-50%,-50%)}.pip.flip{transform:translate(-50%,-50%)rotate(180deg)}.ace{font-size:calc(var(--cw) * .62);place-items:center;line-height:1;display:grid;position:absolute;inset:0}.face{border-radius:calc(var(--cw) * .06);background:linear-gradient(160deg,#ffc94d61,#fff0 50%),repeating-linear-gradient(45deg,#00000009 0 3px,#0000 3px 6px);border:1.5px solid;place-items:center;display:grid;position:absolute;inset:15% 19%;overflow:hidden}.face .figure{font-size:calc(var(--cw) * .46);margin-top:-12%;line-height:1}.face .face-letter{font-size:calc(var(--cw) * .16);font-family:Georgia,Times New Roman,serif;font-weight:800;position:absolute;bottom:6%}.face .face-suit{font-size:calc(var(--cw) * .13);position:absolute}.face .face-suit.tl{top:4%;left:8%}.face .face-suit.br{bottom:4%;right:8%;transform:rotate(180deg)}.card.back{background:linear-gradient(145deg, #1a6b4f, var(--back-1) 45%, var(--back-2));border:1px solid #ffc94d59}.back-inner{inset:calc(var(--cw) * .07);border-radius:calc(var(--cw) * .06);background:radial-gradient(circle at 50% 50%, #b6f25c2e, transparent 60%), repeating-linear-gradient(60deg, #ffffff0d 0 2px, transparent 2px calc(var(--cw) * .1)), repeating-linear-gradient(-60deg, #ffffff0d 0 2px, transparent 2px calc(var(--cw) * .1));border:1px solid #ffc94d73;place-items:center;display:grid;position:absolute}.back-logo{width:calc(var(--cw) * .5);height:calc(var(--cw) * .5);pointer-events:none;border-radius:24%;box-shadow:0 0 0 2px #ffc94d99,0 4px 10px #0006}.card.playable{box-shadow:0 0 0 2px #b6f25cb3,0 6px 16px #00000059}.card.selected{box-shadow:0 0 0 3px var(--lime), 0 14px 24px #00000073;transform:translateY(-22%)}.card.dim{filter:brightness(.55)saturate(.6)}.card.glow{box-shadow:0 0 0 3px var(--gold), 0 0 22px #ffc94d99}@media (hover:hover){.card.clickable:not(.selected):not(.dragging):hover{transform:translateY(-9%)}}.card.draggable{touch-action:none;cursor:grab}.card.dragging{cursor:grabbing;box-shadow:0 0 0 3px var(--lime), 0 22px 36px #0000008c;filter:none;transition:none}.empty-slot{--cw:var(--cw-md);width:var(--cw);height:calc(var(--cw) * 1.4);border-radius:calc(var(--cw) * .1);color:var(--muted);text-transform:uppercase;letter-spacing:.12em;border:2px dashed #ffffff2e;place-items:center;font-size:11px;display:grid}.empty-slot.card-lg{--cw:var(--cw-lg)}.btn{border:1px solid var(--line-2);background:var(--glass-2);cursor:pointer;border-radius:14px;min-height:46px;padding:10px 18px;font-weight:600;transition:transform .12s,background .15s,filter .15s,box-shadow .15s}.btn:hover:not(:disabled){background:#ffffff24}.btn:active:not(:disabled){transform:scale(.97)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn.primary{background:linear-gradient(135deg, var(--lime), var(--green));color:#06231a;border-color:#0000;box-shadow:0 6px 20px #45d48347}.btn.primary:hover:not(:disabled){background:linear-gradient(135deg, var(--lime), var(--green));filter:brightness(1.07)}.btn.danger{color:#ffd9d4;background:#ff6b5b24;border-color:#ff6b5b80}.btn.ghost{background:0 0;border-color:#0000}.btn.big{width:100%;min-height:52px;padding:14px;font-size:1.05rem}.btn.google{color:#1f1f1f;background:#fff;border-color:#0000;justify-content:center;align-items:center;gap:10px;display:flex}.btn.google:hover:not(:disabled){background:#f1f1f1}.g-logo{background:conic-gradient(from -45deg, #ea4335 0 25%, #fbbc05 0 50%, #34a853 0 75%, #4285f4 0);color:#0000;-webkit-background-clip:text;background-clip:text;font-size:1.25rem;font-weight:900}.ghost-btn,.icon-btn{cursor:pointer;color:var(--ink-2);background:0 0;border:0;border-radius:12px;min-height:40px;padding:8px 12px;font-weight:600}.ghost-btn:hover,.icon-btn:hover{background:var(--glass-2);color:var(--ink)}.link-btn{color:var(--lime);cursor:pointer;font-size:inherit;background:0 0;border:0;padding:0;font-weight:600}.link-btn.center{align-self:center;padding:6px}.badge{border:1px solid var(--line);color:var(--ink-2);white-space:nowrap;background:#0000004d;border-radius:999px;align-items:center;gap:4px;padding:3px 9px;font-size:12px;font-weight:600;display:inline-flex}.badge.warn{color:var(--gold);background:#ffc94d24;border-color:#ffc94d73}.badge.on{color:var(--green);background:#45d48324;border-color:#45d48373}.badge.off{color:#ffc4bd;background:#ff6b5b2e;border-color:#ff6b5b80}.field{flex-direction:column;gap:8px;display:flex}.field>span{color:var(--ink-2);font-size:.9rem;font-weight:600}input,select{border:1px solid var(--line-2);color:var(--ink);background:#00000047;border-radius:14px;outline:none;padding:13px 14px;transition:border-color .15s,box-shadow .15s}input::placeholder{color:#6f877a}input:focus,select:focus{border-color:#b6f25cb3;box-shadow:0 0 0 3px #b6f25c26}select option{color:#111}.segmented{border:1px solid var(--line);background:#00000047;border-radius:14px;grid-template-columns:1fr 1fr;gap:4px;padding:4px;display:grid}.segmented.three{grid-template-columns:1fr 1fr 1fr}.segmented button{cursor:pointer;color:var(--muted);background:0 0;border:0;border-radius:10px;padding:10px 6px;font-weight:600;transition:background .15s,color .15s}.segmented.three button{font-size:.88rem}.segmented button.on{color:var(--ink);background:#ffffff1f;box-shadow:0 2px 8px #00000040}.levels{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.level{border:1px solid var(--line);cursor:pointer;text-align:left;background:#00000038;border-radius:14px;flex-direction:column;align-items:flex-start;gap:8px;padding:10px 12px;font-size:.92rem;font-weight:600;transition:border-color .15s,background .15s;display:flex}.level.on{background:#b6f25c1a;border-color:#b6f25cbf}.level-bars{gap:3px;display:flex}.level-bars i{background:#ffffff24;border-radius:2px;width:8px;height:8px}.level-bars i.lit{background:var(--lime)}.level.lvl-hardcore .level-bars i.lit{background:var(--coral)}.level.lvl-vagalume .level-bars i.lit{background:#f7f06a;box-shadow:0 0 6px #f7f06a}.level.lvl-vagalume.on{background:#f7f06a1a;border-color:#f7f06a;box-shadow:0 0 18px #f7f06a40}@media (width<=380px){.levels{grid-template-columns:repeat(2,1fr)}}.screen,.auth-screen{max-width:560px;padding:14px 16px 40px;padding-top:max(14px, env(safe-area-inset-top));flex-direction:column;gap:14px;margin:0 auto;display:flex}.auth-screen{justify-content:center;min-height:100dvh}.screen-top{grid-template-columns:1fr auto 1fr;align-items:center;display:grid}.screen-top h2{text-align:center;font-size:1.15rem}.panel{background:var(--glass);border:1px solid var(--line);border-radius:var(--radius);-webkit-backdrop-filter:blur(14px);box-shadow:var(--shadow);flex-direction:column;gap:14px;padding:18px;display:flex}.panel h3{font-size:1.02rem}.panel-head{justify-content:space-between;align-items:center;gap:10px;display:flex}.brand{text-align:center}.hero-cards{height:calc(var(--cw-lg) * 1.55);justify-content:center;margin-bottom:4px;display:flex}.hero-card{margin:0 calc(var(--cw-lg) * -.22);transform-origin:50% 120%;filter:drop-shadow(0 10px 18px #00000059)}.title{letter-spacing:.08em;background:linear-gradient(#fff,#cfe9c4);color:#0000;-webkit-background-clip:text;background-clip:text;justify-content:center;align-items:center;gap:12px;margin:6px 0 0;font-size:clamp(2.6rem,12vw,3.8rem);font-weight:900;display:flex}.brand.compact .title{font-size:clamp(2rem,9vw,2.6rem)}.title-logo{border-radius:22%;width:.95em;height:.95em;box-shadow:0 6px 18px #00000059}.subtitle{color:var(--muted);margin:6px 0 0}.auth-panel{gap:14px}.divider{color:var(--muted);align-items:center;gap:12px;font-size:.85rem;display:flex}.divider:before,.divider:after{content:"";background:var(--line-2);flex:1;height:1px}.form{flex-direction:column;gap:12px;display:flex}.form-error,.form-info{border-radius:12px;padding:10px 12px;font-size:.9rem}.form-error{color:#ffd9d4;background:#ff6b5b24;border:1px solid #ff6b5b73}.form-info{color:#d8f8e3;background:#45d48324;border:1px solid #45d48373}.profile-bar{border-radius:var(--radius);background:var(--glass);border:1px solid var(--line);align-items:center;gap:12px;padding:10px 12px;display:flex}.avatar{background:linear-gradient(135deg, var(--lime), var(--green));color:#06231a;border-radius:14px;flex:none;place-items:center;width:42px;height:42px;font-size:1.15rem;font-weight:900;display:grid}.avatar.sm{border-radius:11px;width:34px;height:34px;font-size:.95rem}.profile-name{flex-direction:column;flex:1;min-width:0;display:flex}.profile-name b{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.tiles{grid-template-columns:1fr 1fr;gap:12px;display:grid}.tile{border:1px solid var(--line);background:var(--glass);text-align:left;cursor:pointer;min-height:150px;box-shadow:var(--shadow);border-radius:22px;flex-direction:column;align-items:flex-start;gap:4px;padding:18px 16px;transition:transform .15s,border-color .15s,background .15s;display:flex;position:relative;overflow:hidden}.tile:before{content:"";background:var(--tile-color,var(--lime));opacity:.16;filter:blur(10px);border-radius:50%;width:160px;height:160px;position:absolute;inset:auto -30% -50% auto}.tile:hover:not(:disabled){border-color:var(--line-2);background:var(--glass-2);transform:translateY(-3px)}.tile:disabled{opacity:.45;cursor:not-allowed}.tile-online{--tile-color:var(--lime);background:linear-gradient(135deg,#b6f25c29,#45d4830f);border-color:#b6f25c59;grid-column:1/-1;min-height:130px}.tile-pve{--tile-color:var(--sky)}.tile-friends{--tile-color:var(--violet)}.tile-rules{--tile-color:var(--gold);flex-direction:row;grid-column:1/-1;align-items:center;gap:12px;min-height:auto}.tile-rules .tile-sub{margin-left:auto}.tile-icon{margin-bottom:auto;font-size:1.9rem;line-height:1}.tile-rules .tile-icon{margin:0;font-size:1.4rem}.tile-title{font-size:1.08rem;font-weight:700}.tile-sub{color:var(--muted);font-size:.85rem;line-height:1.3}.invite-card{border-radius:var(--radius);background:linear-gradient(135deg,#ffc94d2e,#ffc94d0d);border:1px solid #ffc94d73;justify-content:space-between;align-items:center;gap:12px;padding:14px 16px;animation:.25s ease-out toast-in;display:flex}.share-box{justify-content:space-between;align-items:center;gap:12px;display:flex}.inline-form{flex:1;gap:8px;display:flex}.inline-form input,.inline-form select{flex:1;min-width:0}.code-input{text-transform:uppercase;letter-spacing:.3em;text-align:center;font-weight:800}.list-row{border-top:1px solid var(--line);justify-content:space-between;align-items:center;gap:10px;padding:10px 0;display:flex}.row-actions{flex:none;gap:6px;display:flex}.friend{flex-wrap:wrap;align-items:center;gap:10px;min-width:0;display:flex}.presence{background:#5b6e63;border-radius:50%;flex:none;width:10px;height:10px}.presence.on{background:var(--green);box-shadow:0 0 10px #45d483cc}.room-code{flex-direction:column;align-items:center;gap:8px;display:flex}.room-code .code{letter-spacing:.22em;background:linear-gradient(135deg, var(--lime), var(--gold));color:#0000;-webkit-background-clip:text;background-clip:text;font-size:clamp(2.2rem,11vw,3rem);font-weight:900}.room-settings{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.host-settings{flex-direction:column;gap:8px;display:flex}.center-panel{text-align:center;align-items:center;margin-top:18vh}.center-text{text-align:center}.loading{min-height:100dvh;color:var(--muted);place-items:center;display:grid}.loading-logo{border-radius:22%;width:72px;height:72px;animation:1.4s ease-in-out infinite breathe}@keyframes breathe{50%{opacity:.7;transform:scale(.9)}}.toast{left:50%;bottom:max(20px, env(safe-area-inset-bottom));border:1px solid var(--line-2);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:70;text-align:center;max-width:calc(100vw - 32px);box-shadow:var(--shadow);background:#08140feb;border-radius:16px;padding:12px 20px;animation:.2s ease-out toast-in;position:fixed;transform:translate(-50%)}@keyframes toast-in{0%{opacity:0;translate:0 10px}}.game{background:radial-gradient(ellipse 70% 45% at 50% 45%, #1a6b4f8c, transparent 75%), radial-gradient(ellipse 120% 90% at 50% 50%, var(--felt) 0%, var(--bg-1) 70%, var(--bg-0) 100%);flex-direction:column;min-height:100dvh;display:flex}.topbar{padding:6px 8px;padding-top:max(6px, env(safe-area-inset-top));justify-content:space-between;align-items:center;display:flex}.brand-small{letter-spacing:.12em;font-size:.95rem;font-weight:900}.board{flex-direction:column;flex:1;justify-content:space-between;gap:6px;width:100%;max-width:980px;margin:0 auto;padding:0 16px;display:flex}.seat{border-radius:var(--radius);border:1px solid var(--line);background:#0000002e;padding:8px 10px 10px;transition:border-color .2s,background .2s,box-shadow .2s}.seat.turn{background:#b6f25c0f;border-color:#b6f25c99;box-shadow:0 0 0 1px #b6f25c33,0 0 24px #b6f25c1f}.seat-head{justify-content:space-between;align-items:center;gap:8px;margin-bottom:6px;display:flex}.seat-name{flex-wrap:wrap;align-items:center;gap:6px;font-weight:700;display:flex}.seat-meta{gap:6px;display:flex}.dot{background:var(--lime);width:8px;height:8px;box-shadow:0 0 10px var(--lime);border-radius:50%;animation:1.2s infinite pulse}@keyframes pulse{50%{opacity:.35}}.opp-hand{min-width:0;min-height:calc(var(--cw-sm) * 1.4);flex:1;justify-content:center;display:flex;overflow:hidden}.opponents{flex-direction:column;display:flex}.opponents.multi{flex-flow:wrap;gap:6px}.opponents.multi .seat{flex:calc(50% - 6px);min-width:0;padding:6px 8px}@media (width>=760px){.opponents.multi .seat{flex-basis:calc(33% - 6px)}}.seat.compact .seat-head{flex-wrap:wrap;margin-bottom:4px}.seat.compact .seat-name{font-size:.88rem}.seat.compact .table-cards{min-height:calc(var(--cw-sm) * 1.55);gap:6px}.seat.finished{opacity:.55}.table-cards{min-height:calc(var(--cw-md) * 1.55);justify-content:center;gap:clamp(10px,4vw,26px);display:flex}.slot{--cw:var(--cw-md);width:var(--cw);height:calc(var(--cw) * 1.55);position:relative}.slot.slot-sm{--cw:var(--cw-sm)}.slot>.card{position:absolute;top:0;left:0}.slot .up-card{top:calc(var(--cw) * .16);left:calc(var(--cw) * .08);position:absolute}.center{justify-content:center;align-items:center;gap:clamp(20px,8vw,70px);padding:6px 0;display:flex}.draw-pile,.pile{flex-direction:column;align-items:center;gap:8px;display:flex}.draw-pile .card{box-shadow:2px 2px #0a3427,4px 4px #082a20,0 10px 18px #00000059}.pile-cards{--cw:var(--cw-lg);width:calc(var(--cw) * 1.75);height:calc(var(--cw) * 1.45);outline-offset:10px;border-radius:16px;outline:2px dashed #0000;transition:outline-color .15s,background .15s;position:relative}.pile-cards .empty-slot{margin:0 auto}.pile.drop-ready .pile-cards{outline-color:#b6f25c73}.pile.drop .pile-cards{outline-color:var(--lime);background:#b6f25c1f}.pile-card{animation:.22s ease-out drop;position:absolute;top:0}@keyframes drop{0%{opacity:0;translate:0 -30px;scale:1.08}}.pile-info{flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.hand{min-height:calc(var(--cw-lg) * 1.4 + 26px);justify-content:safe center;padding:14px 4px 4px;display:flex;overflow:visible}.hand-empty{color:var(--muted);align-self:center;font-size:.9rem}.controls{padding:8px 16px;padding-bottom:max(10px, env(safe-area-inset-bottom));border-top:1px solid var(--line);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:#04120d99;flex-direction:column;align-items:center;gap:6px;display:flex}.status{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;display:flex}.status-text{text-align:center;color:var(--ink-2);font-weight:600}.status-text.me{color:var(--lime)}.timer{border:1px solid var(--line);background:#0006;border-radius:999px;width:110px;height:22px;position:relative;overflow:hidden}.timer-bar{background:linear-gradient(90deg, var(--green), var(--lime));transition:width .2s linear;position:absolute;inset:0 auto 0 0}.timer.low .timer-bar{background:linear-gradient(90deg, var(--coral), #ffa07a)}.timer-label{text-align:center;color:#06231a;mix-blend-mode:normal;font-size:12px;font-weight:800;line-height:20px;display:block;position:relative}.hint{color:#ffd2cb;text-align:center;font-size:.88rem}.last-event{color:var(--muted);text-align:center;font-size:.85rem}.buttons{flex-wrap:wrap;justify-content:center;align-items:center;gap:10px;display:flex}.controls .btn{min-width:130px}.flash{border:1px solid var(--line-2);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);text-align:center;pointer-events:none;z-index:40;max-width:calc(100vw - 32px);box-shadow:var(--shadow);background:#04120dd9;border-radius:18px;padding:14px 26px;font-size:clamp(1.1rem,4.5vw,1.6rem);font-weight:800;animation:1.8s forwards flash;position:fixed;top:42%;left:50%;transform:translate(-50%,-50%)}.flash-burn{color:#ffb347;text-shadow:0 0 22px #ff7828e6;background:#3c0e00bf;border-color:#ff8c3c80;font-size:clamp(2rem,9vw,3.4rem)}@keyframes flash{0%{opacity:0;scale:.7}12%{opacity:1;scale:1.05}20%{scale:1}80%{opacity:1}to{opacity:0}}.modal-backdrop{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:50;background:#020a07b3;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.modal{border:1px solid var(--line-2);background:linear-gradient(#0f3528,#0a261d);border-radius:22px;flex-direction:column;width:min(560px,100%);max-height:calc(100dvh - 32px);display:flex;box-shadow:0 30px 80px #0000008c}.modal-head{justify-content:space-between;align-items:center;padding:16px 16px 4px 22px;display:flex}.rules-body{padding:0 22px 22px;overflow-y:auto}.rules-body h3{color:var(--lime);margin:18px 0 6px;font-size:1rem}.rules-body p,.rules-body li{color:var(--ink-2);line-height:1.55}.rules-body ul{margin:0;padding-left:20px}.rules-body .order{letter-spacing:.04em;color:var(--ink);font-size:1.1rem;font-weight:800}.modal.result{text-align:center;align-items:center;gap:10px;padding:28px 20px}.result-emoji{font-size:3.4rem}.ranking{text-align:left;width:100%;max-width:280px;margin:4px 0 8px;padding:0;list-style:none}.ranking li{border-radius:12px;padding:8px 12px}.ranking li.me{background:#b6f25c24;font-weight:700}@media (height<=700px) and (width<=600px){.seat{padding:6px 8px}.hand{padding-top:12px}}.brand-small{align-items:center;gap:8px;display:flex}.brand-logo{border-radius:6px;width:22px;height:22px}
