@charset "UTF-8";
/* One viewport for play; auxiliary records and full card text open above it. */
body[data-screen=solo].is-playing { height:100dvh; min-height:0; min-width:0; overflow:hidden; }
body[data-screen=solo].is-playing > .site-header, body[data-screen=solo].is-playing > .site-footer { display:none; }
body[data-screen=solo].is-playing #app { width:100%; max-width:none; height:100dvh; min-height:0; margin:0; padding:10px 24px 6px; display:grid; grid-template-rows:52px minmax(0,1fr); gap:8px; }
.solo-topbar { display:flex; align-items:center; gap:13px; border-bottom:1px solid #b9a87440; padding-bottom:8px; }
.console-emblem { display:grid; place-items:center; width:38px; height:40px; border:1px double #bc9a55; color:#e9ce8d; font:26px Georgia,serif; transform:rotate(-4deg); background:#b8973b0d; text-decoration:none; }
.console-title { min-width:0; }
.console-title .eyebrow { margin:0 0 3px; color:#c7b88b; font-size:9px; letter-spacing:.15em; }
.console-title h1 { font-size:18px; line-height:1.2; margin:0; color:#f5ecd7; }
.console-tools { display:flex; gap:8px; margin-left:auto; }
.console-tools button { min-height:38px; padding:7px 17px; font-size:13px; border-color:#a29c6255; }
.adventure-shell { display:grid; grid-template-rows:48px minmax(0,1fr) clamp(172px,24dvh,226px) 23px; gap:10px; min-width:0; min-height:0; }
.adventure-shell > .survivor-hud { padding:0 12px; margin:0; gap:20px; border:0; border-bottom:1px solid #a9b77730; border-radius:0; background:#182920b0; box-shadow:none; }
.adventure-shell .hud-identity strong { font-size:12px; }
.adventure-shell .survivor-mark { width:25px; height:25px; flex-basis:25px; }
.adventure-shell > .survivor-hud .stats { display:flex; justify-content:space-around; gap:8px; }
.adventure-shell > .survivor-hud .stat { display:grid; grid-template-columns:18px auto auto; gap:8px; min-height:36px; padding:2px 10px; border:0; background:none; }
.adventure-shell > .survivor-hud .stat .label { grid-column:auto; font-size:11px; color:#bac5ac; }
.adventure-shell > .survivor-hud .stat .value { font-size:22px; }
.adventure-stage,.adventure-dock,.story-stage,.story-console,.story-reader,.page-window,.combat-arena,.arena-field { min-height:0; min-width:0; }
.adventure-stage { position:relative; }
.story-stage { display:grid; grid-template-columns:minmax(0,1.12fr) minmax(0,1fr); height:100%; overflow:hidden; border:1px solid #bb9c6159; border-radius:8px; box-shadow:0 10px 32px #0005; }
.scene-stage-art { min-width:0; min-height:0; position:relative; background:#111d17; overflow:hidden; }
.scene-stage-art .scene-illustration { position:absolute; inset:0; margin:0; padding:0; border:0; border-radius:0; background:transparent; }
.scene-stage-art .scene-art-button { height:100%; border-radius:0; }
.scene-stage-art .scene-art-button img { height:100%; width:100%; object-fit:cover; object-position:center; aspect-ratio:auto; filter:sepia(.12) contrast(1.05); }
body[data-screen=solo] .scene-art-button:hover { background:#111d17; transform:none; filter:none; }
.scene-stage-art .scene-illustration figcaption { display:none; }
.scene-stage-art .scene-art-zoom { top:14px; right:14px; bottom:auto; font-size:11px; background:#111b16c9; }
.scene-location { position:absolute; pointer-events:none; bottom:0; inset-inline:0; padding:50px 28px 24px; background:linear-gradient(transparent,#0c1916e8); color:#f7e9c6; }
.scene-location .eyebrow { margin:0 0 8px; font-size:10px; letter-spacing:.3em; color:#dfc796; }
.scene-location > span { font-size:clamp(22px,2vw,36px); font-weight:800; letter-spacing:-.05em; text-shadow:0 2px 12px #000; }
.story-console { display:grid; grid-template-rows:auto minmax(0,1fr) fit-content(55%); gap:16px; padding:clamp(18px,2vw,34px); color:#26392d; background:radial-gradient(#58462710 .6px,transparent .7px) 0 0 / 4px 4px,linear-gradient(125deg,#f9f1dd,#dfd6ba); box-shadow:-7px 0 30px #0b150c44; }
.story-heading { border-bottom:1px solid #9b8f683f; padding-bottom:13px; }
.story-heading .chapter-label { color:#867143; margin:0 0 6px; font-size:10px; letter-spacing:.18em; }
.story-heading h2 { font-size:clamp(22px,2vw,30px); line-height:1.3; color:#25392e; margin:0; }
.viewport-pager { display:grid; grid-template-rows:32px minmax(0,1fr); min-width:0; min-height:0; }
.pager-heading { display:flex; align-items:center; gap:10px; min-width:0; }
.pager-heading h3 { margin:0; color:#e7debc; font-size:13px; white-space:nowrap; }
.pager-controls { display:flex; gap:6px; align-items:center; margin-left:auto; }
.page-count { color:#b9c3a6; font-size:10px; font-variant-numeric:tabular-nums; white-space:nowrap; min-width:30px; text-align:center; }
.pager-controls .page-arrow { display:grid; place-items:center; width:34px; min-height:30px; height:30px; padding:0; font:24px/1 Georgia,serif; border-radius:3px; color:#e8d4a4; background:#293b2c; border:1px solid #a2a07155; box-shadow:none; }
.pager-controls .page-arrow:disabled { opacity:.28; }
.page-window { overflow-x:auto; overflow-y:hidden; scrollbar-width:none; overscroll-behavior:contain; outline-offset:-3px; }
.page-window::-webkit-scrollbar { display:none; }
.story-reader { grid-template-rows:minmax(0,1fr) 30px; gap:8px; }
.story-reader .pager-heading { grid-row:2; border-top:1px solid #9b8f682b; padding-top:5px; }
.story-reader .page-window { grid-row:1; overflow:hidden; }
.story-reader .pager-heading h3 { font-size:10px; letter-spacing:.1em; color:#8a7954; }
.story-reader .page-count { color:#756d55; }
.story-reader .page-arrow { background:#e6ddc5; color:#41533b; border-color:#a79f7d; }
.story-prose { height:100%; column-gap:24px; column-fill:auto; overflow-wrap:anywhere; }
.story-prose .story-text { color:#364536; margin:0 0 14px; font-size:clamp(16px,1.15vw,20px); line-height:1.9; orphans:2; widows:2; }
.story-actions { display:grid; gap:10px; min-height:0; max-height:40dvh; overflow-y:auto; scrollbar-width:thin; }
.story-actions:empty { display:none; }
.story-actions .story-choices { margin:0; gap:8px; }
.story-actions .story-choice { min-height:50px; width:100%; font-size:15px; line-height:1.5; padding:12px 17px; background:#314b37; border-color:#4b6544; }
.story-actions .toolbar { margin:0; gap:8px; }
.story-actions .action-control { flex:1; }
.story-actions .action-control button,.story-actions > button { width:100%; min-height:48px; font-size:15px; }
.story-actions .caption { color:#71694e; font-size:12px; margin:5px 0 0; }
.adventure-dock { padding:0 14px; border:1px solid #9e9b5e40; border-radius:7px; background:linear-gradient(#1f332799,#101d16bf); box-shadow:inset 0 1px #b5b77913; }
.adventure-dock > .card-rack { height:100%; }
.card-rack .card-row { display:flex; gap:12px; height:100%; margin:0; padding:6px 2px 8px; overflow:visible; }
.card-rack .inventory-card { position:relative; flex:0 0 auto; min-width:0; height:100%; }
.adventure-shell .card-rack .playing-card { --card-art-height:clamp(52px,8dvh,82px); --card-width:164px; display:flex; flex-direction:column; gap:0; width:var(--card-width); min-width:var(--card-width); min-height:0; height:100%; padding:8px; border-radius:6px; position:relative; }
.adventure-shell .card-rack .playing-card > .card-top { position:absolute; top:7px; right:7px; width:24px; height:24px; min-height:0; padding:0; font-size:0; margin:0; z-index:2; }
.adventure-shell .card-rack .playing-card .cost { width:24px; height:24px; min-width:24px; font-size:13px; }
.adventure-shell .card-rack .playing-card > strong { font-size:13px; line-height:1.3; min-height:30px; margin:0 0 5px; padding-right:25px; flex-shrink:0; }
.adventure-shell .card-rack .playing-card .card-art { height:var(--card-art-height); min-height:var(--card-art-height); margin:0 0 6px; flex-basis:var(--card-art-height); }
.adventure-shell .card-rack .playing-card .card-effect { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; min-height:0; max-height:2.9em; font-size:11px; line-height:1.45; margin:0; overflow:hidden; }
.adventure-shell .card-rack .playing-card .card-sub,.adventure-shell .card-rack .playing-card .markers { display:none; }
.adventure-shell .card-rack .playing-card .card-hint { position:absolute; bottom:5px; right:7px; min-height:0; margin:0; padding:2px 5px; font-size:9px; box-shadow:0 0 8px #ebebcd; }
.adventure-shell .card-rack .playing-card .card-hint.locked { display:none; }
.adventure-shell .card-rack .playing-card.exhausted::after { content:'소진'; position:absolute; bottom:5px; right:7px; padding:2px 5px; color:#ede9ca; background:#5c614d; font-size:10px; }
.adventure-shell .card-rack .playing-card:hover { transform:translateY(-3px); }
.inventory-count { position:absolute; bottom:7px; right:7px; background:#253a2e; color:#eee1bb; border-radius:3px; padding:0 4px; font-size:10px; pointer-events:none; }
.rack-meta { color:#a9b996; font-size:11px; margin:0; padding:2px; min-height:28px; }
.console-footer { display:flex; justify-content:space-between; align-items:center; gap:8px; min-width:0; }
.console-footer .dock-tip,.console-footer .save-indicator { margin:0; font-size:10px; color:#a6b391; }
.console-footer .save-indicator { white-space:nowrap; }
.console-footer .game-tools { display:flex; flex-wrap:nowrap; align-items:center; gap:12px; padding:0; margin:0; }
.console-footer .game-tools button { min-height:23px; padding:0 3px; font-size:11px; }
.console-footer .caption { margin:0; font-size:11px; flex:0 0 auto; width:auto; white-space:nowrap; }
/* Combat keeps the board, action bar and hand on one surface. */
.combat-arena { height:100%; display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:12px; padding:14px; border:1px solid #9d996043; border-radius:8px; background:radial-gradient(ellipse at center,#425c3238,transparent 75%),#14271e; }
.arena-heading { display:flex; align-items:center; gap:12px; min-width:0; padding-bottom:10px; border-bottom:1px solid #c5b47a30; }
.arena-heading .scene-illustration { flex:0 0 64px; margin:0; padding:0; }
.arena-heading .chapter-label { margin:0 0 3px; font-size:9px; color:#bda977; }
.arena-heading h2 { margin:0; font-size:18px; color:#ece5ce; }
.arena-heading > button { min-height:34px; font-size:11px; }
.arena-heading .turn-strip { margin:0 0 0 auto; padding:8px 12px; }
.arena-field { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:14px; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; }
.arena-field .enemy-grid { display:grid; grid-template-columns:1fr; margin:0; gap:10px; align-content:start; }
.arena-field .enemy-panel { padding:12px; }
.arena-field .enemy-name { margin-bottom:8px; font-size:14px; }
.arena-field .enemy-panel .stat { min-height:44px; padding:5px; }
.arena-field .enemy-panel .stat .label { font-size:10px; }
.arena-field .enemy-panel .stat .value { font-size:19px; }
.arena-field .enemy-panel .stats { grid-template-columns:repeat(7,minmax(0,1fr)); }
.arena-field .enemy-panel .stats:not(:has(.stat:nth-child(3))) { grid-template-columns:repeat(2,minmax(0,1fr)); }
.arena-field .enemy-panel .caption { font-size:11px; margin:5px 0; }
.arena-field .battle-self { border:1px solid #899c5355; padding:12px; border-radius:6px; background:#203a2633; }
.field-label { margin:0 0 12px; font-size:14px; color:#b9c7a1; }
.arena-field .card-rack { height:166px; margin-top:8px; }
.arena-field .pager-heading { gap:4px; flex-wrap:wrap; }
.arena-field .pager-heading h3 { font-size:11px; }
.arena-field .zone-expand { min-height:28px; padding:0; font-size:10px; }
.arena-field .pager-controls { gap:3px; }
.arena-field .page-count { display:none; }
.arena-field .page-arrow { width:26px; min-height:28px; height:28px; }
.arena-field .card-rack .playing-card { --card-width:128px; --card-art-height:52px; }
.arena-field .card-rack .playing-card .card-effect { -webkit-line-clamp:1; font-size:10px; }
.arena-field .battle-map { grid-column:1 / -1; margin:0; }
.arena-field .battle-map h3 { margin:0 0 5px; font-size:12px; }
.arena-field .empty { width:100%; height:100%; min-height:0; display:grid; place-items:center; font-size:12px; }
.arena-actions { display:flex; align-items:center; gap:12px; border-top:1px solid #b5b47e42; padding-top:10px; }
.arena-actions .next-step { flex:1; font-size:13px; padding:0; margin:0; border:0; background:none; }
.arena-actions .next-step::before { content:none; }
.arena-actions .toolbar { gap:8px; margin:0; }
.arena-actions .action-control { min-width:100px; }
.arena-actions .action-control button { min-height:44px; width:100%; padding:8px 12px; font-size:14px; }
.arena-actions .action-control .caption { max-width:220px; font-size:10px; margin:3px 0 0; }
/* Full text stays reachable in overlays. */
#card-dialog.game-sheet { width:min(900px,calc(100vw - 28px)); max-height:calc(100dvh - 28px); }
.game-menu-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin-top:22px; }
.game-menu-grid > * { min-height:48px; }
.adventure-journal .journal-section > summary { min-height:48px; font-size:15px; }
.adventure-journal .caption,.adventure-journal .record-values,.adventure-journal .log { font-size:14px; }
.adventure-journal .record-notes { min-height:150px; font-size:16px; }
#card-dialog.choice-dialog { width:min(800px,calc(100vw - 24px)); max-height:calc(100dvh - 24px); padding:22px; overflow:hidden; }
.choice-dialog .decision { display:flex; flex-direction:column; max-height:calc(100dvh - 140px); margin:0; padding:18px; }
.choice-dialog .decision > * { flex-shrink:0; }
.choice-dialog .decision .decision-options { min-height:0; flex-shrink:1; overflow-y:auto; overscroll-behavior:contain; }
.choice-dialog .decision-option { font-size:16px; }
.choice-dialog .decision h2 { display:none; }
.choice-dialog .decision p { color:#cdd1ba; }
.choice-dialog .option-description { font-size:13px; }
.choice-dialog .decision > button { min-height:48px; font-size:15px; }
body[data-screen=solo].is-playing #toast,body[data-screen=solo].is-playing .fx-notes { bottom:26px; }
@media (max-width:1100px) {
  body[data-screen=solo].is-playing #app { padding-inline:14px; }
  .adventure-shell .hud-identity { display:none; }
  .adventure-shell > .survivor-hud .stat { padding-inline:3px; gap:5px; }
  .story-console { padding:20px; gap:12px; }
  .arena-actions { flex-wrap:wrap; gap:6px; }
  .arena-field .enemy-panel .stats { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .arena-actions .next-step { flex-basis:100%; }
  .arena-actions .toolbar { flex:1; }
  .arena-actions .action-control { flex:1; }
}
@media (max-width:600px) {
  body[data-screen=solo].is-playing #app { padding:max(6px,env(safe-area-inset-top)) 8px max(5px,env(safe-area-inset-bottom)); grid-template-rows:44px minmax(0,1fr); gap:6px; }
  .solo-topbar { gap:9px; padding-bottom:5px; }
  .console-emblem { width:29px; height:33px; font-size:23px; }
  .console-title h1 { font-size:16px; }
  .console-title .eyebrow { font-size:8px; }
  .console-tools { gap:5px; }
  .console-tools button { min-height:38px; padding:6px 10px; font-size:12px; }
  .adventure-shell { grid-template-rows:52px minmax(0,1fr) 164px 20px; gap:7px; }
  .adventure-shell > .survivor-hud { padding:0; }
  .adventure-shell > .survivor-hud .stats { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:2px; }
  .adventure-shell > .survivor-hud .stat { grid-template-columns:12px auto; padding:4px 0; gap:3px 0; }
  .adventure-shell > .survivor-hud .stat .value { font-size:19px; }
  .adventure-shell > .survivor-hud .stat .label { grid-column:1 / -1; font-size:9px; }
  .adventure-shell > .survivor-hud .stat-icon { font-size:10px; }
  .story-stage { grid-template-columns:minmax(0,1fr); grid-template-rows:minmax(0,.72fr) minmax(0,1fr); }
  .scene-location { padding:25px 16px 12px; }
  .scene-location .eyebrow { font-size:8px; margin-bottom:3px; }
  .scene-location > span { font-size:22px; }
  .scene-stage-art .scene-art-zoom { top:8px; right:8px; font-size:9px; }
  .story-console { padding:12px 14px; gap:8px; }
  .story-heading { padding-bottom:7px; }
  .story-heading .chapter-label { font-size:9px; margin-bottom:3px; }
  .story-heading h2 { font-size:20px; }
  .story-prose .story-text { font-size:15px; line-height:1.8; margin-bottom:12px; }
  .story-reader { grid-template-rows:minmax(0,1fr) 28px; gap:3px; }
  .story-reader .page-arrow { width:36px; height:28px; min-height:28px; }
  .story-actions { max-height:23dvh; gap:6px; }
  .story-actions .story-choice,.story-actions .action-control button,.story-actions > button { min-height:44px; padding:10px 12px; font-size:14px; }
  .adventure-dock { padding:0 7px; }
  .pager-heading { gap:7px; }
  .pager-heading h3 { font-size:12px; }
  .pager-controls { gap:4px; }
  .pager-controls .page-arrow { width:30px; }
  .rack-meta { font-size:10px; }
  .card-rack .card-row { gap:8px; padding-top:4px; padding-bottom:5px; }
  .adventure-shell .card-rack .playing-card { --card-width:112px; --card-art-height:48px; padding:6px; }
  .adventure-shell .card-rack .playing-card > strong { font-size:12px; min-height:29px; padding-right:21px; margin-bottom:4px; }
  .adventure-shell .card-rack .playing-card .card-top { top:5px; right:5px; width:21px; height:21px; }
  .adventure-shell .card-rack .playing-card .cost { width:21px; height:21px; min-width:21px; font-size:12px; }
  .adventure-shell .card-rack .playing-card .card-effect { font-size:10px; -webkit-line-clamp:1; max-height:1.45em; }
  .adventure-shell .card-rack .playing-card:hover { transform:none; }
  .adventure-shell .card-rack .playing-card .card-hint { font-size:8px; padding:1px 3px; bottom:3px; right:4px; }
  .console-footer .dock-tip,.console-footer .save-indicator { font-size:9px; }
  .console-footer .game-tools { gap:6px; }
  .console-footer .game-tools button,.console-footer .caption { font-size:10px; }
  .combat-arena { padding:8px; gap:8px; }
  .arena-heading { gap:7px; padding-bottom:7px; }
  .arena-heading .scene-illustration { display:none; }
  .arena-heading h2 { font-size:15px; }
  .arena-heading > button { font-size:10px; padding:0 4px; }
  .arena-heading .turn-strip { padding:6px 8px; }
  .arena-heading .turn-strip strong,.arena-heading .turn-strip span { font-size:11px; }
  .arena-field { gap:7px; }
  .arena-field .enemy-panel,.arena-field .battle-self { padding:7px; }
  .arena-field .enemy-name,.field-label { font-size:12px; gap:5px; margin-bottom:6px; }
  .arena-field .enemy-mark { width:22px; height:22px; flex-basis:22px; }
  .arena-field .enemy-panel .stat { min-height:37px; padding:3px; }
  .arena-field .enemy-panel .stats { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .arena-field .enemy-panel .stat .value { font-size:16px; }
  .arena-field .enemy-panel .stat .label { font-size:8px; }
  .arena-field .card-rack { height:153px; grid-template-rows:50px minmax(0,1fr); margin-top:4px; }
  .arena-field .pager-heading { gap:1px 5px; }
  .arena-field .pager-heading h3 { font-size:10px; }
  .arena-field .pager-controls { margin-left:0; width:100%; justify-content:flex-end; }
  .arena-field .card-rack .playing-card { --card-width:112px; --card-art-height:40px; }
  .arena-field .card-rack .playing-card .card-effect { display:none; }
  .arena-field .zone-expand { min-height:22px; font-size:9px; }
  .arena-field .empty { padding:6px; font-size:11px; text-align:center; }
  .arena-actions { padding-top:7px; gap:6px; }
  .arena-actions .next-step { font-size:11px; line-height:1.4; }
  .arena-actions .toolbar { gap:5px; }
  .arena-actions .action-control { min-width:70px; }
  .arena-actions .action-control button { min-height:42px; font-size:12px; padding:6px; }
  .arena-actions .action-control .caption { font-size:9px; }
  .arena-actions .choice-trigger { min-height:44px; width:100%; font-size:14px; }
  #card-dialog.choice-dialog { padding:15px; }
  .choice-dialog .decision { padding:12px; max-height:calc(100dvh - 130px); }
  .choice-dialog .decision-option { font-size:15px; padding:10px; }
}
@media (max-width:600px) and (max-height:650px) {
  .story-stage { grid-template-rows:minmax(0,1fr); }
  .story-stage .scene-stage-art { display:none; }
  .adventure-shell { grid-template-rows:48px minmax(0,1fr) 140px 20px; gap:5px; }
  .adventure-dock .playing-card .card-effect { display:none; }
}
@media (min-width:601px) and (max-height:650px) {
  body[data-screen=solo].is-playing #app { grid-template-rows:38px minmax(0,1fr); gap:4px; padding:5px 12px; }
  .solo-topbar { padding-bottom:3px; }
  .console-emblem { width:28px; height:30px; font-size:22px; }
  .console-title h1 { font-size:15px; }
  .console-tools button { min-height:32px; padding-block:4px; }
  .adventure-shell { grid-template-rows:34px minmax(0,1fr) 116px 18px; gap:5px; }
  .adventure-shell > .survivor-hud .stat { min-height:30px; }
  .adventure-shell > .survivor-hud .stat .value { font-size:18px; }
  .adventure-shell > .survivor-hud .stat .label { font-size:10px; }
  .story-console { padding:10px 16px; gap:5px; grid-template-rows:minmax(0,1fr) fit-content(48%); }
  .story-heading { display:none; }
  .story-heading .chapter-label { display:none; }
  .story-heading h2 { font-size:20px; }
  .story-prose .story-text { font-size:14px; line-height:1.65; }
  .story-reader { gap:2px; grid-template-rows:minmax(0,1fr) 24px; }
  .story-reader .pager-heading { padding-top:0; }
  .story-reader .page-arrow { min-height:24px; height:24px; }
  .story-actions { max-height:22dvh; gap:4px; }
  .story-actions .story-choice,.story-actions .action-control button { min-height:36px; padding:5px 10px; font-size:13px; }
  .adventure-dock .viewport-pager { grid-template-rows:27px minmax(0,1fr); }
  .adventure-dock .pager-controls .page-arrow { height:25px; min-height:25px; }
  .adventure-shell .adventure-dock .playing-card { --card-width:132px; --card-art-height:37px; padding:5px; }
  .adventure-shell .adventure-dock .playing-card > strong { min-height:17px; font-size:11px; -webkit-line-clamp:1; }
  .adventure-dock .playing-card .card-effect { display:none; }
  .combat-arena { padding:7px; gap:5px; }
  .arena-heading { padding-bottom:4px; }
  .arena-heading .scene-illustration { display:none; }
  .arena-heading h2 { font-size:15px; }
  .arena-heading .chapter-label { display:none; }
  .arena-heading .turn-strip { padding:4px 8px; }
  .arena-actions { padding-top:4px; flex-wrap:nowrap; }
  .arena-actions .next-step { font-size:11px; flex-basis:auto; }
  .arena-actions .action-control button { min-height:34px; font-size:12px; padding:5px; }
}
@media (prefers-reduced-motion:reduce) { .adventure-shell .card-rack .playing-card:hover { transform:none; } }
/* Scenario selection is a scrollable menu, separate from the play screen. */
body[data-screen=adventure] #app { padding-top:24px; }
body[data-screen=adventure] .page-heading { margin-bottom:20px; }
.expedition-card { min-height:430px; }
.expedition-body { padding-top:120px; }
.expedition-body h2 { margin-block:9px; }
.scenario-features { margin-bottom:14px; }
.expedition-details { margin-top:12px; }
@media (max-width:760px) {
  body[data-screen=adventure] #app { padding:20px 16px 32px; }
  .expedition-card { min-height:370px; }
  .expedition-body { padding:110px 20px 18px; }
  .expedition-body h2 { font-size:28px; }
  .expedition-actions > button { min-height:48px; font-size:14px; }
}

/* Duel: a fixed table, shared action strip and hand. Only card rails are paged. */
body[data-screen=room].is-playing { height:100dvh; min-height:0; min-width:0; overflow:hidden; }
body[data-screen=room].is-playing > .site-header,body[data-screen=room].is-playing > .site-footer { display:none; }
body[data-screen=room].is-playing #app { width:100%; max-width:none; height:100dvh; min-height:0; margin:0; padding:10px 24px 6px; display:grid; grid-template-rows:52px minmax(0,1fr); gap:8px; }
body[data-screen=room].is-playing #toast,body[data-screen=room].is-playing .fx-notes { bottom:32px; }
.adventure-shell.duel-shell { grid-template-rows:minmax(0,1fr) auto clamp(164px,23dvh,226px) 28px; gap:8px; }
.duel-table { display:grid; grid-template-rows:42px minmax(0,1fr); min-height:0; min-width:0; gap:8px; }
.duel-turnbar { display:flex; align-items:center; gap:12px; border-bottom:1px solid #ab9f6c40; }
.duel-turnbar .turn-strip { display:flex; align-items:center; gap:20px; flex:1; min-width:0; margin:0; padding:7px 12px; background:none; border:0; }
.duel-turnbar .turn-strip strong { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:16px; color:#eddda7; }
.duel-turnbar .turn-strip span { font-size:12px; white-space:nowrap; color:#b6c0a7; }
.duel-turnbar .pending-trigger { flex-shrink:0; min-height:32px; padding:4px 10px; font-size:12px; }
.duel-field { min-height:0; min-width:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; }
.duel-player { min-height:0; min-width:0; display:grid; grid-template-rows:30px 54px minmax(0,1fr); gap:10px; padding:14px; border:1px solid #aab16c45; border-radius:8px; background:radial-gradient(ellipse at bottom,#48603945,transparent 75%),#172a20; box-shadow:inset 0 1px #acb68220,0 8px 22px #0002; }
.duel-player.opponent { border-color:#bb877b55; background:radial-gradient(ellipse at bottom,#694b3b30,transparent 75%),#232a21; }
.duel-player-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; min-width:0; }
.duel-player-heading h2 { display:flex; align-items:center; gap:9px; min-width:0; font-size:16px; margin:0; }
.duel-player-heading h2 > span:not(.duel-seat-mark) { white-space:nowrap; text-overflow:ellipsis; overflow:hidden; }
.duel-player-heading h2 small { flex-shrink:0; color:#aeb797; font-size:11px; font-weight:400; }
.duel-seat-mark { display:grid; place-items:center; flex:0 0 28px; height:28px; border:1px solid #b2b37a55; color:#ccce8a; font:18px Georgia,serif; }
.opponent .duel-seat-mark { color:#d3a28b; border-color:#c7917955; }
.duel-deck-count { white-space:nowrap; color:#b6bca3; font-size:11px; flex-shrink:0; }
.duel-player > .stats { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:6px; min-width:0; margin:0; }
.duel-player .stat { display:grid; grid-template-columns:16px auto; gap:2px 4px; padding:4px 6px; min-height:0; background:#111e1580; }
.duel-player .stat .value { font-size:23px; line-height:1.1; }
.duel-player .stat .label { grid-column:1 / -1; color:#b7bfa5; font-size:10px; }
.duel-player .stat-icon { font-size:12px; }
.duel-player .card-rack { min-height:0; min-width:0; }
.duel-player .pager-heading { gap:6px; }
.duel-player .zone-expand { min-height:30px; font-size:11px; padding:2px 4px; }
.duel-player .card-row { align-items:center; }
.duel-player .card-rack .card-row { padding:4px 2px 5px; }
.duel-shell .duel-player .playing-card { --card-width:clamp(128px,12vw,174px); max-height:300px; }
.duel-shell .duel-player .playing-card .card-art { flex:1 1 0; height:auto; min-height:0; max-height:170px; }
.duel-shell .duel-player .playing-card .card-effect { flex-shrink:0; }
.duel-shell .card-rack .playing-card .markers { display:block; flex-shrink:0; margin-top:auto; padding-top:4px; text-align:left; font-size:10px; line-height:1.3; color:#4d5c45; }
.duel-shell .card-rack .playing-card .card-status { color:#4d5c45; font-size:inherit; min-height:16px; padding:1px 3px; }
.duel-shell .card-rack .playing-card.exhausted::after { display:none; }
.duel-shell .card-rack .playing-card .card-hint { bottom:auto; top:46px; right:8px; }
.duel-shell .duel-hand .playing-card .markers { display:none; }
.duel-shell .duel-hand .playing-card .card-art { flex:1 1 0; min-height:0; height:auto; max-height:95px; }
.duel-player .empty { width:100%; height:100%; display:grid; place-items:center; min-height:0; padding:12px; color:#96a38a; border:1px dashed #a0a87933; border-radius:6px; font-size:12px; }
.duel-actionbar { min-width:0; display:flex; align-items:center; gap:16px; padding:8px 14px; border:1px solid #b6ad6950; border-radius:6px; background:#293c2b; box-shadow:0 3px 12px #0003; }
.duel-actionbar .next-step { flex:1; min-width:0; margin:0; padding:0; border:0; background:none; color:#dce2c3; font-size:13px; line-height:1.45; }
.duel-actionbar .next-step::before { content:none; }
.duel-actionbar .toolbar { display:flex; gap:8px; flex-wrap:nowrap; margin:0; }
.duel-actionbar .toolbar:empty { display:none; }
.duel-actionbar .action-control { min-width:100px; }
.duel-actionbar button,.duel-actionbar > .button { min-height:44px; padding:8px 16px; font-size:14px; }
.duel-actionbar .action-control button { width:100%; }
.duel-actionbar .action-control .caption { max-width:220px; font-size:10px; margin:4px 0 0; }
.duel-shell .console-footer .connection { font-size:10px; white-space:nowrap; }
.duel-shell .console-footer .game-tools button { min-height:28px; }
.duel-shell.is-finished .duel-turnbar { border-color:#d3ad68; }
.duel-shell.is-finished .turn-strip strong { font-size:21px; }
@media (max-width:1100px) {
  body[data-screen=room].is-playing #app { padding-inline:14px; }
  .duel-player { padding:10px; gap:7px; }
  .duel-player .page-count { display:none; }
  .duel-field { gap:9px; }
}
@media (min-width:601px) and (min-height:651px) and (max-height:800px) {
  .duel-player { grid-template-rows:26px 42px minmax(0,1fr); gap:6px; padding:10px; }
  .duel-player .stat .value { font-size:19px; }
  .duel-player .stat .label { font-size:9px; }
  .duel-shell .duel-player .playing-card .card-effect { display:none; }
}
@media (max-width:600px) {
  body[data-screen=room].is-playing #app { padding:max(6px,env(safe-area-inset-top)) 8px max(5px,env(safe-area-inset-bottom)); grid-template-rows:44px minmax(0,1fr); gap:6px; }
  .adventure-shell.duel-shell { grid-template-rows:minmax(0,1fr) auto 164px 28px; gap:6px; }
  .duel-table { grid-template-rows:32px minmax(0,1fr); gap:6px; }
  .duel-turnbar { gap:5px; }
  .duel-turnbar .turn-strip { gap:8px; padding:3px 2px; }
  .duel-turnbar .turn-strip strong { font-size:12px; }
  .duel-turnbar .turn-strip span { font-size:10px; }
  .duel-turnbar .pending-trigger { padding:4px 6px; font-size:10px; min-height:28px; }
  .duel-field { grid-template-columns:minmax(0,1fr); grid-template-rows:repeat(2,minmax(0,1fr)); gap:7px; }
  .duel-player { grid-template-columns:100px minmax(0,1fr); grid-template-rows:24px minmax(0,1fr); padding:7px; gap:4px 8px; }
  .duel-player-heading { grid-column:1 / -1; gap:8px; }
  .duel-player-heading h2 { font-size:13px; gap:5px; }
  .duel-player-heading h2 small { font-size:10px; }
  .duel-seat-mark { flex-basis:20px; height:20px; font-size:14px; }
  .duel-deck-count { font-size:10px; }
  .duel-player > .stats { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(3,minmax(0,1fr)); gap:3px; }
  .duel-player .stat { padding:2px 3px; grid-template-columns:10px auto; gap:0 2px; align-content:center; }
  .duel-player .stat .value { font-size:18px; }
  .duel-player .stat .label { font-size:9px; }
  .duel-player .stat-icon { font-size:10px; }
  .duel-player .card-rack { grid-template-rows:28px minmax(0,1fr); }
  .duel-player .pager-heading { gap:3px; }
  .duel-player .pager-heading h3 { font-size:10px; }
  .duel-player .zone-expand { font-size:9px; min-height:26px; padding:0 2px; }
  .duel-player .pager-controls { gap:3px; }
  .duel-player .page-arrow { width:25px; min-height:28px; height:28px; }
  .duel-shell .duel-player .playing-card { --card-width:104px; padding:5px; }
  .duel-shell .duel-player .playing-card > strong { font-size:11px; line-height:1.3; min-height:28px; padding-right:20px; margin-bottom:3px; }
  .duel-shell .duel-player .playing-card .card-art { margin-bottom:2px; }
  .duel-shell .duel-player .playing-card .card-effect { display:none; }
  .duel-shell .duel-player .playing-card .markers { font-size:9px; padding-top:2px; }
  .duel-shell .card-rack .playing-card .card-hint { top:39px; right:5px; }
  .duel-player .empty { padding:4px; font-size:10px; }
  .duel-actionbar { flex-wrap:wrap; padding:7px 9px; gap:6px; }
  .duel-actionbar .next-step { flex-basis:100%; font-size:11px; }
  .duel-actionbar .toolbar { flex:1; gap:6px; }
  .duel-actionbar .action-control { flex:1; min-width:0; }
  .duel-actionbar button,.duel-actionbar > .button { min-height:44px; padding:7px 8px; font-size:13px; }
  .duel-actionbar .choice-trigger { width:100%; }
  .duel-actionbar .action-control .caption { font-size:9px; }
  .duel-shell.is-finished .turn-strip strong { font-size:16px; }
}
@media (max-width:600px) and (max-height:650px) {
  .adventure-shell.duel-shell { grid-template-rows:minmax(0,1fr) auto 140px 28px; gap:5px; }
  .duel-player { grid-template-columns:88px minmax(0,1fr); padding:5px; gap:3px 5px; }
  .duel-player .stat .value { font-size:15px; }
  .duel-player .stat .label { font-size:8px; }
  .duel-player .zone-expand { font-size:0; }
  .duel-player .zone-expand::after { content:' 펼치기'; font-size:9px; }
  .duel-shell .duel-player .playing-card { --card-width:96px; }
}
@media (min-width:601px) and (max-height:650px) {
  body[data-screen=room].is-playing #app { grid-template-rows:38px minmax(0,1fr); gap:4px; padding:5px 12px; }
  .adventure-shell.duel-shell { grid-template-rows:minmax(0,1fr) auto 110px 24px; gap:4px; }
  .duel-table { grid-template-rows:28px minmax(0,1fr); gap:4px; }
  .duel-turnbar .turn-strip { padding:3px 5px; gap:12px; }
  .duel-turnbar .turn-strip strong { font-size:12px; }
  .duel-turnbar .turn-strip span { font-size:10px; }
  .duel-turnbar .pending-trigger { min-height:26px; padding:3px 8px; font-size:10px; }
  .duel-player { padding:5px 7px; gap:4px; grid-template-rows:22px 30px minmax(0,1fr); }
  .duel-player-heading h2 { font-size:12px; }
  .duel-seat-mark { flex-basis:20px; height:20px; font-size:14px; }
  .duel-player .stats { gap:4px; }
  .duel-player .stat { grid-template-columns:10px auto; padding:1px 3px; gap:0 2px; }
  .duel-player .stat .value { font-size:15px; }
  .duel-player .stat .label { font-size:8px; }
  .duel-player .stat-icon { font-size:9px; }
  .duel-player .card-rack { grid-template-rows:24px minmax(0,1fr); }
  .duel-player .pager-heading h3,.duel-player .zone-expand { font-size:10px; }
  .duel-player .zone-expand,.duel-player .page-arrow { min-height:24px; height:24px; }
  .duel-shell .duel-player .playing-card { --card-width:114px; padding:3px 5px; }
  .duel-shell .duel-player .playing-card > strong { font-size:10px; min-height:14px; margin-bottom:2px; -webkit-line-clamp:1; }
  .duel-shell .duel-player .playing-card .card-art { margin-bottom:0; }
  .duel-shell .duel-player .playing-card .card-effect { display:none; }
  .duel-shell .duel-player .playing-card .markers { font-size:8px; padding-top:1px; }
  .duel-shell .duel-player .playing-card .card-hint { top:auto; bottom:2px; }
  .duel-actionbar { padding:4px 8px; gap:8px; }
  .duel-actionbar .next-step { font-size:11px; }
  .duel-actionbar .action-control { min-width:85px; }
  .duel-actionbar button,.duel-actionbar > .button { min-height:34px; font-size:12px; padding:5px 9px; }
  .duel-shell .console-footer .game-tools button { min-height:24px; }
}
@media (min-width:601px) and (max-height:500px) {
  .adventure-shell.duel-shell { grid-template-rows:minmax(0,1fr) auto 100px 24px; }
  .duel-actionbar .action-control { min-width:128px; }
  .duel-player { grid-template-columns:90px minmax(0,1fr); grid-template-rows:22px minmax(0,1fr); gap:4px 8px; }
  .duel-player-heading { grid-column:1 / -1; }
  .duel-player > .stats { grid-template-columns:repeat(2,minmax(0,1fr)); grid-template-rows:repeat(3,minmax(0,1fr)); gap:2px; }
  .duel-player .stat { align-content:center; }
  .duel-player .stat .value { font-size:12px; }
  .duel-player .stat .label { font-size:7px; }
}
@media (max-width:600px) and (max-height:650px), (min-width:601px) and (max-height:500px) {
  .duel-shell .duel-player .playing-card { --card-width:155px; display:grid; grid-template-columns:40px minmax(0,1fr); grid-template-rows:minmax(0,1fr) auto; gap:2px 5px; padding:4px; }
  .duel-shell .duel-player .playing-card > strong { grid-column:2; grid-row:1; font-size:10px; line-height:1.3; min-height:0; padding-right:19px; margin:0; -webkit-line-clamp:2; }
  .duel-shell .duel-player .playing-card .card-art { grid-column:1; grid-row:1 / -1; min-height:0; width:40px; height:100%; margin:0; }
  .duel-shell .duel-player .playing-card .markers { grid-column:2; grid-row:2; font-size:8px; line-height:1.2; padding:0; margin:0; }
  .duel-shell .duel-player .playing-card .card-status { padding:0 3px; min-height:12px; }
  .duel-shell .duel-player .playing-card .card-top { top:4px; right:4px; width:18px; height:18px; }
  .duel-shell .duel-player .playing-card .cost { width:18px; height:18px; min-width:18px; font-size:10px; }
  .duel-shell .duel-player .playing-card .card-hint { display:none; }
  .duel-shell .duel-hand .playing-card .card-effect { display:none; }
  .duel-shell .duel-hand .playing-card .card-hint { top:auto; bottom:2px; }
}
