@media (max-width: 600px) {
  body[data-view="match"] main { padding-bottom: 24px; }
  .hand-panel .hand-action,
  .choice-panel .hand-action {
    position: fixed;
    bottom: calc(var(--mobile-nav-height) + 10px);
    left: 13px;
    right: 13px;
    z-index: 24;
    margin: 0;
    padding: 13px;
    border: 1px solid #d1c3dc;
    background: #e9e2eef5;
    backdrop-filter: blur(12px);
    box-shadow: 0 -5px 20px #291a3910;
  }
  .hand-panel, .choice-panel { padding-bottom: 30px; }
}
.source-deck-label { font-size: 10px; color: var(--muted); }

:root {
  --safe-bottom: max(12px, env(safe-area-inset-bottom, 0px));
  --mobile-nav-height: calc(60px + var(--safe-bottom));
}
.icon { width: 20px; height: 20px; flex-shrink: 0; vertical-align: middle; }
button > .icon, a > .icon, summary > .icon { pointer-events: none; }
.brand-mark svg { display: block; width: .82em; height: .82em; }
.brand-moon { fill: #c0952f; }
.nav-icon { display: inline-flex; align-items: center; justify-content: center; }
.nav-icon .icon { width: 22px; height: 22px; }
.page-heading { margin: 0 0 22px; }
.page-heading h1 { margin: 0; font-size: 24px; letter-spacing: .02em; }
.library-actions { display: flex; justify-content: flex-end; gap: 12px; margin-bottom: 22px; }
.library-actions button { display: inline-flex; align-items: center; gap: 10px; }
.mode-card { display: flex; align-items: center; gap: 14px; min-height: 90px; padding: 22px; }
.mode-card > .icon { width: 27px; height: 27px; }
.mode-card strong { margin: 0; font-size: 16px; }
.mode-card .mode-selected { display: inline-flex; margin-left: auto; color: var(--purple); }
.mode-selected .icon { width: 18px; height: 18px; }
.basic-guide { border: 1px solid var(--line); margin-bottom: 20px; background: #fbfaf7; }
.basic-guide > summary { display: flex; align-items: center; justify-content: space-between; padding: 16px 20px; font-size: 13px; }
.basic-guide .rule-steps { margin: 0; padding: 0 16px 16px; }
.basic-guide[open] > summary .icon, .hand-help[open] > summary .icon { transform: rotate(180deg); }
.hand-help > summary { display: inline-flex; align-items: center; gap: 8px; padding: 8px 0; font-size: 11px; color: var(--muted); }
.hand-help .icon { width: 14px; height: 14px; }
.rule-copy h1 { font-size: 24px; }
.rule-copy .section-heading h2, .offline-card h2 { font-size: 18px; }
.ai-evidence { padding: 0 16px; margin: -4px 0 16px; border: 1px solid var(--line); }
.ai-evidence summary, .starter-presets > summary { display: flex; align-items: center; justify-content: space-between; font-size: 12px; }
.ai-evidence p { font-size: 11px; line-height: 1.8; }
.benchmark-presets > h2 { font-size: 18px; margin: 25px 0 15px; }
.starter-presets > summary { padding: 18px 0; }
.starter-presets button { width: 100%; text-align: left; display: grid; grid-template-columns: 1fr auto; gap: 10px; margin: 8px 0; padding: 15px; }
.starter-presets button > span { grid-column: 1/-1; font-size: 9px; color: var(--muted); }
.starter-presets button strong { font-size: 12px; }
.starter-presets button small { font-size: 10px; }
.card-attack .icon { width: 13px; height: 13px; }
.card-bottom .add .icon { width: 16px; height: 16px; }
.sample-decks .actions { flex-direction: column; align-items: stretch; }
.sample-decks button { text-align: left; line-height: 1.6; }
.recipe-card-list{display:grid;gap:5px;margin:15px 0}.recipe-card-list>button{display:flex;align-items:center;gap:10px;min-height:42px;border:1px solid var(--line);padding:8px 10px;text-align:left}.recipe-card-list>button>span{flex:1;font-size:11px;line-height:1.6}.recipe-card-list strong{font:12px ui-monospace,monospace}.recipe-card-list small{font-size:9px;color:var(--purple)}.policy-results{border-top:1px solid var(--line)}.policy-results summary{padding:12px 0;font-size:11px}
@media(max-width:600px) {
  body { --mobile-controls-space: 0px; padding-bottom: calc(var(--mobile-nav-height) + var(--mobile-controls-space) + 16px); }
  body[data-view="library"] { --mobile-controls-space: 88px; }
  body[data-view="match"]:has(.hand-action) { --mobile-controls-space: 110px; }
  body[data-view="library"] main { padding-bottom: 24px; }
  .app-header nav { height: var(--mobile-nav-height); padding: 0 max(12px, env(safe-area-inset-right, 0px)) var(--safe-bottom) max(12px, env(safe-area-inset-left, 0px)); }
  .app-header nav button { min-height: 60px; padding: 7px 4px; gap: 4px; position: relative; font-size: 10px; }
  .app-header nav button[aria-pressed="true"] { background: transparent; }
  .app-header nav button[aria-pressed="true"]::before { content: ''; position: absolute; top: 5px; width: 46px; height: 30px; border-radius: 12px; background: #e5dbee; z-index: -1; }
  .mobile-deck-bar { bottom: calc(var(--mobile-nav-height) + 10px); }
  .deck.is-open { padding-bottom: calc(25px + var(--safe-bottom)); }
  footer { padding: 18px max(20px, env(safe-area-inset-right, 0px)) 20px max(20px, env(safe-area-inset-left, 0px)); gap: 16px; flex-wrap: wrap; }
  #notice { bottom: calc(var(--mobile-nav-height) + var(--mobile-controls-space) + 12px); }
  .library-actions { margin-bottom: 18px; justify-content: space-between; }
  .library-actions button { min-height: 44px; padding: 10px 14px; font-size: 12px; }
  .page-heading { margin-bottom: 18px; }
  .page-heading h1, .rule-copy h1 { font-size: 22px; }
  .mode-picker { gap: 8px; }
  .mode-card { flex-direction: column; justify-content: center; gap: 9px; padding: 15px 6px 12px; min-height: 100px; }
  .mode-card strong { font-size: 12px; white-space: nowrap; }
  .mode-card .mode-selected { position: absolute; right: 7px; top: 7px; margin: 0; }
  .mode-selected .icon { width: 13px; height: 13px; }
}