.play-mode { display: flex; padding: 4px; border: 1px solid #dce2cd; border-radius: 24px; background: #eeefe3; }
.play-mode button { padding: 8px 17px; border-radius: 20px; font: 600 12px var(--sans); color: #768367; letter-spacing: 0; }
.play-mode button[aria-pressed='true'] { color: #fffdf5; background: #60774d; box-shadow: 0 2px 4px #485c361c; }
.play-mode button:focus-visible { outline: 2px solid #c97845; outline-offset: 3px; }
#adventure-panel[data-mode='score-attack'] .intro { padding: 15px 0 18px; }
#adventure-panel[data-mode='score-attack'] .intro :is(.eyebrow, .intro-note) { display: none; }
html #adventure-panel[data-mode='score-attack'] .intro h1 { margin: 0; max-width: none; white-space: normal; font-size: 27px; line-height: 1.4; }
#adventure-panel[data-mode='score-attack'] .scene { height: clamp(200px, 27vh, 270px); }
#adventure-panel[data-mode='score-attack'] .practice-panel { padding-top: 8px; }
#adventure-panel[data-mode='score-attack'] .typing-area { padding: 4px 0 5px; }
#adventure-panel[data-mode='score-attack'] #typing-instruction { margin-bottom: 2px; }
#adventure-panel[data-mode='score-attack'] .word-reading { margin: 0; line-height: 1.5; }
#adventure-panel[data-mode='score-attack'] .token-line { height: 58px; }
.score-hud { position: relative; display: grid; grid-template-columns: 1.5fr 1fr 1fr; gap: 24px; padding: 12px 28px 15px; background: #fbfbf3; align-items: end; }
.score-label { display: block; font: 600 11px var(--sans); letter-spacing: .07em; color: #667752; margin-bottom: 5px; }
.score-hud strong { font: 500 36px/1.15 var(--mono); letter-spacing: -.06em; color: #536b41; }
.score-hud .score-main > strong { font-size: 38px; color: #c57643; }
.score-hud small { font: 500 12px var(--sans); letter-spacing: 0; margin-left: 6px; }
.score-main { position: relative; }
.score-gain { display: inline-block; margin-left: 12px; color: #be703c; font: 600 12px var(--sans); letter-spacing: 0; }
.score-spark { color: #bb9d5b; font-size: 25px; margin-left: 12px; }
.score-time-track { position: absolute; bottom: 0; left: 0; right: 0; height: 4px; background: #e8eddb; }
#score-time-bar { width: 100%; height: 100%; background: #96ae70; transition: width .1s linear; }
.time-low .score-clock strong { color: #b66338; }
.time-low #score-time-bar { background: #d6965e; }
.score-record { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 18px; padding: 7px 28px; border-bottom: 1px solid #e7eada; color: #6f7f5a; font: 500 11px/1.7 var(--sans); background: #f1f4e6; }
.score-record strong { margin-left: 6px; font-family: var(--mono); font-size: 14px; }
#score-bonus { margin-left: auto; color: #8c754d; }
[data-mode='score-attack'] .cozy-badge { color: #96703f; }
.result-actions { display: flex; flex-direction: column; align-items: center; }
[data-mode='score-attack'] .result-card { max-width: 500px; padding: 24px 30px; }
[data-mode='score-attack'] .result-card > h2 { margin: 10px 0 12px; }
.score-result > span { display: block; color: #798665; font: 500 11px var(--sans); letter-spacing: .06em; }
.score-result > strong { display: block; font: 500 68px/1.3 var(--mono); color: #c57643; letter-spacing: -.06em; }
.score-result small { font: 500 16px var(--sans); margin-left: 8px; }
.score-result > p { margin: 4px 0; font: 600 14px/1.7 var(--sans); color: #697b4d; }
.score-result #score-result-status { margin: 8px auto 16px; font-size: 11px; font-weight: 500; color: #828875; max-width: 340px; }
[data-mode='score-attack'] .result-card > p:first-of-type { display: none; }
[data-mode='score-attack'] .result-stats { padding: 10px 0; margin: 12px 0 0; }
[data-mode='score-attack'] .result-card .result-tip { margin: 6px 0 14px; }
[data-mode='score-attack'] .result-actions .text-button { margin-top: 8px; }
html[lang='ja'] .score-label { letter-spacing: .02em; }
html[lang='ja'] .play-mode button { font-weight: 700; }
@media (max-width: 800px) {
  [data-mode='score-attack'] .intro { padding-bottom: 20px; }
  [data-mode='score-attack'] .journey-panel { display: none; }
}
@media (max-width: 520px) {
  .adventure-toolbar { flex-wrap: wrap; gap: 12px; }
  .play-mode { order: 3; flex-basis: 100%; }
  .play-mode button { flex: 1; padding: 8px 10px; font-size: 12px; }
  html #adventure-panel[data-mode='score-attack'] .intro h1 { font-size: 22px; }
  #adventure-panel[data-mode='score-attack'] .scene { height: 205px; }
  .score-hud { padding: 16px 17px 19px; gap: 14px; grid-template-columns: 1.2fr 1fr 1fr; }
  .score-label { font-size: 10px; }
  .score-hud strong { font-size: 29px; }
  .score-hud .score-main > strong { font-size: 33px; }
  .score-spark { font-size: 18px; margin-left: 5px; }
  .score-gain { position: absolute; bottom: -13px; left: 0; margin: 0; font-size: 9px; white-space: nowrap; }
  .score-record { padding: 9px 17px; gap: 3px 14px; font-size: 10px; }
  #score-bonus { margin-left: 0; width: 100%; }
  [data-mode='score-attack'] .intro-note { display: none; }
  [data-mode='score-attack'] .result-card { padding: 18px; }
  .score-result > strong { font-size: 54px; }
  .score-result #score-result-status { font-size: 10px; margin-bottom: 8px; }
}
@media (prefers-reduced-motion: reduce) {
  #score-time-bar { transition: none; }
}