:root{--bg-ink: #102a2e;--bg-deep: #08342a;--bg-soft: #edf3e7;--card: #fffef7;--line: #1f5f4f;--line-soft: #b7c7be;--text: #10181b;--text-soft: #5b6a65;--accent: #d8a12f;--accent-dark: #966611;--danger: #b02929}*{box-sizing:border-box}body{margin:0;min-height:100vh;color:var(--text);background:radial-gradient(circle at 20% 10%,rgba(216,161,47,.14),transparent 30%),radial-gradient(circle at 80% 20%,rgba(91,203,162,.12),transparent 26%),linear-gradient(135deg,#f2f4eb,#dde6da 40%,#c7d3c8);font-family:Avenir Next,Trebuchet MS,Segoe UI,sans-serif}h1,h2,h3,h4,p{margin:0}.app{width:min(1220px,100%);margin:0 auto;padding:1rem;display:grid;gap:.9rem}.brand{font-size:clamp(2rem,5vw,3rem);line-height:1.05;letter-spacing:.02em}.lobby{min-height:100vh;align-content:center}.lobby-shell{background:linear-gradient(160deg,#092e24f2,#083b33eb);color:#f4f7ef;border:1px solid rgba(216,161,47,.35);border-radius:18px;padding:1.4rem;display:grid;gap:.8rem;box-shadow:0 15px 35px #07211e59}.hero{border-radius:16px;padding:1rem;border:1px solid rgba(216,161,47,.35);background:linear-gradient(140deg,#08342af5,#14493df2),repeating-linear-gradient(45deg,#ffffff08 0,#ffffff08 8px,#00000008 8px,#00000008 16px);color:#f5f8f3;display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}.hero-kicker{color:#dfb558;font-weight:600;letter-spacing:.07em;text-transform:uppercase}.hero-title{font-size:clamp(1.8rem,4vw,2.6rem);font-weight:800;letter-spacing:.01em}.hero-subtitle{margin-top:.45rem;color:#d4e2dc}.panel{border:1px solid rgba(31,95,79,.18);background:#ffffffc4;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);border-radius:14px;padding:.95rem;display:grid;gap:.7rem}.panel.compact{padding:.65rem .8rem}.status-strip{display:flex;flex-wrap:wrap;gap:.45rem}.status-chip{border:1px solid rgba(31,95,79,.2);border-radius:999px;padding:.35rem .65rem;background:#f0f8f4c7;color:#173c33;font-size:.92rem}.board-grid{display:grid;grid-template-columns:1.1fr 1fr;gap:.9rem}.player-grid{display:grid;grid-template-columns:repeat(2,minmax(170px,1fr));gap:.6rem}.seat-slot{border:1px solid rgba(31,95,79,.2);border-radius:10px;background:#f8fbf8d9;padding:.55rem;display:grid;gap:.3rem}.seat-slot.turn{border-color:#d8a12fcc;box-shadow:0 0 0 2px #d8a12f3d}.seat-slot.my-seat{background:linear-gradient(180deg,#e8f8f0eb,#f8fbf8e6)}.seat-line{display:flex;justify-content:space-between;gap:.4rem}.seat-tag,.team-tag{display:inline-block;padding:.14rem .44rem;border-radius:999px;font-size:.75rem;font-weight:700;letter-spacing:.02em}.seat-tag{background:#10433921;color:#134438}.team-tag{background:#d8a12f33;color:#7d5510}.seat-name{font-size:1.04rem;font-weight:600}.trick-panel{background:radial-gradient(circle at 30% 20%,rgba(255,255,255,.12),transparent 35%),linear-gradient(165deg,#0f5a46,#0f4b3e);color:#ecf6f1;border-color:#0e4c3ee6}.trick-panel .muted{color:#d2e5de}.trick-grid{display:grid;grid-template-columns:repeat(2,minmax(120px,1fr));gap:.65rem}.table-seat{background:#fafefb26;border-color:#fff3}.score-line{display:flex;flex-wrap:wrap;gap:.55rem;font-weight:600}.action-panel{align-content:start}.inner-panel{border:1px solid rgba(31,95,79,.2);border-radius:10px;background:#f1f8f3bf;padding:.7rem;display:grid;gap:.5rem}.hand-panel{align-content:start}.hand-grid{display:flex;flex-wrap:wrap;gap:.5rem}.card-btn{width:74px;height:108px;border:1px solid #d6e0d8;border-radius:10px;background:transparent;padding:0;cursor:pointer;transition:transform .15s ease,box-shadow .15s ease}.card-btn:hover{transform:translateY(-2px)}.card-btn.valid{border-color:#1f9961e6;box-shadow:0 0 0 2px #1f99612e}.card-btn.invalid{opacity:.45}.card-btn.invalid-flash{animation:invalidFlash .42s ease}@keyframes invalidFlash{0%{transform:translateY(0);filter:saturate(1.2)}50%{transform:translateY(-2px);filter:saturate(.7)}to{transform:translateY(0);filter:saturate(1)}}.card-pill{display:inline-flex}.playing-card-face{position:relative;width:100%;height:100%;border:1px solid #d1d6d8;border-radius:9px;background:linear-gradient(180deg,#fffefa,#f2f3ec);box-shadow:inset 0 0 0 1px #ffffffbf;overflow:hidden;color:#1d242a}.playing-card-face.compact{width:54px;height:76px}.playing-card-face.red{color:#b73535}.playing-card-face.black{color:#1f2830}.pc-corner{position:absolute;display:grid;justify-items:center;line-height:.95}.pc-tl{top:4px;left:4px}.pc-br{right:4px;bottom:4px;transform:rotate(180deg)}.pc-rank{font-size:.78rem;font-weight:800}.pc-suit{font-size:.7rem}.playing-card-face.compact .pc-rank{font-size:.65rem}.playing-card-face.compact .pc-suit{font-size:.58rem}.pc-center{position:absolute;top:16px;right:8px;bottom:16px;left:8px;display:grid;place-items:center}.playing-card-face.compact .pc-center{top:13px;right:6px;bottom:13px;left:6px}.pc-pips{width:100%;height:100%;display:grid;align-content:space-between}.pc-pips.dense{font-size:.88rem}.pc-pip-row{display:flex;align-items:center}.pc-pip-row.c1{justify-content:center}.pc-pip-row.c2{justify-content:space-between}.pc-ace{font-size:1.55rem;font-weight:700}.pc-royal{display:grid;place-items:center;text-align:center;line-height:1}.pc-royal-rank{font-size:1.25rem;font-weight:900}.pc-royal-suit{font-size:1.02rem}.pc-joker{display:grid;place-items:center;text-align:center;line-height:1.05;font-size:.68rem;font-weight:800}.playing-card-face.compact .pc-ace{font-size:1.1rem}.playing-card-face.compact .pc-royal-rank{font-size:1rem}.playing-card-face.compact .pc-royal-suit{font-size:.84rem}.playing-card-face.compact .pc-joker{font-size:.55rem}.result-panel{border-color:#d8a12f73;background:linear-gradient(160deg,#fcf5e1eb,#fafbf1eb)}.result-summary{font-size:1.08rem;font-weight:700}.result-metrics{display:grid;gap:.3rem}.row{display:flex;align-items:center}.row.wrap{flex-wrap:wrap}.gap{gap:.55rem}.btn{border:1px solid var(--accent-dark);background:linear-gradient(180deg,#d8a12f,#c78917);color:#fff8ea;border-radius:9px;padding:.45rem .8rem;cursor:pointer;font-weight:700;transition:transform .15s ease,box-shadow .15s ease}.btn:hover{transform:translateY(-1px);box-shadow:0 8px 16px #684f1033}.btn.secondary{border-color:#14493d4d;background:linear-gradient(180deg,#f2f8f5,#e4ede8);color:#21453c}.btn:disabled{opacity:.45;cursor:not-allowed;transform:none}.sound-toggle{align-self:center}.text-input{border:1px solid rgba(31,95,79,.35);border-radius:9px;padding:.48rem .62rem;font-size:.98rem;background:#fafcfaf2}.text-input.narrow{width:130px}.muted{color:var(--text-soft)}.error{color:var(--danger)}.error.fixed{position:fixed;right:.8rem;bottom:.8rem;padding:.45rem .68rem;border:1px solid rgba(176,41,41,.35);border-radius:8px;background:#ffededf2}.message-list{margin:0;padding-left:1.1rem;display:grid;gap:.28rem}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#07181c99;display:grid;place-items:center;z-index:100}.modal-card{width:min(420px,92vw);border:1px solid rgba(216,161,47,.45);border-radius:12px;background:linear-gradient(175deg,#fdfaf0,#f4f4e8);padding:1rem;display:grid;gap:.65rem}@media(max-width:980px){.board-grid{grid-template-columns:1fr}.player-grid{grid-template-columns:repeat(auto-fit,minmax(150px,1fr))}.hero{flex-direction:column}.sound-toggle{align-self:flex-start}.card-btn{width:66px;height:96px}}
