:root{--bg-deep: #0d0a08;--bg-panel: #1a140f;--bg-input: #0e0a07;--bg-elevated: #25180f;--border: #3d2f1f;--border-hi: #8a6a3a;--gold: #d4a64a;--gold-soft: #b8923c;--gold-hi: #e2b85a;--blood: #8b1a2a;--blood-text: #ffb0bc;--blood-tint-soft: rgba(139, 26, 42, .15);--blood-tint-strong: rgba(139, 26, 42, .2);--ember: #c87a3a;--cold: #5a7888;--ink: #e8dcc4;--ink-muted: #8a7a64;--ink-dim: #5d5040;--success: #6a9a4a;--danger: #c84a4a;--font-heading: "Cinzel", "Trajan Pro", serif;--font-body: Inter, system-ui, sans-serif}body{margin:0;padding:0;background:var(--bg-deep);color:var(--ink);font-family:var(--font-body)}#app{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;overflow:hidden}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bg-input)}::-webkit-scrollbar-thumb{background:var(--border);border:2px solid var(--bg-input);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--border-hi)}#view-root{position:fixed;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center;pointer-events:none;z-index:10}#view-root>*{pointer-events:auto}.panel{background:radial-gradient(at 50% 0%,rgba(212,166,74,.06) 0%,transparent 60%),var(--bg-panel);border:1px solid var(--border-hi);box-shadow:0 0 0 1px #0009 inset,0 24px 60px #000000b3;padding:36px 32px 32px;min-width:380px;max-width:440px;color:var(--ink);position:relative}.panel:before,.panel:after{content:"";position:absolute;width:16px;height:16px;border:2px solid var(--border-hi);pointer-events:none}.panel:before{top:6px;left:6px;border-right:none;border-bottom:none}.panel:after{bottom:6px;right:6px;border-left:none;border-top:none}.panel h2{margin:0 0 18px;font-family:var(--font-heading);font-weight:700;letter-spacing:6px;font-size:22px;color:var(--gold);text-align:center;text-shadow:0 1px 0 rgba(0,0,0,.8)}.panel-wide{min-width:640px;max-width:1280px;width:calc(100vw - 80px);max-height:calc(100vh - 80px);display:flex;flex-direction:column;padding:28px 28px 24px}.tabs{display:flex;gap:0;margin-bottom:22px;border-bottom:1px solid var(--border)}.tabs button{flex:1;background:transparent;border:none;color:var(--ink-muted);padding:12px 0;font-family:var(--font-heading);font-size:12px;letter-spacing:4px;text-transform:uppercase;cursor:pointer;border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .15s ease,border-color .15s ease}.tabs button:hover{color:var(--ink)}.tabs button[aria-selected=true]{color:var(--gold);border-bottom-color:var(--gold)}form.auth-form{display:flex;flex-direction:column;gap:14px}label.field{display:flex;flex-direction:column;gap:4px;font-family:var(--font-heading);font-size:10px;color:var(--ink-muted);letter-spacing:3px;text-transform:uppercase}label.field input,label.field select{background:var(--bg-input);border:1px solid var(--border);border-radius:2px;color:var(--ink);padding:11px 12px;font-family:var(--font-body);font-size:14px;letter-spacing:0;text-transform:none;transition:border-color .15s ease}label.field input:focus,label.field select:focus{outline:none;border-color:var(--gold)}label.field .field-error{color:var(--danger);font-size:11px;text-transform:none;letter-spacing:0;font-family:var(--font-body);min-height:14px}button.primary,button.secondary{font-family:var(--font-heading);font-weight:700;letter-spacing:4px;font-size:13px;text-transform:uppercase;padding:13px 18px;cursor:pointer;border-radius:2px;transition:background-color .15s ease,border-color .15s ease,color .15s ease}button.primary{background:linear-gradient(180deg,var(--gold) 0%,var(--gold-soft) 100%);color:var(--bg-deep);border:1px solid var(--border-hi);box-shadow:0 0 0 1px #0006 inset,0 2px #00000080;margin-top:4px}button.primary:hover:not(:disabled){background:linear-gradient(180deg,var(--gold-hi) 0%,var(--gold) 100%)}button.primary:disabled{background:var(--bg-elevated);color:var(--ink-dim);border-color:var(--border);box-shadow:none;cursor:not-allowed}button.secondary{background:transparent;color:var(--ink-muted);border:1px solid var(--border)}button.secondary:hover:not(:disabled){color:var(--gold);border-color:var(--border-hi)}button.secondary:disabled{color:var(--ink-dim);cursor:not-allowed}button.secondary.danger{border-color:var(--blood);color:var(--danger)}button.secondary.danger:hover:not(:disabled){background:var(--blood-tint-strong);color:var(--blood-text)}.banner{background:var(--blood-tint-soft);border:1px solid var(--blood);color:var(--blood-text);border-radius:2px;padding:10px 12px;font-size:13px;margin-bottom:12px;font-family:var(--font-body)}.banner.hidden{display:none}.dev-section{margin-top:22px;padding-top:18px;border-top:1px dashed var(--border)}.dev-section h3{margin:0 0 8px;font-family:var(--font-heading);font-size:10px;letter-spacing:3px;color:var(--ink-muted);text-transform:uppercase;font-weight:500}.dev-section .row{display:flex;gap:8px}.dev-section input{flex:1;background:var(--bg-input);border:1px solid var(--border);border-radius:2px;color:var(--ink);padding:8px 10px;font-family:var(--font-body);font-size:13px}.dev-section button{background:transparent;border:1px solid var(--border);color:var(--ink-muted);padding:8px 14px;font-family:var(--font-heading);font-size:11px;letter-spacing:2px;cursor:pointer;border-radius:2px}.dev-section button:hover:not(:disabled){color:var(--gold);border-color:var(--border-hi)}.lobby-greeting{font-family:var(--font-heading);font-size:10px;letter-spacing:4px;text-transform:uppercase;color:var(--ink-muted);text-align:center;margin-top:6px}.lobby-username{font-family:var(--font-heading);font-weight:700;font-size:28px;letter-spacing:4px;color:var(--ink);text-align:center;margin:4px 0 22px;text-shadow:0 1px 0 rgba(0,0,0,.8)}.lobby-deck-field{margin-bottom:16px}.lobby-actions{display:flex;flex-direction:column;gap:10px}.decks-header{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:18px;border-bottom:1px solid var(--border);padding-bottom:14px}.decks-header h2{margin:0;font-family:var(--font-heading);letter-spacing:6px;font-size:20px;font-weight:700;color:var(--gold)}.decks-header .row{display:flex;gap:8px}.decks-list{display:flex;flex-direction:column;gap:8px;overflow-y:auto}.decks-loading,.decks-empty,.editor-deck-empty{color:var(--ink-muted);font-style:italic;font-size:14px;padding:24px;text-align:center}.deck-row{display:flex;align-items:center;justify-content:space-between;background:var(--bg-elevated);border:1px solid var(--border);border-left:3px solid var(--border-hi);border-radius:2px;padding:14px 16px;transition:border-color .15s ease}.deck-row:hover{border-color:var(--border-hi)}.deck-row-main{display:flex;flex-direction:column;gap:4px}.deck-row-name{font-family:var(--font-heading);font-size:16px;letter-spacing:1px;color:var(--ink)}.deck-row-meta{font-size:11px;color:var(--ink-muted);letter-spacing:1px}.deck-row-actions{display:flex;gap:6px}.deck-row button.secondary{padding:6px 14px;font-size:10px;letter-spacing:2px}.deck-name-field{margin-bottom:14px}.editor-body{display:grid;grid-template-columns:200px 1fr 320px;gap:14px;flex:1;min-height:420px;overflow:hidden}.editor-filters{display:flex;flex-direction:column;gap:10px}.editor-filters input{background:var(--bg-input);border:1px solid var(--border);border-radius:2px;color:var(--ink);padding:9px 11px;font-family:var(--font-body);font-size:13px}.type-chips{display:flex;flex-direction:column;gap:6px}.chip{background:var(--bg-input);border:1px solid var(--border);border-radius:2px;color:var(--ink-muted);padding:8px 12px;font-family:var(--font-heading);font-size:10px;letter-spacing:3px;cursor:pointer;text-align:left;text-transform:uppercase}.chip[aria-pressed=true]{color:var(--gold);border-color:var(--border-hi);background:#d4a64a1a}.editor-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:10px;overflow-y:auto;align-content:start;padding:4px}.card-tile{position:relative;background:linear-gradient(180deg,rgba(212,166,74,.06) 0%,transparent 50%),var(--bg-elevated);border:1px solid var(--border);border-radius:3px;padding:10px 8px 8px;display:flex;flex-direction:column;gap:4px;cursor:default;transition:border-color .15s ease}.card-tile:hover{border-color:var(--border-hi)}.card-tile-cost{position:absolute;top:-7px;right:-7px;background:var(--gold);color:var(--bg-deep);border:1px solid var(--border-hi);border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:13px;font-family:var(--font-body);box-shadow:0 1px #0009}.card-tile-body{display:flex;flex-direction:column;gap:2px;padding-right:20px}.card-tile-name{font-family:var(--font-heading);font-size:12px;color:var(--ink);letter-spacing:.5px;line-height:1.2}.card-tile-type{font-family:var(--font-heading);font-size:9px;color:var(--ink-muted);letter-spacing:3px;text-transform:uppercase}.card-tile-stats{font-size:14px;color:var(--gold);font-weight:700;min-height:18px}.card-tile-add{background:transparent;border:1px solid var(--border);border-radius:2px;color:var(--ink-muted);padding:5px;font-family:var(--font-heading);font-size:11px;letter-spacing:2px;cursor:pointer;margin-top:4px}.card-tile-add:hover:not(:disabled){color:var(--gold);border-color:var(--border-hi)}.card-tile-add:disabled{color:var(--ink-dim);cursor:not-allowed}.editor-deck{display:flex;flex-direction:column;gap:10px;overflow:hidden}.editor-deck-header{display:flex;flex-direction:column;gap:4px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:2px;padding:12px 14px}[data-deck-count]{font-family:var(--font-heading);font-size:18px;font-weight:700;color:var(--ink-muted);letter-spacing:4px}[data-deck-count].complete{color:var(--success)}.editor-deck-hint{font-size:11px;color:var(--ink-muted);font-style:italic}.editor-deck-list{display:flex;flex-direction:column;gap:3px;overflow-y:auto}.editor-deck-row{display:grid;grid-template-columns:28px 1fr auto auto;align-items:center;gap:8px;padding:6px 10px;background:var(--bg-elevated);border:1px solid var(--border);border-radius:2px}.editor-deck-row-cost{background:var(--gold);color:var(--bg-deep);border-radius:50%;width:22px;height:22px;display:flex;align-items:center;justify-content:center;font-weight:700;font-size:11px}.editor-deck-row-name{font-family:var(--font-heading);font-size:12px;color:var(--ink);letter-spacing:.5px}.editor-deck-row-qty{font-size:11px;color:var(--ink-muted);font-family:var(--font-body)}.editor-deck-row-buttons{display:flex;gap:4px}.chip-btn{background:transparent;border:1px solid var(--border);border-radius:2px;color:var(--ink-muted);width:24px;height:24px;display:flex;align-items:center;justify-content:center;font-family:var(--font-body);font-size:14px;cursor:pointer;padding:0}.chip-btn:hover:not(:disabled){color:var(--gold);border-color:var(--border-hi)}.chip-btn:disabled{color:var(--ink-dim);cursor:not-allowed}.queue-spinner{font-family:var(--font-heading);font-size:14px;color:var(--gold);letter-spacing:4px;text-align:center;padding:36px 0;min-height:80px}#view-root>.match-overlay{position:fixed;top:0;right:0;bottom:0;left:0;pointer-events:none;display:flex;flex-direction:column;padding:16px;font-family:var(--font-body);color:var(--ink);z-index:20}.match-overlay>*{pointer-events:auto}.match-overlay .banner{margin-bottom:8px;align-self:center;max-width:480px}.match-status{display:flex;align-items:center;gap:24px;background:var(--bg-panel);border:1px solid var(--border-hi);border-radius:2px;padding:8px 14px;font-family:var(--font-heading);font-size:11px;letter-spacing:3px;align-self:center;text-transform:uppercase;box-shadow:0 0 0 1px #00000080 inset}[data-turn-info]{color:var(--ink-muted)}[data-timer]{color:var(--gold);font-weight:700;min-width:40px}.match-actions{position:absolute;bottom:16px;right:16px;display:flex;gap:8px}.event-log{position:absolute;top:16px;right:16px;width:260px;max-height:180px;overflow-y:auto;background:var(--bg-panel);border:1px solid var(--border);border-radius:2px;padding:8px 10px;font-family:ui-monospace,monospace;font-size:10px;color:var(--ink-muted);opacity:.85;box-shadow:0 0 0 1px #00000080 inset}.event-log-row{padding:2px 0;border-bottom:1px solid var(--border)}.event-log-row:last-child{border-bottom:none}.mulligan-panel{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);background:radial-gradient(at 50% 0%,rgba(212,166,74,.08) 0%,transparent 60%),var(--bg-panel);border:1px solid var(--border-hi);border-radius:3px;padding:28px 32px 24px;min-width:360px;z-index:22;box-shadow:0 0 0 1px #0009 inset,0 24px 60px #000000b3}.mulligan-panel h3{margin:0 0 8px;font-family:var(--font-heading);letter-spacing:6px;font-weight:700;font-size:18px;color:var(--gold);text-align:center}.mulligan-help{font-size:12px;color:var(--ink-muted);font-style:italic;text-align:center;margin-bottom:16px}.mulligan-row{display:flex;align-items:center;gap:10px;padding:7px 0;font-family:var(--font-heading);font-size:12px;letter-spacing:1px;color:var(--ink);cursor:pointer}.mulligan-row input{accent-color:var(--gold)}.match-end-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(at 50% 50%,transparent 0%,rgba(13,10,8,.94) 60%),#0d0a08d9;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;z-index:25}.match-end-overlay h2{margin:0;font-family:var(--font-heading);letter-spacing:10px;font-weight:900;font-size:38px;color:var(--gold);text-shadow:0 2px 0 rgba(0,0,0,.9)}[data-match-end-outcome]{font-family:var(--font-heading);font-size:18px;color:var(--ink);letter-spacing:4px}.turn-banner{position:absolute;top:160px;left:50%;transform:translate(-50%);padding:8px 22px;border-radius:2px;font-family:var(--font-heading);font-size:13px;letter-spacing:6px;font-weight:700;background:var(--bg-panel);border:1px solid var(--border);box-shadow:0 0 0 1px #00000080 inset}.turn-banner.my-turn{color:var(--gold);border-color:var(--border-hi);text-shadow:0 0 12px rgba(212,166,74,.4)}.turn-banner.opponent-turn{color:var(--ink-dim)}.hand-hint{position:absolute;bottom:210px;left:50%;transform:translate(-50%);padding:6px 12px;border-radius:2px;font-size:12px;letter-spacing:1px;color:var(--blood-text);background:var(--blood-tint-strong);border:1px solid var(--blood);text-align:center;max-width:480px;font-style:italic}.hidden{display:none!important}
