*{box-sizing:border-box;margin:0;padding:0}:root{--bg-dark: #1a1a2e;--bg-card: #16213e;--bg-input: #0f3460;--text-primary: #eee;--text-secondary: #94a3b8;--accent: #e94560;--accent-hover: #ff6b6b;--success: #22c55e;--border: #334155;--card-shadow: 0 4px 6px rgba(0, 0, 0, .3)}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;background:var(--bg-dark);color:var(--text-primary);min-height:100vh}.container{max-width:1200px;margin:0 auto;padding:1rem}.card{background:var(--bg-card);border-radius:12px;padding:1.5rem;box-shadow:var(--card-shadow)}button{background:var(--accent);color:#fff;border:none;padding:.75rem 1.5rem;border-radius:8px;font-size:1rem;font-weight:600;cursor:pointer;transition:background .2s;display:inline-flex;align-items:center;justify-content:center;gap:.5rem}button svg{flex-shrink:0}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-spin{animation:spin 1s linear infinite}button:hover{background:var(--accent-hover)}button:disabled{opacity:.5;cursor:not-allowed}button.secondary{background:var(--bg-input)}button.secondary:hover{background:var(--border)}input{background:var(--bg-input);border:1px solid var(--border);color:var(--text-primary);padding:.75rem 1rem;border-radius:8px;font-size:1rem;width:100%}input:focus{outline:none;border-color:var(--accent)}.form-group{margin-bottom:1rem}label{display:block;margin-bottom:.5rem;color:var(--text-secondary);font-size:.875rem}h1,h2,h3{margin-bottom:1rem}.error{color:var(--accent);font-size:.875rem;margin-top:.5rem}.success{color:var(--success)}.rules-page{max-height:calc(100vh - 4rem);overflow-y:auto}.rules-content h1{display:none}.rules-content h2{color:var(--text-primary);margin-top:1.5rem;margin-bottom:.75rem;padding-bottom:.25rem;border-bottom:1px solid var(--border)}.rules-content h3{color:var(--text-primary);margin-top:1rem;margin-bottom:.5rem}.rules-content p{color:var(--text-secondary);line-height:1.6;margin-bottom:.75rem}.rules-content ul,.rules-content ol{color:var(--text-secondary);padding-left:1.5rem;margin-bottom:.75rem;line-height:1.6}.rules-content li{margin-bottom:.25rem}.rules-content strong{color:var(--text-primary)}.rules-content table{width:100%;border-collapse:collapse;margin-bottom:1rem;font-size:.875rem}.rules-content th,.rules-content td{padding:.5rem .75rem;text-align:left;border-bottom:1px solid var(--border)}.rules-content th{color:var(--text-secondary);font-weight:600}.rules-content td{color:var(--text-primary)}.rules-content tbody tr:hover{background:var(--bg-input)}.game-board{display:grid;grid-template-areas:"scoreboard sidebar" "main sidebar" "hand sidebar";grid-template-columns:1fr 300px;grid-template-rows:auto 1fr auto;min-height:calc(100vh - 2rem);gap:1rem}.game-main{grid-area:main;display:flex;flex-direction:column;align-items:center;justify-content:center}.player-hand{grid-area:hand;display:flex;justify-content:center;padding:1rem;flex-wrap:wrap}.playing-card{width:80px;min-width:80px;height:120px;background:#fff;border-radius:8px;box-shadow:var(--card-shadow);cursor:pointer;transition:transform .2s;display:flex;flex-shrink:0;align-items:center;justify-content:center;font-size:.75rem;color:#333;margin-left:-20px}.playing-card:first-child{margin-left:0}.playing-card:hover{transform:translateY(-10px)}.playing-card.selected{transform:translateY(-20px);box-shadow:0 0 0 3px var(--accent)}.playing-card.winner{box-shadow:0 0 12px 4px #ffd700cc;border:2px solid gold}.playing-card.dabb{box-shadow:0 0 10px 3px #f59e0b99;border:2px solid #f59e0b}.playing-card.herz,.playing-card.schell{color:#dc2626}.trick-area{display:flex;justify-content:center;align-items:center;min-height:200px;gap:1rem}.trick-area-player-name{font-size:.75rem;color:var(--text-secondary);margin-top:.25rem;white-space:nowrap}.bidding-panel{display:flex;gap:.5rem;align-items:center;justify-content:center;flex-wrap:wrap}.scoreboard{grid-area:scoreboard;background:var(--bg-card);border-radius:8px;overflow:hidden}.scoreboard-header{display:flex;justify-content:space-between;align-items:center;padding:.75rem 1rem;cursor:pointer;gap:1rem}.scoreboard-players{display:flex;justify-content:space-around;flex:1;gap:1rem}.player-info{text-align:center;min-width:80px}.player-info.current{color:var(--accent)}.player-info .player-name{font-size:.875rem;color:var(--text-secondary)}.player-info .score{font-size:1.5rem;font-weight:700}.player-info .bid-info{font-size:.75rem;color:var(--accent)}.player-info .disconnected-info{font-size:.75rem;color:var(--text-secondary)}.scoreboard-actions{display:flex;gap:.5rem;flex-shrink:0}.scoreboard-toggle{padding:.5rem .75rem;font-size:.75rem;background:var(--bg-input);white-space:nowrap}.scoreboard-toggle:hover{background:var(--border)}.scoreboard .exit-button{padding:.5rem .75rem;font-size:.75rem;background:transparent;color:var(--text-secondary);border:1px solid var(--border);white-space:nowrap}.scoreboard .exit-button:hover{background:var(--bg-input);color:var(--text-primary)}.game-winner-banner{background:var(--success);color:#fff;text-align:center;padding:.5rem;font-size:.875rem}.scoreboard-history{padding:.5rem 1rem 1rem;overflow-x:auto}.scoreboard-history table{width:100%;border-collapse:collapse;font-size:.875rem}.scoreboard-history th,.scoreboard-history td{padding:.5rem;text-align:center;border-bottom:1px solid var(--border)}.scoreboard-history th{color:var(--text-secondary);font-weight:600}.scoreboard-history tbody tr:hover{background:var(--bg-input)}.scoreboard-history .round-cell{text-align:left}.scoreboard-history .round-number{font-weight:700}.scoreboard-history .round-bid{font-size:.75rem;color:var(--text-secondary)}.scoreboard-history .score-cell{min-width:100px}.scoreboard-history .score-total{font-weight:700;font-size:1rem}.scoreboard-history .score-breakdown{font-size:.7rem;color:var(--text-secondary)}.scoreboard-history .bid-not-met{background:#e9456026}.scoreboard-history .bid-failed{font-size:.7rem;color:var(--accent);font-weight:600}.scoreboard-history tfoot td{border-top:2px solid var(--border);border-bottom:none;padding-top:.75rem}.current-round-info{text-align:center;padding:.5rem;font-size:.875rem;color:var(--text-secondary);border-top:1px solid var(--border)}.modal-overlay{position:fixed;inset:0;background:#000000bf;display:flex;align-items:center;justify-content:center;z-index:1000;padding:1rem}.modal-content{max-width:400px;width:100%;animation:modal-appear .2s ease-out}@keyframes modal-appear{0%{opacity:0;transform:scale(.95)}to{opacity:1;transform:scale(1)}}.game-log{grid-area:sidebar;background:var(--bg-card);border-radius:8px;box-shadow:var(--card-shadow);overflow:hidden;height:fit-content;align-self:start;position:sticky;top:1rem}.game-log-header{display:flex;justify-content:space-between;align-items:center;padding:.5rem .75rem;background:var(--bg-input);border-bottom:1px solid var(--border)}.game-log-title{font-size:.75rem;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.5px}.game-log-toggle{padding:.25rem .5rem;font-size:.65rem;background:transparent;color:var(--text-secondary);border:1px solid var(--border)}.game-log-toggle:hover{background:var(--bg-input);color:var(--text-primary)}.game-log-turn-banner{background:var(--accent);color:#fff;text-align:center;padding:.5rem;font-size:.875rem;font-weight:600;animation:pulse-banner 1.5s ease-in-out infinite}@keyframes pulse-banner{0%,to{opacity:1}50%{opacity:.7}}.game-log-entries{max-height:180px;overflow-y:auto;padding:.5rem}.game-log-entries.expanded{max-height:350px}.game-log-entry{padding:.35rem .5rem;font-size:.75rem;border-radius:4px;margin-bottom:.25rem;color:var(--text-primary);line-height:1.4}.game-log-entry:last-child{margin-bottom:0}.game-log-entry.highlight{background:#e9456026;color:var(--accent-hover)}.game-log-entry.success{background:#22c55e26;color:var(--success)}.game-log-entry.error{background:#e9456033;color:var(--accent)}.game-log-empty{text-align:center;padding:1rem;color:var(--text-secondary);font-size:.75rem}.game-log-meld-toggle{display:inline-block;width:18px;height:18px;line-height:16px;text-align:center;margin-left:.25rem;padding:0;font-size:.75rem;background:var(--bg-input);border:1px solid var(--border);border-radius:4px;cursor:pointer;vertical-align:middle}.game-log-meld-toggle:hover{background:var(--border)}.game-log-meld-details{margin-top:.25rem;padding-left:.5rem;font-size:.7rem;color:var(--text-secondary);border-left:2px solid var(--border)}.celebration-overlay{position:fixed;inset:0;pointer-events:none;z-index:1100;overflow:hidden}@keyframes confetti-fall{0%{transform:translateY(-100px) rotate(0) translate(0);opacity:1}to{transform:translateY(100vh) rotate(720deg) translate(var(--drift, 50px));opacity:0}}.confetti-particle{position:absolute;top:-20px;animation:confetti-fall var(--duration, 3s) ease-out forwards;animation-delay:var(--delay, 0s)}@keyframes firework-rise{0%{transform:translateY(100vh);opacity:1}to{transform:translateY(var(--rise-y, 30vh));opacity:1}}@keyframes firework-burst{0%{transform:scale(0) translate(0);opacity:1}50%{opacity:1}to{transform:scale(1) translate(var(--burst-x, 0),var(--burst-y, 0));opacity:0}}@keyframes firework-fade{0%{opacity:1}to{opacity:0}}.firework-container{position:absolute;animation:firework-fade 2s ease-out forwards;animation-delay:var(--delay, 0s)}.firework-trail{position:absolute;width:4px;height:4px;border-radius:50%;background:var(--color, gold);animation:firework-rise .5s ease-out forwards;animation-delay:var(--delay, 0s)}.firework-spark{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--color, gold);animation:firework-burst 1s ease-out forwards;animation-delay:calc(var(--delay, 0s) + .5s);box-shadow:0 0 6px var(--color, gold)}@media(max-width:767px){.game-board{grid-template-areas:"scoreboard" "main" "hand";grid-template-columns:1fr;grid-template-rows:auto 1fr auto;padding-bottom:150px}.scoreboard-history{display:none}.scoreboard.expanded .scoreboard-history{display:block}.player-info .player-name{font-size:.75rem}.player-info .score{font-size:1.25rem}.scoreboard-toggle,.scoreboard .exit-button{font-size:.65rem;padding:.4rem .5rem}.game-log{position:fixed;inset:auto 0 0;width:100%;border-radius:12px 12px 0 0;max-height:40vh;height:auto;align-self:auto}.game-log-entries{max-height:120px}.game-log-entries.expanded{max-height:calc(40vh - 80px)}}