:root{--color-surface:#141c17;--color-glass:#ffffff0d;--color-glass-border:#ffffff1a;--color-card:#fafafa;--color-ink:#1a1b20;--color-crimson:#e63946;--color-text-primary:#f1faee;--color-text-secondary:#f1faee99;--color-accent:#e9c46a;--font-display:"Playfair Display", serif;--font-body:"Inter", sans-serif;--font-mono:"Space Mono", monospace;--shadow-card:0 4px 6px #0000004d, 0 1px 3px #0003;--shadow-glow:0 0 15px #e9c46a66}*{box-sizing:border-box}body{font-family:var(--font-body);background-color:var(--color-surface);color:var(--color-text-primary);flex-direction:column;min-height:100vh;margin:0;padding:0;display:flex}h1,h2,h3,.phase-title{font-family:var(--font-display);margin:0 0 1rem;font-weight:400}button{background:var(--color-glass);border:1px solid var(--color-glass-border);color:var(--color-text-primary);cursor:pointer;font-family:var(--font-body);border-radius:4px;padding:.5rem 1rem;transition:all .2s cubic-bezier(.25,.8,.25,1)}button:hover:not(:disabled){background:#ffffff1a;border-color:#fff3}button:disabled{cursor:not-allowed;opacity:.4}:root{interpolate-size:allow-keywords}.panel{background:var(--color-glass);border:1px solid var(--color-glass-border);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-radius:8px;margin-bottom:1rem;padding:1.5rem;transition:all .3s cubic-bezier(.25,.8,.25,1)}.table-header{border-bottom:1px solid var(--color-glass-border);background:#0003;justify-content:space-between;align-items:center;padding:1rem 2rem;display:flex}td{border-bottom:1px solid var(--color-glass-border);padding:1rem 0;transition:all .3s cubic-bezier(.25,.8,.25,1)}.table-header-info{align-items:baseline;gap:2rem;display:flex}.phase-tag{font-family:var(--font-mono);text-transform:uppercase;letter-spacing:1px;color:var(--color-accent);font-size:.85rem}.table-content{flex-direction:column;flex:1;gap:2rem;width:100%;max-width:1200px;margin:0 auto;padding:2rem;display:flex}.play-area{flex-direction:column;flex:1;justify-content:center;align-items:center;min-height:400px;display:flex;position:relative}.seats-container{aspect-ratio:16/9;width:100%;max-width:600px;margin-bottom:3rem;position:relative}.seat-wrapper{flex-direction:column;align-items:center;gap:.5rem;display:flex;position:absolute}.seat-pos-bottom{bottom:0;left:50%;transform:translate(-50%)}.seat-pos-left{top:50%;left:0;transform:translateY(-50%)}.seat-pos-top-left{top:0;left:20%}.seat-pos-top-right{top:0;right:20%}.seat-pos-right{top:50%;right:0;transform:translateY(-50%)}.seat-nameplate{font-family:var(--font-body);background:var(--color-glass);border:1px solid var(--color-glass-border);color:var(--color-text-secondary);white-space:nowrap;border-radius:20px;padding:.25rem .75rem;font-size:.9rem}.seat-nameplate.is-turn{color:var(--color-ink);background:var(--color-accent);border-color:var(--color-accent);box-shadow:var(--shadow-glow);font-weight:600}.seat-role{text-transform:uppercase;letter-spacing:.5px;color:var(--color-accent);font-size:.75rem}.trick-area{gap:.5rem;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.card-physical{background:var(--color-card);width:60px;height:84px;box-shadow:var(--shadow-card);font-family:var(--font-mono);color:var(--color-ink);-webkit-user-select:none;user-select:none;border-radius:6px;flex-direction:column;padding:4px;font-size:1.1rem;font-weight:700;line-height:1;display:flex;position:relative}.card-physical.suit-hearts,.card-physical.suit-diamonds{color:var(--color-crimson)}.card-back{background:repeating-linear-gradient(45deg, var(--color-accent) 0, var(--color-accent) 10px, transparent 10px, transparent 20px), var(--color-glass);border:1px solid var(--color-glass-border)}.card-rank,.card-suit{margin-top:2px;font-size:1.2rem}.card-watermark{opacity:.05;pointer-events:none;font-size:3rem;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.hand-container{border:1px solid var(--color-glass-border);background:#0000004d;border-radius:12px;flex-wrap:wrap;justify-content:center;gap:.5rem;padding:1rem;display:flex}.hand-card-btn{background:0 0;border:none;margin:0;padding:0;transition:transform .2s cubic-bezier(.175,.885,.32,1.275)}.hand-card-btn:hover:not(:disabled){transform:translateY(-8px)}.hand-card-btn:disabled .card-physical{opacity:.5;background:#e0e0e0}[role=alert]{color:var(--color-crimson);border:1px solid var(--color-crimson);background:#e639461a;border-radius:4px;margin-bottom:1rem;padding:.75rem 1rem}select,input{font-family:var(--font-body);border:1px solid var(--color-glass-border);color:var(--color-text-primary);background:#0003;border-radius:4px;padding:.5rem}[role=dialog]{background:var(--color-surface);border:1px solid var(--color-accent);box-shadow:0 10px 30px #00000080, var(--shadow-glow);z-index:100;border-radius:8px;flex-direction:column;align-items:center;gap:1rem;padding:2rem;display:flex;position:fixed;top:50%;left:50%;transform:translate(-50%,-50%)}[role=dialog] .dialog-actions{gap:1rem;display:flex}table{border-collapse:collapse;width:100%;margin-top:1rem}th,td{text-align:left;border-bottom:1px solid var(--color-glass-border);padding:.75rem 1rem}th{font-family:var(--font-mono);color:var(--color-text-secondary);font-size:.85rem;font-weight:400}button,.mock-button{transition:transform .2s,box-shadow .2s}button:hover:not(:disabled),.mock-button:hover:not(:disabled){transform:translateY(-2px)scale(1.02);box-shadow:0 4px 12px #00000026}button:active:not(:disabled),.mock-button:active:not(:disabled){transform:translateY(0)scale(.98)}.card-physical{transition:transform .2s,box-shadow .2s}.card-physical:hover{z-index:10;transform:translateY(-4px);box-shadow:0 6px 16px #0003}@keyframes pop-in-out{0%{opacity:0;transform:scale(.5)translateY(10px)}15%{opacity:1;transform:scale(1.1)translateY(0)}25%{opacity:1;transform:scale(1)}80%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)translateY(-10px)}}.anim-bubble{background:var(--color-surface);border:1px solid var(--color-border);pointer-events:none;z-index:100;white-space:nowrap;border-radius:1rem;padding:.5rem 1rem;font-weight:700;animation:1.5s forwards pop-in-out;position:absolute;top:-40px;box-shadow:0 4px 12px #0003}@keyframes slide-in{0%{opacity:0;transform:translateY(50px)}to{opacity:1;transform:translateY(0)}}.trick-area>div{animation:.3s ease-out slide-in}.landing-container{background:var(--color-bg);min-height:100vh;display:flex}.landing-left-pane{border-right:1px solid var(--color-glass-border);flex:2;padding:2rem;overflow-y:auto}.landing-hero{background:var(--color-glass);border-radius:12px;justify-content:center;align-items:center;height:200px;margin-bottom:2rem;display:flex}.landing-title{color:var(--color-accent);margin:0;font-size:4rem}.landing-text{color:var(--color-text-secondary);line-height:1.6}.landing-restrictions{color:var(--color-text-secondary);margin-bottom:2rem;padding-left:1.5rem;line-height:1.6}.landing-tutorial{color:var(--color-text-secondary);flex-direction:column;gap:.8rem;padding-bottom:2rem;line-height:1.6;display:flex}.landing-right-pane{background:var(--color-surface);flex-direction:column;flex:1;gap:2rem;padding:2rem;display:flex}.landing-login-btn{text-align:center;background:var(--color-accent);width:100%;color:var(--color-ink);border-radius:4px;padding:1rem;font-size:1.2rem;font-weight:700;text-decoration:none;transition:transform .2s,box-shadow .2s;display:inline-block}.landing-login-btn:hover{transform:translateY(-2px)scale(1.02);box-shadow:0 4px 12px #00000026}.landing-login-btn:active{transform:translateY(0)scale(.98)}.landing-active-games{border-top:1px solid var(--color-glass-border);padding-top:1.5rem}.landing-active-games h3{margin-top:0}@keyframes slideInDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.captured-animate{animation:.4s cubic-bezier(.175,.885,.32,1.275) forwards slideInDown}@keyframes wobble{0%{transform:rotate(0)scale(1)}15%{transform:rotate(-5deg)scale(1.1)}30%{transform:rotate(5deg)scale(1.1)}45%{transform:rotate(-5deg)scale(1.1)}60%{transform:rotate(5deg)scale(1.1)}75%{transform:rotate(-2deg)scale(1.05)}to{transform:rotate(0)scale(1)}}.loser-friend-anim{color:var(--color-crimson);font-weight:700;animation:2s ease-in-out infinite wobble;display:inline-block}.turn-timer{font-family:var(--font-mono);color:var(--color-text-secondary);background:var(--color-glass);border:1px solid var(--color-glass-border);border-radius:6px;align-items:center;padding:.4rem .8rem;font-size:1.1rem;transition:color .3s,border-color .3s;display:flex}.timer-overtime{color:var(--color-crimson);border-color:var(--color-crimson);font-weight:700}@keyframes heavyShake{0%,to{transform:translate(0)}20%,60%{transform:translate(-4px)}40%,80%{transform:translate(4px)}}.timer-shake{animation:.4s ease-in-out heavyShake}@keyframes floatUpFade{0%{opacity:0;transform:translateY(0)scale(.5)}20%{opacity:1;transform:translateY(-20px)scale(1.2)}80%{opacity:1;transform:translateY(-60px)scale(1)}to{opacity:0;transform:translateY(-80px)scale(.8)}}.frowny-emitter{pointer-events:none;z-index:20;position:absolute;top:-20px;left:50%;transform:translate(-50%)}.frowny{opacity:0;font-size:2rem;animation:3s ease-in infinite floatUpFade;position:absolute}.frowny-1{animation-delay:0s;left:-20px}.frowny-2{animation-delay:1s;left:10px}.frowny-3{animation-delay:2s;left:30px}