/* Daily 10-Second Challenge only (Improvement 05). Loaded after styles.css by the two ten-second pages and nowhere else.
   The game button answers taps at once (no double-tap zoom on the button; pinch zoom stays available), and the result
   shows its level message and the Personal Best note under the existing early/late heading. */
.game-shell .game-button { touch-action: manipulation; }
.game-result .game-tier { margin: .45rem 0 0; font-size: clamp(1.05rem, 3.6vw, 1.3rem); font-weight: 760; color: var(--ink); }
.game-result .game-best { display: inline-block; margin: .75rem 0 0; padding: .25rem .85rem; border: 1px solid #e8c766; border-radius: 999px; background: #fff6d6; color: #5c4300; font-weight: 820; }
/* Storybook pilot (Improvement 07, Gate 7-1a design, 17 items). Only colours already used by Home and the Play Hub
   (home.css --hm-*, play-hub.css headings, styles.css --ink/--muted/--surface), copied as --pc-* tokens because this
   page does not load home.css. Everything is scoped to the game shell and the page heading of these two pages; sizes,
   positions, the timer logic and the button's behaviour are unchanged. No !important, no new motion. */
.game-shell, .tool-heading {
  --pc-page-bg: #fffaf1;
  --pc-surface: #ffffff;
  --pc-surface-soft: #fde7d8;
  --pc-text: #3a2a1f;
  --pc-text-strong: #10233f;
  --pc-text-muted: #5c6b7f;
  --pc-kicker: #9a6510;
  --pc-accent: #c4473a;
  --pc-accent-dark: #a33a2f;
  --pc-wood: #b9824f;
  --pc-border: #f0e3d0;
  --pc-shadow-soft: 0 8px 22px rgba(16, 35, 63, .08);
  --pc-radius-sm: .75rem;
  --pc-radius-md: 1rem;
  --pc-radius-lg: 1.5rem;
  --pc-radius-pill: 999px;
}
/* 1 page background (the same cream as --pc-page-bg) */
html:root { background: #fffaf1; }
/* 2-4 page heading: the Play Hub headline colour (the size stays, so nothing below moves), the Hub's kicker colour;
   the lede keeps --muted */
.tool-heading h1 { color: var(--pc-text); }
.tool-heading .eyebrow { color: var(--pc-kicker); }
/* 5 the game frame */
.game-shell.game-shell { border-color: var(--pc-border); box-shadow: var(--pc-shadow-soft); }
/* 6-7 the mode bar */
.game-shell .game-mode { background: var(--pc-surface-soft); }
.game-shell .game-mode span { border-color: var(--pc-wood); color: var(--pc-text); }
/* 8-9 the timer panel: white with navy digits (the same 15.74:1 as before) and wooden edges drawn inside the panel
   (an inset shadow, not a border, so the panel and START keep their exact place) */
.game-shell .game-face { box-shadow: inset 0 1px 0 var(--pc-wood), inset 0 -1px 0 var(--pc-wood); background: var(--pc-surface); color: var(--pc-text-strong); }
.game-shell .timer-target { border-color: var(--pc-wood); color: var(--pc-text); }
/* 10-12 START / STOP: peach, navy label, coral edge; size, place and touch handling unchanged; a navy focus ring */
.game-shell .game-button { border-color: var(--pc-accent); background: var(--pc-surface-soft); color: var(--pc-text-strong); }
.game-shell .game-button:hover { background: var(--pc-page-bg); }
.game-shell .game-button:focus-visible { outline: 3px solid var(--pc-text-strong); }
/* 13-14 the result: cream with a coral rule; the "Result" label readable again (it kept the old dark-panel colour) */
.game-shell .game-result { border-top-color: var(--pc-accent); background: var(--pc-page-bg); }
.game-shell .game-result .result-label { border-color: var(--pc-accent); color: var(--pc-accent-dark); }
/* 15-16 the records: warm rules; a word inside a label stays on the label's line ("今日の Daily") */
.game-shell .record-grid div { border-top-color: var(--pc-border); }
.game-shell .record-grid span span { display: inline; }
/* 17 the share button */
.game-shell .secondary-button { border-color: var(--pc-accent); border-radius: var(--pc-radius-pill); color: var(--pc-accent-dark); }