/* The forge: shared materials and typography for the native-sized game surfaces. */
@font-face {
  font-family: 'Rajdhani';
  src: url('/public/fonts/rajdhani-bold-latin.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
:root {
  --font-display: 'Rajdhani', 'Avenir Next Condensed', 'Arial Narrow', sans-serif;
  --font-ui: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --bg: #101315;
  --panel: #1c2021;
  --panel-raised: #292e2e;
  --line: #76664b;
  --text: #f3ede0;
  --muted: #b6bab7;
  --gold: #dab782;
  --gold-light: #f8dfac;
  --metal-edge: #a58a6059;
  --metal-surface: linear-gradient(145deg, #323332ed, #191e20f5 44%, #171b1df5);
  --forge-art: url('/public/art/ui/forge-sanctum.webp');
  --lobby-art: var(--forge-art);
  color-scheme: dark;
  font-family: var(--font-ui);
}
body { background:var(--bg); color:var(--text); font-family:var(--font-ui); }
button, input, select, textarea { font-family:inherit; }
button, a { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
button { transition:background-color 160ms, border-color 160ms, box-shadow 160ms; }
button:focus-visible, a:focus-visible, summary:focus-visible { outline:2px solid #f1d6a1; outline-offset:4px; }
::selection { background:#aa8a4f; color:#fff8e7; }
.game-shell.is-codex { position:relative; isolation:isolate; background:#111719; }
.game-shell.is-codex::before { content:''; position:fixed; inset:0; z-index:-1; background:linear-gradient(180deg,#10161999,#101619e6 70%),var(--forge-art) center/cover; pointer-events:none; }
.game-shell .game-main { margin-inline:auto; }
.game-shell :is(.page-heading h1,.account-heading h1,.rooms-heading h1) { font:700 clamp(30px,3.2vw,44px)/1 var(--font-display); letter-spacing:1px; text-transform:uppercase; margin:8px 0; color:#f7eddb; text-wrap:balance; }
.game-shell :is(.page-heading,.account-heading,.rooms-heading) { margin-bottom:24px; }
.game-shell :is(.page-heading p,.account-heading>p,.rooms-heading>p) { color:#b6bfbe; font-size:12px; line-height:1.6; }
.game-shell :is(.account-panel h2,.room-option h2,.pack-odds h2,.guide-feature h2,.empty-state h2,.room-wait h2), .dialog h2 { font-family:var(--font-display); font-weight:700; letter-spacing:.4px; text-transform:uppercase; }
.eyebrow { color:#cbb58e; font-size:9px; letter-spacing:1.7px; }
.game-shell .button, .dialog .button { min-height:46px; font:700 17px/1.1 var(--font-display); letter-spacing:.65px; text-transform:uppercase; border-radius:3px 10px 3px 10px; }
.game-shell .button.primary, .dialog .button.primary { color:#241e16; border:1px solid #f2d29a; background:linear-gradient(170deg,#f5dfaa,#d8ad68 52%,#b68448); box-shadow:inset 0 2px 0 #fff0c7,inset 0 -3px 0 #85592c,0 4px 0 #0a0c0c,0 7px 19px #0005; text-shadow:0 1px #ffecb366; }
.game-shell .button.secondary, .dialog .button.secondary { color:#ede1cd; border:1px solid #89755380; background:linear-gradient(155deg,#34393a,#222728); box-shadow:inset 0 1px #e5d6b52b,0 3px 0 #090d0e; }
.game-shell .button:disabled, .dialog .button:disabled { opacity:.48; box-shadow:none; cursor:not-allowed; }
.game-shell .text-button { color:#d9c6a4; }
.game-shell :is(.account-panel,.rooms-panel,.deck-summary,.guide-feature,.history-stats,.history-row,.empty-state.big) { background:var(--metal-surface); border:1px solid var(--metal-edge); border-top-color:#d6bd855e; border-radius:4px 14px 4px 14px; box-shadow:inset 0 1px #f5e5c21a,0 3px 0 #070b0b,0 12px 32px #0004; }
.game-shell :is(.account-panel,.rooms-panel) { position:relative; }
.game-shell :is(.account-panel,.rooms-panel)::before { content:''; position:absolute; top:6px; left:6px; width:3px; height:3px; border-radius:50%; background:#c4a374; box-shadow:0 1px 2px #000; opacity:.75; pointer-events:none; }
.game-shell :is(input:not([type=checkbox]):not([type=range]),select) { border-color:#87745175; background:#0e1517ed; color:#efe9dc; border-radius:3px; }
.game-shell :is(input,select)::placeholder { color:#9ca9aa; }
.game-shell :is(.search-box,.collection-ownership,.tabs,.account-auth-tabs,.deck-type-tabs>button,.deck-selected-filter) { border-color:#8f795440; background:#121a1ddd; border-radius:4px; }
.game-shell :is(.tab.active,.account-auth-tabs>button.active,.collection-ownership>button[aria-pressed=true],.deck-type-tabs>button[aria-pressed=true]) { color:#f7dfb1; border-color:#c29d5e; background:linear-gradient(180deg,#61503855,#2b2b24); box-shadow:inset 0 -2px #c3a166; }
.game-shell .filter { background:#192123; border-color:#71827c50; }
.game-shell .filter.active { background:#39352c; border-color:#c3a775; }
.game-shell .visual-guide { background:#121b1de0; border-color:#72756a4a; }
.game-shell :is(.deck-mobile-bar,.collection-toolbar) { border-color:#87765355; }
.game-shell .deck-mobile-bar { background:#151d1ff5; box-shadow:0 -6px 22px #0006; }
.game-shell :is(.budget-row b,.deck-mobile-counters b,.history-score,.account-profile-stats dd,.ranked-points>strong,.account-wallet b) { font-family:var(--font-display); font-weight:700; font-variant-numeric:tabular-nums; }
.game-shell .deck-summary { border-top:3px solid #b89962; }
.game-shell .deck-summary .fine-print { color:#aeb8b4; }
.game-shell .field-card { background:#1a2426; border:1px solid #9b845a7a; border-radius:4px 12px; box-shadow:0 4px 0 #080d0e; }
.game-shell .field-card h3 { font:700 24px/1.05 var(--font-display); color:#f6e3bd; }
.game-shell .field-card p { color:#bdc6c3; }
.game-shell .field-art { border-bottom:2px solid #8a714e; }
/* Login is an entrance to the game, keeping usable native form controls. */
.account-auth-page { padding-top:24px; }
.account-auth-page .account-heading { text-align:center; margin-bottom:26px; }
.account-auth-page .account-heading::before { content:'S'; display:grid; place-items:center; width:65px; height:72px; margin:0 auto 18px; font:700 51px/1 var(--font-display); color:#f7d49a; border:1px solid #b89456a6; border-radius:4px 18px 4px 18px; background:linear-gradient(145deg,#554833cc,#192225ee); box-shadow:inset 0 0 0 5px #10191b77,0 0 25px #d9a95614; }
.account-auth-page .account-heading>p { margin-inline:auto; }
.account-auth-panel { border-top:2px solid #cbaa6b; }
.account-auth-panel label { color:#dfd8c9; }
.account-auth-panel label>small { color:#a8b5b2; }
.account-auth-tabs>button { font:700 17px var(--font-display); text-transform:uppercase; letter-spacing:.6px; }
.account-auth-panel input { box-shadow:inset 0 2px 6px #0004; }
.account-recovery { background:linear-gradient(140deg,#423a2a,#1e2929); }
.account-rank-badge>span>strong { font:700 30px/1.1 var(--font-display); letter-spacing:.6px; text-transform:uppercase; }
.account-wallet>span { background:#101a1edb; border-color:#b399633d; border-radius:3px; box-shadow:inset 0 1px #ded3b415; color:#bfc8c2; }
.account-wallet b { color:#f1d49d; }
.account-profile-stats { border-color:#ad95653b; }
.account-profile-stats dt, .account-record, .account-details>summary { color:#b8c4c0; }
.account-profile-stats dd { color:#f2e6d0; }
/* Ranked uses a crest and an actual standings table, not a dashboard of cards. */
.game-shell .account-panel.ranked-current { background:linear-gradient(180deg,#17202566,#11191cf5 88%),var(--forge-art) center/cover; min-height:360px; }
.ranked-current>h2 { font-size:32px; }
.ranked-search-symbol { border-radius:5px 18px; width:77px; height:77px; background:linear-gradient(155deg,#725c3b70,#1c292d); border:1px solid #c5a36a99; box-shadow:inset 0 0 0 5px #142126,0 0 27px #d2a9541f; }
.ranked-search-symbol>.icon { width:35px; height:35px; }
.ranked-progress { border-top:2px solid #c69e60; }
.ranked-active-deck { background:#111b1cb3; border:1px solid #7c74524d; padding:12px; border-radius:3px; }
.ranked-points>strong { color:#f0d4a1; }
.rank-reward-table, .rank-table { font-variant-numeric:tabular-nums; }
.leaderboard-panel { margin-top:24px; }
.rank-table th, .rank-table td { border-color:#8190832e; }
.rank-table thead { background:#0e1719; color:#bfbcac; }
.rank-table tbody tr.is-you { background:#9f87452b; }
.rank-position.podium { color:#ffe1a0; background:#69543140; border-color:#b58a4b77; }
.rank-table-points { font:700 22px var(--font-display); color:#eed6a7; }
/* Packs have a physical focal point, with the economy one tier below. */
.packs-page .account-heading { margin-bottom:12px; }
.packs-page>.account-wallet { margin:12px 0 22px; }
.pack-store-layout { grid-template-columns:minmax(0,2fr) minmax(220px,1fr); align-items:stretch; }
.game-shell .account-panel.pack-offer { min-height:340px; padding:32px; gap:36px; overflow:hidden; background:radial-gradient(ellipse at 25% 40%,#ddaa5430,transparent 60%),linear-gradient(120deg,#172022aa,#11191bee),var(--forge-art) center/cover; }
.pack-object { width:156px; height:222px; border:3px solid #96764f; border-top-color:#d3b587; border-right-color:#665036; border-radius:6px 18px 6px 18px; background:repeating-linear-gradient(135deg,#d6b56d08 0 1px,transparent 1px 10px),radial-gradient(ellipse,#6c654138,#0e1b20 72%),#172428; box-shadow:inset 0 0 0 3px #181b18,inset 0 0 0 5px #b0925a66,5px 6px 0 #332d22,8px 9px 0 #070c0d,0 22px 32px #0009,0 0 40px #9acfbd0b; }
.pack-object::before { inset:12px; border-radius:3px 12px; border-color:#bc995850; }
.pack-object>span { display:grid; place-items:center; width:77px; height:87px; border:1px solid #c7a36188; border-radius:3px 17px; background:linear-gradient(145deg,#5d503340,#102126); font:700 69px var(--font-display); text-shadow:0 0 25px #ceaa5c66; }
.pack-object>small { margin-top:9px; }
.pack-offer-copy h2 { font-size:31px; max-width:220px; }
.pack-offer-copy>p { color:#bdc9c4; }
.pack-offer-copy>.button { min-height:54px; font-size:18px; }
.pack-collection { display:flex; flex-direction:column; justify-content:center; }
.pack-collection>strong { font-family:var(--font-display); font-size:68px; font-weight:700; }
.pack-odds { margin-top:28px; }
.pack-odds>div>span { border-radius:3px 10px; background:#172123d9; box-shadow:inset 0 2px var(--rarity-glow); }
.pack-odds b { font-family:var(--font-display); font-size:29px; }
.pack-odds>p { color:#b7c0bc; }
.pack-opening-stage { background:radial-gradient(ellipse,#baa06520,transparent 75%),linear-gradient(#131d2099,#10191be6),var(--forge-art) center/cover; border-color:#ab8f5866; border-radius:4px 16px; padding-top:35px; box-shadow:inset 0 1px #f2d5a04d,0 4px 0 #080e0f; }
.pack-back { background:repeating-linear-gradient(135deg,#d3ae6408 0 1px,transparent 1px 10px),radial-gradient(ellipse,#4c5038,#122028 76%); border:3px solid #b18e58; border-right-color:#6a573f; border-bottom-color:#665139; border-radius:5px 13px; box-shadow:inset 0 0 0 2px #171c1b,0 6px 0 #0b1010,0 15px 26px #0009; }
.pack-back b { font:700 99px/1.5 var(--font-display); }
.pack-back::before { border-radius:2px 10px; }
.pack-front { border-width:2px; border-radius:5px 13px; background:#172023; }
.pack-front .pack-result-art:after { background:linear-gradient(0deg,#172023,transparent 55%); }
.pack-front .pack-result-body>strong { font-family:var(--font-display); font-weight:700; text-transform:uppercase; }
.pack-rarity { background:#091214; font-family:var(--font-display); font-size:13px; font-weight:700; }
.pack-pull-reward { background:#18312c; }
/* Private duels use the same invitation console as the rest of the game. */
.rooms-heading h1 br { display:none; }
.room-option { border-color:#a88b5752; }
.room-option h2 { font-size:30px; }
.room-option-number { font-family:var(--font-display); color:#d4b879; }
.room-deck { background:#131c1f; border-color:#97825c66; }
.room-deck strong { font-family:var(--font-display); font-weight:700; letter-spacing:.3px; }
.game-shell .editor-section-heading h2 { font-family:var(--font-display); font-weight:700; text-transform:uppercase; }
.room-deck-fan img { border-color:#ad8a52; border-radius:3px; }
.room-code { font-family:var(--font-display)!important; font-weight:700!important; color:#f8d9a1!important; letter-spacing:6px; }
.room-seats>div { background:#121c1f; border-color:#8e835b6b; }
.room-wait .room-sigil { color:#f2cf93; }
/* Inspection stays a readable close-up of the actual illustration. */
.dialog-backdrop { background:#040a0de3; backdrop-filter:blur(8px); }
.dialog { border:1px solid #9c8159; border-top:3px solid #c0a16c; border-radius:4px 18px; background:linear-gradient(135deg,#2b302d,#151e22 48%); box-shadow:0 25px 90px #000b,inset 0 0 0 4px #b2975f0c; }
.dialog>header { border-bottom-color:#ba9e6238; background:#131c1ccc; }
.dialog>header h2 { font-size:27px; }
.dialog-body :is(h3,.inspection-effect h3) { font-family:var(--font-ui); font-size:15px; font-weight:600; color:#e9e3d5; line-height:1.5; }
.dialog .inspect-art { position:relative; height:360px; max-width:265px; border:4px solid #9d8057; border-radius:5px 16px 5px 16px; box-shadow:inset 0 0 0 2px #1a2020,0 6px 0 #080d0f,0 14px 30px #0008; }
.dialog .inspect-art::after { content:''; position:absolute; inset:5px; border:1px solid #e4c5885c; border-radius:2px 9px; pointer-events:none; }
.dialog .inspect-art>.portrait { object-position:center 20%; }
.dialog .inspect-item-art { border:3px solid #95825b; border-radius:4px 14px; }
.dialog .inspect-stats { background:#111c20; border-color:#88784e; }
.dialog .inspection-effect { border-color:#92815c42; }
.dialog .inspection-reference { color:#a9b6b2; }
.dialog .guide-tip { background:#141f20; border-color:#87785266; }
#toast { background:#192625f5; color:#f5e2bd; border-color:#c4a56e; border-radius:3px 10px; box-shadow:0 6px 30px #0008; }
@media (hover:hover) and (pointer:fine) {
  .game-shell .button.primary:not(:disabled):hover { background:linear-gradient(170deg,#fff0c5,#e6c083 52%,#c19454); box-shadow:inset 0 2px #fff6dc,inset 0 -3px #936534,0 4px #0a0c0c,0 7px 28px #c6954730; }
  .game-shell .button.secondary:not(:disabled):hover { border-color:#dcc08a; background:linear-gradient(155deg,#404646,#293133); }
}
@media (max-width:700px) {
  .game-shell.is-codex .game-main { padding-top:20px; }
  .game-shell :is(.page-heading h1,.account-heading h1,.rooms-heading h1) { font-size:31px; letter-spacing:.6px; line-height:1.08; }
  .game-shell :is(.page-heading,.account-heading,.rooms-heading) { margin-bottom:19px; }
  .account-auth-page { padding-top:5px; }
  .account-auth-page .account-heading::before { width:48px; height:54px; font-size:38px; margin-bottom:13px; }
  .game-shell .account-auth-panel { padding:21px 19px; }
  .pack-store-layout { display:flex; flex-direction:column; gap:14px; }
  .game-shell .account-panel.pack-offer { flex-direction:column; min-height:0; padding:25px 21px 22px; gap:24px; text-align:center; }
  .pack-offer .pack-object { width:126px; height:178px; }
  .pack-object>span { width:61px; height:67px; font-size:53px; }
  .pack-offer-copy { width:100%; }
  .pack-offer-copy h2 { font-size:29px; max-width:none; margin:9px 0 7px; }
  .pack-offer-copy p { font-size:12px; line-height:1.5; }
  .pack-offer-copy>.button { margin-top:18px; font-size:18px; }
  .pack-collection { display:grid; grid-template-columns:1fr auto; align-items:center; gap:8px 15px; padding:16px 18px; }
  .pack-collection>.eyebrow { grid-column:1; }
  .pack-collection>strong { grid-column:2; grid-row:1/3; font-size:43px; margin:0; }
  .pack-collection>strong>small { font-size:21px; }
  .pack-collection .account-collection-track { grid-column:1; margin:0; }
  .pack-collection>.text-button { grid-column:1/-1; padding:0; min-height:36px; justify-self:start; }
  .pack-opening-stage { padding:27px 8px 20px; }
  .pack-front .pack-result-body>strong { font-size:17px; line-height:1.02; }
  .pack-rarity { font-size:10px; }
  .pack-back b { font-size:66px; }
  .pack-opening-actions .button { font-size:16px; min-height:48px; }
  .pack-odds { margin-top:23px; }
  .game-shell .account-panel.ranked-current { min-height:325px; }
  .game-shell .ranked-current>h2 { font-size:28px; }
  .ranked-progress .account-rank-badge>span>strong { font-size:25px; }
  .leaderboard-panel { margin-top:18px; }
  .dialog { border-radius:5px 14px 0 0; }
  .dialog>header h2 { font-size:25px; }
  .dialog .inspect-art { height:315px; max-width:235px; }
  .game-shell .button { min-height:48px; }
}
@media (prefers-reduced-motion:reduce) { button { transition:none; } }