/* Grove + Ember controls. Loaded last; labels, actions and native media stay unchanged. */
:root {
  --control-radius: 10px;
  --control-bg: #faf7f0;
  --control-hover: #eee6d8;
  --control-ink: #3b422f;
  --control-border: #858872;
  --control-focus: #3b422f;
  --control-shadow: inset 0 1px 0 #ffffffb3, 0 2px 5px #3b422f0d;
  --control-primary: #3b422f;
  --control-primary-hover: #475039;
  --control-primary-ink: #f4efe6;
}

body :is(button, a.button, .roadmap-back) {
  border: 1px solid var(--control-border);
  border-radius: var(--control-radius);
  background: linear-gradient(#ffffff38, #ffffff00), var(--control-bg);
  color: var(--control-ink);
  box-shadow: var(--control-shadow);
  min-height: 46px;
  max-width: 100%;
  white-space: normal;
  font-weight: 600;
  line-height: 1.4;
  text-decoration: none;
  transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
body :is(button, a.button, .roadmap-back):hover {
  background: var(--control-hover);
  color: var(--control-ink);
  border-color: var(--control-ink);
  box-shadow: inset 0 1px 0 #ffffff70, 0 3px 8px #3b422f16;
  transform: none;
}
body :is(button, a.button).primary {
  background: linear-gradient(#ffffff0d, #ffffff00), var(--control-primary);
  color: var(--control-primary-ink);
  border: 1px solid var(--control-primary);
  box-shadow: inset 0 1px 0 #ffffff24, inset 0 -2px 0 #c86142, 0 3px 7px #171b161a;
}
body :is(button, a.button).primary:hover {
  background: var(--control-primary-hover);
  color: var(--control-primary-ink);
  border-color: var(--control-primary-hover);
  box-shadow: inset 0 1px 0 #ffffff24, inset 0 -2px 0 #c86142, 0 5px 10px #171b1626;
}
@media (hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference) {
  body :is(button, a.button).primary:hover:not(:disabled):not([aria-disabled=true]) { transform: translateY(-1px); }
}
body :is(button, a.button, .roadmap-back):active {
  transform: none;
  box-shadow: inset 0 1px 3px #171b1626;
}
body :is(button, a.button, .roadmap-back):focus-visible,
body summary:focus-visible {
  outline: 3px solid var(--control-focus);
  outline-offset: 4px;
}

/* Dark panels reverse the same hierarchy instead of introducing a new button family. */
.runner, .roadmap-current, .daily-reminder, .scene-start, .return-home>.panel, .walk-header {
  --control-bg: #465039;
  --control-hover: #536047;
  --control-ink: #f4efe6;
  --control-border: #a9ae91;
  --control-focus: #d7a743;
  --control-primary: #f4efe6;
  --control-primary-hover: #e4dac9;
  --control-primary-ink: #3b422f;
  --control-shadow: inset 0 1px 0 #ffffff14, 0 2px 5px #171b161f;
}
.roadmap-current .notice {
  --control-bg: #faf7f0; --control-hover: #eee6d8; --control-ink: #3b422f;
  --control-border: #858872; --control-focus: #3b422f;
}
body .scene-start .start-next-action .button,
body .walk-header>a.button { color: var(--control-ink); border-color: var(--control-border); }
body .scene-start .start-next-action .primary { color: var(--control-primary-ink); border-color: var(--control-primary); }
body .roadmap-current .notice a.button { color: var(--control-ink); border-color: var(--control-border); }
body .section-audio-button svg { color: #a74329; }
body .runner .section-audio-button svg { color: #eaa68b; }

/* Navigation and disclosures remain calmer than the main action. */
body>nav a, body>footer a, .journal-note-action {
  border: 1px solid #a4a38f;
  border-radius: var(--control-radius);
  background: #f4efe6;
  color: #3b422f;
  box-shadow: inset 0 1px 0 #ffffff80;
  transition: background-color .16s ease, border-color .16s ease;
}
body>nav a:hover, body>footer a:hover { background: #eae5d9; border-color: #3b422f; }
body>nav a[aria-current=page] {
  background: #3b422f; color: #f4efe6; border-color: #3b422f;
  box-shadow: inset 0 -2px 0 #c86142, inset 0 1px 0 #ffffff20;
}
body>nav a:focus-visible, body>footer a:focus-visible { outline: 3px solid #3b422f; outline-offset: 4px; }
.tool-disclosure>summary, .journal-comparison>summary, #plan-editor>summary, #beginner-paths>summary,
.start-practice-about>summary {
  border: 1px solid #a4a38f;
  border-radius: var(--control-radius);
  background: #f4efe6;
  color: #3b422f;
  padding: .65rem .9rem;
  min-height: 46px;
  box-shadow: inset 0 1px 0 #ffffff80;
}
.start-practice-about { border: 0; padding: 0; }
.start-practice-about>summary { list-style-position: inside; }
.start-practice-about[open]>summary, .tool-disclosure[open]>summary, .journal-comparison[open]>summary,
#plan-editor[open]>summary, #beginner-paths[open]>summary { background: #eae5d9; border-color: #777c66; }
.start-practice-about>summary:hover, .tool-disclosure>summary:hover, .journal-comparison>summary:hover,
#plan-editor>summary:hover, #beginner-paths>summary:hover { background: #eae5d9; border-color: #3b422f; }
.journal-note>summary:hover .journal-note-action { background: #eae5d9; color: #3b422f; border-color: #3b422f; }

/* Selected controls use a persistent fill; keyboard focus has its own outline. */
body button[aria-pressed=true], body button[aria-expanded=true], body .walk-chapters button[aria-current] {
  background: #3b422f; color: #f4efe6; border-color: #3b422f;
  box-shadow: inset 0 -2px 0 #c86142, inset 0 1px 0 #ffffff20;
  outline: none;
}
body button[aria-pressed=true]:hover, body button[aria-expanded=true]:hover,
body .walk-chapters button[aria-current]:hover { background: #475039; color: #f4efe6; }
body button[aria-pressed=true]:focus-visible, body button[aria-expanded=true]:focus-visible,
body .walk-chapters button[aria-current]:focus-visible { outline: 3px solid var(--control-focus); outline-offset: 4px; }
body .roadmap-days button, body .roadmap-badge-button { transform: none; }
body .roadmap-days button:not([aria-pressed=true]) { background: #faf7f0; color: #3b422f; border-color: #858872; }

/* Destructive actions stay explicit and visually separate from ordinary choices. */
body button:is(.delete-entry, [data-delete-attempt], [data-delete-checkin], #privacy-delete, #delete-all, #clear-plan, #discard-draft),
body #delete-account-form button[type=submit], body #erase-identity-form button[type=submit] {
  background: #faf1eb; color: #8a3626; border-color: #ac6957;
  box-shadow: inset 0 1px 0 #ffffff90;
}
body button:is(.delete-entry, [data-delete-attempt], [data-delete-checkin], #privacy-delete, #delete-all, #clear-plan, #discard-draft):hover,
body #delete-account-form button[type=submit]:hover, body #erase-identity-form button[type=submit]:hover { background: #f0ddd1; color: #792b20; border-color: #8a3626; transform: none; }

/* The image and branded label remain one feedback control. */
body .willy-feedback-control .willy-feedback-trigger { padding: 0; border-radius: var(--control-radius); font-weight: 400; }

/* Preserve the player's compact, embedded controls and familiar transport icons. */
body .walkthrough-player .walkthrough-transport :is(button, select) {
  border-radius: 8px; min-height: 44px; background: transparent; color: #f4efe6;
  border: 1px solid transparent; box-shadow: none; transform: none;
}
body .walkthrough-player .walkthrough-transport :is(button, select):hover { background: transparent; border-color: #f4efe6; }
body .walkthrough-player .walkthrough-transport select { background: transparent; }
body .walkthrough-player .walkthrough-transport button[aria-pressed=true] { background: transparent; border-color: transparent; box-shadow: inset 0 -2px 0 #c86142; }
body .walkthrough-player .walkthrough-transport :is(button, select, input):focus-visible { outline: 2px solid #f4efe6; outline-offset: 1px; }

/* Disabled controls must not acquire an enabled-looking hover or lift. */
body button:disabled, body button:disabled:hover, body .button[aria-disabled=true], body .button[aria-disabled=true]:hover {
  background: #e8e4da; color: #676b60; border: 1px solid #aaa995;
  box-shadow: none; transform: none; opacity: 1; cursor: not-allowed;
}
body .walkthrough-player .walkthrough-transport button:disabled { background: transparent; color: #a9ae91; border-color: transparent; }
@media (prefers-reduced-motion:reduce) {
  body :is(button, a.button, .roadmap-back), body>nav a, body>footer a { transition: none; }
  body :is(button, a.button, .roadmap-back):hover { transform: none; }
}
@media (forced-colors:active) {
  body :is(button, a.button, .roadmap-back), body>nav a, body>footer a, body summary, .journal-note-action {
    background: ButtonFace; color: ButtonText; border-color: ButtonText; box-shadow: none;
  }
  body :is(button, a.button):focus-visible, body summary:focus-visible { outline-color: Highlight; }
  body button[aria-pressed=true], body button[aria-expanded=true], body>nav a[aria-current=page] { background: Highlight; color: HighlightText; border-color: Highlight; }
  body button:disabled, body button:disabled:hover { background: ButtonFace; color: GrayText; border-color: GrayText; }
}