/* Self-hosted fonts: offline-first promise.
   Departure Mono carries all display, UI, numerals, buttons, headers, and timer roles.
   It ships a single 400 weight; requested 700+ weights are synthesized by the browser.
   JetBrains Mono serves as the glyph-coverage fallback. */
@font-face {
  font-family: 'Departure Mono';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url(../fonts/DepartureMono-Regular.woff2) format('woff2'),
       url(../fonts/DepartureMono-Regular.woff) format('woff');
}

/* JetBrains Mono Fallback */
@font-face {
  font-family: 'JetBrains Mono';
  font-style: normal;
  font-weight: 100 800;
  font-display: swap;
  src: url(../fonts/jetbrains-mono-5.woff2) format('woff2');
  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}

@import url("tokens.css");
@import url("workout.css");

/* app-overrides.css imports tokens from tokens.css - see DESIGN.md and tokens.css for the palette.
   Keep only component and layout rules here. Theme changes belong in tokens.css.
   workout.css is split for modular loading; app-overrides keeps the fallback import for MAUI. */

* { -webkit-tap-highlight-color: transparent; box-sizing: border-box; }
html, body { margin:0; padding:0; width:100%; height:100%; min-height:100dvh; overflow:hidden; background: var(--pl-paper); color: var(--pl-ink); }
body { display:flex; flex-direction:column; font-family: var(--font-body); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
/* Camera hole / display cutout and tall screens (20:9, 21:9): the page is
   edge-to-edge (SafeAreaEdges=None) and the status-bar-safe-area div
   provides the visible background behind the cutout. */
.status-bar-safe-area {
  display:block;
  height:env(safe-area-inset-top, 0px);
  min-height:env(safe-area-inset-top, 0px);
  background:var(--pl-paper);
  flex-shrink:0;
}
html, body, #app, button, input, select, textarea, .mud-typography, .mud-button, .mud-input {
  font-family: 'Departure Mono', 'JetBrains Mono', ui-monospace, monospace !important;
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
}
button, [role="button"], .mud-button-root {
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
#app { display:flex; flex-direction:column; flex:1 1 0%; min-height:0; overflow:hidden; }
::selection { background: var(--pl-ink); color: var(--pl-paper); }
html[data-theme-mode="dark"] ::selection { background: var(--pl-cyan); color: var(--pl-paper); }
:focus-visible { outline: 2px solid var(--pl-focus); outline-offset: 2px; }
* { scrollbar-color: var(--pl-hairline-strong) transparent; scrollbar-width: thin; }
*::-webkit-scrollbar { width: 6px; height: 6px; }
*::-webkit-scrollbar-thumb { background: var(--pl-hairline-strong); border-radius: 0px; }
*::-webkit-scrollbar-track { background: transparent; }
@media (max-width: 768px) {
  * { scrollbar-width: none !important; }
  *::-webkit-scrollbar { display: none !important; width: 0 !important; height: 0 !important; }
}
input, textarea { caret-color: var(--pl-ink); accent-color: var(--pl-accent-bg); }
h1, h2, h3, h4, h5, h6, .mud-typography-h1, .mud-typography-h2, .mud-typography-h3, .mud-typography-h4 { text-wrap: balance; font-family: var(--font-display) !important; letter-spacing: -0.02em; font-weight: 800; text-transform: uppercase; }
p, li, .mud-typography-body1, .mud-typography-body2 { text-wrap: pretty; line-height: 1.5; }
.app-shell {
  display:flex; flex-direction:column; flex:1 1 auto; width:100%; min-height:0; height:100%; overflow:hidden;
  background-color: var(--pl-paper);
  background-image: 
    linear-gradient(to right, var(--pl-grid-line) 1px, transparent 1px),
    linear-gradient(to bottom, var(--pl-grid-line) 1px, transparent 1px);
  background-size: 24px 24px;
}
.app-main-scroll {
  flex:1 1 auto; min-height:0; width:100%; overflow-x:hidden; overflow-y:auto; -webkit-overflow-scrolling:touch; overscroll-behavior-y:contain; scroll-padding-top: 0;
  background: transparent;
}
.app-page-container { padding-left: var(--page-x) !important; padding-right: var(--page-x) !important; padding-top: 16px !important; padding-bottom: 24px !important; max-width: var(--page-max) !important; margin-inline:auto !important; }
.app-shell:not(.app-shell--immersive) .app-page-container { padding-bottom: calc(var(--app-nav-pill-bottom, 12px) + var(--app-nav-pill-height, 56px) + 28px) !important; }
.app-shell--fixed-dock .app-page-container { padding-bottom: calc(var(--app-fab-bottom, 80px) + 24px) !important; }
.mud-icon-root { user-select:none; width:1em; height:1em; display:inline-block; fill:currentColor; flex-shrink:0; }
.mud-icon-root.mud-svg-icon { width:1em; height:1em; }
.mud-icon-button { display:inline-flex !important; align-items:center !important; justify-content:center !important; width:44px !important; height:44px !important; min-width:44px !important; min-height:44px !important; padding:0 !important; border-radius:var(--radius) !important; font-size:1.25rem !important; color:inherit; background:var(--pl-chip-2); border:1.5px solid var(--hairline-strong); transition:transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease !important; touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
.mud-icon-button:hover { background:var(--pl-chip) !important; border-color:var(--pl-yellow) !important; }
.mud-icon-button:active { transform: translate(2px, 2px); }
.mud-icon-button .mud-icon-root { font-size:20px !important; width:20px !important; height:20px !important; color:inherit; }
.mud-icon-button.mud-icon-button-size-small { width:44px !important; height:44px !important; min-width:44px !important; min-height:44px !important; }
.mud-icon-button.mud-icon-button-size-small .mud-icon-root { font-size:18px !important; width:18px !important; height:18px !important; }
.mud-icon-button.mud-icon-button-size-large .mud-icon-root { font-size:24px !important; width:24px !important; height:24px !important; }
/* No-shadow material rule: kill MudBlazor's default soft elevation on buttons
   and papers. The plate pass later in this file re-adds hard offset shadows. */
.mud-button-root, .mud-button-root:hover, .mud-button-root:focus-visible,
.mud-paper, .mud-paper:hover { box-shadow:none !important; }
.mud-button-icon-start, .mud-button-icon-end { display:inline-flex !important; align-items:center !important; justify-content:center !important; flex-shrink:0; }
.mud-button-icon-start .mud-icon-root, .mud-button-icon-end .mud-icon-root { font-size:18px !important; width:18px !important; height:18px !important; }
.mud-menu-item .mud-icon-root { font-size:18px !important; width:18px !important; height:18px !important; margin-right:8px; flex-shrink:0; }
.empty-state-container { padding: 36px 16px; text-align: center; }
.empty-state-icon-box {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 68px !important;
  height: 68px !important;
  margin: 0 auto 14px auto !important;
  border-radius: var(--radius) !important;
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
}
.empty-state-icon {
  font-size: 34px !important;
  width: 34px !important;
  height: 34px !important;
  color: var(--pl-yellow) !important;
  fill: var(--pl-yellow) !important;
}
.empty-state .mud-icon-root { font-size:32px !important; width:32px !important; height:32px !important; color:var(--pl-stone); }
.plate-card { position:relative; background:var(--pl-chip); border:var(--hairline); border-radius:var(--radius); overflow:hidden; }
.app-nav-pill { position:fixed; left:0; right:0; margin-inline:auto; bottom:12px; z-index:1100 !important; width:min(440px, calc(100% - 24px)); pointer-events:auto !important; }
.app-nav-pill__inner { pointer-events:auto !important; display:flex; align-items:stretch; gap:0; height:56px; background:var(--pl-chip); border:var(--hairline-strong); border-radius:var(--radius); overflow:hidden; }
.app-nav-tab { display:flex; flex:1 1 0px; flex-direction:column; align-items:center; justify-content:center; gap:2px; min-width:0; margin:0; padding:6px 8px; border:none; background:transparent; color:var(--pl-stone); text-decoration:none; cursor:pointer; font-family:var(--font-mono); position:relative; transition:background 120ms ease, color 120ms ease, transform 90ms cubic-bezier(0.2, 0, 0, 1), opacity 90ms ease !important; touch-action:manipulation; -webkit-tap-highlight-color:transparent; pointer-events:auto !important; }
.app-nav-tab .mud-icon-root { font-size:20px !important; width:20px !important; height:20px !important; pointer-events:none; }
.app-nav-tab--active { background:var(--pl-accent-bg) !important; color:var(--pl-accent-fg) !important; font-weight:700; }
.app-nav-tab--active .mud-icon-root { color:inherit !important; }
.app-nav-tab__label { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; line-height:1; pointer-events:none; }
.app-nav-tab:active { opacity:0.85; transform: translate(1px, 1px); }
.app-shell .app-main-scroll { padding-bottom:calc(56px + 28px + env(safe-area-inset-bottom,0px) + var(--app-ime-inset,0px)); }
.app-shell--immersive .app-main-scroll { padding-bottom:0; }
.app-shell--immersive .app-nav-pill { display:none; }
.app-shell--immersive .app-rail { display:none !important; }
@media (min-width:960px) { .app-nav-pill__inner { height:52px; } .app-nav-tab { flex-direction:row; gap:6px; padding:0 10px; justify-content:center; } .app-nav-tab__label { font-size:0.6875rem; } }
.app-fab {
  position: fixed !important;
  z-index: 1400 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 48px !important;
  min-width: 48px !important;
  max-width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  padding: 0 !important;
  border-radius: var(--radius) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  background: var(--pl-chip-2) !important;
  color: var(--pl-ink) !important;
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  cursor: pointer;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  transition: opacity 150ms ease, transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease !important;
  overflow: hidden;
  box-shadow: var(--pl-plate-shadow-md) !important;
  animation: fab-in 0.28s cubic-bezier(.19,1,.22,1) both;
}
.app-fab--secondary {
  background: var(--pl-chip-2) !important;
  color: var(--pl-ink) !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
}
.app-fab--secondary:hover {
  background: var(--pl-chip) !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow) !important;
}
.app-fab--primary {
  background: var(--pl-volt-fill) !important;
  background-color: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  border: 1.5px solid var(--pl-volt-edge) !important;
}
.app-fab--primary .mud-icon-root {
  color: var(--pl-volt-fg) !important;
  fill: var(--pl-volt-fg) !important;
}
.app-fab--primary:hover {
  filter: brightness(1.12) !important;
  background: var(--pl-volt-fill) !important;
  background-color: var(--pl-volt-fill) !important;
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pl-volt-fill) 80%, #FFFFFF) 0%,
    var(--pl-volt-fill) 52%,
    color-mix(in srgb, var(--pl-volt-fill) 86%, #000000) 100%
  ) !important;
  box-shadow: var(--pl-plate-shadow-md) !important;
}
.app-fab--primary:disabled,
.app-fab:disabled {
  opacity: 0.35 !important;
  pointer-events: none !important;
  background: var(--pl-chip-2) !important;
  border-color: var(--hairline-strong) !important;
  color: var(--pl-stone) !important;
  box-shadow: none !important;
}
.app-fab--primary:disabled .mud-icon-root,
.app-fab:disabled .mud-icon-root {
  color: var(--pl-stone) !important;
  fill: var(--pl-stone) !important;
}

html[data-theme-mode="light"] .app-fab--secondary {
  background: var(--pl-chip-2) !important;
  color: #1A1B26 !important;
  border: 1.5px solid #A39D82 !important;
}
html[data-theme-mode="light"] .app-fab--secondary .mud-icon-root {
  color: #1A1B26 !important;
  fill: #1A1B26 !important;
}

.app-fab:active { transform: translate(5px, 5px) !important; box-shadow: none !important; }
.app-fab .mud-icon-root { font-size:22px !important; width:22px !important; height:22px !important; color:inherit; }
.app-fab--mini { width:48px !important; min-width:48px !important; max-width:48px !important; height:48px !important; min-height:48px !important; }
.app-fab--extended { width:auto !important; min-width:48px !important; max-width:none !important; padding:0 16px !important; }

/* Uniform Bottom-Left and Bottom-Right Alignment */
.app-fab--br-1 {
  right: 16px !important;
  left: auto !important;
  bottom: 16px !important;
}

/* On pages with bottom navigation (e.g. Home): float above the nav pill */
.app-shell:not(.app-shell--immersive) .app-nav-pill ~ * .app-fab--br-1:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .app-nav-pill ~ .app-fab--br-1:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .home-page ~ .app-fab--br-1:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .app-fab--br-1:not(.dialog-fab) {
  bottom: calc(56px + 12px + 16px) !important; /* 84px */
  right: 16px !important;
}
.app-shell:not(.app-shell--immersive) .app-nav-pill ~ * .app-fab--bl-1:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .app-nav-pill ~ .app-fab--back:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .app-nav-pill ~ .workout-undo-fab:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .home-page ~ .app-fab--bl-1:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .home-page ~ .app-fab--back:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .home-page ~ .workout-undo-fab:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .app-fab--bl-1:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .app-fab--back:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .workout-undo-fab:not(.dialog-fab) {
  bottom: 84px !important;
}
.app-shell:not(.app-shell--immersive) .app-nav-pill ~ * .app-fab--br-2:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .home-page ~ .app-fab--br-2:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .app-fab--br-2:not(.dialog-fab) {
  bottom: 84px !important;
  right: 72px !important;
}
.app-shell:not(.app-shell--immersive) .app-nav-pill ~ * .app-fab--bl-2:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .home-page ~ .app-fab--bl-2:not(.dialog-fab),
.app-shell:not(.app-shell--immersive) .app-fab--bl-2:not(.dialog-fab) {
  bottom: 84px !important;
  left: 72px !important;
}

@media (min-width: 960px) {
  .app-shell:not(.app-shell--immersive) .app-fab--br-1:not(.dialog-fab),
  .home-page ~ .app-fab--br-1:not(.dialog-fab) {
    bottom: 24px !important;
    right: 24px !important;
  }
}

/* Big screens: keep FABs beside the 640px content column, not at the far window edge.
   On 800 to 1920px the calc lands 16px outside the column with a 16px gap. Below 768px
   the 16px viewport edge stays. This matches DESIGN.md: FABs anchor to calc(50% - 320px - 64px). */
@media (min-width: 769px) {
  .app-fab--bl-1:not(.dialog-fab),
  .app-fab--back:not(.dialog-fab),
  .workout-undo-fab:not(.dialog-fab) {
    left: max(16px, calc(50% - 320px - 64px)) !important;
    right: auto !important;
  }
  .app-fab--br-1:not(.dialog-fab) {
    right: max(16px, calc(50% - 320px - 64px)) !important;
    left: auto !important;
  }
  .app-fab--bl-2:not(.dialog-fab) {
    left: max(72px, calc(50% - 320px - 8px)) !important;
  }
  .app-fab--br-2:not(.dialog-fab) {
    right: max(72px, calc(50% - 320px - 8px)) !important;
  }
  .app-shell:not(.app-shell--immersive) .app-fab--bl-1:not(.dialog-fab),
  .app-shell:not(.app-shell--immersive) .app-fab--back:not(.dialog-fab),
  .app-shell:not(.app-shell--immersive) .workout-undo-fab:not(.dialog-fab) {
    left: max(16px, calc(50% - 320px - 64px)) !important;
  }
  .app-shell:not(.app-shell--immersive) .app-fab--br-1:not(.dialog-fab) {
    right: max(16px, calc(50% - 320px - 64px)) !important;
  }
  .app-shell:not(.app-shell--immersive) .app-fab--bl-2:not(.dialog-fab) {
    left: max(72px, calc(50% - 320px - 8px)) !important;
  }
  .app-shell:not(.app-shell--immersive) .app-fab--br-2:not(.dialog-fab) {
    right: max(72px, calc(50% - 320px - 8px)) !important;
  }
}

/* Modal / Dialog FABs ALWAYS anchor at bottom: 16px in screen corners */
.dialog-fab.app-fab,
.dialog-fab.app-fab--bl-1,
.dialog-fab.app-fab--br-1,
.app-shell .dialog-fab.app-fab--bl-1,
.app-shell .dialog-fab.app-fab--br-1 {
  position: fixed !important;
  z-index: 1400 !important;
  bottom: 16px !important;
}
.dialog-fab.app-fab--bl-1,
.app-shell .dialog-fab.app-fab--bl-1 {
  left: 16px !important;
  right: auto !important;
}
.dialog-fab.app-fab--br-1,
.app-shell .dialog-fab.app-fab--br-1 {
  right: 16px !important;
  left: auto !important;
}

.app-fab--br-2 {
  right: 72px !important;
  left: auto !important;
  bottom: 16px !important;
}
.app-fab--bl-1,
.app-fab--back,
.workout-undo-fab {
  left: 16px !important;
  right: auto !important;
  bottom: 16px !important;
}
/* Keep secondary left stack for future use, but keep same height */
.app-fab--bl-2,
.dialog-fab.app-fab--bl-2 {
  left: 72px !important;
  right: auto !important;
  bottom: 16px !important;
}

.mud-dialog-container,
.mud-dialog-overlay,
.mud-overlay-dialog {
  transform: none !important;
  perspective: none !important;
  filter: none !important;
}
.dialog-fab {
  position: fixed !important;
  z-index: 1400 !important;
}
.workout-undo-fab {
  position: fixed !important;
  bottom: 16px !important;
  left: 16px !important;
  z-index: 1400 !important;
  width: 48px !important;
  height: 48px !important;
  min-width: 48px !important;
  min-height: 48px !important;
  border-radius: var(--radius) !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  background: var(--pl-chip-2) !important;
  color: var(--pl-yellow) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  cursor: pointer !important;
  transition: all 120ms ease;
}
.workout-undo-fab:hover {
  background: var(--pl-chip) !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow) !important;
}
.workout-undo-fab .mud-icon-root {
  font-size: 24px !important;
  width: 24px !important;
  height: 24px !important;
  color: var(--pl-yellow) !important;
  fill: var(--pl-yellow) !important;
}
.page-header, .home-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  flex-wrap: wrap !important;
  padding: 2px 0 6px !important;
  margin-bottom: 14px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-sizing: border-box;
  box-shadow: none !important;
  width: 100% !important;
  gap: 8px !important;
  overflow: visible !important;
}
.page-header .page-header__title,
.page-header .mud-typography-h1,
.home-header__title,
.home-header .mud-typography-h1 {
  display: inline-flex !important;
  align-items: center !important;
  width: fit-content !important;
  max-width: 100% !important;
  flex-grow: 0 !important;
  padding: 9px 14px !important;
  background: var(--pl-volt-fill) !important;
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pl-volt-fill) 88%, #FFFFFF) 0%,
    var(--pl-volt-fill) 56%,
    color-mix(in srgb, var(--pl-volt-fill) 92%, #000000) 100%
  ) !important;
  border: 1.5px solid var(--pl-volt-edge) !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-display) !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  letter-spacing: 0.02em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  color: var(--pl-volt-fg) !important;
  margin: 0 !important;
  box-sizing: border-box !important;
  box-shadow: 5px 5px 0 var(--pl-plate-shadow-color) !important;
}
.home-header .home-header__title {
  font-size: 22px !important;
}
h1:focus,
h1:focus-visible,
.page-header:focus,
.page-header:focus-visible,
.page-header__title:focus,
.page-header__title:focus-visible,
.mud-typography-h1:focus,
.mud-typography-h1:focus-visible {
  outline: none !important;
}
.page-header .mud-button,
.page-header .mud-icon-button {
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  border-radius: var(--radius) !important;
  color: var(--pl-ink) !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 12px !important;
}
.page-header .mud-button:hover,
.page-header .mud-icon-button:hover {
  background: var(--pl-chip) !important;
  border-color: var(--pl-yellow) !important;
}
@keyframes fab-in { from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:translateY(0)} }
.home-page { display:flex; flex-direction:column; gap:16px; }
.app-fab-page-padding {
  padding-bottom: 96px !important;
}
@media (min-width: 769px) {
  .app-fab-page-padding {
    padding-bottom: 48px !important;
  }
}
.home-header { margin-bottom:0 !important; }
/* Cards, Panels, and Surfaces */
.stat-card.mud-paper,
.home-hero.mud-paper,
.plan-card.mud-paper,
.history-session-card,
.bodyweight-panel.mud-paper,
.rest-timer-panel.mud-paper,
.exercise-progress-chart,
.bodyweight-chart-panel,
.history-heatmap-panel,
.home-heatmap-panel,
.activity-heatmap-card,
.plan-exercise-sheet.mud-dialog,
.ai-chat-dialog,
.exercise-accordion-card {
  position: relative !important;
  border-radius: var(--radius) !important;
}

.home-stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:0; }
.stat-card.mud-paper { display:grid; grid-template-rows:1fr 32px; gap:0; min-height:88px; padding:0 !important; border:1.5px solid var(--pl-hairline-strong) !important; border-radius:var(--radius); background:var(--pl-chip); overflow:hidden; position:relative; transition:border-color 150ms ease; }
.stat-card.mud-paper:hover { border-color:var(--pl-yellow) !important; }
.stat-card__value { display:grid; place-items:center; place-content:center; text-align:center; padding:4px 6px; font-family:var(--font-display); font-weight:800; line-height:1.1; letter-spacing:0.02em; font-variant-numeric:tabular-nums; color:var(--pl-ink); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:clamp(1rem, 3.8vw, 1.375rem); min-height:0; }
.stat-card:nth-child(1) .stat-card__value { color:var(--pl-yellow); background:color-mix(in srgb, var(--pl-yellow) 12%, transparent); }
.stat-card:nth-child(2) .stat-card__value { color:var(--pl-cyan-text); background:color-mix(in srgb, var(--pl-cyan) 12%, transparent); }
.stat-card:nth-child(3) .stat-card__value { color:var(--pl-purple-text); background:color-mix(in srgb, var(--pl-purple) 12%, transparent); }
.stat-card:nth-child(4) .stat-card__value { color:var(--pl-success-text); background:color-mix(in srgb, var(--pl-success) 12%, transparent); }
.stat-card__value--date { font-size:1.375rem !important; font-family:var(--font-display) !important; letter-spacing:0.02em; font-weight:800; }
.stat-card__value--name { font-size:1rem !important; font-family:var(--font-display) !important; letter-spacing:0.02em; font-weight:800; line-height:1.2; }
.stat-card__label { display:grid; place-items:center; text-align:center; padding:4px 6px; font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; line-height:1; letter-spacing:0.14em; text-transform:uppercase; color:var(--pl-ink); background:transparent; border-top:var(--hairline-strong); }

.home-hero.mud-paper {
  position: relative;
  padding: 16px !important;
  border: 1.5px solid var(--pl-volt-fill) !important;
  border-radius: var(--radius) !important;
  background: color-mix(in srgb, var(--pl-yellow) 8%, var(--pl-chip)) !important;
  box-shadow: none !important;
  overflow: hidden;
}
.home-hero__label { display:inline-flex; align-items:center; gap:6px; font-family:var(--font-mono); font-size:0.6875rem; font-weight:800; letter-spacing:0.14em; text-transform:uppercase; color:var(--pl-volt-fg); background:var(--pl-volt-fill); padding:4px 8px; border-radius:var(--radius); border:1px solid var(--pl-volt-edge); box-shadow:var(--pl-plate-shadow-sm); }
.home-hero__dot { width:7px; height:7px; border-radius:50%; background:var(--pl-volt-fg); }
.home-hero__title { font-family:var(--font-display) !important; font-size:22px !important; font-weight:800 !important; letter-spacing:0.02em !important; text-transform:uppercase !important; margin:8px 0 12px !important; color:var(--pl-ink); }
.home-hero__continue.mud-button-root { min-height:44px !important; border-radius:var(--radius) !important; font-family:var(--font-mono) !important; font-size:0.6875rem !important; letter-spacing:0.12em !important; text-transform:uppercase !important; font-weight:800 !important; background:var(--pl-volt-fill) !important; color:var(--pl-volt-fg) !important; border:1.5px solid var(--pl-volt-edge) !important; }
.home-hero__discard.mud-icon-button { position:absolute !important; top:8px !important; right:8px !important; width:44px !important; height:44px !important; border-radius:var(--radius) !important; border:var(--hairline) !important; background:var(--pl-chip) !important; color:var(--pl-error) !important; }

.home-overview { display:grid; grid-template-columns:minmax(0,1fr); gap:12px; margin:0; }
@media (min-width:960px) { .home-overview--with-hero { grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); align-items:stretch; } .home-overview--with-hero .home-stats .stat-card.mud-paper { min-height:96px; } }
.home-plans-header { display:flex; align-items:center; justify-content:space-between; gap:8px; margin:4px 0 8px; padding-bottom:4px; }
.home-plans-header__title-group { display:flex; align-items:center; gap:10px; }
.home-plans-header__title { font-family:var(--font-display) !important; font-size:18px !important; font-weight:800 !important; letter-spacing:0.04em !important; text-transform:uppercase !important; margin:0 !important; }
.home-plans-count-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 30px !important;
  min-width: 30px !important;
  padding: 5px 10px !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  color: var(--pl-ink) !important;
  font-family: var(--font-mono) !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  letter-spacing: 0.05em !important;
  line-height: 1.2 !important;
  box-sizing: border-box !important;
}
.home-plans-new-btn.mud-button-root { background:var(--pl-volt-fill) !important; color:var(--pl-volt-fg) !important; border:1.5px solid var(--pl-volt-edge) !important; font-family:var(--font-mono) !important; font-weight:800 !important; letter-spacing:0.08em !important; text-transform:uppercase !important; border-radius:var(--radius) !important; }
.home-heatmap-panel.mud-paper, .history-heatmap-panel.mud-paper { overflow:hidden; max-width:100%; border:1.5px solid var(--hairline-strong) !important; border-radius:var(--radius) !important; background:var(--pl-chip) !important; box-shadow:none !important; position:relative; padding:12px !important; }
.heatmap-legend { display:flex; flex-wrap:wrap; align-items:center; gap:8px 14px; font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--pl-stone); padding-bottom:10px; margin-bottom:10px; border-bottom:var(--hairline); }
@media (min-width:960px) { .home-heatmap-panel.mud-paper { width:fit-content; margin-inline:auto; padding:14px 16px !important; } }
.activity-heatmap { display:flex; align-items:flex-start; gap:8px; padding:0; background:transparent; --heatmap-cell-size:26px; --heatmap-gap:3px; }
.heatmap-labels { display:grid; grid-template-rows:repeat(7,var(--heatmap-cell-size)); gap:var(--heatmap-gap); align-items:center; padding:2px 0; flex-shrink:0; }
.heatmap-scroll { flex:1; min-width:0; overflow-x:auto; -webkit-overflow-scrolling:touch; padding:0 4px 6px 2px; overscroll-behavior-x:contain; scrollbar-width:thin; }
.heatmap-grid { display:grid; gap:var(--heatmap-gap); align-items:center; min-width:min-content; padding:2px; }
.heatmap-day-label { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--pl-stone); text-align:end; justify-content:flex-end; display:flex; align-items:center; height:var(--heatmap-cell-size); min-width:14px; }
button.heatmap-cell { width:var(--heatmap-cell-size); height:var(--heatmap-cell-size); border:1px solid var(--pl-hairline); border-radius:var(--radius); background:var(--pl-paper-2); box-sizing:border-box; padding:0; margin:0; display:block; cursor:pointer; position:relative; overflow:hidden; transition: background 120ms ease, border-color 120ms ease, opacity 120ms ease; }
@media (hover: hover) and (pointer: fine) {
  button.heatmap-cell { transition:transform 120ms ease, background 120ms ease, border-color 120ms ease, opacity 120ms ease; }
  button.heatmap-cell:hover { transform:scale(1.12); z-index:2; }
}
button.heatmap-cell:active { transform:scale(1.18); z-index:2; }
button.heatmap-cell.heatmap-off { background:var(--pl-paper-2); border:1px solid var(--pl-hairline); }
button.heatmap-cell.heatmap-future.heatmap-off { opacity:0.55; border-style:dashed; border-color:var(--pl-hairline-strong); }
button.heatmap-cell.heatmap-on { background:var(--pl-success) !important; border:1.5px solid var(--pl-success) !important; }
button.heatmap-cell.heatmap-on.heatmap-future { opacity:0.85; }
button.heatmap-cell.heatmap-scheduled { border:1.5px dashed var(--pl-stone-2); background:var(--pl-paper-2); }
button.heatmap-cell.heatmap-planned { background:var(--pl-chip); border:1.5px dashed var(--pl-stone); }
button.heatmap-cell.heatmap-planned::before { content:''; position:absolute; inset:30%; border-radius:50%; background:var(--pl-cyan); opacity:0.95; }
button.heatmap-cell.heatmap-missed { border:1.5px solid var(--pl-stone-2); background:repeating-linear-gradient(-45deg, transparent 0 2px, color-mix(in srgb, var(--pl-stone-2) 34%, transparent) 2px 5px); }
button.heatmap-cell.heatmap-missed--recent { border:1.5px solid var(--pl-err-text); background:repeating-linear-gradient(-45deg, transparent 0 2px, color-mix(in srgb, var(--pl-err-text) 34%, transparent) 2px 5px); }
button.heatmap-cell.heatmap-today { box-shadow:inset 0 0 0 2px var(--pl-volt-fill), 0 0 0 1px var(--pl-paper); outline:none; }
button.heatmap-cell.heatmap-selected { border-color:var(--pl-ink) !important; box-shadow:inset 0 0 0 2.5px var(--pl-ink); }
button.heatmap-cell.heatmap-today.heatmap-selected { box-shadow:inset 0 0 0 2.5px var(--pl-ink), inset 0 0 0 4.5px var(--pl-volt-fill); }
.home-plan-list { display:flex; flex-direction:column; gap:8px; }
@media (min-width: 960px) {
  .home-plan-list { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; align-items:start; }
  .home-plan-list .plan-card.mud-card { height:100%; }
}

/* History top: heatmap takes full row, KPIs bigger on desktop */
.history-top-grid { display:flex; flex-direction:column; gap:12px; }
.history-top-grid__left { display:flex; flex-direction:column; gap:12px; min-width:0; }
.history-top-grid__right { min-width:0; }
@media (min-width: 960px) {
  .history-top-grid { gap:16px; }
  .history-heatmap-panel.mud-paper { padding:16px !important; }
  .activity-heatmap { --heatmap-cell-size:28px; --heatmap-gap:4px; }
  .history-stats { gap:12px; margin-top:4px; }
  .history-stats .stat-card.mud-paper { min-height:110px; }
  .history-stats .stat-card__value { font-size:28px !important; line-height:1 !important; }
  .history-stats .stat-card__label { font-size:12px !important; letter-spacing:0.08em !important; }
  .history-stats:has(.stat-card:nth-child(3):last-child) .stat-card__value { font-size:28px !important; }
}
.plan-card.mud-card { width:100%; overflow:hidden; border:var(--hairline) !important; border-radius:var(--radius) !important; background:var(--pl-chip) !important; box-shadow:none !important; position:relative; }
.plan-card__content { padding:10px 12px !important; display:flex; flex-direction:column; gap:8px; }
.plan-card__row { display:flex; align-items:center; justify-content:flex-start !important; gap:8px; }
/* The info block carries flex-grow so the actions pin right without
   space-between pushing the title to the card's midpoint. */
.plan-card__row .plan-card__info { flex:1 1 auto; }
.plan-card-handle { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; min-width:32px; border:none; background:transparent; color:var(--pl-stone); cursor:grab; touch-action:none; padding:0; flex-shrink:0; }
.plan-card-handle:active { cursor:grabbing; }
.plan-card-handle .mud-icon-root { font-size:20px !important; width:20px !important; height:20px !important; }
.plan-card-name { font-family:var(--font-display) !important; font-weight:900 !important; font-size:18px !important; letter-spacing:-0.015em !important; text-transform:uppercase !important; overflow:hidden; word-break:break-word; white-space:normal; flex:1; }
.plan-card__actions { display:flex; align-items:center; gap:4px; flex-shrink:0; }
.plan-card__actions .mud-icon-button { width:44px !important; height:44px !important; min-width:44px !important; min-height:44px !important; border-radius:var(--radius) !important; border:var(--hairline) !important; background:var(--pl-chip) !important; }
/* The START play control is the card's one primary action. MudBlazor emits
   mud-button-filled-* classes here, not mud-icon-button-color-*, so target the
   explicit class and pin accent colors for AA contrast in both themes. */
.plan-card__actions .mud-icon-button.plan-card__start,
.plan-card__actions .mud-icon-button.plan-card__start:hover { background:var(--pl-accent-bg) !important; color:var(--pl-accent-fg) !important; border:1px solid var(--pl-accent-bg) !important; }
.plan-card__meta { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.plan-card__load-dots { display:flex; align-items:center; gap:4px; flex-wrap:wrap; }
.load-dot { width:14px; height:14px; border-radius:50%; border:var(--hairline); display:inline-grid; place-items:center; font-family:var(--font-mono); font-size:0.4375rem; font-weight:700; line-height:1; position:relative; }
/* Plate hues stay bright in both themes, so labels use deep ink for contrast (~7:1). */
.load-dot--25 { background:var(--pl-plate-red); border-color:var(--pl-plate-red); color:#1A1B26; }
.load-dot--20 { background:var(--pl-plate-blue); border-color:var(--pl-plate-blue); color:#1A1B26; box-shadow:inset 0 0 0 2px rgba(26,27,38,0.45); }
.load-dot--15 { background:var(--pl-plate-gold); border-color:var(--pl-plate-gold); color:#1A1B26; background-image:repeating-linear-gradient(45deg, transparent 0 2px, rgba(0,0,0,0.14) 2px 3px); }
.load-dot--10 { background:var(--pl-plate-green); border-color:var(--pl-plate-green); color:#1A1B26; }
.load-dot--5 { background:var(--pl-chip); color:var(--pl-ink); border-color:var(--pl-hairline-strong); }
.history-stats { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; margin-top:8px; }
@media (min-width:576px) { .history-stats { grid-template-columns:repeat(4,minmax(0,1fr)); } }
/* Three-tile rows (bodyweight, exercise progress, session detail) use 3 columns without orphan cqi */
.history-stats:has(.stat-card:nth-child(3):last-child) { grid-template-columns:repeat(3,minmax(0,1fr)); }
.history-stats:has(.stat-card:nth-child(3):last-child) .stat-card__value { font-size:1.375rem; }
@media (max-width: 480px) {
  .history-stats:has(.stat-card:nth-child(3):last-child) .stat-card__value { font-size: 0.8125rem !important; padding: 4px 2px !important; }
}
.history-stats .stat-card.mud-paper { min-height:76px; }
.history-session-list { display:flex; flex-direction:column; gap:10px; width:100%; }
.history-session-card {
  display:flex; flex-direction:column; width:100%; position:relative;
  border:1.5px solid var(--hairline-strong) !important;
  border-radius:var(--radius); background:var(--pl-chip) !important;
  box-shadow:none !important; cursor:pointer; overflow:hidden;
  text-align:left; appearance:none; padding:0; font:inherit; color:inherit;
  transition:all 140ms ease;
}
.history-session-card:hover {
  border-color:var(--pl-yellow) !important;
  background:var(--pl-chip-2) !important;
}
.history-session-card:focus-visible { outline:2px solid var(--pl-ink); outline-offset:-2px; }
.history-session-card--selected {
  border-color:var(--pl-yellow) !important;
  box-shadow:inset 0 0 0 1.5px var(--pl-yellow) !important;
}
.history-session-card__inner {
  display:flex; align-items:center; justify-content:space-between;
  padding:12px 14px; gap:12px;
}
.history-session-card__left {
  display:flex; align-items:center; min-width:0; flex:1; gap:12px;
}
.history-session-card__info {
  display:flex; flex-direction:column; min-width:0; gap:4px;
}
.history-session-card__title {
  font-family:var(--font-display) !important; font-size:16px !important;
  font-weight:800 !important; letter-spacing:0.02em !important;
  text-transform:uppercase !important; color:var(--pl-ink);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.history-session-card__subtitle {
  font-family:var(--font-mono); font-size:0.6875rem; letter-spacing:0.04em;
  color:var(--pl-stone); display:flex; align-items:center; gap:8px; flex-wrap:wrap;
}
.history-session-card__time-badge {
  color:var(--pl-ink); font-weight:700;
}
.history-session-card__duration-badge {
  color:var(--pl-stone);
}
.history-session-card__badge-inprogress {
  font-family:var(--font-mono); font-size:0.6875rem; font-weight:800;
  letter-spacing:0.1em; text-transform:uppercase;
  color:var(--pl-volt-fg); background:var(--pl-volt-fill);
  padding:2px 8px; border-radius:var(--radius);
  border:1px solid var(--pl-volt-edge);
}

.history-session-card__right {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}
.history-session-card__actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.history-action-btn {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: var(--radius) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  background: var(--pl-chip-2) !important;
  color: var(--pl-ink) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  cursor: pointer !important;
  padding: 0 !important;
  box-sizing: border-box !important;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.history-action-btn:hover {
  background: var(--pl-chip) !important;
  border-color: var(--pl-yellow) !important;
}
.history-action-btn:active {
  transform: translate(3px, 3px) !important;
  box-shadow: none !important;
}
.history-action-btn .mud-icon-root {
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
}
.history-action-btn--delete {
  color: var(--pl-error) !important;
}
.history-action-btn--delete:hover {
  background: var(--pl-error) !important;
  color: #FFFFFF !important;
  border-color: var(--pl-error) !important;
}
html[data-theme-mode="dark"] .history-action-btn--delete:hover {
  color: #10111A !important;
}
html[data-theme-mode="dark"] .history-action-btn--delete:hover .mud-icon-root {
  color: #10111A !important;
  fill: #10111A !important;
}
.history-action-btn--chevron {
  color: var(--pl-ink) !important;
  cursor: pointer !important;
}
html[data-theme-mode="light"] .history-action-btn--chevron {
  color: var(--pl-ink) !important;
}
.history-session-card:hover .history-action-btn--chevron {
  color: var(--pl-yellow-text) !important;
  border-color: var(--pl-yellow) !important;
}

.history-card-continue-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 4px !important;
  height: 36px !important;
  min-height: 36px !important;
  padding: 0 12px !important;
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  background: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  cursor: pointer !important;
  box-sizing: border-box !important;
  transition: transform 100ms ease, filter 120ms ease, box-shadow 100ms ease !important;
}
.history-card-continue-btn:hover { filter: brightness(1.08) !important; }
.history-card-continue-btn:active {
  transform: translate(3px, 3px) !important;
  box-shadow: none !important;
}
.rest-timer-panel.mud-paper {
  border: 2px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  background: var(--pl-chip) !important;
  box-shadow: 6px 6px 0 var(--pl-plate-shadow-color) !important;
  overflow: hidden;
}
.rest-timer-panel--active.mud-paper { padding:0 !important; }
.rest-timer-display {
  background: var(--pl-chip) !important;
}
.rest-timer-digits {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0;
  width: 100%;
  min-width: 220px;
  margin: 0;
  padding: 18px 0 14px;
  font-family: var(--font-display) !important;
  font-weight: 900 !important;
  font-variant-numeric: tabular-nums lining-nums;
  font-feature-settings: "tnum" 1, "lnum" 1;
  font-kerning: none;
  font-variant-ligatures: none;
  font-synthesis: none;
  font-size: clamp(7rem, 30vw, 10.5rem) !important;
  font-size: clamp(112px, round(30vw, 11px), 168px) !important;
  line-height: 0.82 !important;
  letter-spacing: -0.04em;
  color: var(--pl-ink) !important;
  text-shadow: none !important;
  transform: translateZ(0);
  transition: color 220ms ease;
}
html[data-theme-mode="dark"] .rest-timer-digits {
  color: var(--pl-yellow) !important;
}
.rest-timer-digits--imminent {
  color: #C2410C !important;
  text-shadow: none !important;
}
.rest-timer-digits--urgent {
  color: #9F1239 !important;
  text-shadow: none !important;
}
.rest-timer-unit { display:inline-flex; justify-content:center; align-items:center; width:1ch; min-width:1ch; max-width:1ch; text-align:center; letter-spacing:0; font-variant-numeric:tabular-nums; font-feature-settings:"tnum" 1; font-kerning:none; }
.rest-timer-separator { display:inline-flex !important; flex-direction:column !important; justify-content:center !important; align-items:center !important; gap:14px !important; margin:0 14px !important; vertical-align:middle !important; height:auto !important; }
.timer-dot { display:block !important; width:16px !important; height:16px !important; background:currentColor !important; border-radius:3px !important; opacity:0.95 !important; }
.rest-timer-controls {
  width: 100%;
  padding: 6px 12px 14px;
  box-sizing: border-box;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 10px !important;
  align-items: stretch;
  background: transparent !important;
  border-top: none !important;
}
.rest-timer-icon-btn,
.rest-timer-add-btn {
  width: 100% !important;
  height: 48px !important;
  min-width: 0 !important;
  min-height: 48px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: var(--radius) !important;
  border: 2px solid var(--pl-ink-border) !important;
  background: var(--pl-chip-2) !important;
  color: var(--pl-ink) !important;
  cursor: pointer !important;
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color) !important;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease, color 120ms ease !important;
  box-sizing: border-box !important;
  padding: 0 8px !important;
  font-family: var(--font-mono) !important;
  font-size: 0.9375rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.rest-timer-icon-btn:hover,
.rest-timer-add-btn:hover {
  background: var(--pl-chip) !important;
  color: var(--pl-ink) !important;
}
.rest-timer-icon-btn:active,
.rest-timer-add-btn:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 1px 1px 0 var(--pl-plate-shadow-color) !important;
}
.rest-timer-icon-btn .mud-icon-root {
  font-size: 24px !important;
  width: 24px !important;
  height: 24px !important;
}
.rest-timer-add-btn {
  color: var(--pl-ok-text) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 4px !important;
}
.rest-timer-add-btn .mud-icon-root {
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
  color: var(--pl-ok-text) !important;
  fill: var(--pl-ok-text) !important;
}
.rest-timer-icon-btn--reset .mud-icon-root {
  color: var(--pl-warn-text) !important;
  fill: var(--pl-warn-text) !important;
}
.rest-timer-icon-btn--skip .mud-icon-root {
  color: var(--pl-cyan-text) !important;
  fill: var(--pl-cyan-text) !important;
}
html[data-theme-mode="dark"] .rest-timer-icon-btn,
html[data-theme-mode="dark"] .rest-timer-add-btn {
  background: var(--pl-chip) !important;
  border-color: var(--pl-hairline-strong) !important;
  box-shadow: 3px 3px 0 #10111A !important;
}
html[data-theme-mode="dark"] .rest-timer-add-btn {
  color: var(--pl-success-text) !important;
}
html[data-theme-mode="dark"] .rest-timer-add-btn .mud-icon-root {
  color: var(--pl-success-text) !important;
  fill: var(--pl-success-text) !important;
}
html[data-theme-mode="dark"] .rest-timer-icon-btn:hover,
html[data-theme-mode="dark"] .rest-timer-add-btn:hover {
  background: var(--pl-chip-2) !important;
}
html[data-theme-mode="dark"] .rest-timer-icon-btn--reset .mud-icon-root {
  color: var(--pl-yellow-text) !important;
  fill: var(--pl-yellow-text) !important;
}
html[data-theme-mode="dark"] .rest-timer-icon-btn--skip .mud-icon-root {
  color: var(--pl-cyan-text) !important;
  fill: var(--pl-cyan-text) !important;
}
.rest-timer-controls .mud-icon-button { width:100% !important; min-width:0 !important; height:48px !important; border-radius:var(--radius) !important; border:1.5px solid var(--pl-ink-border) !important; background: var(--pl-chip) !important; color:var(--pl-ink) !important; box-shadow:2px 2px 0 var(--pl-plate-shadow-color) !important; }
.rest-timer-controls .mud-icon-button[aria-label*="Pause"] { background:color-mix(in srgb, var(--pl-amber) 25%, var(--pl-chip)) !important; border-color:var(--pl-warn-text) !important; color:var(--pl-ink) !important; }
.rest-timer-controls .mud-button { height:48px !important; width:100% !important; min-width:0 !important; flex:1 1 0 !important; border-radius:var(--radius) !important; font-family:var(--font-mono) !important; font-size:0.8125rem !important; font-weight:700 !important; letter-spacing:0.12em !important; text-transform:uppercase !important; border:1.5px solid var(--pl-ink-border) !important; box-shadow:2px 2px 0 var(--pl-plate-shadow-color) !important; }
.rest-timer-edge-track { flex-shrink:0; height:8px; margin:0; background:var(--pl-chip-2); border-top:1.5px solid var(--pl-ink-border); position:relative; overflow:hidden; }
.rest-timer-edge-fill { width:100%; height:100%; background:var(--pl-volt-fill); border-radius:0; transform:scaleX(0); transform-origin:left; will-change:transform; transition: transform 1s linear; }
html[data-theme-mode="dark"] .rest-timer-edge-fill { background: var(--pl-yellow); }
.rest-timer-edge-fill--imminent { background:#C2410C; }
.rest-timer-edge-fill--urgent { background:#9F1239; }
.rest-timer-panel--complete.mud-paper { border-color:var(--pl-success) !important; background:var(--pl-chip) !important; }
.rest-timer-complete-content { color:var(--pl-ink) !important; }
.rest-timer-complete-title { color:var(--pl-success) !important; font-weight:900 !important; }
.rest-timer-complete-subtitle { color:var(--pl-ink) !important; font-weight:800 !important; opacity:0.85; }
.rest-timer-complete-icon { color:var(--pl-success) !important; fill:var(--pl-success) !important; }
.set-metric-stepper__row { display:flex; align-items:stretch; gap:6px; width:100%; }
.set-metric-stepper__label { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--pl-stone); }
.set-metric-stepper__btn.mud-button-root { flex:0 0 56px; width:56px !important; min-width:56px !important; max-width:56px; height:56px !important; min-height:56px !important; padding:0 !important; font-family:var(--font-display) !important; font-size:33px !important; font-weight:800 !important; line-height:1; border-radius:var(--radius) !important; border:1.5px solid var(--hairline-strong) !important; background:var(--pl-chip-2) !important; color:var(--pl-ink) !important; box-shadow:2px 2px 0 var(--pl-plate-shadow-color) !important; }
.set-metric-stepper__value, .set-metric-stepper__input { flex:1 1 auto; min-width:0; min-height:56px; border-radius:var(--radius); font-family:var(--font-display); font-size:22px; font-weight:800; border:var(--hairline-strong); background:var(--pl-chip); color:var(--pl-ink); display:inline-flex; align-items:center; justify-content:center; text-align:center; }
.set-metric-stepper__value { cursor:ew-resize; user-select:none; }
.set-metric-stepper__value-unit { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; margin-left:6px; opacity:1; }
.mud-table .mud-table-head .mud-table-cell { font-family:var(--font-mono) !important; font-weight:700 !important; font-size:0.6875rem !important; letter-spacing:0.12em !important; text-transform:uppercase !important; color:var(--pl-stone) !important; background:var(--pl-chip-2) !important; border-bottom:var(--hairline-strong) !important; }
.mud-table .mud-table-cell { border-bottom:var(--hairline) !important; font-size:14px; }
.premium-table.mud-paper, .mud-card.mud-paper { border:var(--hairline) !important; border-radius:var(--radius) !important; background:var(--pl-chip) !important; box-shadow:none !important; overflow:hidden; }
.premium-table .mud-table-head .mud-table-cell { background:var(--pl-chip-2) !important; }
.mud-button-root { border-radius:var(--radius) !important; font-family:var(--font-mono) !important; font-size:0.6875rem !important; letter-spacing:0.12em !important; text-transform:uppercase !important; font-weight:700 !important; min-height:44px !important; transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease, opacity 120ms ease !important; touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
.mud-button-filled-primary:not(:disabled):not(.mud-button-filled-disabled) { background:var(--pl-accent-bg) !important; color:var(--pl-accent-fg) !important; border:1px solid var(--pl-accent-bg) !important; }
.mud-button-filled-primary:disabled,
.mud-button-filled-primary.mud-button-filled-disabled {
  border: 1.5px solid var(--pl-hairline-strong) !important;
}
/* Error, Warning, and Success confirms: pin pairs the audit verified instead of trusting MudBlazor defaults.
   Light: white on #BE123C is 6.4:1, white on #B45309 is 4.7:1, white on #0F7A3E is 5.1:1.
   Dark: #10111A on #FF0055 is 4.8:1, #10111A on #FAFF00 is 13.5:1, #10111A on #A3E635 is 11.2:1. */
.mud-button-filled-error { background:var(--pl-error) !important; color:#FFFFFF !important; border:1.5px solid var(--pl-error) !important; }
html[data-theme-mode="dark"] .mud-button-filled-error { color: var(--pl-paper) !important; }

.mud-button-filled-warning { background:var(--pl-warning) !important; color:#FFFFFF !important; border:1.5px solid var(--pl-warning) !important; }
html[data-theme-mode="dark"] .mud-button-filled-warning { color: #10111A !important; border-color: var(--pl-warning) !important; }

.mud-button-filled-success { background:var(--pl-success) !important; color:#FFFFFF !important; border:1.5px solid var(--pl-success) !important; }
html[data-theme-mode="dark"] .mud-button-filled-success { color: #10111A !important; border-color: var(--pl-success) !important; }
.mud-button-outlined { border:var(--hairline-strong) !important; background:var(--pl-chip) !important; color:var(--pl-ink) !important; }
.mud-chip { border-radius:var(--radius) !important; font-family:var(--font-mono) !important; font-size:0.6875rem !important; letter-spacing:0.08em !important; border:var(--hairline) !important; }
/* High-Contrast Outlined Inputs & Floating Labels */
.mud-input-outlined-border {
  border-color: var(--hairline-strong) !important;
  border-width: 1.5px !important;
  border-radius: var(--radius) !important;
}
.mud-input.mud-input-outlined {
  background: var(--pl-chip) !important;
  color: var(--pl-ink) !important;
  border-radius: var(--radius) !important;
}
.mud-input.mud-input-outlined input {
  color: var(--pl-ink) !important;
  font-family: var(--font-body) !important;
  font-weight: 700 !important;
}
.mud-input.mud-input-outlined input::placeholder {
  color: var(--pl-stone) !important;
  opacity: 1 !important;
}
.mud-input-label-outlined {
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  background: var(--pl-chip) !important;
  padding: 0 4px !important;
}
.mud-input-label-outlined.mud-input-label-inputcontrol {
  color: var(--pl-ink) !important;
  font-weight: 800 !important;
}
.mud-input-helper-text {
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  color: var(--pl-stone) !important;
  margin-top: 4px !important;
}
.mud-input-adornment-start .mud-icon-root,
.mud-input-adornment-end .mud-icon-root {
  color: var(--pl-ink) !important;
  opacity: 0.85 !important;
}
.mud-input-control.mud-input-focused .mud-input-outlined-border {
  border-color: var(--pl-yellow) !important;
  border-width: 2px !important;
}
.mud-input-control.mud-input-focused .mud-input-label-outlined {
  color: var(--pl-yellow) !important;
}

/* Cyberpunk Brutalist Toggle Switch */
.mud-switch {
  display: inline-flex !important;
  align-items: center !important;
  margin: 6px 0 !important;
  cursor: pointer !important;
  user-select: none !important;
}
.mud-switch-span {
  width: 48px !important;
  height: 26px !important;
  position: relative !important;
  display: inline-flex !important;
  align-items: center !important;
  flex-shrink: 0 !important;
}
.mud-switch-track {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: var(--radius) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  background: var(--pl-chip-2) !important;
  transition: background 150ms ease, border-color 150ms ease !important;
  opacity: 1 !important;
}
.mud-switch-base {
  position: absolute !important;
  top: 1px !important;
  left: 1px !important;
  width: 24px !important;
  height: 24px !important;
  min-width: 24px !important;
  min-height: 24px !important;
  padding: 0 !important;
  z-index: 2 !important;
  transition: transform 150ms cubic-bezier(0.4, 0, 0.2, 1) !important;
  background: transparent !important;
}
.mud-switch-base.mud-checked {
  transform: translateX(22px) !important;
}
.mud-switch-base.mud-checked ~ .mud-switch-track,
.mud-switch-span:has(.mud-checked) .mud-switch-track {
  background: var(--pl-yellow) !important;
  border-color: #10111A !important;
}
.mud-switch-thumb-medium,
.mud-switch-thumb-small,
.mud-switch-thumb-large {
  width: 20px !important;
  height: 20px !important;
  border-radius: 0px !important;
  background: var(--pl-ink) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  box-shadow: none !important;
}
.mud-switch-base.mud-checked .mud-switch-thumb-medium,
.mud-switch-base.mud-checked .mud-switch-thumb-small,
.mud-switch-base.mud-checked .mud-switch-thumb-large {
  background: #10111A !important;
  border-color: #10111A !important;
}
.mud-switch .mud-typography {
  font-family: var(--font-display) !important;
  font-size: 16px !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
  color: var(--pl-ink) !important;
  margin-left: 12px !important;
}

/* Diagrams, Charts, and Heatmaps with CAD Fine-Line Checkered Grid */
.history-heatmap-panel,
.home-heatmap-panel,
.activity-heatmap-card {
  background-color: var(--pl-chip) !important;
  background-image:
    linear-gradient(to right, var(--pl-grid-line) 1px, transparent 1px),
    linear-gradient(to bottom, var(--pl-grid-line) 1px, transparent 1px) !important;
  background-size: 16px 16px !important;
  border: 1.5px solid var(--hairline-strong) !important;
}
.exercise-progress-chart__plot,
.bodyweight-chart {
  position: relative !important;
  background: var(--pl-chip) !important;
  background-image: none !important;
  border: none !important;
  overflow: visible !important;
}
@media (max-width: 480px) {
  .exercise-progress-chart,
  .bodyweight-chart-panel {
    padding: 14px 10px !important;
  }
  .exercise-progress-chart .settings-card__title,
  .bodyweight-chart-panel .settings-card__title {
    font-size: 15px !important;
    line-height: 1.2 !important;
  }
  .exercise-progress-chart__plot,
  .bodyweight-chart {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    padding-bottom: 4px;
  }
  .exercise-progress-chart__plot .mud-chart,
  .bodyweight-chart .mud-chart {
    min-width: 560px !important;
    height: 300px !important;
  }
  .exercise-progress-chart__plot .mud-chart svg,
  .bodyweight-chart .mud-chart svg {
    height: 300px !important;
  }
  .mud-charts-yaxis text,
  .mud-charts-xaxis text {
    font-size: 12px !important;
    font-weight: 700 !important;
    fill: var(--pl-ink) !important;
  }
  .mud-chart-serie.mud-chart-line {
    stroke-width: 3.2 !important;
  }
}
@media (max-width: 380px) {
  .exercise-progress-chart__plot .mud-chart,
  .bodyweight-chart .mud-chart {
    min-width: 520px !important;
  }
  .activity-heatmap { --heatmap-cell-size: 22px; }
}
html[data-theme-mode="light"] .mud-charts-grid path,
html[data-theme-mode="light"] .mud-charts-gridlines-yaxis path {
  stroke: var(--pl-ink) !important;
  stroke-width: 1.2px !important;
  opacity: 0.95 !important;
}
html[data-theme-mode="dark"] .mud-charts-grid path,
html[data-theme-mode="dark"] .mud-charts-gridlines-yaxis path {
  stroke-width: 0.8px !important;
  opacity: 1 !important;
}

/* iOS Safari zooms the viewport when focusing a field under 16px; floor all fields.
   Class-level rules (steppers etc.) still win over this element selector. */
input:not([type=checkbox]):not([type=radio]):not([type=range]):not([type=hidden]),
textarea { font-size:max(16px, 1em); }
.mud-dialog { border:var(--hairline-strong) !important; border-radius:var(--radius) !important; background:var(--pl-chip) !important; box-shadow: var(--pl-plate-shadow-lg) !important; overflow:hidden; }
/* Dialog footers center their actions: with one or two buttons the centered
   row reads as a deliberate close bar instead of a stray corner button. */
.mud-dialog-actions { justify-content:center !important; padding:8px 16px 12px !important; }
.mud-dialog-title { font-family:var(--font-display) !important; font-weight:800 !important; letter-spacing:-0.015em !important; border-bottom:var(--hairline); padding-bottom:10px !important; }
.mud-dialog-content { padding-top:12px !important; }

/* Transparent overlay for popovers/menus, dark backdrop only for dialogs. No blur, sharp brutalist plates. */
.mud-overlay { background:transparent !important; backdrop-filter:none !important; }
.mud-dialog-container + .mud-overlay,
.mud-overlay:has(.mud-dialog),
.mud-dialog-provider .mud-overlay { background:color-mix(in srgb, var(--pl-rubber) 72%, transparent) !important; backdrop-filter:none !important; }

/* Instant, perfectly anchored Popovers / Three-dot Menus */
.mud-popover-provider .mud-popover {
  transition: opacity 50ms ease !important;
  animation: none !important;
  transform: none !important;
}
.mud-popover.mud-popover-open {
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  background: var(--pl-chip) !important;
  box-shadow: 4px 4px 0 var(--pl-plate-shadow-color) !important;
  z-index: 2100 !important;
}
.mud-popover.mud-popover-open.mud-popover-top-left,
.mud-popover.mud-popover-open.mud-popover-top-right,
.mud-popover.mud-popover-open.mud-popover-top-center {
  box-shadow: 4px -4px 0 var(--pl-plate-shadow-color) !important;
  margin-top: -4px !important;
}
.mud-popover.mud-popover-open.mud-popover-bottom-left,
.mud-popover.mud-popover-open.mud-popover-bottom-right,
.mud-popover.mud-popover-open.mud-popover-bottom-center {
  box-shadow: 4px 4px 0 var(--pl-plate-shadow-color) !important;
  margin-top: 4px !important;
}
.mud-popover:has(.mud-list),
.mud-popover.overflow-y-auto:has(.mud-list) {
  overflow: hidden !important;
  overflow-y: hidden !important;
}
.mud-popover .mud-list {
  background: var(--pl-chip) !important;
  padding: 4px 0 !important;
  max-height: inherit !important;
  overflow-y: auto !important;
  overflow-x: hidden !important;
}
.mud-popover .mud-list-item {
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  min-height: 38px !important;
  padding: 6px 12px !important;
  border-bottom: 1px solid var(--pl-hairline);
  transition: all 100ms ease !important;
}
.mud-popover .mud-list-item:last-child { border-bottom: none; }
.mud-popover .mud-list-item:hover {
  background: var(--pl-chip-2) !important;
  color: var(--pl-yellow) !important;
}
.mud-popover .mud-list-item .mud-icon-root {
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
  margin-right: 8px !important;
}

/* Universal Dialog & Modal Styling.
   Column direction plus auto vertical margins centers a dialog that fits the
   space and pins it to the top only once it fills the space, which is exactly
   when it would otherwise slide behind the floating FABs at the bottom. */
.mud-dialog-container {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: flex-start !important;
  padding: calc(16px + env(safe-area-inset-top, 0px)) 12px calc(76px + env(safe-area-inset-bottom, 0px)) !important;
  padding-left: calc(12px + env(safe-area-inset-left, 0px)) !important;
  padding-right: calc(12px + env(safe-area-inset-right, 0px)) !important;
  box-sizing: border-box !important;
  overflow-y: auto !important;
  scrollbar-width: none !important;
}
.mud-dialog-container::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}
.mud-dialog {
  border: 1.5px solid var(--hairline-strong) !important;
  border-radius: var(--radius) !important;
  background: var(--pl-chip) !important;
  box-shadow: none !important;
  overflow: hidden !important;
  transform: none !important;
  animation: none !important;
  display: flex !important;
  flex-direction: column !important;
  width: 100% !important;
  max-width: 560px !important;
  height: auto !important;
  max-height: calc(100dvh - 92px - env(safe-area-inset-top, 0px) - env(safe-area-inset-bottom, 0px)) !important;
  margin-top: auto !important;
  margin-bottom: auto !important;
}
.mud-dialog-content {
  padding: 16px 16px 24px !important;
  background: var(--pl-chip) !important;
  overflow-y: auto !important;
  -webkit-overflow-scrolling: touch !important;
  flex: 1 1 auto !important;
}
.mud-dialog-title {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 12px 16px !important;
  background: var(--pl-chip-2) !important;
  border-bottom: 1.5px solid var(--hairline-strong) !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
.mud-dialog-title > * {
  width: 100% !important;
}
/* The MudBlazor close button is absolutely positioned; keep it anchored to
   the dialog and at tap-target size instead of stretched by the rule above. */
.mud-dialog {
  position: relative !important;
}
.mud-dialog-title > .mud-button-close {
  width: 44px !important;
  height: 44px !important;
}
.dialog-header-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  gap: 12px !important;
}
.dialog-header-bar__left {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  min-width: 0 !important;
  flex: 1 !important;
}
.dialog-header-bar__title {
  font-family: var(--font-display) !important;
  font-size: 1.0625rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.02em !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: break-word !important;
  line-height: 1.25 !important;
  margin: 0 !important;
}
.mud-dialog-title .mud-typography-h6 {
  font-family: var(--font-display) !important;
  font-size: 1.0625rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.02em !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  margin: 0 !important;
}
.mud-dialog-content {
  padding: 16px !important;
  background: var(--pl-chip) !important;
}
.mud-dialog-actions {
  padding: 12px 16px !important;
  background: var(--pl-chip-2) !important;
  border-top: 1.5px solid var(--hairline-strong) !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  box-sizing: border-box !important;
}
.dialog-actions-bar {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  width: 100% !important;
  padding: 12px 16px !important;
  background: var(--pl-chip-2) !important;
  border-top: 1.5px solid var(--hairline-strong) !important;
  box-sizing: border-box !important;
}
/* Floating FABs for modal sheets are fixed in screen corners */
.dialog-fab {
  position: fixed !important;
  z-index: 1400 !important;
}
.dialog-fab.app-fab--bl-1 {
  left: calc(16px + env(safe-area-inset-left, 0px)) !important;
  right: auto !important;
  bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
}
.dialog-fab.app-fab--br-1 {
  right: calc(16px + env(safe-area-inset-right, 0px)) !important;
  left: auto !important;
  bottom: calc(16px + env(safe-area-inset-bottom, 0px)) !important;
}

/* Hide underlying page FABs when any dialog/sheet is open so only the dialog FABs show */
body:has(.mud-dialog-container) .app-fab:not(.dialog-fab),
body:has(.mud-dialog) .app-fab:not(.dialog-fab),
body:has(.mud-overlay-dialog) .app-fab:not(.dialog-fab),
html:has(.mud-dialog) .app-fab:not(.dialog-fab),
.mud-dialog-open .app-fab:not(.dialog-fab),
.mud-overlay-dialog ~ .app-fab:not(.dialog-fab),
.mud-dialog-container ~ .app-fab:not(.dialog-fab) {
  display: none !important;
}

/* Dialog close button and header icon */
.modal-close-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  border-radius: var(--radius) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  background: var(--pl-chip) !important;
  color: var(--pl-ink) !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: all 120ms ease;
  box-sizing: border-box;
}
.modal-close-btn:hover {
  background: var(--pl-chip-2) !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow) !important;
}
.modal-close-btn:active {
  opacity: 0.75;
}
.modal-close-btn .mud-icon-root {
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
}
.dialog-title-icon-box {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  min-width: 32px;
  min-height: 32px;
  border-radius: var(--radius);
  background: var(--pl-volt-fill);
  color: var(--pl-volt-fg) !important;
  flex-shrink: 0;
}
.dialog-title-icon-box .mud-icon-root {
  color: var(--pl-volt-fg) !important;
  fill: var(--pl-volt-fg) !important;
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
}
.dialog-title-icon-box--error {
  background: var(--pl-error) !important;
  background-image: none !important;
  color: #FFFFFF !important;
}
.dialog-title-icon-box--error .mud-icon-root {
  color: #FFFFFF !important;
  fill: #FFFFFF !important;
}
html[data-theme-mode="dark"] .dialog-title-icon-box--error {
  color: #10111A !important;
}
html[data-theme-mode="dark"] .dialog-title-icon-box--error .mud-icon-root {
  color: #10111A !important;
  fill: #10111A !important;
}

.dialog-title-icon-box--warning {
  background: var(--pl-warning) !important;
  background-image: none !important;
  color: #FFFFFF !important;
}
.dialog-title-icon-box--warning .mud-icon-root {
  color: #FFFFFF !important;
  fill: #FFFFFF !important;
}
html[data-theme-mode="dark"] .dialog-title-icon-box--warning {
  color: #10111A !important;
}
html[data-theme-mode="dark"] .dialog-title-icon-box--warning .mud-icon-root {
  color: #10111A !important;
  fill: #10111A !important;
}

.dialog-title-icon-box--success {
  background: var(--pl-success) !important;
  background-image: none !important;
  color: #FFFFFF !important;
}
.dialog-title-icon-box--success .mud-icon-root {
  color: #FFFFFF !important;
  fill: #FFFFFF !important;
}
html[data-theme-mode="dark"] .dialog-title-icon-box--success {
  color: #10111A !important;
}
html[data-theme-mode="dark"] .dialog-title-icon-box--success .mud-icon-root {
  color: #10111A !important;
  fill: #10111A !important;
}

.plan-sheet-save-btn {
  width: 100%;
  min-height: 48px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  background: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  border: 1.5px solid var(--pl-volt-edge) !important;
  border-radius: var(--radius);
  cursor: pointer;
  transition: all 120ms ease;
}
.plan-sheet-save-btn:hover:not(:disabled) {
  filter: brightness(1.1);
}
.plan-sheet-save-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

/* Plan Editor Section Headers: brutalist plate titles with hard shadow and acid edge */
.plan-section-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 !important;
  margin-top: 4px !important;
  margin-bottom: 10px !important;
  width: 100% !important;
}
.plan-section-header__title {
  display: inline-flex !important;
  align-items: center !important;
  padding: 5px 12px !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-display) !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  letter-spacing: 0.05em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  margin: 0 !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
}

/* Universal Section Headers & Machined Plate Titles */
.section-plate-header,
.history-section-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 0 !important;
  margin-top: 8px !important;
  margin-bottom: 12px !important;
  width: 100% !important;
}

.home-plans-header__title-group,
.history-section-header__title-group,
.section-plate-header__title-group,
.plan-section-header__title-group {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.section-plate-title,
.history-section-header__title {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 5px 12px !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-display) !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  letter-spacing: 0.05em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  margin: 0 !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
}

.section-plate-tag {
  display: inline-flex !important;
  align-items: center !important;
  padding: 3px 8px !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-mono) !important;
  font-size: 11px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--pl-stone) !important;
  box-shadow: 1px 1px 0 var(--pl-plate-shadow-color) !important;
  margin-bottom: 8px !important;
}

/* Plan Page Subtitle Badge & Name Field */
.plan-page__name-badge,
.plan-page__subtitle {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  padding: 5px 12px !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  font-family: var(--font-display) !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  margin-bottom: 12px !important;
}
.plan-page__name-tag {
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--pl-stone) !important;
  padding-right: 6px;
  border-right: 1.5px solid var(--pl-hairline-strong);
}
.plan-page__name-text {
  color: var(--pl-ink) !important;
}
.plan-details-card__name-input input {
  font-family: var(--font-display) !important;
  font-size: 1.125rem !important;
  font-weight: 800 !important;
  letter-spacing: -0.01em !important;
}

.plan-card-icon-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  padding: 0 !important;
  border-radius: var(--radius) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  background: var(--pl-chip-2) !important;
  color: var(--pl-ink) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  box-sizing: border-box !important;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.plan-card-icon-btn:hover {
  background: var(--pl-chip) !important;
  border-color: var(--pl-yellow) !important;
}
.plan-card-icon-btn:active {
  transform: translate(3px, 3px) !important;
  box-shadow: none !important;
}
.plan-card-icon-btn .mud-icon-root {
  color: var(--pl-ink) !important;
  fill: var(--pl-ink) !important;
}

.plan-card__start.mud-button-root,
.plan-card__start.mud-icon-button,
.mud-button-filled.plan-card__start,
.mud-icon-button.plan-card__start,
button.plan-card__start,
.plan-card-icon-btn.plan-card__start,
.plan-card__start {
  background: var(--pl-volt-fill) !important;
  background-color: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
}
.mud-icon-button.plan-card__start .mud-icon-root,
.plan-card-icon-btn.plan-card__start .mud-icon-root,
.plan-card__start .mud-icon-root {
  color: var(--pl-volt-fg) !important;
  fill: var(--pl-volt-fg) !important;
}
.plan-card__start:hover,
.plan-card-icon-btn.plan-card__start:hover {
  filter: brightness(1.12) !important;
  background-color: var(--pl-yellow) !important;
}

/* Rest Timer Panel & Controls */
.rest-timer-icon-btn {
  width: 100%;
  height: 44px;
  min-width: 0;
  min-height: 44px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: var(--radius);
  border: 1.5px solid var(--hairline-strong);
  background: var(--pl-chip-2);
  color: var(--pl-ink);
  cursor: pointer;
  transition: all 120ms ease;
}
.rest-timer-icon-btn:hover {
  background: color-mix(in srgb, var(--pl-yellow) 10%, var(--pl-chip-2));
  border-color: var(--pl-yellow);
  color: var(--pl-yellow);
}

/* Rest Timer Complete State */
/* Title must stay on one line: 10 glyphs x 0.6em advance + tracking has to fit
   the narrowest supported panel (~256px at 320px viewport), hence 11vw max. */
.rest-timer-display--complete { min-height:clamp(4rem,18vw,5.8rem) !important; display:flex !important; align-items:center; justify-content:center; min-width:0; }
.rest-timer-complete-content { display:flex; align-items:center; justify-content:center; width:100%; min-width:0; padding:10px 16px; box-sizing:border-box; animation:rest-complete-bounce 350ms cubic-bezier(0.34, 1.56, 0.64, 1); }
.rest-timer-complete-icon-box {
  display: inline-grid !important;
  place-items: center;
  width: 44px;
  height: 44px;
  flex-shrink: 0;
  background: var(--pl-chip-2);
  border: 1.5px solid var(--pl-ok-text);
  border-radius: var(--radius);
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color);
  margin-right: 12px;
}
.rest-timer-complete-icon-box .mud-icon-root {
  font-size: 26px !important;
  width: 26px !important;
  height: 26px !important;
  color: var(--pl-ok-text) !important;
  fill: var(--pl-ok-text) !important;
}
html[data-theme-mode="dark"] .rest-timer-complete-icon-box {
  border-color: var(--pl-success-text);
}
html[data-theme-mode="dark"] .rest-timer-complete-icon-box .mud-icon-root {
  color: var(--pl-success-text) !important;
  fill: var(--pl-success-text) !important;
}
.rest-timer-complete-title { font-family:'Departure Mono','JetBrains Mono',monospace; font-size:clamp(26px, 7.8vw, 66px); font-weight:900; letter-spacing:0.015em; line-height:1; color:var(--pl-ok-text); text-align:center; white-space:normal; overflow-wrap:anywhere; max-width:100%; min-width:0; }
.rest-timer-complete-subtitle { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--pl-stone); text-align:center; max-width:100%; }
@media (max-width: 360px) {
  .rest-timer-complete-content { padding:8px 10px; }
  .rest-timer-complete-title { font-size:clamp(22px, 7vw, 66px); letter-spacing:0.01em; }
  .rest-timer-complete-subtitle { font-size:0.625rem; letter-spacing:0.12em; }
}

/* Exercise Card Top Edge Track */
.exercise-card-edge-track { width:100%; height:4px; background:var(--pl-chip-2); position:relative; overflow:hidden; flex-shrink:0; }
.exercise-card-edge-fill { height:100%; background:var(--pl-ink); transition:width 240ms cubic-bezier(0.4, 0, 0.2, 1); }
.exercise-card-edge-fill--complete { background:var(--pl-ok-text) !important; }

.mud-snackbar { border:var(--hairline-strong) !important; border-radius:var(--radius) !important; background:var(--pl-chip) !important; color:var(--pl-ink) !important; box-shadow: var(--pl-plate-shadow-md) !important; min-width:min(320px,calc(100vw - 24px)); }
.plan-details-card { border:var(--hairline-strong) !important; background:var(--pl-chip) !important; border-radius:var(--radius) !important; box-shadow:none !important; overflow:hidden; }
.plan-details-card .mud-input-filled .mud-input-slot { background:var(--pl-chip-2) !important; border-radius:var(--radius) !important; border:var(--hairline) !important; }

/* Plan add exercise input form */
.plan-add-exercise { display:flex; align-items:center; gap:8px; margin-top:12px; width:100%; min-width:0; }
.plan-add-exercise__input { flex:1 1 0; min-width:0; }
.plan-add-exercise__input .mud-input-control { min-width:0; }
.plan-add-exercise__btn.mud-button-root {
  height: 40px !important;
  min-height: 40px !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  font-family: var(--font-mono) !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  flex-shrink: 0;
  align-self: center;
  transition: transform 100ms ease, filter 120ms ease, box-shadow 100ms ease !important;
}
.plan-add-exercise__btn.mud-button-root:not(:disabled) {
  background: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
}
.plan-add-exercise__btn.mud-button-root:not(:disabled):hover {
  filter: brightness(1.08) !important;
}
.plan-add-exercise__btn.mud-button-root:not(:disabled):active {
  transform: translate(3px, 3px) !important;
  box-shadow: none !important;
}
.plan-add-exercise__btn.mud-button-root:disabled {
  opacity: 0.55 !important;
  background: var(--pl-chip-2) !important;
  color: var(--pl-stone) !important;
  box-shadow: none !important;
}

/* Autocomplete: prevent flex clipping and oversized adornment button everywhere */
.mud-autocomplete { min-width:0; }
.mud-autocomplete .mud-input-control { min-width:0; }
html body .mud-autocomplete .mud-input-adornment .mud-icon-button.mud-input-adornment-icon-button {
  width:32px !important;
  height:32px !important;
  min-width:32px !important;
  min-height:32px !important;
  border: none !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
html body .mud-autocomplete .mud-input-adornment .mud-icon-button.mud-input-adornment-icon-button:hover,
html body .mud-autocomplete .mud-input-adornment .mud-icon-button.mud-input-adornment-icon-button:active,
html body .mud-autocomplete .mud-input-adornment .mud-icon-button.mud-input-adornment-icon-button:focus {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
.mud-autocomplete .mud-input-adornment .mud-icon-button .mud-icon-root { font-size:18px !important; width:18px !important; height:18px !important; }
.plan-exercise-sheet__body .mud-autocomplete { min-width:0; }

/* Prevent double scrollbar when a dialog is open: hide the main scroll behind the overlay */
body:has(.mud-dialog) .app-main-scroll,
.mud-dialog-open .app-main-scroll {
  overflow: hidden !important;
  scrollbar-width: none !important;
}
body:has(.mud-dialog) .app-main-scroll::-webkit-scrollbar,
.mud-dialog-open .app-main-scroll::-webkit-scrollbar {
  display: none !important;
  width: 0 !important;
  height: 0 !important;
}

/* Home plans header */
.home-plans-header { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:12px !important; margin-bottom:8px !important; }
.home-plans-header__title-group { display:flex; align-items:center; gap:8px; }
.home-plans-header__actions { display:flex; align-items:center; gap:8px; }
.home-plans-new-btn.mud-button-root { height:44px !important; min-height:44px !important; font-family:var(--font-mono) !important; font-size:0.6875rem !important; font-weight:700 !important; letter-spacing:0.08em !important; text-transform:uppercase !important; border-radius:var(--radius) !important; }
.home-plans-ai-btn.mud-button-root { height:36px !important; min-height:36px !important; font-family:var(--font-mono) !important; font-size:0.6875rem !important; font-weight:700 !important; letter-spacing:0.08em !important; text-transform:uppercase !important; border-radius:var(--radius) !important; border:var(--hairline-strong) !important; }

/* Bodyweight card on history page: premium plate with aligned header and log row */
.bodyweight-panel.mud-paper {
  border:1.5px solid var(--hairline-strong) !important;
  border-radius:var(--radius) !important;
  background:var(--pl-chip) !important;
  box-shadow:none !important;
  padding:14px !important;
  display:flex; flex-direction:column; gap:12px;
}
.bodyweight-panel__header { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.bodyweight-panel__left { display:flex; align-items:baseline; gap:10px; flex:1 1 auto; min-width:0; flex-wrap:wrap; }
.bodyweight-panel__title { font-family:var(--font-display) !important; font-size:18px !important; font-weight:800 !important; letter-spacing:0.02em !important; text-transform:uppercase !important; margin:0 !important; color:var(--pl-ink); }
.bodyweight-panel__latest-text { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; color:var(--pl-stone); letter-spacing:0.04em; white-space:nowrap; }
.bodyweight-panel__details-link {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  height: 30px !important;
  min-height: 30px !important;
  padding: 0 12px !important;
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  cursor: pointer !important;
  text-decoration: none !important;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
  transition: transform 100ms ease, background 120ms ease, border-color 120ms ease, box-shadow 100ms ease !important;
}
.bodyweight-panel__details-link:hover {
  background: var(--pl-chip) !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow-text) !important;
}
.bodyweight-panel__details-link:active {
  transform: translate(3px, 3px) !important;
  box-shadow: none !important;
}
.bodyweight-log-row { display: flex; align-items: center; gap: 8px; width: 100%; flex-wrap: nowrap; }
.bodyweight-log-row .set-metric-stepper__row { flex: 1 1 auto; min-width: 0; }
.bodyweight-log-row__log-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 56px !important;
  height: 56px !important;
  min-width: 56px !important;
  min-height: 56px !important;
  border-radius: var(--radius) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  background: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  cursor: pointer !important;
  padding: 0 !important;
  transition: transform 100ms ease, background 120ms ease, opacity 120ms ease, box-shadow 100ms ease !important;
  touch-action: manipulation;
  flex-shrink: 0 !important;
  box-sizing: border-box !important;
}
.bodyweight-log-row__log-btn:hover:not(:disabled) { filter: brightness(1.08) !important; }
.bodyweight-log-row__log-btn:active:not(:disabled) {
  transform: translate(3px, 3px) !important;
  box-shadow: none !important;
}
.bodyweight-log-row__log-btn:disabled {
  opacity: 0.45 !important;
  background: var(--pl-chip-2) !important;
  border-color: var(--pl-ink-border) !important;
  color: var(--pl-stone) !important;
  box-shadow: none !important;
  cursor: not-allowed !important;
}
.bodyweight-log-row__log-btn .mud-icon-root { font-size: 26px !important; width: 26px !important; height: 26px !important; }

/* Set Metric Stepper Global Polish */
.set-metric-stepper__btn, .set-metric-stepper__btn.mud-button-root {
  flex: 0 0 56px !important;
  width: 56px !important;
  min-width: 56px !important;
  max-width: 56px !important;
  height: 56px !important;
  min-height: 56px !important;
  padding: 0 !important;
  font-family: var(--font-display) !important;
  font-size: 33px !important;
  font-weight: 800 !important;
  line-height: 1 !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: var(--radius) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  background: var(--pl-chip-2) !important;
  color: var(--pl-ink) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
  cursor: pointer !important;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease, color 120ms ease !important;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.set-metric-stepper__btn:hover,
.set-metric-stepper__btn.mud-button-root:hover {
  background: var(--pl-chip) !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow) !important;
}
.set-metric-stepper__btn:active,
.set-metric-stepper__btn.mud-button-root:active {
  transform: translate(2px, 2px) !important;
  box-shadow: none !important;
  border-color: var(--pl-volt-edge) !important;
  background: var(--pl-chip) !important;
  color: var(--pl-yellow) !important;
}
.set-metric-stepper__value, .set-metric-stepper__value--compact { height:56px !important; min-height:56px !important; font-size:22px !important; font-weight:800 !important; }
.set-metric-stepper__input, .set-metric-stepper__input--compact { height:56px !important; min-height:56px !important; font-size:22px !important; font-weight:800 !important; }

/* Offscreen Share Card */
/* Captured to PNG via html2canvas: explicit hex colors only, no var() or color-mix(). */
.share-card-wrap { position:fixed !important; left:-9999px !important; top:0 !important; width:400px !important; opacity:0 !important; pointer-events:none !important; z-index:-9999 !important; }
.share-card { width:400px; box-sizing:border-box; padding:24px; color:#1A1B26; }
html[data-theme-mode="dark"] .share-card { color: var(--pl-ink); }
.share-card__header { display:flex; align-items:center; gap:10px; margin-bottom:18px; }
.share-card__logo { width:30px; height:30px; fill:#1A1B26; flex-shrink:0; }
html[data-theme-mode="dark"] .share-card__logo { fill: var(--pl-cyan); }
.share-card__brand { font-size:13px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:#565A6E; }
html[data-theme-mode="dark"] .share-card__brand { color: var(--pl-stone); }
.share-card__plan { margin:0; font-size:24px; font-weight:800; line-height:1.25; letter-spacing:-0.02em; }
.share-card__date { margin:6px 0 0; font-size:12px; color:#565A6E; }
html[data-theme-mode="dark"] .share-card__date { color: var(--pl-stone); }
.share-card__stats { display:grid; grid-template-columns:repeat(3, 1fr); gap:10px; margin:20px 0; }
.share-card__stat { display:flex; flex-direction:column; gap:2px; padding:12px 8px; background:#F5F5F7; text-align:center; }
html[data-theme-mode="dark"] .share-card__stat { background: var(--pl-chip); }
.share-card__stat-value { font-size:17px; font-weight:700; white-space:nowrap; color:#1A1B26; }
html[data-theme-mode="dark"] .share-card__stat-value { color: var(--pl-cyan); }
.share-card__stat-label { font-size:10px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:#565A6E; }
html[data-theme-mode="dark"] .share-card__stat-label { color: var(--pl-stone); }
.share-card__exercises { margin-top:4px; }
.share-card__exercise { padding:12px 0; border-top:1px solid #B4B8C5; }
html[data-theme-mode="dark"] .share-card__exercise { border-top-color: var(--pl-hairline); }
.share-card__exercise-name { margin:0 0 8px; font-size:14px; font-weight:700; }
.share-card__set { display:flex; justify-content:space-between; align-items:baseline; gap:12px; padding:4px 0; font-size:12px; }
.share-card__set--warmup { color:#565A6E; }
html[data-theme-mode="dark"] .share-card__set--warmup { color: var(--pl-stone); }
.share-card__set-label { min-width:0; }
.share-card__set-metrics { font-weight:700; text-align:right; white-space:nowrap; }
.share-card__warmup { font-size:9px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:#8A5A12; margin-right:6px; }
html[data-theme-mode="dark"] .share-card__warmup { color: var(--pl-yellow); }
.share-card__footer { margin-top:16px; padding-top:12px; border-top:1px solid #B4B8C5; font-size:10px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; text-align:center; color:#565A6E; }
html[data-theme-mode="dark"] .share-card__footer { border-top-color: var(--pl-hairline); color: var(--pl-stone); }
.share-card--dark { background:#141624; color:#C0CAF5; }
.share-card--dark .share-card__logo { fill:#00E5FF; }
.share-card--dark .share-card__brand { color:#8A90B8; }
.share-card--dark .share-card__date { color:#8A90B8; }
.share-card--dark .share-card__stat { background:#181A2A; }
.share-card--dark .share-card__stat-value { color:#00E5FF; }
.share-card--dark .share-card__stat-label { color:#8A90B8; }
.share-card--dark .share-card__exercise { border-top-color:#282B42; }
.share-card--dark .share-card__set--warmup { color:#8A90B8; }
.share-card--dark .share-card__warmup { color:#FAFF00; }
.share-card--dark .share-card__footer { border-top-color:#282B42; color:#8A90B8; }

/* Infinite Scroll Tables and Progress Lists for Bodyweight, Exercise Progress, and History Detail */
/* Column rhythm matches the shared compact table; edit mode keeps a wide action slot. */
.infinite-table-head--4x, .infinite-table-row--4x { grid-template-columns: minmax(0,1.5fr) minmax(0,0.8fr) minmax(0,1fr) minmax(0,0.8fr); }
.history-detail-table .infinite-table-head--5, .history-detail-table .infinite-table-row--5 { grid-template-columns: minmax(0,1.4fr) minmax(0,0.7fr) minmax(0,0.9fr) minmax(0,0.8fr) 76px; }
.history-detail-plan-head--4, .history-detail-plan-row--4 { grid-template-columns: minmax(0,1.4fr) minmax(0,1.1fr) minmax(0,0.7fr) minmax(0,0.7fr); }
.history-detail-plan-head--3, .history-detail-plan-row--3 { grid-template-columns: minmax(0,1.8fr) minmax(0,0.8fr) minmax(0,0.7fr); }
.history-detail-plan-warmup { display:inline-flex; align-items:center; margin-left:4px; padding:0 4px; border-radius:var(--radius); font-family:var(--font-mono); font-size:0.625rem; font-weight:700; letter-spacing:0.04em; text-transform:uppercase; background:color-mix(in srgb, var(--pl-amber) 20%, transparent); color:var(--pl-warn-text); border:1px solid color-mix(in srgb, var(--pl-warn-text) 50%, transparent); vertical-align:middle; }
.history-infinite-scroll-loading { display:flex; justify-content:center; padding:12px; }
.history-infinite-scroll-sentinel { height:1px; width:100%; }
.history-detail-table__input { width:100%; max-width:64px; height:32px; min-height:32px; padding:2px 6px; font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; border:var(--hairline-strong); border-radius:var(--radius); background:var(--pl-chip); color:var(--pl-ink); box-sizing:border-box; text-align:right; }
.history-detail-table__btn.mud-icon-button { width:32px !important; height:32px !important; min-width:32px !important; min-height:32px !important; border:var(--hairline); border-radius:var(--radius); background:var(--pl-chip-2); }
.history-detail-exercise-cell { display:flex; flex-direction:column; align-items:flex-start; justify-content:center; gap:2px; min-width:0; }
.history-detail-exercise-cell--continuation { min-height:1.25rem; justify-content:center; }
.history-detail-exercise-name { font-weight:600; white-space:normal; overflow-wrap:break-word; word-break:break-word; line-height:1.35; width:100%; min-width:0; }
.history-detail-warmup-badge { display:inline-flex; align-items:center; padding:1px 5px; border-radius:var(--radius); font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; background:color-mix(in srgb, var(--pl-amber) 20%, transparent); color:var(--pl-warn-text); border:1px solid var(--pl-warn-text); }
.history-detail-row--group-start { border-top:1.5px solid var(--hairline-strong) !important; }
.history-detail-row--continuation { border-top:none !important; }
/* Card titles already name the series; the MudChart legend would duplicate them */
.bodyweight-chart .mud-chart-legend, .exercise-progress-chart__plot .mud-chart-legend { display:none; }
.bodyweight-chart-panel, .exercise-progress-chart { border:1.5px solid var(--hairline-strong) !important; border-radius:var(--radius) !important; background:var(--pl-chip) !important; box-shadow:none !important; overflow:visible !important; }
.bodyweight-chart, .exercise-progress-chart__plot { width:100%; }

/* Plan Exercise List and Rows */
.plan-exercise-list { display:flex; flex-direction:column; gap:8px; width:100%; min-width:0; }
.plan-exercise-group { border:1.5px solid var(--pl-hairline-strong); margin-bottom:4px; background:var(--pl-chip); overflow:hidden; border-radius:var(--radius); }
.plan-exercise-group--superset { border-left:3px solid var(--pl-cyan); }
.plan-exercise-group[data-group="A"] { border-left-color: var(--pl-cyan); }
.plan-exercise-group[data-group="B"] { border-left-color: var(--pl-plate-red); }
.plan-exercise-group[data-group="C"] { border-left-color: var(--pl-plate-blue); }
.plan-exercise-group[data-group="D"] { border-left-color: var(--pl-plate-gold); }
.plan-exercise-group__header { padding:6px 12px; background:var(--pl-chip-2); border-bottom:1px solid var(--pl-hairline); font-family:var(--font-mono); font-size:11px; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--pl-ink); display:flex; align-items:center; justify-content:space-between; gap:8px; }
.plan-exercise-group__count { color:var(--pl-stone); font-weight:700; }
.plan-exercise-group .plan-exercise-row { border:none !important; border-radius:0 !important; margin:0 !important; box-shadow:none !important; }
.plan-exercise-group .plan-exercise-row + .plan-exercise-row { border-top:1px solid var(--pl-hairline) !important; }
.plan-exercise-group .plan-exercise-row:hover { background:color-mix(in srgb, var(--pl-yellow) 6%, var(--pl-chip)) !important; }
.plan-exercise-group .plan-exercise-row__chip--superset { opacity:0.82; font-size:0.625rem !important; }
.plan-exercise-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px !important;
  border: 1.5px solid var(--hairline-strong) !important;
  border-radius: var(--radius) !important;
  background: var(--pl-chip) !important;
  box-shadow: none !important;
  transition: border-color 120ms ease, background 120ms ease;
  user-select: none;
  min-width: 0;
  max-width: 100%;
}
.plan-exercise-row:hover { border-color: var(--pl-yellow) !important; }
.plan-exercise-row__main { display: flex; align-items: center; gap: 8px; flex: 1 1 0%; min-width: 0; max-width: 100%; }
.plan-card-handle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  background: var(--pl-chip) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
  color: var(--pl-ink) !important;
  border-radius: var(--radius) !important;
  box-sizing: border-box !important;
}

.plan-exercise-handle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  background: var(--pl-chip-2) !important;
  color: var(--pl-ink) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
  cursor: grab !important;
  touch-action: none;
  padding: 0 !important;
  flex-shrink: 0;
  box-sizing: border-box !important;
}
.plan-exercise-handle:active { cursor: grabbing !important; }
.plan-exercise-row__body { display: flex; align-items: center; gap: 10px; flex: 1 1 0%; min-width: 0; max-width: 100%; border: none; background: transparent; padding: 4px 6px; text-align: left; cursor: pointer; color: var(--pl-ink); font: inherit; white-space: normal; transition: transform 90ms ease, opacity 90ms ease; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.plan-exercise-row__body:active { transform: translate(1px, 1px); opacity: 0.85; }
.plan-exercise-row__index {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  padding: 0 !important;
  font-family: var(--font-mono) !important;
  font-size: 0.875rem !important;
  font-weight: 800 !important;
  color: var(--pl-purple-text) !important;
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  border-radius: var(--radius) !important;
  flex-shrink: 0;
  box-sizing: border-box !important;
}
.plan-exercise-row__text { display: flex; flex-direction: column; gap: 2px; flex: 1 1 0%; min-width: 0; max-width: 100%; }
.plan-exercise-row__name { font-family: var(--font-display) !important; font-size: 16px !important; font-weight: 800 !important; letter-spacing: -0.015em !important; color: var(--pl-ink) !important; display: block !important; white-space: normal !important; overflow-wrap: break-word !important; word-break: break-word !important; line-height: 1.35 !important; min-width: 0 !important; max-width: 100% !important; }
.plan-exercise-row__chip--superset { font-family: var(--font-mono) !important; font-size: 0.6875rem !important; font-weight: 800 !important; padding: 2px 6px !important; border-radius: var(--radius) !important; background: var(--pl-volt-fill) !important; color: var(--pl-volt-fg) !important; text-transform: uppercase !important; display: inline-block !important; }
.plan-exercise-row__summary { font-family: var(--font-mono) !important; font-size: 0.6875rem !important; letter-spacing: 0.04em !important; color: var(--pl-stone) !important; display: block !important; white-space: normal !important; overflow-wrap: break-word !important; word-break: break-word !important; line-height: 1.3 !important; }
.plan-exercise-row__chevron { color: var(--pl-stone) !important; flex-shrink: 0; }
.plan-exercise-row__chevron .mud-icon-root { font-size: 18px !important; width: 18px !important; height: 18px !important; }
.plan-exercise-row__actions { display: flex; align-items: center; flex-shrink: 0; }
.plan-exercise-row__menu .mud-icon-button {
  width: 36px !important;
  height: 36px !important;
  min-width: 36px !important;
  min-height: 36px !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  background: var(--pl-chip-2) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  border-radius: var(--radius) !important;
  color: var(--pl-ink) !important;
  box-sizing: border-box !important;
  transition: transform 100ms ease, background 120ms ease, border-color 120ms ease, box-shadow 100ms ease !important;
}
.plan-exercise-row__menu .mud-icon-button:hover {
  background: var(--pl-chip) !important;
  border-color: var(--pl-yellow) !important;
}
.plan-exercise-row__menu .mud-icon-button:active {
  transform: translate(3px, 3px) !important;
  box-shadow: none !important;
}
/* Drag and drop feedback: both home plan cards and plan exercise rows share the
   same Sortable contract: ghost is the placeholder left behind, chosen is the
   lifted item before it becomes the floating mirror, drag/fallback is the
   mirror that follows the finger. The mirror must look elevated and alive. */
.plan-exercise-row--ghost,
.plan-card--ghost {
  opacity: 0.38 !important;
  background: repeating-linear-gradient(-45deg, transparent 0 5px, color-mix(in srgb, var(--pl-stone) 14%, transparent) 5px 10px) !important;
  border: 1.5px dashed var(--pl-hairline-strong) !important;
  box-shadow: none !important;
}

.plan-exercise-row--chosen,
.plan-card--chosen {
  border-color: var(--pl-yellow) !important;
  background: color-mix(in srgb, var(--pl-yellow) 13%, var(--pl-chip)) !important;
  box-shadow: 0 2px 8px rgba(0,0,0,0.12) !important;
}

.plan-exercise-row--drag,
.plan-card--drag,
.plan-exercise-row--fallback,
.plan-card--fallback {
  opacity: 0.96 !important;
  transform: rotate(0.7deg) scale(1.02);
  border-color: var(--pl-yellow) !important;
  background: var(--pl-chip) !important;
  box-shadow: 0 12px 24px rgba(0,0,0,0.20), 0 4px 8px rgba(0,0,0,0.14) !important;
  z-index: 1200;
}

.plan-exercise-row--fallback,
.plan-card--fallback {
  pointer-events: none;
}

@media (prefers-reduced-motion: reduce) {
  .plan-exercise-row--drag,
  .plan-card--drag,
  .plan-exercise-row--fallback,
  .plan-card--fallback {
    transform: none !important;
  }
}

.plan-exercise-row--chosen .plan-exercise-handle,
.plan-card--chosen .plan-card-handle,
.plan-exercise-row--drag .plan-exercise-handle,
.plan-card--drag .plan-card-handle {
  background: var(--pl-yellow) !important;
  color: var(--pl-volt-fg) !important;
  border-color: var(--pl-volt-edge) !important;
}

/* Active Workout Layout and Exercise Cards */
.workout-exercise-layout { display:flex; flex-direction:column; gap:12px; }
.exercise-accordion-card { border:var(--hairline) !important; border-radius:var(--radius) !important; background:var(--pl-chip) !important; box-shadow:none !important; scroll-margin-top:12px; overflow:hidden; }
.exercise-accordion-card--expanded { border-color:var(--pl-ink) !important; box-shadow:inset 0 0 0 1px var(--pl-ink) !important; }
.exercise-accordion-header { display:flex; align-items:center; justify-content:space-between; width:100%; padding:10px 12px 6px !important; background:transparent; border:none; cursor:pointer; text-align:left; font:inherit; color:inherit; gap:8px; box-sizing:border-box; min-height:44px !important; transition: opacity 90ms ease; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.exercise-accordion-header:not(.exercise-accordion-header--static):active { opacity: 0.78; }
.header-left { display:flex !important; align-items:center !important; gap:8px !important; min-width:0 !important; flex:1 !important; padding-left:0 !important; }
.header-right { display:flex !important; align-items:center !important; gap:6px !important; flex-shrink:0 !important; padding-right:0 !important; }
.exercise-index-tag {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 2px 8px !important;
  margin: 0 !important;
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 800 !important;
  color: var(--pl-purple-text) !important;
  letter-spacing: 0.08em !important;
  min-width: 38px !important;
  box-sizing: border-box !important;
}
html[data-theme-mode="light"] .exercise-index-tag {
  color: #6D28D9 !important;
  background: #E5E7EB !important;
}
.completed-icon { display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:var(--radius) !important; background:var(--pl-success); color:#FFFFFF !important; flex-shrink:0; }
.completed-icon .mud-icon-root { font-size:16px !important; width:16px !important; height:16px !important; color:#FFFFFF !important; fill:#FFFFFF !important; }
html[data-theme-mode="dark"] .completed-icon { color:#10111A !important; }
html[data-theme-mode="dark"] .completed-icon .mud-icon-root { color:#10111A !important; fill:#10111A !important; }
.exercise-name { font-family:var(--font-display) !important; font-size:18px !important; font-weight:800 !important; letter-spacing:-0.015em !important; line-height:1.2 !important; color:var(--pl-ink) !important; text-transform:none !important; }
.workout-superset-badge { display:inline-flex; align-items:center; justify-content:center; height:36px; min-height:36px; font-family:var(--font-mono); font-size:0.6875rem; font-weight:800; letter-spacing:0.08em; padding:0 8px; border-radius:var(--radius); background:var(--pl-amber); color:#10111A; box-sizing:border-box; }
html[data-theme-mode="dark"] .workout-superset-badge { color:var(--pl-rubber); }
.exercise-more-menu .mud-icon-button { width:44px !important; height:44px !important; min-width:44px !important; min-height:44px !important; border:1.5px solid var(--hairline-strong) !important; background:var(--pl-chip-2); color:var(--pl-ink) !important; border-radius:var(--radius) !important; box-sizing:border-box; }
.exercise-more-menu .mud-icon-button .mud-icon-root { color:var(--pl-ink) !important; fill:var(--pl-ink) !important; }
.set-progress-pill { display:inline-flex; align-items:center; justify-content:center; height:36px; min-height:36px; padding:0 10px; border:1.5px solid var(--hairline-strong) !important; border-radius:var(--radius); background:var(--pl-chip-2); color:var(--pl-ink); font-family:var(--font-mono); font-size:0.6875rem; font-weight:800; letter-spacing:0.08em; text-transform:uppercase; white-space:nowrap; box-sizing:border-box; }
.set-progress-pill--completed { background:var(--pl-success) !important; color:#FFFFFF !important; border-color:var(--pl-success) !important; font-weight:800 !important; }
html[data-theme-mode="dark"] .set-progress-pill--completed { color:#10111A !important; }
.exercise-accordion-card .mud-card-content { padding:0 12px 12px 12px !important; }
.set-logging-rows { display:flex; flex-direction:column; gap:6px !important; padding-top:0 !important; }
.set-active-panel { display:flex; flex-direction:column; gap:6px !important; padding:10px 12px !important; background:var(--pl-chip-2); border:1.5px solid var(--hairline-strong); border-radius:var(--radius); position:relative; }
.set-active-panel__header { display:flex; align-items:center; margin-bottom:2px !important; }
.set-active-panel__controls { display:flex; align-items:stretch; gap:8px; width:100%; }
.set-stepper-rows { display:flex; flex-direction:column !important; gap:6px !important; flex:1; min-width:0; }
.log-set-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  min-width: 64px;
  align-self: stretch;
  height: auto;
  min-height: 90px;
  border: 1.5px solid var(--pl-volt-edge) !important;
  background: var(--pl-volt-fill) !important;
  background-color: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  cursor: pointer;
  padding: 0;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), filter 120ms ease !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  flex-shrink: 0;
  border-radius: var(--radius) !important;
}
.log-set-btn::before, .log-set-btn::after {
  display: none !important;
}
.log-set-btn:hover {
  filter: brightness(1.15);
}
.log-set-btn:active {
  transform: translate(3px, 3px) !important;
  box-shadow: none !important;
}
.log-set-btn .mud-icon-root { font-size:32px !important; width:32px !important; height:32px !important; color:var(--pl-volt-fg) !important; fill:var(--pl-volt-fg) !important; font-weight:900; }
.warmup-chip { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; padding:2px 6px; border-radius:var(--radius); background:color-mix(in srgb, var(--pl-amber) 20%, transparent); color:var(--pl-warn-text); border:1px solid var(--pl-warn-text); white-space:nowrap; }
.warmup-chip--row { margin-right:6px; }
.set-completed-row { display:flex; flex-direction:column; gap:6px; padding:10px 0; border-bottom:var(--hairline); }
.set-completed-row:last-child { border-bottom:none; }
.set-completed-row__header { display:flex; align-items:center; }
.set-completed-row__label { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; color:var(--pl-stone); }
.set-completed-row .set-stepper-rows { display:flex; flex-direction:column !important; gap:8px !important; width:100%; }
.workout-top { display:flex; flex-direction:column; gap:8px; }
/* The rest panel reserves its slot in the flow. Stats plate and timer read as
   one machined block; rest start scrolls the timer into view and rest end
   scrolls the active set back (Workout.razor), so the shift is always the
   thing the user is about to look at. */
.workout-top--with-timer { gap:0; }
.workout-top--with-timer .workout-session-stats { border-bottom:none !important; border-bottom-left-radius:0 !important; border-bottom-right-radius:0 !important; }
.workout-top--with-timer .rest-timer-panel { border-top:none !important; border-top-left-radius:0 !important; border-top-right-radius:0 !important; }
.workout-session-stats {
  display: flex !important;
  align-items: stretch !important;
  justify-content: center !important;
  padding: 6px 8px !important;
  border: 1.5px solid var(--hairline-strong) !important;
  border-radius: var(--radius);
  background: var(--pl-chip) !important;
  box-shadow: none !important;
  gap: 6px !important;
}
.workout-session-stat {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  gap: 2px !important;
  flex: 1 !important;
  min-width: 0 !important;
  padding: 4px 8px !important;
  min-height: 48px !important;
  justify-content: center !important;
  background: var(--pl-chip-2) !important;
  border: 1px solid var(--hairline-strong) !important;
  border-radius: var(--radius);
}
.workout-session-stat:last-child { border-right:1px solid var(--hairline-strong); }
.workout-session-stat__value {
  font-family: var(--font-display) !important;
  font-size: clamp(1.375rem, 4.5vw, 1.875rem) !important;
  font-weight: 900 !important;
  line-height: 1.1 !important;
  white-space: nowrap;
  color: var(--pl-yellow) !important;
  font-variant-numeric: tabular-nums;
  letter-spacing: -0.01em;
}
.workout-session-stat__label {
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  color: var(--pl-stone);
  background: var(--pl-chip);
  padding: 1px 6px;
  border-radius: var(--radius);
  border: 1px solid var(--hairline);
}
.workout-session-stat-divider { display:none; }
.settings-card.mud-paper { border:var(--hairline) !important; border-radius:var(--radius) !important; background:var(--pl-chip) !important; box-shadow:none !important; }
/* Detail-page card headers share one aligned title row everywhere. */
.settings-card__header { display:flex; align-items:center; gap:8px; margin-bottom:8px; min-width:0; }
.settings-card__header .mud-icon-root { font-size:18px !important; width:18px !important; height:18px !important; color:var(--pl-stone) !important; flex-shrink:0; }
.settings-card__title { font-family:var(--font-display) !important; font-size:1rem !important; font-weight:800 !important; letter-spacing:0.02em !important; line-height:1.25 !important; margin:0 !important; color:var(--pl-ink); }

/* Settings section tabs, premium wrapping segmented control */
.settings-tab-row { display:flex; flex-wrap:wrap; gap:6px; width:100%; }
.settings-tab { flex:1 1 72px; display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:44px; padding:0 12px; border:var(--hairline); border-radius:var(--radius); background:var(--pl-chip-2); color:var(--pl-stone); font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; cursor:pointer; transition:transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), border-color 120ms ease, color 120ms ease, background 120ms ease !important; white-space:nowrap; touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
.settings-tab .mud-icon-root { font-size:16px !important; width:16px !important; height:16px !important; color:inherit; }
.settings-tab:hover { border-color:var(--pl-hairline-strong); color:var(--pl-ink); background:var(--pl-chip-2); }
.settings-tab:active { transform: translate(1px, 1px); }
.settings-tab--active, .settings-tab--active:hover { background:var(--pl-accent-bg) !important; color:var(--pl-accent-fg) !important; border-color:var(--pl-ink) !important; font-weight:900 !important; box-shadow: var(--pl-plate-shadow-sm) !important; }
.settings-tab--active:active { transform: translate(2px, 2px) !important; box-shadow: 1px 1px 0 var(--pl-plate-shadow-color) !important; }
.settings-tab:focus-visible { outline:2px solid var(--pl-focus); outline-offset:-2px; }

@media (max-width: 480px) {
  .settings-tab-row {
    display: grid !important;
    grid-template-columns: repeat(4, 1fr) !important;
    gap: 4px !important;
  }
  .settings-tab {
    flex: none !important;
    min-width: 0 !important;
    padding: 0 4px !important;
    gap: 3px !important;
    font-size: 0.625rem !important;
  }
  .settings-tab .mud-icon-root {
    font-size: 14px !important;
    width: 14px !important;
    height: 14px !important;
  }
}

/* Settings expansion panel headers, title and subtitle as distinct rows */
.settings-panel__header { display:flex; align-items:center; gap:12px; min-width:0; width:100%; max-width:100%; text-align:left; box-sizing:border-box; }
.settings-panel__icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  flex-shrink: 0;
  border-radius: var(--radius);
  background: var(--pl-chip-2);
  border: 1.5px solid var(--pl-hairline-strong);
  transition: all 120ms ease;
  color: var(--pl-ink);
}
.settings-panel__icon .mud-icon-root {
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
  color: inherit !important;
}
.settings-panel__icon--appearance { color: var(--pl-purple-text) !important; }
html[data-theme-mode="dark"] .settings-panel__icon--appearance { color: var(--pl-purple) !important; }

.settings-panel__icon--units { color: var(--pl-cyan-text) !important; }
html[data-theme-mode="dark"] .settings-panel__icon--units { color: var(--pl-cyan) !important; }

.settings-panel__icon--timer { color: var(--pl-warn-text) !important; }
html[data-theme-mode="dark"] .settings-panel__icon--timer { color: var(--pl-yellow) !important; }

.settings-panel__icon--profiles { color: var(--pl-cyan-text) !important; }
html[data-theme-mode="dark"] .settings-panel__icon--profiles { color: var(--pl-cyan) !important; }

.settings-panel__icon--schedule { color: var(--pl-ok-text) !important; }
html[data-theme-mode="dark"] .settings-panel__icon--schedule { color: var(--pl-success) !important; }

.settings-panel__icon--ai { color: var(--pl-purple-text) !important; }
html[data-theme-mode="dark"] .settings-panel__icon--ai { color: var(--pl-purple) !important; }

.settings-panel__icon--backup { color: var(--pl-cyan-text) !important; }
html[data-theme-mode="dark"] .settings-panel__icon--backup { color: var(--pl-plate-blue) !important; }

.settings-panel__icon--update { color: var(--pl-ok-text) !important; }
html[data-theme-mode="dark"] .settings-panel__icon--update { color: var(--pl-success) !important; }

.settings-panel__icon--account { color: var(--pl-err-text) !important; }
html[data-theme-mode="dark"] .settings-panel__icon--account { color: var(--pl-error) !important; }

.settings-panel__icon--danger,
.settings-panel--danger .settings-panel__icon {
  color: var(--pl-err-text) !important;
  border-color: color-mix(in srgb, var(--pl-err-text) 45%, var(--pl-hairline-strong)) !important;
}
html[data-theme-mode="dark"] .settings-panel__icon--danger,
html[data-theme-mode="dark"] .settings-panel--danger .settings-panel__icon {
  color: var(--pl-error) !important;
}

.settings-card__icon {
  color: var(--pl-cyan-text) !important;
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
  flex-shrink: 0;
}
html[data-theme-mode="dark"] .settings-card__icon {
  color: var(--pl-cyan) !important;
}
.settings-panel__text { display:flex; flex-direction:column; gap:2px; min-width:0; flex:1 1 auto; max-width:100%; overflow:hidden; }
.settings-panel__title { font-family:var(--font-display); font-size:1rem; font-weight:800; letter-spacing:0.02em; text-transform:uppercase; color:var(--pl-ink); line-height:1.2; overflow-wrap:break-word; word-break:break-word; white-space:normal !important; }
.settings-panel__subtitle { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--pl-stone); line-height:1.35; white-space:normal !important; overflow-wrap:break-word !important; word-break:break-word !important; }
html[data-theme-mode="light"] .settings-panel__subtitle { color: var(--pl-ink-2); }
html[data-theme-mode="light"] .settings-tab { color: var(--pl-ink-2); }
html[data-theme-mode="light"] .settings-schedule-day { color: var(--pl-ink-2); }
html[data-theme-mode="light"] .app-nav-tab { color: var(--pl-ink-2); }
html[data-theme-mode="light"] .mud-text-secondary { color: var(--pl-ink-2) !important; }
.settings-panel__content { display:flex; flex-direction:column; gap:10px; padding-top:6px; min-width:0; max-width:100%; }
.settings-panels { display:flex; flex-direction:column; gap:8px; width:100%; min-width:0; max-width:100%; }
.settings-panel.mud-expand-panel { border:var(--hairline) !important; border-radius:var(--radius) !important; background:var(--pl-chip) !important; box-shadow:none !important; overflow:hidden !important; min-width:0; max-width:100%; }
.settings-panel.mud-expand-panel .mud-expand-panel-header { display:flex !important; align-items:center !important; justify-content:space-between !important; gap:10px !important; padding:10px 14px !important; min-height:56px; overflow:hidden !important; min-width:0 !important; max-width:100% !important; box-sizing:border-box !important; }
.settings-panel.mud-expand-panel .mud-expand-panel-text { min-width:0 !important; flex:1 1 auto !important; max-width:100% !important; overflow:hidden !important; }
.settings-panel.mud-expand-panel .mud-expand-panel-icon { flex-shrink:0 !important; margin-left:8px !important; margin-right:0 !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; width:28px !important; height:28px !important; }
.settings-panel--danger.mud-expand-panel { border-color:color-mix(in srgb, var(--pl-err-text) 28%, var(--pl-hairline)) !important; }
.settings-btn-group { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.settings-btn-group .mud-button-root { flex:0 1 auto; min-height:40px !important; }
.settings-local-banner { border:var(--hairline) !important; background:color-mix(in srgb, var(--pl-success) 8%, var(--pl-chip)) !important; }
.settings-schedule-days { display:grid; grid-template-columns:repeat(7, minmax(0,1fr)); gap:6px; margin-top:4px; }
.settings-schedule-day { display:grid; place-items:center; height:44px; border:var(--hairline); border-radius:var(--radius); background:var(--pl-chip-2); color:var(--pl-stone); font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; cursor:pointer; transition:transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), border-color 120ms ease, color 120ms ease, background 120ms ease !important; user-select:none; touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
.settings-schedule-day:hover { border-color:var(--pl-hairline-strong); color:var(--pl-ink); background:var(--pl-chip-2); }
.settings-schedule-day:active { transform: translate(1px, 1px); }
.settings-schedule-day[aria-pressed="true"] { background:var(--pl-accent-bg) !important; color:var(--pl-accent-fg) !important; border-color:var(--pl-ink) !important; font-weight:900 !important; box-shadow: var(--pl-plate-shadow-sm) !important; }
.settings-schedule-day[aria-pressed="true"]:active { transform: translate(2px, 2px) !important; box-shadow: 1px 1px 0 var(--pl-plate-shadow-color) !important; }
.settings-schedule-day:focus-visible { outline:2px solid var(--pl-focus); outline-offset:2px; }

/* Ghost danger button (Remove all data...), outlined error with AA contrast */
.btn-premium-ghost { background:var(--pl-chip) !important; color:var(--pl-err-text) !important; border:1px solid color-mix(in srgb, var(--pl-err-text) 45%, transparent) !important; min-height:44px; font-family:var(--font-mono) !important; font-size:0.6875rem !important; font-weight:700 !important; letter-spacing:0.1em !important; text-transform:uppercase !important; }
.btn-premium-ghost:hover { background:color-mix(in srgb, var(--pl-error) 8%, var(--pl-chip)) !important; border-color:var(--pl-err-text) !important; }

/* Bodyweight Header (deduped, see main bodyweight-panel block above) */

/* History Day Filter Bar */
.history-filter-bar { display:flex; align-items:center; flex-wrap:wrap; gap:8px; padding:8px 10px; border:var(--hairline); border-radius:var(--radius); background:var(--pl-chip); }
.history-filter-bar__label { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--pl-stone); margin-right:2px; }
.history-filter-chip { display:inline-flex; align-items:center; height:36px; padding-left:10px; border:var(--hairline-strong); border-radius:var(--radius); background:var(--pl-chip-2); }
.history-filter-chip__label { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.06em; color:var(--pl-ink); white-space:nowrap; }
.history-filter-chip__remove { display:inline-flex; align-items:center; justify-content:center; width:30px; height:30px; margin-left:4px; margin-right:3px; padding:0; border:none; border-radius:var(--radius); background:transparent; color:var(--pl-stone); cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; transition:transform 90ms ease, color 120ms ease, background 120ms ease !important; }
.history-filter-chip__remove:hover { color:var(--pl-err-text); background:color-mix(in srgb, var(--pl-error) 12%, transparent); }
.history-filter-chip__remove:active { color:var(--pl-err-text); background:color-mix(in srgb, var(--pl-error) 18%, transparent); transform: translate(1px, 1px); }
.history-filter-chip__remove .mud-icon-root { font-size:16px !important; width:16px !important; height:16px !important; }
.history-filter-chip--selected { background:var(--pl-accent-bg) !important; border-color:var(--pl-accent-bg) !important; }
.history-filter-chip--selected .history-filter-chip__label { color:var(--pl-accent-fg) !important; }
.history-filter-chip--selected .history-filter-chip__remove { color:var(--pl-accent-fg) !important; }
.history-filter-chip--selected .history-filter-chip__remove:hover { background:color-mix(in srgb, var(--pl-accent-fg) 14%, transparent) !important; color:var(--pl-accent-fg) !important; }
.history-filter-bar__clear { margin-left:auto; display:inline-flex; align-items:center; height:36px; padding:0 12px; border:var(--hairline); border-radius:var(--radius); background:transparent; color:var(--pl-stone); font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; cursor:pointer; -webkit-tap-highlight-color:transparent; touch-action:manipulation; transition:transform 90ms ease, color 120ms ease, border-color 120ms ease, opacity 90ms ease !important; }
.history-filter-bar__clear:hover { color:var(--pl-err-text); border-color:var(--pl-hairline-strong); }
.history-filter-bar__clear:active { transform: translate(1px, 1px); opacity: 0.8; }

/* History Select Bar */
.history-select-bar { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:8px 12px; border:var(--hairline-strong) !important; border-radius:var(--radius) !important; background:var(--pl-chip-2) !important; margin-bottom:8px; }
.history-select-bar__left, .history-select-bar__right { display:flex; align-items:center; gap:8px; }
.history-select-bar__count { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; color:var(--pl-ink); }
.history-select-bar__btn { display:inline-flex; align-items:center; gap:4px; height:30px; padding:0 10px; font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.06em; text-transform:uppercase; border:var(--hairline); border-radius:var(--radius); background:var(--pl-chip-2); color:var(--pl-ink); cursor:pointer; transition:transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms ease, background 120ms ease, border-color 120ms ease, color 120ms ease !important; touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
.history-select-bar__btn:hover { background:var(--pl-chip-2); border-color:var(--pl-ink); }
.history-select-bar__btn:active:not(:disabled) { transform: translate(1px, 1px); }
.history-select-bar__btn--delete { color:var(--pl-err-text) !important; border-color:color-mix(in srgb, var(--pl-err-text) 45%, transparent) !important; }
.history-select-bar__btn--delete:hover:not(:disabled) { background:var(--pl-error) !important; color:#FFFFFF !important; border-color:var(--pl-error) !important; }
.history-select-bar__btn--delete:disabled { opacity:0.4; cursor:not-allowed; }
.history-select-bar__btn--compare { color:var(--pl-ink) !important; }
.history-select-bar__btn--compare:disabled { opacity:0.4; cursor:not-allowed; }
.history-select-bar__btn--compare:not(:disabled) { border-color:var(--pl-hairline-strong) !important; }
.history-select-bar__btn--compare:not(:disabled):hover { background:var(--pl-chip) !important; border-color:var(--pl-ink) !important; }
.history-select-bar__btn--done { background:var(--pl-accent-bg) !important; color:var(--pl-accent-fg) !important; border-color:var(--pl-accent-bg) !important; }

/* History Session Card Selection */
.history-session-card--selected { border-color:var(--pl-ink) !important; background:color-mix(in srgb, var(--pl-ink) 8%, var(--pl-chip)) !important; }
html[data-theme-mode="dark"] .history-session-card--selected { border-color:var(--pl-ink) !important; background:color-mix(in srgb, var(--pl-ink) 10%, var(--pl-chip)) !important; }
.history-session-check { display:flex; align-items:center; justify-content:center; margin-right:8px; }

/* Exercise Progression Controls and Tabs */
.exercise-progress-controls { display:flex; align-items:center; gap:10px; width:100%; flex-wrap:wrap; }
.exercise-progress-controls > * { min-width:0; }
.exercise-progress-picker,
.exercise-progress-range { flex:1 1 0; min-width:140px; }
.bodyweight-range-row { display:flex; width:100%; gap:8px; }
.bodyweight-range-row__select { flex:1 1 auto; max-width:100%; min-width:0; }
.exercise-metric-tabs { display:flex; align-items:stretch; gap:4px; padding:3px; border:var(--hairline); border-radius:var(--radius); background:var(--pl-chip-2); width:100%; margin-bottom:4px; }
.exercise-metric-tab { flex:1 1 0px; display:inline-flex; align-items:center; justify-content:center; height:36px; padding:0 10px; font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--pl-stone); background:transparent; border:none; border-radius:var(--radius); cursor:pointer; transition:transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), color 120ms ease, background 120ms ease !important; white-space:nowrap; touch-action:manipulation; -webkit-tap-highlight-color:transparent; }
.exercise-metric-tab:hover { color:var(--pl-ink); }
.exercise-metric-tab:active { transform: translate(1px, 1px); }
.exercise-metric-tab--active { background:var(--pl-accent-bg) !important; color:var(--pl-accent-fg) !important; font-weight:900 !important; border:1.5px solid var(--pl-ink) !important; box-shadow: var(--pl-plate-shadow-sm) !important; }
.exercise-metric-tab--active:active { transform: translate(2px, 2px) !important; box-shadow: 1px 1px 0 var(--pl-plate-shadow-color) !important; }

/* Exercise progress: date cell with PR trophy aligned to baseline */
.exercise-progress-date { display:inline-flex; align-items:center; gap:6px; min-width:0; }
.exercise-progress-date__text { line-height:1; }
.exercise-progress-date__pr { display:inline-flex; align-items:center; justify-content:center; width:20px; height:20px; flex-shrink:0; border-radius:var(--radius); background:color-mix(in srgb, var(--pl-yellow) 18%, transparent); border:1px solid color-mix(in srgb, var(--pl-yellow) 55%, var(--pl-hairline)); }
.exercise-progress-date__pr-icon.mud-icon-root { font-size:14px !important; width:14px !important; height:14px !important; color:var(--pl-warn-text) !important; fill:var(--pl-warn-text) !important; line-height:1 !important; }
html[data-theme-mode="dark"] .exercise-progress-date__pr { background:color-mix(in srgb, var(--pl-yellow) 14%, transparent); border-color:color-mix(in srgb, var(--pl-yellow) 40%, transparent); }
html[data-theme-mode="dark"] .exercise-progress-date__pr-icon.mud-icon-root { color:var(--pl-yellow) !important; fill:var(--pl-yellow) !important; }
.infinite-table-row--pr { border-left:3px solid var(--pl-yellow) !important; background:color-mix(in srgb, var(--pl-yellow) 6%, var(--pl-chip-2)) !important; }

/* Exercise progress chart: tighter padding so dots never sit on top edge and labels have air on mobile */
.exercise-progress-chart { overflow:hidden !important; }
.exercise-progress-chart__plot { padding:6px 6px 2px 2px; box-sizing:border-box; min-width:0; overflow:hidden; }
.exercise-progress-chart__plot .mud-chart { overflow:visible !important; }
.exercise-progress-chart__plot svg { overflow:visible !important; }
@media (max-width:600px) {
  .exercise-progress-controls { gap:8px; }
  .exercise-progress-picker, .exercise-progress-range { min-width:0; flex-basis:100%; }
  .exercise-metric-tabs { gap:3px; padding:2px; }
  .exercise-metric-tab { height:34px; font-size:0.625rem; padding:0 8px; }
  .exercise-progress-chart__plot { padding:4px 4px 8px 0; }
  .infinite-table-head, .infinite-table-row { font-size:0.875rem !important; }
  .exercise-progress-date__pr { width:18px; height:18px; }
  .exercise-progress-date__pr-icon.mud-icon-root { font-size:13px !important; width:13px !important; height:13px !important; }
}

/* Infinite Table List. One compact density shared by the session sets table,
   bodyweight entries, and exercise progression rows, sized for phones first. */
.infinite-table-list { display:flex; flex-direction:column; width:100%; }
.infinite-table-head, .infinite-table-row { display:grid; align-items:center; gap:6px; box-sizing:border-box; }
.infinite-table-head--3, .infinite-table-row--3 { grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) 36px; }
.infinite-table-head--4, .infinite-table-row--4 { grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,0.8fr) 36px; }
.infinite-table-head--5, .infinite-table-row--5 { grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,1fr) minmax(0,0.8fr) 36px; }
.infinite-table-head {
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 800 !important;
  line-height: 1.3;
  letter-spacing: 0.1em !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  background: var(--pl-chip-2) !important;
  border-bottom: 1.5px solid var(--hairline-strong) !important;
  padding: 10px 12px !important;
  user-select: none;
}
.infinite-table-row {
  font-family: var(--font-display) !important;
  font-size: 0.9375rem !important;
  line-height: 1.4;
  font-weight: 700 !important;
  font-variant-numeric: tabular-nums;
  border-bottom: 1px solid var(--pl-grid-line) !important;
  padding: 10px 12px !important;
  transition: background 120ms ease;
  color: var(--pl-ink) !important;
}
.infinite-table-row:hover {
  background: color-mix(in srgb, var(--pl-yellow) 10%, var(--pl-chip-2)) !important;
}
.infinite-table-row:nth-child(odd) {
  background: var(--pl-chip-2) !important;
}
.infinite-table-row:last-child { border-bottom:none; }
/* Value columns align right for scanning; the first cell holds the label or date */
.infinite-table-head > span:not(:first-child):not(.infinite-table-head__action),
.infinite-table-row > span:not(:first-child):not(.infinite-table-row__action) { text-align:right; font-weight:600; }
.infinite-table-row > span:not(:first-child):not(.infinite-table-row__action) { white-space:nowrap; }
.infinite-table-head__action, .infinite-table-row__action { display:flex; align-items:center; justify-content:flex-end; gap:4px; }
/* Row action controls stay small so the rows themselves stay slim. */
.infinite-table-row__action .mud-icon-button,
.bodyweight-table__menu.mud-menu .mud-icon-button { width:32px !important; height:32px !important; min-width:32px !important; min-height:32px !important; border-radius:var(--radius) !important; }
@media (max-width:360px) {
  .infinite-table-head, .infinite-table-row { gap:4px; padding-left:8px; padding-right:8px; }
}

/* Progress Exercise Grid */
.progress-exercise-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(140px, 1fr)); gap:8px; margin-top:8px; }
.progress-exercise-card { display:flex; align-items:center; justify-content:space-between; gap:6px; padding:10px 12px; min-height:44px; border:var(--hairline); border-radius:var(--radius); background:var(--pl-chip-2); color:var(--pl-ink); cursor:pointer; text-align:left; transition:all 120ms ease; }
.progress-exercise-card:hover { background:var(--pl-chip); border-color:var(--pl-ink); }
.progress-exercise-card__name { font-family:var(--font-body); font-size:0.875rem; font-weight:600; line-height:1.2; }
.progress-exercise-card__chevron { color:var(--pl-stone); flex-shrink:0; }

/* MudBlazor Popovers and Dropdowns in Dialogs */
.mud-dialog-container { z-index:1400 !important; }
.mud-popover-provider { z-index:2000 !important; }
.mud-popover.mud-popover-open {
  z-index:2100 !important;
  border:1.5px solid var(--pl-ink-border) !important;
  border-radius:var(--radius) !important;
  background:var(--pl-chip) !important;
}
.mud-popover .mud-list { background:var(--pl-chip) !important; padding:4px 0 !important; }
.mud-popover .mud-list-item { font-family:var(--font-mono) !important; font-size:0.875rem !important; font-weight:600 !important; color:var(--pl-ink) !important; min-height:40px !important; }
html[data-theme-mode="dark"] .mud-popover .mud-list-item { color:var(--pl-ink) !important; }
.completed-icon { border-radius:0px !important; }
.completed-icon .mud-icon-root { font-size:20px !important; }

.app-splash { background:#0E0F17 !important; color:#C0CAF5 !important; font-family:var(--font-body) !important; }
html[data-theme-mode="light"] .app-splash { background: var(--pl-paper) !important; color: var(--pl-ink) !important; }
.mud-dialog.ai-chat-dialog { border:var(--hairline-strong) !important; border-radius:var(--radius) !important; }
.share-card { border:var(--hairline) !important; border-radius:var(--radius) !important; background:var(--pl-chip) !important; overflow:hidden; position:relative; }
.mud-paper:has(.empty-state) { border:var(--hairline) !important; background:var(--pl-chip) !important; }
/* Reduced motion: no transforms anywhere; state changes keep a plain opacity
   fade (DESIGN.md motion contract) instead of a global animation kill.
   Rest pulse is also disabled here. */
@media (prefers-reduced-motion:reduce) {
  *, ::before, ::after { animation:none !important; transition-property:opacity, background-color, border-color, color !important; transition-duration:150ms !important; scroll-behavior:auto !important; }
  :active { transform: none !important; }
  .rest-timer-digits--urgent { animation:none !important; }
}
@media (prefers-contrast:more) { .app-nav-tab--active, .mud-button-filled-primary, .stat-card.mud-paper, .history-session-card { border-width:2px !important; } }
/* Desktop status rail: retired. The bottom pill is the chrome at every width,
   centered, so big screens keep the same thumb-first navigation. */
.app-rail { display:none; }

/* Big-screen GitHub button: a plain button in the page header, title left and
   source link right. Hidden on phones so the title keeps the full row.
   Same plate language as the header back button: chip surface,
   hairline-strong edge, zero radius, hard offset shadow, mono stamp text. */
.app-github-link { display:none; }
@media (min-width:960px) {
  .page-header__actions .app-github-link {
    display:inline-flex;
    align-items:center;
    gap:8px;
    min-height:44px;
    padding:0 12px;
    background:var(--pl-chip-2);
    border:1.5px solid var(--pl-hairline-strong);
    border-radius:var(--radius);
    box-shadow:var(--pl-plate-shadow-sm);
    color:var(--pl-ink);
    font-family:var(--font-mono);
    font-size:0.6875rem;
    font-weight:800;
    letter-spacing:0.12em;
    text-transform:uppercase;
    text-decoration:none;
    transition:transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease;
    touch-action:manipulation;
  }
  .page-header__actions .app-github-link:hover {
    background:var(--pl-chip);
    border-color:var(--pl-yellow);
  }
  .page-header__actions .app-github-link:active {
    transform:translate(2px, 2px);
    box-shadow:none;
  }
  .page-header__actions .app-github-link:focus-visible {
    outline:2px solid var(--pl-focus);
    outline-offset:2px;
  }
  .app-github-link__mark {
    width:18px;
    height:18px;
    flex-shrink:0;
    fill:currentColor;
  }
  .app-github-link__label {
    line-height:1;
  }
  .app-github-link__external.mud-icon-root {
    font-size:16px !important;
    width:16px !important;
    height:16px !important;
    color:var(--pl-stone);
  }
  .page-header__actions .app-github-link:hover .app-github-link__external.mud-icon-root {
    color:var(--pl-ink);
  }
}
@media (min-width:960px) and (prefers-contrast:more) {
  .page-header__actions .app-github-link {
    border-width:2px;
    box-shadow:none;
  }
}
@media (min-width:960px) and (prefers-reduced-motion:reduce) {
  .page-header__actions .app-github-link {
    transition-property:opacity, background-color, border-color, color;
    transition-duration:150ms;
  }
  .page-header__actions .app-github-link:active {
    transform:none;
  }
}

/* FABs stay put: scroll-linked hiding made them vanish at random moments,
   so every floating action is always on screen and tappable. */

/* Heatmap legend keys are drawn shapes, never font glyphs. */
.heatmap-legend { display:flex; flex-wrap:wrap; align-items:center; column-gap:12px; row-gap:4px; }
.hm-key { display:inline-flex; align-items:center; gap:5px; }
.hm-glyph { display:inline-block; width:10px; height:10px; flex-shrink:0; border-radius:var(--radius); }
.hm-glyph--today { border-radius:50%; border:2px solid var(--pl-volt-fill); background:transparent; box-shadow:0 0 0 1px var(--pl-paper); }
.hm-glyph--scheduled { border:1.5px dashed var(--pl-stone-2); background:var(--pl-paper-2); }
.hm-glyph--missed { border:1.5px solid var(--pl-stone-2); background:repeating-linear-gradient(-45deg, transparent 0 2px, color-mix(in srgb, var(--pl-stone-2) 20%, transparent) 2px 6px); }

.mono-token { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:var(--pl-stone); }

/* AI empty-state heading: same voice as the plate headers. */
.ai-chat-empty__title { font-family:var(--font-display) !important; font-size:18px !important; font-weight:800 !important; letter-spacing:0.02em !important; text-transform:uppercase !important; color:var(--pl-ink) !important; }

/* The one authored motion moment (DESIGN.md): a 120ms split-flap tick.
   Applied to numeric values whose element is re-keyed on change so the
   animation replays exactly when the number flips. */
@keyframes flap-tick {
  0% { transform:scaleY(1); opacity:1; }
  35% { transform:scaleY(0.66) translateY(2px); opacity:0.5; }
  70% { transform:scaleY(1.08); opacity:1; }
  100% { transform:scaleY(1); opacity:1; }
}
.flap-tick { display:inline-block; animation:flap-tick 120ms cubic-bezier(.19,1,.22,1) both; }

/* Skip link: first tab stop on every page. Standard visually-hidden clip
   pattern: the 1x1 box stays in-viewport so Chromium keeps it in sequential
   focus (opacity:0 and off-screen positioning both get skipped). */
.skip-link { position:fixed; left:8px; top:8px; z-index:3000; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; padding:10px 16px; background:var(--pl-chip); color:var(--pl-ink); border:var(--hairline-strong); border-radius:var(--radius); font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase; text-decoration:none; }
.skip-link:focus { width:auto; height:auto; clip-path:none; }
.hairline { height:1px; background:var(--pl-hairline); border:none; margin:12px 0; }
.dot-matrix { background-image:radial-gradient(circle, var(--pl-dot) 1px, transparent 1.25px); background-size:8px 8px; }
/* PageHeader title sizing lives in PageHeader.razor.css (22px display role,
   +0.02em tracking per DESIGN.md). No global override here on purpose. */
.mud-paper, .mud-card, .mud-dialog, .mud-snackbar, .mud-chip, .mud-button-root, .mud-input-outlined-border { border-radius:var(--radius) !important; }
.mud-button-root:focus-visible, .mud-icon-button:focus-visible { outline:2px solid var(--pl-ink) !important; outline-offset:2px !important; }
html[data-theme-mode="dark"] .mud-button-root:focus-visible { outline-color:var(--pl-focus) !important; }
/* content-visibility removed: it deferred paint of plate shadows on scroll, making box shadows appear delayed */
.visually-hidden { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }
.sr-only { position:absolute !important; width:1px !important; height:1px !important; padding:0 !important; margin:-1px !important; overflow:hidden !important; clip:rect(0,0,0,0) !important; white-space:nowrap !important; border:0 !important; }

/* Universal Departure Mono typography: cyberpunk brutalist field computer */
html, body, #app, button, input, select, textarea, .mud-typography, .mud-button-root, .mud-input-root, .mud-chip, .mud-card, .mud-paper {
  font-family: 'Departure Mono', 'JetBrains Mono', ui-monospace, monospace !important;
}

html body div.rest-timer-digits,
html body div.rest-timer-digits span.rest-timer-unit,
html body span.rest-timer-complete-title {
  font-family: 'Departure Mono', 'JetBrains Mono', monospace !important;
}

/* AI chat markdown uses a proportional stack for readability.
   Timer and stat values stay mono per DESIGN.md. Code stays mono. */
.ai-msg--assistant .markdown-body,
.ai-msg--assistant .ai-msg__content {
  font-family: 'Inter', system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  font-variant-numeric: tabular-nums lining-nums;
  letter-spacing: normal !important;
  text-transform: none !important;
}
.ai-msg--assistant .markdown-body code,
.ai-msg--assistant .markdown-body pre,
.ai-msg--assistant .markdown-body pre *,
.ai-msg--assistant .markdown-body code * {
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
}
.markdown-body pre,
.markdown-body code {
  font-family: 'JetBrains Mono', ui-monospace, monospace !important;
}
.ai-msg--assistant .markdown-body p { margin: 0 0 8px !important; line-height: 1.6 !important; }
.ai-msg--assistant .markdown-body p:last-child { margin-bottom: 0 !important; }
.ai-msg--assistant .markdown-body ul,
.ai-msg--assistant .markdown-body ol { margin: 8px 0 !important; padding-left: 20px !important; line-height: 1.6 !important; }
.ai-msg--assistant .markdown-body li { margin: 4px 0 !important; }
.ai-msg--assistant .markdown-body h1,
.ai-msg--assistant .markdown-body h2,
.ai-msg--assistant .markdown-body h3,
.ai-msg--assistant .markdown-body h4 { font-family: 'Inter', system-ui, sans-serif !important; line-height: 1.35 !important; letter-spacing: -0.01em !important; text-transform: none !important; }
.ai-msg--assistant .markdown-body blockquote { border-left: 3px solid var(--pl-hairline-strong) !important; margin: 8px 0 !important; padding: 6px 12px !important; color: var(--pl-stone) !important; }
.ai-msg--assistant .markdown-body a { text-decoration: underline !important; }

/* AI Assistant Full Page Layout & Components */
.ai-page-wrapper {
  display: flex;
  flex-direction: column;
  min-height: calc(100dvh - 120px);
  gap: 12px;
  position: relative;
  padding-bottom: 32px;
}
.ai-page-header {
  margin-bottom: 0 !important;
}
.ai-chat-messages {
  flex: 0 1 auto;
  min-height: 0;
  max-height: calc(100dvh - 280px);
  overflow-y: auto;
  padding: 14px;
  border: 1.5px solid var(--hairline-strong);
  border-radius: var(--radius);
  background: var(--pl-chip);
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.ai-chat-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  min-height: 240px;
  padding: 32px 16px;
}
.ai-chat-empty__icon-plate {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 64px;
  height: 64px;
  border-radius: var(--radius);
  background: var(--pl-chip-2);
  border: 1.5px solid var(--hairline-strong);
}
.ai-msg {
  display: flex;
  flex-direction: column;
  gap: 4px;
  max-width: 90%;
}
.ai-msg--user {
  align-self: flex-end;
  align-items: flex-end;
}
.ai-msg--user .ai-msg__bubble {
  background: var(--pl-volt-fill);
  color: var(--pl-volt-fg);
  border: 1.5px solid var(--pl-volt-edge);
  border-radius: var(--radius);
  padding: 10px 14px;
  font-weight: 600;
  line-height: 1.4;
}
.ai-msg--assistant {
  align-self: flex-start;
  align-items: flex-start;
  display: flex;
  flex-direction: row;
  gap: 10px;
  max-width: 96%;
}
.ai-msg__avatar {
  width: 32px;
  height: 32px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #1A1B26;
  border: 1.5px solid #1A1B26;
  border-radius: var(--radius);
  color: var(--pl-volt-fill);
  flex-shrink: 0;
  box-shadow: var(--pl-plate-shadow-sm);
}
.ai-msg__avatar .mud-icon-root {
  color: var(--pl-volt-fill) !important;
  fill: var(--pl-volt-fill) !important;
}
.ai-msg__body {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
  min-width: 0;
}
.ai-msg__actions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 4px;
  padding: 0 2px;
  flex-wrap: wrap;
}
.ai-msg__time {
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  color: var(--pl-stone);
  white-space: nowrap;
  line-height: 1;
}
.ai-msg__copy.mud-icon-button {
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  min-height: 32px !important;
  flex-shrink: 0 !important;
  box-shadow: none !important;
  border: 1px solid var(--pl-hairline) !important;
  background: var(--pl-chip) !important;
}
.ai-msg__copy.mud-icon-button .mud-icon-root {
  font-size: 16px !important;
  width: 16px !important;
  height: 16px !important;
}
.ai-msg--assistant .ai-msg__bubble {
  background: var(--pl-chip-2);
  color: var(--pl-ink);
  border: 1.5px solid var(--hairline-strong);
  border-radius: var(--radius);
  padding: 12px 16px;
  line-height: 1.5;
  overflow-wrap: break-word;
}
.ai-chat-quick-actions {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
@media (min-width: 540px) {
  .ai-chat-quick-actions {
    grid-template-columns: repeat(4, 1fr);
  }
}
.ai-quick-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 10px 12px;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border-radius: var(--radius);
  border: 1.5px solid var(--hairline-strong);
  background: var(--pl-chip);
  cursor: pointer;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms ease, background 120ms ease, border-color 120ms ease, color 120ms ease !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.ai-quick-btn:hover:not(:disabled) {
  transform: translateY(-1px);
  border-color: var(--pl-yellow);
}
.ai-quick-btn:active:not(:disabled) {
  transform: translate(1px, 1px);
}
/* One quiet chip for all quick prompts: the prompt text is the signal, not
   a four-color rainbow. Volt appears only on hover, as everywhere else. */
.ai-chat-input {
  position: sticky;
  bottom: 0;
  z-index: 10;
  background: var(--pl-chip);
  border: 1.5px solid var(--hairline-strong);
  border-radius: var(--radius);
  padding: 8px 10px;
}
.ai-chat-composer {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
}
.ai-chat-input__field {
  flex: 1;
  min-width: 0;
}
.ai-chat-send-button {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  background: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  border: 1.5px solid var(--pl-volt-edge) !important;
  border-radius: var(--radius) !important;
}
.ai-chat-send-button:hover {
  filter: brightness(1.1) !important;
}

.ai-bridge-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.ai-bridge-options {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  padding: 8px 0;
}
.ai-api-key-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  background: color-mix(in srgb, var(--pl-amber) 10%, var(--pl-chip));
  border: 1.5px solid var(--pl-yellow);
  border-radius: var(--radius);
}
.ai-api-key-banner__content {
  display: flex;
  align-items: center;
  gap: 10px;
}
.ai-banner-title {
  color: var(--pl-ink) !important;
}

/* Contrast Surface Plates for Section Titles */
.home-plans-header {
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  padding: 4px 0 8px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  margin-bottom: 8px !important;
}
.home-plans-header__title {
  display: inline-flex !important;
  align-items: center !important;
  padding: 5px 12px !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  font-family: var(--font-display) !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  letter-spacing: 0.05em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  margin: 0 !important;
}

#main-content:focus,
#main-content:focus-visible {
  outline: none !important;
}

/* Universal solid background for buttons and icon buttons */
.home-hero .mud-icon-button,
.home-hero__discard-btn,
.home-hero__discard {
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  border-radius: var(--radius) !important;
  color: var(--pl-error) !important;
  box-shadow: none !important;
}
.home-hero .mud-icon-button:hover,
.home-hero__discard-btn:hover,
.home-hero__discard:hover {
  background: color-mix(in srgb, var(--pl-error) 15%, var(--pl-chip-2)) !important;
  border-color: var(--pl-error) !important;
  color: var(--pl-error) !important;
}
.home-hero .mud-icon-button:hover .mud-icon-root,
.home-hero__discard:hover .mud-icon-root {
  color: var(--pl-error) !important;
  fill: var(--pl-error) !important;
}

.dialog-cancel-btn.mud-button-root {
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  color: var(--pl-ink) !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-mono) !important;
  font-weight: 700 !important;
  text-transform: uppercase !important;
}
.dialog-cancel-btn.mud-button-root:hover {
  background: var(--pl-chip) !important;
  border-color: var(--pl-yellow) !important;
}
.dialog-confirm-btn.mud-button-root {
  border-radius: var(--radius) !important;
  font-family: var(--font-mono) !important;
  font-weight: 800 !important;
  text-transform: uppercase !important;
  box-shadow: none !important;
}

/* AI Assistant Page, Tabs & Components */
.ai-page-wrapper {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
  box-sizing: border-box;
}
.ai-header-bar {
  display: flex;
  align-items: stretch;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
  padding-bottom: 8px;
  margin-bottom: 2px;
}
.ai-mode-tabs {
  display: flex !important;
  flex: 1 1 auto !important;
  width: 100% !important;
  max-width: 100% !important;
  align-items: stretch !important;
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  border-radius: var(--radius) !important;
  padding: 4px !important;
  gap: 6px !important;
  box-sizing: border-box !important;
}
.ai-mode-tab {
  display: inline-flex !important;
  flex: 1 1 0 !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 8px !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 16px !important;
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 700 !important;
  letter-spacing: 0.08em !important;
  text-transform: uppercase !important;
  border-radius: var(--radius) !important;
  border: 1px solid transparent !important;
  background: transparent !important;
  color: var(--pl-stone) !important;
  cursor: pointer !important;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, color 120ms ease, border-color 120ms ease !important;
  white-space: nowrap !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.ai-mode-tab:hover {
  background: var(--pl-chip) !important;
  color: var(--pl-ink) !important;
  border-color: var(--hairline-strong) !important;
}
.ai-mode-tab:active {
  transform: translate(1px, 1px);
}
.ai-mode-tab--active {
  background: var(--pl-yellow) !important;
  background-color: var(--pl-yellow) !important;
  color: var(--pl-volt-fg) !important;
  border-color: var(--pl-ink) !important;
  font-weight: 900 !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
}
.ai-mode-tab--active:active {
  transform: translate(2px, 2px) !important;
  box-shadow: none !important;
}
.ai-mode-tab--active .mud-icon-root {
  color: var(--pl-volt-fg) !important;
  fill: var(--pl-volt-fg) !important;
}
.ai-clear-btn {
  align-self: stretch;
  height: auto !important;
  min-height: 44px !important;
  padding: 0 16px !important;
  border-radius: var(--radius) !important;
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  color: var(--pl-ink) !important;
  font-size: 0.6875rem !important;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease, color 120ms ease !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.ai-clear-btn .mud-icon-root {
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
}
.ai-clear-btn:hover {
  background: var(--pl-chip) !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-ink) !important;
}
.ai-clear-btn:active {
  transform: translate(2px, 2px);
  box-shadow: none !important;
}
.ai-chat-messages {
  flex: 0 1 auto;
  min-height: 0;
  max-height: 60vh;
  overflow-y: auto;
  padding: 14px 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  border-radius: var(--radius);
  box-sizing: border-box;
}
.ai-chat-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 200px;
  text-align: center;
  padding: 24px 16px;
  gap: 12px;
}
.ai-chat-empty__icon-plate {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 56px;
  height: 56px;
  border-radius: var(--radius);
  background: var(--pl-volt-fill);
  border: 1.5px solid var(--pl-volt-edge);
  color: var(--pl-volt-fg);
  box-shadow: var(--pl-plate-shadow-sm);
}
.ai-chat-empty__icon-plate .mud-icon-root {
  color: var(--pl-volt-fg) !important;
  fill: var(--pl-volt-fg) !important;
  font-size: 28px !important;
  width: 28px !important;
  height: 28px !important;
}
.ai-chat-empty__title {
  font-family: var(--font-display);
  font-size: 1.125rem;
  font-weight: 900;
  letter-spacing: 0.02em;
  text-transform: uppercase;
  color: var(--pl-ink);
}
.ai-chat-empty__desc {
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  color: var(--pl-stone);
  max-width: 320px;
  line-height: 1.5;
}
.ai-chat-quick-actions {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 8px;
  padding: 8px 0;
  width: 100%;
}
.ai-chat-offline-hint {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px 16px;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  border-radius: var(--radius) !important;
  box-sizing: border-box;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  overflow: visible !important;
  margin: 0 3px 8px 0;
}
.ai-chat-view { overflow: visible !important; }
.ai-chat-messages { overflow-y: auto; overflow-x: visible; padding-right: 8px; }
.ai-chat-offline-hint .mud-typography {
  color: var(--pl-ink) !important;
  font-size: 14px !important;
  line-height: 1.4 !important;
  flex: 1 1 auto;
  min-width: 0;
}
.ai-chat-offline-hint .mud-button-root {
  flex-shrink: 0;
  white-space: nowrap;
}
.ai-chat-input {
  display: flex;
  align-items: center;
  width: 100%;
  padding-top: 8px;
}
.ai-chat-composer {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 6px 8px 6px 14px;
  border-radius: var(--radius);
  background: var(--pl-chip-2);
  border: 1.5px solid var(--hairline-strong);
  box-sizing: border-box;
  min-height: 48px;
}
.ai-chat-composer:focus-within {
  border-color: var(--pl-yellow);
  background: var(--pl-chip);
}
.ai-chat-input__field {
  flex: 1;
  min-width: 0;
}
.ai-chat-send-button {
  height: 40px !important;
  min-width: 40px !important;
  width: 40px !important;
  border-radius: var(--radius) !important;
  flex-shrink: 0;
  background: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  border: 1.5px solid var(--pl-volt-edge) !important;
}
html[data-theme-mode="dark"] .ai-chat-send-button:disabled,
html[data-theme-mode="dark"] .ai-chat-send-button.mud-button-filled-disabled,
html[data-theme-mode="dark"] .ai-chat-send-button[disabled] {
  background: var(--pl-chip-2) !important;
  color: var(--pl-stone) !important;
  border-color: var(--pl-hairline-strong) !important;
  opacity: 0.65 !important;
}
html[data-theme-mode="dark"] .ai-chat-send-button:disabled .mud-icon-root,
html[data-theme-mode="dark"] .ai-chat-send-button.mud-button-filled-disabled .mud-icon-root,
html[data-theme-mode="dark"] .ai-chat-send-button[disabled] .mud-icon-root {
  color: var(--pl-stone) !important;
  fill: var(--pl-stone) !important;
  opacity: 1 !important;
}
html[data-theme-mode="dark"] .log-set-btn:disabled,
html[data-theme-mode="dark"] .bodyweight-log-row__log-btn:disabled,
html[data-theme-mode="dark"] .plan-card-icon-btn.plan-card__start:disabled,
html[data-theme-mode="dark"] .home-hero__continue.mud-button-root:disabled,
html[data-theme-mode="dark"] .ai-quick-btn:disabled {
  background: var(--pl-chip-2) !important;
  color: var(--pl-stone) !important;
  border-color: var(--pl-hairline-strong) !important;
  opacity: 0.65 !important;
}
html[data-theme-mode="dark"] .log-set-btn:disabled .mud-icon-root,
html[data-theme-mode="dark"] .bodyweight-log-row__log-btn:disabled .mud-icon-root,
html[data-theme-mode="dark"] .ai-quick-btn:disabled {
  color: var(--pl-stone) !important;
  fill: var(--pl-stone) !important;
}
.ai-bridge-container {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
}
.ai-bridge-card {
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  padding: 16px;
  border-radius: var(--radius);
}
.ai-bridge-card__header {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 12px;
}
.ai-bridge-step-badge {
  width: 28px;
  height: 28px;
  border-radius: var(--radius);
  background: var(--pl-volt-fill);
  color: var(--pl-volt-fg);
  font-family: var(--font-mono);
  font-weight: 800;
  font-size: 0.6875rem;
  display: grid;
  place-items: center;
  flex-shrink: 0;
}
.ai-bridge-step-badge .mud-icon-root {
  color: var(--pl-volt-fg) !important;
  fill: var(--pl-volt-fg) !important;
}
.ai-bridge-prompt-preview {
  max-height: 180px;
  overflow-y: auto;
  background: var(--pl-paper);
  border: 1.5px solid var(--hairline-strong);
  border-radius: var(--radius);
  padding: 10px 12px;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  line-height: 1.5;
  white-space: pre-wrap;
  word-break: break-word;
  color: var(--pl-ink);
}

.ai-bridge-wizard {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  width: 100%;
}
.ai-bridge-step {
  flex: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 8px 12px;
  border: 1.5px solid var(--pl-hairline);
  background: var(--pl-chip);
  font-family: 'Departure Mono', 'JetBrains Mono', ui-monospace, monospace;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--pl-ink);
  border-radius: 0;
  cursor: pointer;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms ease, background 120ms ease, border-color 120ms ease, color 120ms ease;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.ai-bridge-step:active:not(:disabled) {
  transform: translate(1px, 1px);
}
.ai-bridge-step.active:active {
  box-shadow: none;
}
.ai-bridge-step.active {
  background: var(--pl-volt-fill);
  color: var(--pl-volt-fg);
  border-color: var(--pl-ink);
  box-shadow: var(--pl-plate-shadow-sm);
}
.ai-bridge-step:disabled {
  opacity: 0.5;
  cursor: not-allowed;
}
.ai-bridge-step-line {
  flex: 0 0 24px;
  height: 2px;
  background: var(--pl-hairline);
  display: block;
}
.ai-bridge-diff {
  margin-top: 8px;
  padding: 8px;
  background: var(--pl-chip-2);
  border: 1px solid var(--pl-hairline);
  border-radius: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.ai-bridge-diff__row {
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ai-bridge-diff__label {
  font-family: 'Departure Mono', monospace;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  padding: 2px 6px;
  border-radius: 0;
  width: fit-content;
}
.ai-bridge-diff__added {
  color: #15803d;
}
html[data-theme-mode="dark"] .ai-bridge-diff__added {
  color: #22c55e;
}
.ai-bridge-diff__removed {
  color: #991b1b;
}
html[data-theme-mode="dark"] .ai-bridge-diff__removed {
  color: #ef4444;
}
.ai-bridge-diff__modified {
  color: #854d0e;
}
html[data-theme-mode="dark"] .ai-bridge-diff__modified {
  color: #eab308;
}
.ai-bridge-diff__list {
  margin: 0;
  padding-left: 16px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  font-family: 'Departure Mono', monospace;
  font-size: 11px;
  line-height: 1.4;
  color: var(--pl-ink);
}
.ai-bridge-diff__list li {
  word-break: break-word;
}
.ai-bridge-empty {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  background: var(--pl-chip-2);
  border: 1px solid var(--pl-hairline);
  border-radius: 0;
}
.ai-bridge-results {
  background: var(--pl-chip-2);
  border: 1px solid var(--pl-hairline);
  border-radius: 0;
  padding: 10px 12px;
}
.ai-bridge-result-item {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 0;
  border-bottom: 1px solid var(--pl-hairline);
}
.ai-bridge-result-item:last-child {
  border-bottom: none;
}
.ai-bridge-result-item--success {
  color: var(--pl-success, #15803d);
}
.ai-bridge-result-item--error {
  color: var(--pl-danger, #991b1b);
}

/* AI Bridge Action Summary Banner */
.ai-bridge-summary {
  background: var(--pl-chip-2);
  border: 1.5px solid var(--pl-hairline-strong);
  border-radius: var(--radius);
  padding: 14px;
  box-shadow: var(--pl-plate-shadow-sm);
  display: flex;
  flex-direction: column;
  gap: 10px;
}
html[data-theme-mode="light"] .ai-bridge-summary {
  background: var(--pl-chip-2) !important;
  border: 2px solid #10111A !important;
  box-shadow: 3px 3px 0 #10111A !important;
}
.ai-bridge-summary__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}
.ai-bridge-summary__title-wrap {
  display: flex;
  flex-direction: column;
  gap: 2px;
}
.ai-bridge-summary__badge {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--pl-yellow-text);
}
html[data-theme-mode="dark"] .ai-bridge-summary__badge {
  color: var(--pl-yellow);
}
.ai-bridge-summary__title {
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 900;
  letter-spacing: 0.04em;
  color: var(--pl-ink);
  margin: 0;
  line-height: 1.1;
}
.ai-bridge-summary__status-chips {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.ai-bridge-stat-chip {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 3px 8px;
  border-radius: var(--radius);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 800;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.ai-bridge-stat-chip .mud-icon-root {
  font-size: 14px !important;
  width: 14px !important;
  height: 14px !important;
}
.ai-bridge-stat-chip--ready {
  background: rgba(34, 197, 94, 0.15);
  border: 1.5px solid var(--pl-success);
  color: var(--pl-success);
}
html[data-theme-mode="light"] .ai-bridge-stat-chip--ready {
  color: #15803d !important;
  background: rgba(34, 197, 94, 0.22) !important;
  border: 1.5px solid #15803d !important;
}
.ai-bridge-stat-chip--warn {
  background: rgba(234, 179, 8, 0.15);
  border: 1.5px solid var(--pl-warning, #eab308);
  color: var(--pl-warning, #eab308);
}
html[data-theme-mode="light"] .ai-bridge-stat-chip--warn {
  color: #854d0e !important;
  background: rgba(234, 179, 8, 0.22) !important;
  border: 1.5px solid #854d0e !important;
}
.ai-bridge-stat-chip--err {
  background: rgba(239, 68, 68, 0.15);
  border: 1.5px solid var(--pl-danger);
  color: var(--pl-danger);
}
html[data-theme-mode="light"] .ai-bridge-stat-chip--err {
  color: #991b1b !important;
  background: rgba(239, 68, 68, 0.22) !important;
  border: 1.5px solid #991b1b !important;
}
.ai-bridge-summary__tools {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  padding-top: 8px;
  border-top: 1px dashed var(--pl-hairline-strong);
}
.ai-bridge-tool-badge {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 3px 8px;
  background: var(--pl-chip);
  border: 1px solid var(--pl-hairline-strong);
  border-radius: var(--radius);
  font-family: var(--font-mono);
  font-size: 11px;
  color: var(--pl-ink);
}
.ai-bridge-tool-badge strong {
  color: var(--pl-yellow-text);
}
html[data-theme-mode="dark"] .ai-bridge-tool-badge strong {
  color: var(--pl-yellow);
}

/* AI Bridge Action Card Layout */
.ai-bridge-actions-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.ai-bridge-action-card {
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline-strong);
  border-radius: var(--radius);
  overflow: hidden;
  box-shadow: var(--pl-plate-shadow-sm);
  display: flex;
  flex-direction: column;
}
html[data-theme-mode="light"] .ai-bridge-action-card {
  border: 2px solid #10111A !important;
  box-shadow: 3px 3px 0 #10111A !important;
}
.ai-bridge-action-card--valid {
  border-left: 5px solid var(--pl-success) !important;
}
.ai-bridge-action-card--warn {
  border-left: 5px solid var(--pl-warning, #eab308) !important;
}
.ai-bridge-action-card--invalid {
  border-left: 5px solid var(--pl-danger) !important;
  opacity: 0.92;
}
.ai-bridge-action-card__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 12px;
  background: var(--pl-chip-2);
  border-bottom: 1px solid var(--pl-hairline-strong);
}
.ai-bridge-action-card__head-left {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.ai-bridge-action-card__tag {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  color: var(--pl-purple-text);
  background: var(--pl-chip);
  padding: 2px 6px;
  border: 1px solid var(--pl-hairline-strong);
}
html[data-theme-mode="dark"] .ai-bridge-action-card__tag {
  color: var(--pl-purple);
}
.ai-bridge-action-card__tool {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--pl-ink);
}
.ai-bridge-action-card__pill {
  display: inline-flex;
  align-items: center;
  height: 20px;
  padding: 0 6px;
  border-radius: var(--radius);
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.06em;
}
.ai-bridge-action-card__pill--ok {
  background: rgba(34, 197, 94, 0.15);
  color: var(--pl-success);
  border: 1px solid var(--pl-success);
}
html[data-theme-mode="light"] .ai-bridge-action-card__pill--ok {
  color: #15803d !important;
  border-color: #15803d !important;
}
.ai-bridge-action-card__pill--warn {
  background: rgba(234, 179, 8, 0.15);
  color: var(--pl-warning, #eab308);
  border: 1px solid var(--pl-warning, #eab308);
}
html[data-theme-mode="light"] .ai-bridge-action-card__pill--warn {
  color: #854d0e !important;
  border-color: #854d0e !important;
}
.ai-bridge-action-card__pill--err {
  background: rgba(239, 68, 68, 0.15);
  color: var(--pl-danger);
  border: 1px solid var(--pl-danger);
}
html[data-theme-mode="light"] .ai-bridge-action-card__pill--err {
  color: #991b1b !important;
  border-color: #991b1b !important;
}
.ai-bridge-action-card__body {
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.ai-bridge-action-card__title {
  font-family: var(--font-sans);
  font-size: 14px;
  font-weight: 800;
  color: var(--pl-ink);
  margin: 0;
  line-height: 1.35;
}
.ai-bridge-action-card__desc {
  font-size: 12px;
  color: var(--pl-stone);
  margin: 0;
  line-height: 1.45;
}
.ai-bridge-action-card__error-callout {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 6px;
  padding: 6px 10px;
  background: rgba(239, 68, 68, 0.12);
  border: 1px solid var(--pl-danger);
  border-radius: var(--radius);
  color: var(--pl-danger);
  font-size: 12px;
  font-weight: 700;
}
html[data-theme-mode="light"] .ai-bridge-action-card__error-callout {
  color: #991b1b !important;
  border-color: #991b1b !important;
}
.ai-bridge-action-card__details {
  border-top: 1px dashed var(--pl-hairline-strong);
  background: var(--pl-paper);
}
.ai-bridge-action-card__summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 7px 12px;
  cursor: pointer;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  color: var(--pl-stone);
  user-select: none;
}
.ai-bridge-action-card__summary:hover {
  color: var(--pl-ink);
}
.ai-bridge-action-card__code {
  margin: 0;
  padding: 8px 12px;
  font-family: var(--font-mono);
  font-size: 11px;
  line-height: 1.45;
  color: var(--pl-ink);
  background: var(--pl-chip-2);
  overflow-x: auto;
  max-height: 160px;
}


/* ==================================================================
   PLATE DEPTH PASS, August 2026.
   Print-registration depth joins the system. Plates cast HARD offset
   shadows with zero blur, matching the Sharp-Edges Rule. Blurred
   shadows and glows stay banned. New devices:
   - Plate shadows: sm 2px, md 3px, lg 6px, solid ink or void.
   - Machined bevel: 1px inset top highlight on raised plates.
   - Volt fill token: large-area fills only, always under ink text.
   - Shader washes: aurora grounds, CRT scanlines on the timer and
     splash, hazard stripe march on the urgent timer track, and an
     off-register ink split on the timer digits.
   - Press physics: volt CTAs translate into their shadow on press.
   ================================================================== */
:root {
  --pl-plate-shadow-color: #1B1E33; /* deep ink plate shadow for paper */
  --pl-plate-shadow-sm: 4px 4px 0 var(--pl-plate-shadow-color);
  --pl-plate-shadow-md: 6px 6px 0 var(--pl-plate-shadow-color);
  --pl-plate-shadow-lg: 10px 10px 0 var(--pl-plate-shadow-color);
  --pl-bevel-highlight: rgba(255, 255, 255, 0.65);
  --pl-volt-fill: #FAFF00; /* volt fill in light too; ink text keeps 15:1 on it */
}
html[data-theme-mode="dark"] {
  --pl-plate-shadow-color: #1B1E33;
  --pl-plate-shadow-sm: 4px 4px 0 #1B1E33;
  --pl-plate-shadow-md: 6px 6px 0 #1B1E33;
  --pl-plate-shadow-lg: 10px 10px 0 #1B1E33;
  --pl-bevel-highlight: rgba(192, 202, 245, 0.07);
  --pl-volt-fill: #FAFF00;
}
/* System dark fallback before JS sets data-theme: shadows paint correctly on first frame */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme-mode="light"]) {
    --pl-plate-shadow-color: #1B1E33;
    --pl-plate-shadow-sm: 4px 4px 0 #1B1E33;
    --pl-plate-shadow-md: 6px 6px 0 #1B1E33;
    --pl-plate-shadow-lg: 10px 10px 0 #1B1E33;
    --pl-bevel-highlight: rgba(192, 202, 245, 0.07);
  }
}

/* Aurora grounds: one cool wash per theme under the 24px grid. Static, cheap,
   decorative only. */
html[data-theme-mode="dark"] .app-shell {
  background-image:
    radial-gradient(1000px 500px at 85% -8%, rgba(122, 162, 247, 0.08), transparent 62%),
    radial-gradient(800px 460px at 4% 108%, rgba(187, 154, 247, 0.06), transparent 62%),
    linear-gradient(to right, var(--pl-grid-line) 1px, transparent 1px),
    linear-gradient(to bottom, var(--pl-grid-line) 1px, transparent 1px);
}
html[data-theme-mode="dark"] .app-main-scroll {
  background: transparent;
}
html[data-theme-mode="light"] .app-shell {
  background-image:
    radial-gradient(820px 420px at 8% -6%, rgba(14, 116, 144, 0.07), transparent 58%),
    radial-gradient(1100px 520px at 50% -12%, rgba(255, 252, 235, 0.52), transparent 62%),
    radial-gradient(900px 520px at 98% 108%, rgba(124, 58, 237, 0.09), transparent 58%),
    radial-gradient(700px 400px at 18% 102%, rgba(250, 255, 0, 0.06), transparent 60%),
    linear-gradient(to right, var(--pl-grid-line) 1px, transparent 1px),
    linear-gradient(to bottom, var(--pl-grid-line) 1px, transparent 1px);
}
html[data-theme-mode="light"] .app-main-scroll {
  background: transparent;
}

/* Raised plates: cards, panels, toolbars. Bevel plus offset, never blur. */
.plate-card,
.stat-card.mud-paper,
.home-hero.mud-paper,
.plan-card.mud-card,
.history-session-card,
.bodyweight-panel.mud-paper,
.rest-timer-panel.mud-paper,
.workout-session-stats,
.exercise-progress-chart,
.bodyweight-chart-panel,
.history-heatmap-panel.mud-paper,
.home-heatmap-panel.mud-paper,
.activity-heatmap-card,
.settings-card.mud-paper,
.settings-panel.mud-expand-panel,
.plan-details-card,
.history-filter-bar,
.ai-chat-messages,
.ai-chat-input,
.ai-bridge-card {
  box-shadow: var(--pl-plate-shadow-md) !important;
}

/* Interactive plates: base cards are GPU-promoted for stable scrolling, hover lift only on devices that hover. */
.plan-card.mud-card,
.history-session-card,
.progress-exercise-card {
  transition: border-color 150ms ease, background 120ms ease;
  transform: translateZ(0);
  backface-visibility: hidden;
}
.plan-card.mud-card:hover,
.history-session-card:hover,
.progress-exercise-card:hover {
  border-color: var(--pl-yellow) !important;
}
@media (hover: hover) and (pointer: fine) {
  .plan-card.mud-card,
  .history-session-card,
  .progress-exercise-card {
    transition: transform 120ms ease, border-color 150ms ease, background 120ms ease;
    will-change: transform;
  }
  .plan-card.mud-card:hover,
  .history-session-card:hover,
  .progress-exercise-card:hover {
    transform: translate3d(-2px, -2px, 0);
    box-shadow: 7px 7px 0 var(--pl-plate-shadow-color) !important;
  }
}

/* Fused workout block: stats plate and timer read as one mounted unit, so the
   pair casts a single shadow from the parent instead of stacking two. */
.workout-top--with-timer .workout-session-stats,
.workout-top--with-timer .rest-timer-panel.mud-paper {
  box-shadow: none !important;
}
.workout-top--with-timer {
  box-shadow: var(--pl-plate-shadow-md);
}

/* Floating chrome casts the deepest shadow: pill, FABs, undo. */
.app-nav-pill__inner {
  box-shadow: var(--pl-plate-shadow-lg) !important;
}
.app-fab {
  box-shadow: var(--pl-plate-shadow-md) !important;
}
.app-fab:active {
  transform: translate(5px, 5px) !important;
  box-shadow: none !important;
}
.app-fab:disabled,
.app-fab--primary:disabled {
  box-shadow: none !important;
}
.workout-undo-fab {
  box-shadow: var(--pl-plate-shadow-md) !important;
  transition: opacity 150ms ease, transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.workout-undo-fab:active {
  transform: translate(5px, 5px) !important;
  box-shadow: none !important;
}

/* Volt CTA sheen: vertical fill ramp on the volt-fill token, mini plate
   shadow, and press physics that collapse the offset. Ink borders unchanged. */
.log-set-btn,
.home-hero__continue.mud-button-root,
.home-plans-new-btn.mud-button-root,
.plan-sheet-save-btn,
.plan-card-icon-btn.plan-card__start,
.bodyweight-log-row__log-btn,
.ai-chat-send-button,
.history-card-continue-btn,
.app-fab--primary,
.dialog-title-icon-box:not(.dialog-title-icon-box--error):not(.dialog-title-icon-box--warning):not(.dialog-title-icon-box--success) {
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pl-volt-fill) 80%, #FFFFFF) 0%,
    var(--pl-volt-fill) 52%,
    color-mix(in srgb, var(--pl-volt-fill) 86%, #000000) 100%
  ) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), filter 120ms ease !important;
}
.log-set-btn:active,
.home-hero__continue.mud-button-root:active,
.home-plans-new-btn.mud-button-root:active,
.plan-sheet-save-btn:active,
.plan-card-icon-btn.plan-card__start:active,
.bodyweight-log-row__log-btn:active,
.ai-chat-send-button:active,
.history-card-continue-btn:active {
  transform: translate(3px, 3px) !important;
  box-shadow: none !important;
}

/* Active segmented tabs share the volt sheen at tab scale. */
.ai-mode-tab--active {
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pl-volt-fill) 80%, #FFFFFF) 0%,
    var(--pl-volt-fill) 52%,
    color-mix(in srgb, var(--pl-volt-fill) 86%, #000000) 100%
  ) !important;
  box-shadow: var(--pl-plate-shadow-sm)!important;
}

/* Active states are volt, everywhere: nav tab, segmented tabs, schedule days,
   filter chips. One live color owns "you are here" in both themes. */
.app-nav-tab--active {
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pl-volt-fill) 82%, #FFFFFF) 0%,
    var(--pl-volt-fill) 100%
  ) !important;
  color: var(--pl-volt-fg) !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.4);
}
.settings-tab--active,
.settings-tab--active:hover:not(:active),
.exercise-metric-tab--active,
.settings-schedule-day[aria-pressed="true"],
.history-filter-chip--selected {
  background: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  border-color: var(--pl-volt-edge) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
}
.history-filter-chip--selected .history-filter-chip__label,
.history-filter-chip--selected .history-filter-chip__remove {
  color: var(--pl-volt-fg) !important;
}

/* Checked switch track picks up the same volt ramp. */
.mud-switch-span:has(.mud-checked) .mud-switch-track {
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pl-volt-fill) 80%, #FFFFFF) 0%,
    var(--pl-volt-fill) 100%
  ) !important;
  box-shadow: var(--pl-plate-shadow-sm);
}

/* Table heads: machined band instead of a flat well. */
.infinite-table-head,
.mud-table .mud-table-head .mud-table-cell {
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pl-chip-2) 55%, var(--pl-chip)) 0%,
    var(--pl-chip-2) 100%
  ) !important;
}

/* Overlays: dialogs deepest, snackbars and menus mid. Bevel plus hard offset,
   never blur. */
.mud-dialog {
  box-shadow: var(--pl-plate-shadow-lg) !important;
}
.mud-snackbar {
  box-shadow: var(--pl-plate-shadow-md) !important;
}
.mud-popover.mud-popover-open {
  box-shadow: 4px 4px 0 var(--pl-plate-shadow-color) !important;
}
.mud-popover.mud-popover-open.mud-popover-top-left,
.mud-popover.mud-popover-open.mud-popover-top-right,
.mud-popover.mud-popover-open.mud-popover-top-center {
  box-shadow: 4px -4px 0 var(--pl-plate-shadow-color) !important;
}
/* Snackbars clear the fixed bottom nav pill so toasts never cover navigation */
.mud-snackbar-location-bottom-left,
.mud-snackbar-location-bottom-center,
.mud-snackbar-location-bottom-right,
.mud-snackbar-location-bottom-left .mud-snackbar,
.mud-snackbar-location-bottom-center .mud-snackbar,
.mud-snackbar-location-bottom-right .mud-snackbar {
  bottom: calc(56px + 12px + 16px + env(safe-area-inset-bottom,0px)) !important;
}
@media (min-width: 769px) {
  .mud-snackbar-location-bottom-left,
  .mud-snackbar-location-bottom-center,
  .mud-snackbar-location-bottom-right {
    bottom: 16px !important;
  }
}

/* ==================================================================
   BUTTON PLATE PASS. Every button is a machined plate: bevel, hard
   offset shadow, and press physics that drop it into the shadow.
   Text buttons stay flat (they are links, not plates). Disabled
   buttons stay flat. prefers-contrast:more strips it all below.
   ================================================================== */
.mud-button-filled:not(.mud-button-filled-disabled),
.mud-button-outlined:not(.mud-button-outlined-disabled),
.mud-icon-button:not(.mud-button-disabled):not(.app-fab):not(.workout-undo-fab) {
  box-shadow: var(--pl-plate-shadow-sm) !important;
}
.mud-button-filled:not(.mud-button-filled-disabled):active,
.mud-button-outlined:not(.mud-button-outlined-disabled):active,
.mud-icon-button:not(.mud-button-disabled):not(.app-fab):not(.workout-undo-fab):active {
  transform: translate(2px, 2px) !important;
  box-shadow: inset 0 1px 0 var(--pl-bevel-highlight) !important;
}
.mud-button-text:not(.mud-button-text-disabled):active {
  transform: none !important;
  opacity: 0.75 !important;
}

/* ==================================================================
   BRUTALIST ACID LIGHT MODE, button and control separation.
   Light mode was too polite: every control shared the same warm
   hairline and chip-2 well, so secondary buttons vanished into cards.
   These overrides give interactive plates an ink border (#1A1B26)
   and a hard offset, while static cards keep the warm hairline.
   Volt stays the only fill bright enough to shout; everything else
   earns attention through border weight and shadow depth.
   ================================================================== */
html[data-theme-mode="light"] .mud-button-outlined:not(.mud-button-filled-disabled):not(.mud-button-outlined-disabled) {
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  color: var(--pl-ink) !important;
  box-shadow: 4px 4px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .mud-button-outlined:not(.mud-button-outlined-disabled):hover {
  background: color-mix(in srgb, var(--pl-volt-fill) 8%, var(--pl-chip-2)) !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow-text) !important;
}
html[data-theme-mode="light"] .mud-icon-button:not(.mud-button-disabled):not(.app-fab):not(.workout-undo-fab):not(.plan-card__start):not(.mud-error-text):not(.mud-warning-text):not(.mud-success-text):not(.home-hero__discard),
html[data-theme-mode="light"] .rest-timer-icon-btn,
html[data-theme-mode="light"] .rest-timer-add-btn {
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  color: var(--pl-ink) !important;
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .mud-icon-button:not(.mud-button-disabled):not(.app-fab):not(.workout-undo-fab):not(.mud-error-text):not(.mud-warning-text):not(.mud-success-text):not(.home-hero__discard):hover,
html[data-theme-mode="light"] .rest-timer-icon-btn:hover,
html[data-theme-mode="light"] .rest-timer-add-btn:hover {
  background: color-mix(in srgb, var(--pl-volt-fill) 8%, var(--pl-chip-2)) !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow-text) !important;
}
html[data-theme-mode="light"] .mud-icon-button:not(.mud-button-disabled):not(.app-fab):not(.workout-undo-fab):not(.mud-error-text):not(.mud-warning-text):not(.mud-success-text):not(.home-hero__discard):hover .mud-icon-root {
  color: var(--pl-yellow-text) !important;
  fill: var(--pl-yellow-text) !important;
}
/* All secondary, text, outlined, modal, discard, and icon buttons in light mode must use the tan brutal well (--pl-chip-2 #EDE8D3), never white */
html[data-theme-mode="light"] .mud-button:not(.mud-button-filled):not(.home-plans-new-btn):not(.plan-sheet-save-btn):not(.log-set-btn):not(.bodyweight-log-row__log-btn):not(.ai-chat-send-button):not(.home-hero__continue):not(.plan-card__start):not(.workout-focus__log),
html[data-theme-mode="light"] .mud-button-root:not(.mud-button-filled):not(.home-plans-new-btn):not(.plan-sheet-save-btn):not(.log-set-btn):not(.bodyweight-log-row__log-btn):not(.ai-chat-send-button):not(.home-hero__continue):not(.plan-card__start):not(.workout-focus__log),
html[data-theme-mode="light"] button:not(.mud-button-filled):not(.app-fab--primary):not(.settings-tab--active):not(.exercise-metric-tab--active):not(.history-filter-chip--selected):not(.ai-mode-tab--active):not(.home-plans-new-btn):not(.plan-sheet-save-btn):not(.log-set-btn):not(.bodyweight-log-row__log-btn):not(.ai-chat-send-button):not(.home-hero__continue):not(.plan-card__start):not(.history-card-continue-btn):not(.heatmap-cell):not(.workout-focus__log):not(.set-metric-stepper__value):not(.set-metric-stepper__btn):not(.workout-timesup-banner__btn):not(.workout-timesup-banner__dismiss-icon):not(.workout-timesup-banner__dismiss):not(.workout-actions__btn--end):not(.ai-bridge-step),
html[data-theme-mode="light"] .btn-premium-ghost,
html[data-theme-mode="light"] .premium-btn:not(.premium-btn-filled),
html[data-theme-mode="light"] .dialog-cancel-btn,
html[data-theme-mode="light"] .home-hero__discard,
html[data-theme-mode="light"] .plan-card__actions .mud-icon-button:not(.plan-card__start),
html[data-theme-mode="light"] .plan-card-icon-btn:not(.plan-card__start),
html[data-theme-mode="light"] .workout-transport__btn {
  background: var(--pl-chip-2) !important;
}
html[data-theme-mode="light"] .mud-button:not(.mud-button-filled):not(.home-plans-new-btn):not(.plan-sheet-save-btn):not(.log-set-btn):not(.bodyweight-log-row__log-btn):not(.ai-chat-send-button):not(.home-hero__continue):not(.plan-card__start):not(.workout-focus__log):hover,
html[data-theme-mode="light"] .mud-button-root:not(.mud-button-filled):not(.home-plans-new-btn):not(.plan-sheet-save-btn):not(.log-set-btn):not(.bodyweight-log-row__log-btn):not(.ai-chat-send-button):not(.home-hero__continue):not(.plan-card__start):not(.workout-focus__log):hover,
html[data-theme-mode="light"] button:not(.mud-button-filled):not(.app-fab--primary):not(.settings-tab--active):not(.exercise-metric-tab--active):not(.history-filter-chip--selected):not(.ai-mode-tab--active):not(.home-plans-new-btn):not(.plan-sheet-save-btn):not(.log-set-btn):not(.bodyweight-log-row__log-btn):not(.ai-chat-send-button):not(.home-hero__continue):not(.plan-card__start):not(.history-card-continue-btn):not(.heatmap-cell):not(.workout-focus__log):not(.set-metric-stepper__value):not(.set-metric-stepper__btn):not(.workout-timesup-banner__btn):not(.workout-timesup-banner__dismiss-icon):not(.workout-timesup-banner__dismiss):not(.workout-actions__btn--end):not(.ai-bridge-step):hover,
html[data-theme-mode="light"] .btn-premium-ghost:hover,
html[data-theme-mode="light"] .premium-btn:not(.premium-btn-filled):hover,
html[data-theme-mode="light"] .dialog-cancel-btn:hover,
html[data-theme-mode="light"] .home-hero__discard:hover,
html[data-theme-mode="light"] .plan-card__actions .mud-icon-button:not(.plan-card__start):hover,
html[data-theme-mode="light"] .plan-card-icon-btn:not(.plan-card__start):hover,
html[data-theme-mode="light"] .workout-transport__btn:hover {
  background: color-mix(in srgb, var(--pl-volt-fill) 8%, var(--pl-chip-2)) !important;
}
html[data-theme-mode="light"] .app-fab--secondary {
  background: var(--pl-chip-2) !important;
  color: var(--pl-ink) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 6px 6px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .app-fab--secondary:hover {
  background: var(--pl-chip-2) !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow-text) !important;
}
html[data-theme-mode="light"] .app-fab--secondary:hover .mud-icon-root {
  color: var(--pl-yellow-text) !important;
}
/* Empty state display icons: bold brutalist plate with high-contrast colored icon */
html[data-theme-mode="light"] .empty-state-icon-box {
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color) !important;
  color: var(--pl-cyan-text) !important;
}
html[data-theme-mode="light"] .empty-state-icon {
  color: var(--pl-cyan-text) !important;
  fill: var(--pl-cyan-text) !important;
  stroke: none !important;
  filter: none !important;
}

/* ==================================================================
   SEMANTIC ICON COLORS - Purposeful palette with WCAG AA (>= 4.5:1)
   contrast in both Dark and Light themes. Never flatten to plain ink.
   ================================================================== */
.mud-icon-color-primary:not(.mud-button-filled-primary *):not(.app-fab--primary *):not(.empty-state-icon) {
  color: var(--pl-cyan-text) !important;
  fill: var(--pl-cyan-text) !important;
}
html[data-theme-mode="dark"] .mud-icon-color-primary:not(.mud-button-filled-primary *):not(.app-fab--primary *):not(.empty-state-icon) {
  color: var(--pl-cyan) !important;
  fill: var(--pl-cyan) !important;
}

.mud-icon-color-secondary:not(.mud-button-filled-secondary *):not(.app-fab--secondary *) {
  color: var(--pl-purple-text) !important;
  fill: var(--pl-purple-text) !important;
}
html[data-theme-mode="dark"] .mud-icon-color-secondary:not(.mud-button-filled-secondary *):not(.app-fab--secondary *) {
  color: var(--pl-purple) !important;
  fill: var(--pl-purple) !important;
}

.mud-icon-color-info:not(.mud-button-filled-info *) {
  color: var(--pl-cyan-text) !important;
  fill: var(--pl-cyan-text) !important;
}
html[data-theme-mode="dark"] .mud-icon-color-info:not(.mud-button-filled-info *) {
  color: var(--pl-cyan) !important;
  fill: var(--pl-cyan) !important;
}

.mud-icon-color-warning:not(.mud-button-filled-warning *) {
  color: var(--pl-warn-text) !important;
  fill: var(--pl-warn-text) !important;
}
html[data-theme-mode="dark"] .mud-icon-color-warning:not(.mud-button-filled-warning *) {
  color: var(--pl-yellow) !important;
  fill: var(--pl-yellow) !important;
}

.mud-icon-color-success:not(.mud-button-filled-success *) {
  color: var(--pl-ok-text) !important;
  fill: var(--pl-ok-text) !important;
}
html[data-theme-mode="dark"] .mud-icon-color-success:not(.mud-button-filled-success *) {
  color: var(--pl-success) !important;
  fill: var(--pl-success) !important;
}

.mud-icon-color-error:not(.mud-button-filled-error *) {
  color: var(--pl-err-text) !important;
  fill: var(--pl-err-text) !important;
}
html[data-theme-mode="dark"] .mud-icon-color-error:not(.mud-button-filled-error *) {
  color: var(--pl-error) !important;
  fill: var(--pl-error) !important;
}

/* Standalone icon buttons with semantic colors */
.mud-icon-button-color-primary:not(.mud-button-filled):not(.plan-card__start) {
  color: var(--pl-cyan-text) !important;
}
html[data-theme-mode="dark"] .mud-icon-button-color-primary:not(.mud-button-filled):not(.plan-card__start) {
  color: var(--pl-cyan) !important;
}
.mud-icon-button-color-secondary:not(.mud-button-filled) {
  color: var(--pl-purple-text) !important;
}
html[data-theme-mode="dark"] .mud-icon-button-color-secondary:not(.mud-button-filled) {
  color: var(--pl-purple) !important;
}
.mud-icon-button-color-info:not(.mud-button-filled) {
  color: var(--pl-cyan-text) !important;
}
html[data-theme-mode="dark"] .mud-icon-button-color-info:not(.mud-button-filled) {
  color: var(--pl-cyan) !important;
}
.mud-icon-button-color-warning:not(.mud-button-filled) {
  color: var(--pl-warn-text) !important;
}
html[data-theme-mode="dark"] .mud-icon-button-color-warning:not(.mud-button-filled) {
  color: var(--pl-yellow) !important;
}
.mud-icon-button-color-success:not(.mud-button-filled) {
  color: var(--pl-ok-text) !important;
}
html[data-theme-mode="dark"] .mud-icon-button-color-success:not(.mud-button-filled) {
  color: var(--pl-success) !important;
}
.mud-icon-button-color-error:not(.mud-button-filled) {
  color: var(--pl-err-text) !important;
}
html[data-theme-mode="dark"] .mud-icon-button-color-error:not(.mud-button-filled) {
  color: var(--pl-error) !important;
}

/* Onboarding Tips Icon Colors */
.onboarding-tip__icon {
  color: var(--pl-cyan-text) !important;
  fill: var(--pl-cyan-text) !important;
}
html[data-theme-mode="dark"] .onboarding-tip__icon {
  color: var(--pl-cyan) !important;
  fill: var(--pl-cyan) !important;
}
.onboarding-tip--warning .mud-icon-root {
  color: var(--pl-warn-text) !important;
  fill: var(--pl-warn-text) !important;
}
html[data-theme-mode="dark"] .onboarding-tip--warning .mud-icon-root {
  color: var(--pl-yellow) !important;
  fill: var(--pl-yellow) !important;
}
html[data-theme-mode="light"] .settings-tab,
html[data-theme-mode="light"] .exercise-metric-tab,
html[data-theme-mode="light"] .ai-mode-tab,
html[data-theme-mode="light"] .ai-quick-btn,
html[data-theme-mode="light"] .history-filter-chip,
html[data-theme-mode="light"] .progress-exercise-card {
  background: var(--pl-chip-2) !important;
  color: var(--pl-ink-2) !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  box-shadow: none !important;
}
html[data-theme-mode="light"] .settings-tab--active,
html[data-theme-mode="light"] .exercise-metric-tab--active,
html[data-theme-mode="light"] .history-filter-chip--selected,
html[data-theme-mode="light"] .ai-mode-tab--active {
  background: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  border: 1.5px solid var(--pl-ink) !important;
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color) !important;
  font-weight: 900 !important;
}
html[data-theme-mode="light"] .settings-tab--active .mud-icon-root,
html[data-theme-mode="light"] .exercise-metric-tab--active .mud-icon-root,
html[data-theme-mode="light"] .history-filter-chip--selected .mud-icon-root,
html[data-theme-mode="light"] .ai-mode-tab--active .mud-icon-root {
  color: var(--pl-volt-fg) !important;
  fill: var(--pl-volt-fg) !important;
}
html[data-theme-mode="light"] .settings-tab:hover,
html[data-theme-mode="light"] .exercise-metric-tab:hover,
html[data-theme-mode="light"] .ai-quick-btn:hover,
html[data-theme-mode="light"] .history-filter-chip:hover,
html[data-theme-mode="light"] .progress-exercise-card:hover {
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow-text) !important;
}
html[data-theme-mode="light"] .mud-input-outlined-border {
  border-color: var(--pl-ink-border) !important;
  border-width: 1.5px !important;
}
html[data-theme-mode="light"] .mud-input-control.mud-input-focused .mud-input-outlined-border {
  border-color: var(--pl-yellow) !important;
  border-width: 2px !important;
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color), 0 0 0 3px color-mix(in srgb, var(--pl-volt-fill) 22%, transparent) !important;
}
html[data-theme-mode="light"] .history-session-card,
html[data-theme-mode="light"] .plan-card.mud-card,
html[data-theme-mode="light"] .exercise-accordion-card {
  border-color: var(--pl-hairline-strong) !important;
}

/* Copy Share and PR buttons: Text variant premium plates were missing the machined shadow. All premium-btn and related table buttons now carry the same plate. */
.premium-btn.mud-button-root,
.premium-btn.mud-icon-button,
.exercise-progress-table__open.mud-icon-button,
.pr-dialog-close.mud-button-root,
.history-detail-table__btn.mud-icon-button {
  box-shadow: var(--pl-plate-shadow-sm) !important;
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
}
.premium-btn.mud-button-root:hover,
.exercise-progress-table__open.mud-icon-button:hover,
.pr-dialog-close.mud-button-root:hover,
.history-detail-table__btn.mud-icon-button:hover {
  background: var(--pl-chip) !important;
  border-color: var(--pl-yellow) !important;
}
.premium-btn.mud-button-root:active,
.exercise-progress-table__open.mud-icon-button:active,
.pr-dialog-close.mud-button-root:active,
.history-detail-table__btn.mud-icon-button:active {
  transform: translate(3px, 3px) !important;
  box-shadow: none !important;
}

/* Focused inputs get a hard volt ring, zero blur. */
.mud-input-control.mud-input-focused .mud-input-outlined-border {
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--pl-yellow) 28%, transparent);
}

/* Home hero: hazard wash over the plate. Stripes stay under the ink border
   and clear of the label and CTA, which carry the solid volt. */
.home-hero.mud-paper {
  background-image:
    repeating-linear-gradient(
      -45deg,
      color-mix(in srgb, var(--pl-volt-fill) 8%, transparent) 0 12px,
      transparent 12px 26px
    ),
    linear-gradient(150deg, color-mix(in srgb, var(--pl-volt-fill) 16%, transparent) 0%, transparent 58%) !important;
  background-color: var(--pl-chip) !important;
}

/* Stat value plates: duotone ramps, one accent per card, graded strip. */
.stat-card:nth-child(1) .stat-card__value {
  background-image: linear-gradient(155deg, color-mix(in srgb, var(--pl-yellow) 34%, transparent) 0%, color-mix(in srgb, var(--pl-yellow) 10%, transparent) 80%) !important;
}
.stat-card:nth-child(2) .stat-card__value {
  background-image: linear-gradient(155deg, color-mix(in srgb, var(--pl-cyan) 32%, transparent) 0%, color-mix(in srgb, var(--pl-cyan) 9%, transparent) 80%) !important;
}
.stat-card:nth-child(3) .stat-card__value {
  background-image: linear-gradient(155deg, color-mix(in srgb, var(--pl-purple) 32%, transparent) 0%, color-mix(in srgb, var(--pl-purple) 9%, transparent) 80%) !important;
}
.stat-card:nth-child(4) .stat-card__value {
  background-image: linear-gradient(155deg, color-mix(in srgb, var(--pl-success) 32%, transparent) 0%, color-mix(in srgb, var(--pl-success) 9%, transparent) 80%) !important;
}
/* Light mode only: the neon yellow fails 3:1 on its own tint, so the first
   card's value drops to the AA-safe yellow text token. Volt now prints as
   #6E6400 in light, which passes on the tint directly; the override stays
   harmless because it resolves to the same printed volt ink. */
html[data-theme-mode="light"] .stat-card:nth-child(1) .stat-card__value {
  color: var(--pl-yellow-text);
}

/* Heatmap done cells: machined gloss over the green fill. */
button.heatmap-cell.heatmap-on {
  background-image: linear-gradient(180deg, rgba(255, 255, 255, 0.22), rgba(255, 255, 255, 0) 60%) !important;
}

/* Colored load dots get a painted lip. */
.load-dot--25, .load-dot--20, .load-dot--15, .load-dot--10 {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.35);
}

/* Urgent edge track: solid error red with the pre-existing pulse. */

/* AI surfaces: user bubble rides the volt sheen, empty-state plate gets the
   dot matrix and a mini shadow. */
.ai-msg--user .ai-msg__bubble {
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pl-volt-fill) 80%, #FFFFFF) 0%,
    var(--pl-volt-fill) 100%
  );
  box-shadow: var(--pl-plate-shadow-sm);
}
.ai-chat-empty__icon-plate {
  background-image: radial-gradient(circle, var(--pl-dot) 1px, transparent 1.25px);
  background-size: 8px 8px;
  box-shadow: var(--pl-plate-shadow-sm);
}

/* Splash carries the scanlines too, so the terminal is on before the app is. */
.app-splash {
  position: relative;
  overflow: hidden;
}
.app-splash::after {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  background: repeating-linear-gradient(0deg, transparent 0 2px, rgba(192, 202, 245, 0.05) 2px 3px);
}
.app-splash__retry {
  height: 44px;
  min-height: 44px;
  padding: 0 16px;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--pl-volt-fill);
  color: var(--pl-volt-fg);
  border: 1.5px solid var(--pl-ink-border);
  box-shadow: var(--pl-plate-shadow-sm);
  cursor: pointer;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), filter 120ms ease;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.app-splash__retry:hover {
  filter: brightness(1.08);
}
.app-splash__retry:active {
  transform: translate(3px, 3px);
  box-shadow: none !important;
}
.app-splash__clear {
  height: 44px;
  min-height: 44px;
  padding: 0 16px;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--pl-chip);
  color: var(--pl-ink);
  border: 1.5px solid var(--pl-ink-border);
  box-shadow: var(--pl-plate-shadow-sm);
  cursor: pointer;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), filter 120ms ease;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.app-splash__clear:hover {
  filter: brightness(1.08);
}
.app-splash__clear:active {
  transform: translate(3px, 3px);
  box-shadow: none !important;
}

/* Forced more-contrast mode: plates go flat, depth returns to borders. */
@media (prefers-contrast:more) {
  .plate-card, .stat-card.mud-paper, .home-hero.mud-paper, .plan-card.mud-card,
  .history-session-card, .bodyweight-panel.mud-paper, .rest-timer-panel.mud-paper,
  .workout-session-stats, .exercise-progress-chart, .bodyweight-chart-panel,
  .history-heatmap-panel.mud-paper, .home-heatmap-panel.mud-paper,
  .activity-heatmap-card, .settings-card.mud-paper, .settings-panel.mud-expand-panel,
  .plan-details-card, .history-filter-bar, .ai-chat-messages,
  .ai-chat-input, .ai-bridge-card, .app-nav-pill__inner, .app-fab, .workout-undo-fab,
  .mud-dialog, .mud-snackbar, .mud-popover.mud-popover-open,
  .mud-button-filled, .mud-button-outlined, .mud-icon-button,
  .workout-actions-row .premium-btn-filled, .workout-actions-row .premium-btn-error-outlined {
    box-shadow: none !important;
  }
  .workout-top--with-timer { box-shadow: none; }
}

/* Big screens: the pill stays the one chrome, centered, and FABs anchor to
   the centered 640px content column instead of the viewport edges. */
@media (min-width:769px) {
  .app-shell:not(.app-shell--immersive) .app-fab.app-fab--br-1:not(.dialog-fab),
  .app-shell:not(.app-shell--immersive) .home-page ~ .app-fab--br-1:not(.dialog-fab) {
    right: calc(50% - 320px - 64px) !important;
    bottom: 84px !important;
  }
  .app-shell:not(.app-shell--immersive) .app-fab.app-fab--br-2:not(.dialog-fab) {
    right: calc(50% - 320px - 120px) !important;
    bottom: 84px !important;
  }
  .app-shell:not(.app-shell--immersive) .app-fab.app-fab--bl-1:not(.dialog-fab),
  .app-shell:not(.app-shell--immersive) .app-fab.app-fab--back:not(.dialog-fab),
  .app-shell:not(.app-shell--immersive) .workout-undo-fab {
    left: calc(50% - 320px - 64px) !important;
    bottom: 84px !important;
  }
  .app-shell:not(.app-shell--immersive) .app-fab.app-fab--bl-2:not(.dialog-fab) {
    left: calc(50% - 320px - 120px) !important;
    bottom: 84px !important;
  }
  .app-shell.app-shell--immersive .app-fab:not(.dialog-fab) {
    bottom: 16px !important;
  }
  .app-shell .dialog-fab.app-fab--br-1 {
    right: calc(50% - 320px - 64px) !important;
    bottom: 16px !important;
  }
  .app-shell .dialog-fab.app-fab--bl-1 {
    left: calc(50% - 320px - 64px) !important;
    bottom: 16px !important;
  }
}

/* CHROME CLEARANCE: bottom fade removed per brutalist request. Crisp hard edges, no gradient haze.
   The sticky session strip and the nav pill cast their own hard shadows, so no fade is needed. */
.app-chrome-fade {
  display: none !important;
}

/* Session end controls: plain row at the bottom, not sticky */
.workout-actions-row {
  position: static !important;
  bottom: auto !important;
  z-index: auto !important;
  display: flex !important;
  gap: 8px !important;
  margin: 24px 0 0 !important;
  padding: 12px 0 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-top: 0 !important;
  box-shadow: none !important;
}
.workout-actions-row .premium-btn {
  min-height: 48px !important;
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !important;
  font-weight: 800 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  border-radius: var(--radius) !important;
}
.workout-actions-row .premium-btn-filled {
  flex: 1 1 auto !important;
  background: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  border: 1.5px solid var(--pl-volt-edge) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
}
.workout-actions-row .premium-btn-filled:hover {
  filter: brightness(1.12);
}
.workout-actions-row .premium-btn-filled:active {
  transform: translate(2px, 2px) !important;
  box-shadow: inset 0 1px 0 var(--pl-bevel-highlight) !important;
}
.workout-actions-row .premium-btn-error-outlined {
  flex: 0 0 auto !important;
  min-width: 116px;
  border: 1.5px solid var(--pl-error) !important;
  color: var(--pl-err-text) !important;
  background: var(--pl-chip) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
}
.workout-actions-row .premium-btn-error-outlined:hover {
  background: var(--pl-error) !important;
  color: #FFFFFF !important;
}
html[data-theme-mode="dark"] .workout-actions-row .premium-btn-error-outlined:hover {
  color: #10111A !important;
}
.workout-actions-row .premium-btn-error-outlined:active {
  transform: translate(2px, 2px) !important;
  box-shadow: inset 0 1px 0 var(--pl-bevel-highlight) !important;
}

/* MudBlazor expand panels animate margin and min-height, which thrashes
   layout on low-end phones. Collapse snaps; opacity carries the change. */
.mud-expand-panel,
.mud-expand-panel .mud-collapse-container,
.mud-expand-panel .mud-collapse-wrapper {
  transition: opacity 150ms ease !important;
}

/* Volt primary reaches MudBlazor controls. Check glyphs and switch thumbs
   print in the volt foreground ink so they stay visible on the volt fill
   in both themes (library defaults assume a dark primary). */
.mud-checkbox .mud-checkbox-ex-checkpath,
.mud-radio .mud-checkbox-ex-checkpath {
  fill: var(--pl-volt-fg) !important;
}
.mud-switch.mud-checked .mud-switch-thumb {
  background: var(--pl-volt-fg) !important;
  color: var(--pl-volt-fill) !important;
}
.mud-switch.mud-checked .mud-switch-track {
  background-color: var(--pl-volt-fill) !important;
}
.mud-switch.mud-checked .mud-switch-track .mud-switch-thumb,
.mud-switch.mud-checked:hover .mud-switch-thumb {
  color: var(--pl-volt-fg) !important;
}

/* ==================================================================
   TITLE BRUTALIST PASS: primary and section headings become machined
   plates with hard shadows. Menu and card names stay typographic to
   avoid overuse. Diagram titles get clearance for their shadow.
   ================================================================== */
.home-plans-header__title,
.home-plans-count-chip {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 5px 12px !important;
  background: var(--pl-chip) !important;
  background-image: none !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-display) !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  letter-spacing: 0.05em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  margin: 0 !important;
  box-sizing: border-box !important;
}
.home-plans-count-chip {
  min-width: 30px !important;
  height: 30px !important;
  padding: 5px 10px !important;
  font-family: var(--font-mono) !important;
  font-size: 14px !important;
}
/* Diagram and section plates: general fallback cards stay flat, machined plates take chip styles */
.settings-card__title {
  display: inline !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  letter-spacing: 0.03em !important;
  line-height: 1.1 !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  margin: 0 !important;
}
.bodyweight-panel__title {
  display: inline-flex !important;
  align-items: center !important;
  padding: 4px 10px !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-radius: var(--radius) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  font-family: var(--font-display) !important;
  font-size: 14px !important;
  font-weight: 900 !important;
  letter-spacing: 0.04em !important;
  line-height: 1.2 !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  margin: 0 !important;
  border-left: 1.5px solid var(--pl-ink-border) !important;
}
/* Settings panel headers */
.settings-panel__title {
  display: block !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-left: 0 !important;
  border-radius: 0 !important;
  font-family: var(--font-display) !important;
  font-size: 15px !important;
  font-weight: 900 !important;
  letter-spacing: 0.04em !important;
  line-height: 1.2 !important;
  color: var(--pl-ink) !important;
  box-shadow: none !important;
  margin: 0 !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: break-word !important;
}
.settings-panel.mud-expand-panel {
  overflow: hidden !important;
}
.settings-panel.mud-expand-panel .mud-expand-panel-header {
  overflow: hidden !important;
  padding: 10px 14px !important;
}
.settings-panel__subtitle {
  display: block !important;
  font-weight: 700 !important;
  letter-spacing: 0.06em !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: break-word !important;
  line-height: 1.35 !important;
}
.mud-dialog-title .mud-typography-h6,
.dialog-header-bar__title {
  display: inline-flex !important;
  align-items: center !important;
  padding: 7px 12px !important;
  background: var(--pl-volt-fill) !important;
  background-image: linear-gradient(
    180deg,
    color-mix(in srgb, var(--pl-volt-fill) 88%, #FFFFFF) 0%,
    var(--pl-volt-fill) 58%,
    color-mix(in srgb, var(--pl-volt-fill) 92%, #000000) 100%
  ) !important;
  border: 1.5px solid var(--pl-volt-edge) !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-display) !important;
  font-size: 17px !important;
  font-weight: 900 !important;
  letter-spacing: 0.02em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  color: var(--pl-volt-fg) !important;
  box-shadow: 4px 4px 0 var(--pl-plate-shadow-color) !important;
}
.mud-dialog-title {
  background: var(--pl-chip-2) !important;
  border-bottom: 1.5px solid var(--pl-hairline-strong) !important;
  padding: 10px 12px !important;
}
.ai-chat-empty__title {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 7px 14px !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  border-radius: var(--radius) !important;
  box-shadow: 4px 4px 0 var(--pl-plate-shadow-color) !important;
  font-size: 18px !important;
}
/* Card and row names: flat typographic inside cards - no shadow, no plate */
.plan-card-name,
.history-session-card__title,
.plan-exercise-row__name,
.exercise-accordion-header .exercise-name {
  font-weight: 800 !important;
  letter-spacing: -0.015em !important;
}
.plan-card-name {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  box-shadow: none !important;
  margin: 0 !important;
  flex: 1 1 auto !important;
}
.history-session-card__title {
  display: inline-flex !important;
  align-items: center !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
  font-weight: 800 !important;
  font-size: 16px !important;
  margin: 0 !important;
  flex: 1 1 auto !important;
}
.plan-exercise-row__name {
  display: block !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
  font-weight: 800 !important;
  font-size: 16px !important;
  margin: 0 !important;
  flex: 1 1 auto !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: break-word !important;
  line-height: 1.35 !important;
  min-width: 0 !important;
}
.exercise-accordion-header .exercise-name {
  display: block !important;
  padding: 0 !important;
  background: transparent !important;
  border: 0 !important;
  border-left: 0 !important;
  box-shadow: none !important;
  font-weight: 800 !important;
  font-size: 18px !important;
  margin: 0 !important;
  flex: 1 1 auto !important;
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: break-word !important;
  line-height: 1.3 !important;
  min-width: 0 !important;
}
.plan-card.mud-card,
.history-session-card {
  overflow: visible !important;
}
.plan-card__content,
.history-session-card__inner {
  overflow: visible !important;
}
.infinite-table-head {
  box-shadow: inset 0 1px 0 var(--pl-bevel-highlight) !important;
  border-bottom-width: 2px !important;
}
.history-detail-table .settings-card__title,
.history-detail-plan-table .settings-card__title,
.exercise-progress-chart .settings-card__title,
.bodyweight-chart-panel .settings-card__title,
.plan-details-card .settings-card__title {
  border-left: 0 !important;
}

/* History select controls: hard offset only for instant paint */
.history-select-bar,
.history-filter-bar {
  box-shadow: 4px 4px 0 var(--pl-plate-shadow-color) !important;
  margin-bottom: 14px !important;
  margin-right: 6px !important;
  transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease !important;
}
.history-filter-bar.history-filter-bar--selection {
  box-shadow: 4px 4px 0 var(--pl-plate-shadow-color) !important;
}
.history-select-toggle.mud-button-root,
.history-select-bar__btn {
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color) !important;
  transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease !important;
}
/* MudSelects reached from history (exercise progress, bodyweight) get a plate only when on those pages */
.exercise-progress-controls .mud-input-control .mud-input-outlined-border,
.bodyweight-range-row .mud-input-control .mud-input-outlined-border {
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color) !important;
}
.exercise-progress-controls .mud-input-control,
.bodyweight-range-row .mud-input-control {
  margin-bottom: 10px !important;
  margin-right: 6px !important;
}
/* Diagram and chart plates need room for inner title shadows */
.home-heatmap-panel.mud-paper,
.history-heatmap-panel.mud-paper,
.bodyweight-panel.mud-paper,
.settings-card.mud-paper {
  overflow: visible !important;
}
.exercise-progress-chart,
.bodyweight-chart-panel {
  overflow: visible !important;
  max-width: 100%;
}
@media (min-width: 481px) {
  .exercise-progress-chart .exercise-progress-chart__plot,
  .bodyweight-chart-panel .bodyweight-chart {
    overflow: visible !important;
  }
}
@media (max-width: 480px) {
  .exercise-progress-chart .exercise-progress-chart__plot,
  .bodyweight-chart-panel .bodyweight-chart {
    overflow-x: auto !important;
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: thin;
    padding-bottom: 4px;
    max-width: 100%;
  }
}

/* Instant plate shadows: static titles never transition so shadow paints on first frame.
   Interactive cards keep only transform/background transitions, never box-shadow. */
:where(.page-header__title,
.home-plans-header__title,
.home-plans-count-chip,
.bodyweight-panel__title,
.settings-card__title,
.plan-section-header__title,
.section-plate-title,
.history-section-header__title,
.mud-dialog-title .mud-typography-h6,
.dialog-header-bar__title,
.ai-chat-empty__title) {
  transition: none !important;
}
:where(.history-select-bar,
.history-filter-bar,
.history-select-bar__btn,
.history-select-toggle,
.settings-tab,
.settings-schedule-day,
.exercise-metric-tab,
.progress-exercise-card,
.ai-quick-btn,
.history-filter-chip) {
  transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease !important;
}
:where(.plan-card.mud-card,
.history-session-card,
.progress-exercise-card) {
  transition: transform 120ms ease, border-color 150ms ease, background-color 120ms ease !important;
}

/* Fallback hard shadow via pseudo-element for titles where box-shadow is clipped by overflow:hidden ancestors.
   Box-shadow is kept as primary, pseudo-element ensures visibility even if ancestor clips.
   Only the volt plate header needs the fallback; row titles inside cards stay flat so the
   dark pseudo never lands behind dark ink and reads as a black block. */
.page-header__title {
  position: relative !important;
}
.page-header__title::after {
  content: '';
  position: absolute;
  inset: 0;
  background: var(--pl-plate-shadow-color);
  border-radius: var(--radius);
  z-index: -1;
  pointer-events: none;
  transform: translate(5px, 5px);
}
.history-session-card__title,
.plan-card-name,
.plan-exercise-row__name,
.exercise-accordion-header .exercise-name,
.settings-panel__title,
.home-plans-header__title,
.home-plans-count-chip,
.bodyweight-panel__title,
.settings-card__title,
.plan-section-header__title,
.section-plate-title,
.history-section-header__title {
  position: static !important;
  color: var(--pl-ink) !important;
}
.history-session-card__title::after,
.plan-card-name::after,
.plan-exercise-row__name::after,
.exercise-accordion-header .exercise-name::after,
.settings-panel__title::after,
.home-plans-header__title::after,
.home-plans-count-chip::after,
.bodyweight-panel__title::after,
.settings-card__title::after,
.plan-section-header__title::after,
.section-plate-title::after,
.history-section-header__title::after {
  content: none !important;
  display: none !important;
}

/* ==================================================================
   WORKOUT, BRUTAL FIELD DECK, CYBERPUNK ACID
   Mobile-first, single-focus, intense. Only the relevant thing breathes.
   Acid palette: volt #FAFF00, cyan #00E5FF, magenta #FF0055,
   violet #C084FC, toxic #A3E635, amber #E0AF68.
   Zero radius, hairline plates, hard shadows, tabular mono, 44px thumbs.
   ================================================================== */
.workout-brutal {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
  max-width: 480px;
  margin: 0 auto;
  padding-bottom: 8px;
}

/* Header, machined plate, volt kicker */
.workout-brutal__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 10px 8px;
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline-strong);
  box-shadow: var(--pl-plate-shadow-md);
  position: relative;
  overflow: visible;
}
.workout-brutal__header::after {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  bottom: -1px;
  height: 3px;
  background: var(--pl-volt-fill);
  border-top: 1px solid var(--pl-volt-edge);
}

.workout-brutal__title {
  margin: 0;
  font-family: var(--font-display) !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  letter-spacing: 0.02em !important;
  line-height: 1 !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
}
.workout-brutal__header-meta {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 4px;
  padding-top: 2px;
}
.workout-brutal__header-count {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--pl-ink);
  background: var(--pl-chip-2);
  border: 1.5px solid var(--pl-hairline-strong);
  padding: 4px 7px;
  line-height: 1;
}

/* Permission alert, compact brutal */
.workout-brutal__alert {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 8px 10px;
  background: color-mix(in srgb, var(--pl-magenta) 10%, var(--pl-chip));
  border: 1.5px solid color-mix(in srgb, var(--pl-magenta) 40%, var(--pl-hairline-strong));
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.02em;
  color: var(--pl-ink);
}
.workout-brutal__alert-dot {
  width: 8px;
  height: 8px;
  flex-shrink: 0;
  background: var(--pl-magenta);
  border: 1px solid var(--pl-ink);
}
.workout-brutal__alert-text { flex: 1 1 auto; min-width: 0; }
.workout-brutal__alert-btn {
  flex-shrink: 0;
  height: 28px;
  padding: 0 10px;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  background: var(--pl-ink);
  color: var(--pl-chip);
  border: 1.5px solid var(--pl-ink);
  cursor: pointer;
  transition: transform 90ms ease, opacity 90ms ease, background 120ms ease !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.workout-brutal__alert-btn:hover {
  filter: brightness(1.1);
}
.workout-brutal__alert-btn:active {
  transform: translate(1px, 1px);
}
html[data-theme-mode="dark"] .workout-brutal__alert-btn { background: var(--pl-volt-fill); color: var(--pl-volt-fg); border-color: var(--pl-volt-edge); }

/* HUD, instrument cluster, brutal */
.workout-hud {
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline-strong);
  box-shadow: var(--pl-plate-shadow-md);
  overflow: hidden;
  display: flex;
  flex-direction: column;
}
.workout-hud__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr) !important;
  gap: 0;
  border-bottom: 1.5px solid var(--pl-hairline-strong);
}
.workout-hud__stat {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  padding: 12px 6px 10px;
  background: var(--pl-chip);
  position: relative;
}
.workout-hud__stat + .workout-hud__stat { border-left: 1.5px solid var(--pl-hairline); }
.workout-hud__label {
  font-family: var(--font-mono);
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--pl-stone);
  line-height: 1;
}
.workout-hud__stat--volume .workout-hud__label { color: #0369A1; }
.workout-hud__stat--sets .workout-hud__label { color: #15803D; }
html[data-theme-mode="dark"] .workout-hud__stat--volume .workout-hud__label { color: #7AA2F7; }
html[data-theme-mode="dark"] .workout-hud__stat--sets .workout-hud__label { color: #9ECE6A; }
.workout-hud__value {
  font-family: var(--font-display);
  font-size: clamp(16px, 4.5vw, 20px) !important;
  font-weight: 900 !important;
  letter-spacing: -0.015em;
  line-height: 1.1;
  color: var(--pl-ink) !important;
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
html[data-theme-mode="dark"] .workout-hud__stat--volume .workout-hud__value { color: #C0CAF5 !important; }
html[data-theme-mode="dark"] .workout-hud__stat--sets .workout-hud__value { color: #C0CAF5 !important; }
.workout-hud__bar-wrap {
  padding: 10px 14px 10px;
  background: var(--pl-chip-2);
  border-bottom: 1.5px solid var(--pl-hairline);
}
.workout-hud__bar-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 8px;
  gap: 8px;
}
.workout-hud__bar-label {
  font-family: var(--font-mono);
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--pl-stone);
}
.workout-hud__bar-pct {
  font-family: var(--font-display) !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  letter-spacing: 0.02em;
  color: var(--pl-ink);
  font-variant-numeric: tabular-nums;
}
.workout-hud__bar {
  height: 12px !important;
  background: var(--pl-paper-2);
  border: 1.5px solid var(--pl-hairline-strong);
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: stretch;
}
.workout-hud__fill {
  height: 100%;
  background: var(--pl-volt-fill);
  border-right: 1.5px solid var(--pl-volt-edge);
  transition: width 360ms cubic-bezier(.19,1,.22,1);
  position: relative;
  z-index: 1;
}
.workout-hud__fill::after {
  content: '';
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(90deg, transparent 0 10px, rgba(16,17,26,0.08) 10px 11px);
}
.workout-hud__bar-grid {
  position: absolute;
  inset: 0;
  background-image: linear-gradient(to right, var(--pl-grid-line) 1px, transparent 1px);
  background-size: 12px 100%;
  opacity: 0.5;
  pointer-events: none;
}
.workout-hud__exercise-strip {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 8px 10px;
  background: var(--pl-chip);
  overflow-x: auto;
  scrollbar-width: none;
  border-top: 1px solid var(--pl-hairline);
}
.workout-hud__exercise-strip::-webkit-scrollbar { display: none; }
.workout-hud__dot {
  width: 26px;
  height: 26px;
  flex-shrink: 0;
  display: inline-grid;
  place-items: center;
  background: var(--pl-chip-2);
  border: 1.5px solid var(--pl-hairline-strong);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 800;
  color: var(--pl-stone);
  position: relative;
  transition: all 140ms ease;
}
.workout-hud__dot--done {
  background: var(--pl-success);
  border-color: var(--pl-success);
  color: #FFFFFF !important;
}
html[data-theme-mode="dark"] .workout-hud__dot--done {
  color: #10111A !important;
}
.workout-hud__dot--active {
  background: var(--pl-volt-fill);
  color: var(--pl-volt-fg);
  border-color: var(--pl-volt-edge);
  box-shadow: var(--pl-plate-shadow-sm);
  transform: translate(-1px, -1px);
}
.workout-hud__dot--active .workout-hud__dot-pulse {
  position: absolute;
  inset: -4px;
  border: 1.5px solid var(--pl-volt-fill);
  opacity: 0.6;
}
.workout-hud__dot-check { font-size: 14px; line-height: 1; font-weight: 900; }
.workout-hud__dot-num { font-variant-numeric: tabular-nums; }

/* DECK, the one thing that matters */
.workout-deck {
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important;
  position: relative;
}
.workout-deck::before {
  display: none !important;
}
.workout-deck > * { position: relative; z-index: 1; }

/* Focus card */
.workout-focus {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0;
  position: relative;
  background: var(--pl-chip);
  border: 2px solid var(--pl-ink-border);
  box-shadow: var(--pl-plate-shadow-md);
  overflow: hidden;
}
.workout-focus__edge {
  height: 5px;
  background: var(--pl-chip-2);
  border-bottom: 1.5px solid var(--pl-hairline);
  overflow: hidden;
  position: relative;
}
.workout-focus__edge-fill {
  height: 100%;
  background: var(--pl-ink);
  transition: width 300ms cubic-bezier(.19,1,.22,1);
  position: relative;
}
.workout-focus__edge-fill::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.2));
}
/* Time's up banner on the logging interface: high-visibility acid volt plate */
.workout-timesup-banner {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 12px 14px;
  background: var(--pl-volt-fill);
  border-bottom: 2px solid var(--pl-volt-edge);
  color: var(--pl-volt-fg);
  box-shadow: inset 0 1.5px 0 rgba(255, 255, 255, 0.5), 0 3px 0 rgba(16, 17, 26, 0.25);
  animation: timesup-banner-slide 220ms cubic-bezier(0.16, 1, 0.3, 1);
  position: relative;
  overflow: hidden;
}
@keyframes timesup-banner-slide {
  from { transform: translateY(-8px); opacity: 0; }
  to { transform: translateY(0); opacity: 1; }
}
.workout-timesup-banner__main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  min-width: 0;
}
.workout-timesup-banner__body {
  display: flex;
  align-items: center;
  gap: 12px;
  min-width: 0;
  flex: 1 1 auto;
}
.workout-timesup-banner__badge {
  display: grid;
  place-items: center;
  width: 36px;
  height: 36px;
  background: var(--pl-volt-fg);
  border: 1.5px solid var(--pl-volt-fg);
  border-radius: var(--radius);
  flex-shrink: 0;
  box-shadow: 2px 2px 0 rgba(16, 17, 26, 0.35);
}
.workout-timesup-banner__badge .mud-icon-root {
  font-size: 22px !important;
  width: 22px !important;
  height: 22px !important;
  color: var(--pl-volt-fill) !important;
  fill: var(--pl-volt-fill) !important;
}
.workout-timesup-banner__text {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  flex: 1 1 auto;
}
.workout-timesup-banner__kicker-row {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.workout-timesup-banner__title {
  font-family: var(--font-mono) !important;
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--pl-volt-fg) !important;
  line-height: 1;
}
.workout-timesup-banner__set-badge {
  font-family: var(--font-mono) !important;
  font-size: 13px !important;
  font-weight: 900 !important;
  letter-spacing: 0.12em !important;
  text-transform: uppercase !important;
  background: var(--pl-volt-fg) !important;
  color: var(--pl-volt-fill) !important;
  padding: 4px 10px !important;
  border: 1.5px solid var(--pl-volt-fg) !important;
  border-radius: var(--radius);
  line-height: 1.1;
  box-shadow: 2px 2px 0 rgba(16, 17, 26, 0.4) !important;
  flex-shrink: 0;
  white-space: nowrap;
}
.workout-timesup-banner__exercise-name {
  font-family: var(--font-display) !important;
  font-size: 20px;
  font-weight: 900;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--pl-volt-fg) !important;
  line-height: 1.1;
  word-break: break-word;
}
.workout-timesup-banner__actions {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
  gap: 8px;
  width: 100%;
}
.workout-timesup-banner__btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 40px;
  padding: 0 12px;
  background: #10111A !important;
  color: #FFFFFF !important;
  border: 1.5px solid #10111A !important;
  border-radius: var(--radius);
  cursor: pointer;
  font-family: var(--font-mono) !important;
  font-size: 12px !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  box-shadow: 2px 2px 0 rgba(16, 17, 26, 0.4) !important;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms ease, background 120ms ease, border-color 120ms ease !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.workout-timesup-banner__btn span {
  color: #FFFFFF !important;
  font-weight: 900 !important;
}
.workout-timesup-banner__btn .mud-icon-root {
  color: #FFFFFF !important;
  fill: #FFFFFF !important;
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
}
.workout-timesup-banner__btn:hover {
  background: #24283B !important;
  color: #FFFFFF !important;
  border-color: #24283B !important;
}
.workout-timesup-banner__btn:hover span {
  color: #FFFFFF !important;
}
.workout-timesup-banner__btn:active {
  transform: translate(1px, 1px);
  box-shadow: none !important;
}
.workout-timesup-banner__btn--ready {
  background: #10111A !important;
  color: #FFFFFF !important;
  border-color: #10111A !important;
  font-weight: 900 !important;
}
@media (max-width: 380px) {
  .workout-timesup-banner {
    padding: 10px 10px;
    gap: 8px;
  }
  .workout-timesup-banner__title {
    font-size: 10px;
  }
  .workout-timesup-banner__set-badge {
    font-size: 9px;
    padding: 1px 4px;
  }
  .workout-timesup-banner__exercise-name {
    font-size: 17px;
  }
  .workout-timesup-banner__actions {
    gap: 6px;
  }
  .workout-timesup-banner__btn {
    min-height: 34px;
    padding: 0 6px;
    font-size: 10px;
    gap: 4px;
  }
  .workout-timesup-banner__btn .mud-icon-root {
    font-size: 14px !important;
    width: 14px !important;
    height: 14px !important;
  }
}
.workout-focus__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px 8px;
  background: var(--pl-chip-2);
  border-bottom: 1.5px solid var(--pl-hairline-strong);
}
.workout-focus__head-left {
  display: flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
  flex: 1;
}
.workout-focus__index {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 3px 7px;
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline-strong);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.06em;
  color: var(--pl-purple-text);
}
html[data-theme-mode="dark"] .workout-focus__index { color: var(--pl-purple); background: var(--pl-chip-2); }
.workout-focus__superset {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 24px;
  padding: 0 8px;
  background: var(--pl-cyan);
  color: #10111A;
  border: 1.5px solid #10111A;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.06em;
  border-radius: var(--radius);
}
.workout-focus__superset-partner {
  display: flex;
  flex-direction: column;
  gap: 6px;
  padding: 10px 12px;
  background: var(--pl-chip-2);
  border-top: 1.5px solid var(--pl-hairline);
  border-left: 3px solid var(--pl-cyan);
}
.workout-focus__superset-partner[data-group="B"] { border-left-color: var(--pl-plate-red); }
.workout-focus__superset-partner[data-group="C"] { border-left-color: var(--pl-plate-blue); }
.workout-focus__superset-partner[data-group="D"] { border-left-color: var(--pl-plate-gold); }
.workout-focus__superset[data-group="B"] { background: var(--pl-plate-red); }
.workout-focus__superset[data-group="C"] { background: var(--pl-plate-blue); color: #FFFFFF; }
.workout-focus__superset[data-group="D"] { background: var(--pl-plate-gold); }
.workout-focus__superset-partner__kicker {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--pl-stone);
}
.workout-focus__superset-partner__name {
  font-family: var(--font-display);
  font-size: 14px;
  font-weight: 800;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  color: var(--pl-ink);
  line-height: 1.2;
}
.workout-focus__superset-partner__preview {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: var(--pl-ink);
  background: var(--pl-chip);
  border: 1px solid var(--pl-hairline);
  padding: 2px 8px;
}
.workout-focus__superset-partner__hint {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--pl-stone);
}
.workout-focus__badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 26px;
  padding: 0 10px;
  border-radius: var(--radius);
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border: 1.5px solid var(--pl-ink-border);
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color);
  line-height: 1;
}
.workout-focus__badge--set {
  background: var(--pl-chip);
  color: var(--pl-ink);
}
.workout-focus__badge--warmup {
  background: color-mix(in srgb, var(--pl-amber) 20%, var(--pl-chip));
  border-color: var(--pl-warn-text);
  color: var(--pl-warn-text);
}
html[data-theme-mode="dark"] .workout-focus__badge--set {
  background: #1C2033;
  color: #FAFF00;
  border-color: #2D3352;
}
.workout-focus__pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 26px;
  padding: 0 10px;
  background: var(--pl-chip-2);
  border: 1.5px solid var(--pl-ink-border);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  color: var(--pl-stone);
  font-variant-numeric: tabular-nums;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color);
  border-radius: var(--radius);
}
.workout-focus__pill--done {
  background: var(--pl-success) !important;
  border-color: var(--pl-success) !important;
  color: #FFFFFF !important;
}
html[data-theme-mode="dark"] .workout-focus__pill--done {
  color: #10111A !important;
}
.workout-focus__menu-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 36px;
  height: 36px;
  min-width: 36px;
  min-height: 36px;
  padding: 0;
  border-radius: var(--radius);
  border: 1.5px solid var(--pl-ink-border);
  background: var(--pl-chip-2);
  color: var(--pl-ink);
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color);
  box-sizing: border-box;
  cursor: pointer;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease, box-shadow 90ms ease !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.workout-focus__menu-btn:hover {
  background: var(--pl-chip);
  border-color: var(--pl-yellow);
}
.workout-focus__menu-btn:active {
  transform: translate(1px, 1px);
  box-shadow: none;
}
.workout-focus__menu-btn .mud-icon-root {
  color: var(--pl-ink);
  fill: var(--pl-ink);
  font-size: 20px;
  width: 20px;
  height: 20px;
}
.workout-focus__menu-popover,
.workout-focus__menu-popover.mud-popover,
.workout-focus__menu-popover.mud-popover-open,
.workout-focus__menu-popover.mud-popover-open.mud-popover-top-left,
.workout-focus__menu-popover.mud-popover-open.mud-popover-top-right,
.workout-focus__menu-popover.mud-popover-open.mud-popover-top-center,
.workout-focus__menu-popover.mud-popover-open.mud-popover-bottom-left,
.workout-focus__menu-popover.mud-popover-open.mud-popover-bottom-right,
.workout-focus__menu-popover.mud-popover-open.mud-popover-bottom-center {
  box-shadow: none !important;
}
.workout-focus__name {
  margin: 0;
  padding: 14px 14px 12px;
  font-family: var(--font-display) !important;
  font-size: 24px !important;
  font-weight: 900 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.15 !important;
  text-transform: uppercase !important;
  color: var(--pl-yellow) !important;
  border-bottom: 1.5px solid var(--pl-hairline);
  background: var(--pl-chip);
  word-break: break-word;
}
html[data-theme-mode="light"] .workout-focus__name {
  color: var(--pl-ink) !important;
}
.workout-focus__dots {
  display: flex;
  align-items: center;
  gap: 6px;
  padding: 10px 14px;
  background: var(--pl-chip-2);
  border-bottom: 1.5px solid var(--pl-hairline);
  flex-wrap: wrap;
}
.workout-focus__dot {
  width: 26px;
  height: 26px;
  display: inline-grid;
  place-items: center;
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-ink-border);
  position: relative;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  color: var(--pl-stone);
}
.workout-focus__dot--warmup { border-style: dashed; }
.workout-focus__dot--done {
  background: var(--pl-success);
  border-color: var(--pl-success);
  color: #FFFFFF;
}
html[data-theme-mode="dark"] .workout-focus__dot--done {
  color: #10111A;
}
.workout-focus__dot--active {
  background: var(--pl-volt-fill);
  border: 2px solid #10111A;
  color: #10111A;
  box-shadow: 2.5px 2.5px 0 var(--pl-plate-shadow-color);
  width: 28px;
  height: 28px;
  font-size: 12px;
  font-weight: 900;
  z-index: 1;
}
.workout-focus__dot-check { font-size: 11px; font-weight: 900; line-height: 1; }
.workout-focus__set-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 14px;
  background: var(--pl-chip-2);
  border-bottom: 1.5px solid var(--pl-ink-border);
}
.workout-focus__set-label {
  font-family: var(--font-display) !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  letter-spacing: -0.01em !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 6px !important;
}
.workout-focus__set-total {
  font-family: var(--font-mono) !important;
  font-size: 13px !important;
  font-weight: 800 !important;
  letter-spacing: 0.08em !important;
  color: var(--pl-stone) !important;
}
.workout-focus__warmup {
  font-family: var(--font-display) !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  letter-spacing: -0.01em !important;
  text-transform: uppercase !important;
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 6px !important;
  padding: 3px 10px !important;
  background: color-mix(in srgb, var(--pl-amber) 18%, transparent) !important;
  border: 2px solid var(--pl-warn-text) !important;
  color: var(--pl-warn-text) !important;
}
.workout-focus__set-hint {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--pl-stone);
}
.workout-focus__controls {
  display: flex;
  align-items: stretch;
  gap: 8px;
  padding: 12px 12px 12px 16px;
  background: var(--pl-chip);
  border-bottom: 1.5px solid var(--pl-hairline);
  position: relative;
  overflow: hidden;
}
.workout-focus__bumper {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  width: 5px;
  background: var(--pl-volt-fill);
  border-right: 1.5px solid var(--pl-volt-edge);
  box-shadow: 2px 0 0 var(--pl-plate-shadow-color);
}
.workout-focus__steppers {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.workout-focus__stepper {
  background: var(--pl-chip-2);
  border: 1.5px solid var(--pl-hairline-strong);
  padding: 6px 8px 6px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.workout-focus__stepper-label {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--pl-stone);
}
/* Brutalize the stepper internals inside focus */
.workout-focus__stepper .set-metric-stepper__row--compact {
  gap: 6px;
}
.workout-focus__stepper .set-metric-stepper__btn--compact {
  width: 60px !important;
  min-width: 60px !important;
  height: 60px !important;
  min-height: 60px !important;
  font-size: 30px !important;
  font-weight: 900 !important;
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  color: var(--pl-ink) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease, color 120ms ease !important;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.workout-focus__stepper .set-metric-stepper__btn--compact:hover {
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow) !important;
  background: var(--pl-chip) !important;
}
.workout-focus__stepper .set-metric-stepper__btn--compact:active {
  transform: translate(2px, 2px) !important;
  box-shadow: none !important;
  border-color: var(--pl-volt-edge) !important;
  background: var(--pl-chip) !important;
  color: var(--pl-yellow) !important;
}
.workout-focus__stepper .set-metric-stepper__value--compact {
  height: 60px !important;
  min-height: 60px !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  color: var(--pl-ink) !important;
  box-shadow: none !important;
}
.workout-focus__stepper .set-metric-stepper__value-unit {
  color: var(--pl-stone);
  font-size: 11px !important;
  letter-spacing: 0.06em;
}
.workout-focus__log {
  width: 84px;
  min-width: 84px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 4px;
  background: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  border: 1.5px solid var(--pl-volt-edge) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
  cursor: pointer;
  padding: 8px 4px;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), filter 120ms ease, box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  flex-shrink: 0;
  align-self: stretch;
}
.workout-focus__log:hover {
  background: var(--pl-volt-fill) !important;
  filter: brightness(1.08) !important;
  transform: none !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
}
.workout-focus__log:active {
  background: var(--pl-volt-fill) !important;
  transform: translate(2px, 2px) !important;
  box-shadow: none !important;
  filter: brightness(0.98);
}
.workout-focus__log:disabled {
  opacity: 0.35;
  pointer-events: none;
  box-shadow: none !important;
  transform: none !important;
}
.workout-focus__log .workout-focus__log-icon,
.workout-focus__log-icon .mud-icon-root {
  font-size: 32px !important;
  width: 32px !important;
  height: 32px !important;
  color: var(--pl-volt-fg) !important;
  fill: var(--pl-volt-fg) !important;
}
.workout-focus__log-icon {
  display: grid;
  place-items: center;
}
.workout-focus__log-label {
  font-family: var(--font-mono) !important;
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--pl-volt-fg) !important;
  line-height: 1;
}
.workout-next {
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 8px;
  padding: 14px 16px;
  background: var(--pl-chip-2);
  border-top: 2px solid var(--pl-ink-border);
  user-select: none;
  touch-action: pan-y;
  cursor: default;
  transition: transform 90ms ease, background 120ms ease;
}
.workout-next--swipeable:active {
  transform: translate(1px, 1px);
}
.workout-next__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}
.workout-next__kicker {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-mono);
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  line-height: 1;
  color: #10111A !important;
  background: #FAFF00 !important;
  border: 1.5px solid #10111A !important;
  padding: 2px 8px;
  border-radius: var(--radius);
  box-shadow: 1.5px 1.5px 0 var(--pl-plate-shadow-color);
  flex-shrink: 0;
}
html[data-theme-mode="dark"] .workout-next__kicker {
  color: #10111A !important;
  background: #FAFF00 !important;
  border-color: #10111A !important;
}
.workout-next__set-badge {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-mono);
  font-size: 10px !important;
  font-weight: 900 !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--pl-ink) !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 1.5px 1.5px 0 var(--pl-plate-shadow-color);
  padding: 2px 8px;
  border-radius: var(--radius);
  line-height: 1;
  flex-shrink: 0;
}
html[data-theme-mode="dark"] .workout-next__set-badge {
  color: #C0CAF5 !important;
  background: #10111A !important;
  border-color: #2D3352 !important;
}
.workout-next__name {
  font-family: var(--font-display);
  font-size: 18px !important;
  font-weight: 900 !important;
  letter-spacing: -0.015em;
  text-transform: uppercase;
  color: var(--pl-ink) !important;
  line-height: 1.2;
  text-align: center !important;
  width: 100%;
  white-space: normal;
  overflow-wrap: break-word;
  word-break: break-word;
}
html[data-theme-mode="dark"] .workout-next__name {
  color: #FFFFFF !important;
}
.workout-next__preview {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-mono);
  font-size: 13px !important;
  font-weight: 900 !important;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--pl-ink) !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color);
  padding: 4px 12px;
  border-radius: var(--radius);
  line-height: 1;
  text-align: center !important;
  margin: 0 auto;
  white-space: nowrap;
}
html[data-theme-mode="dark"] .workout-next__preview {
  color: var(--pl-yellow) !important;
  background: #10111A !important;
  border-color: #2D3352 !important;
}
.workout-focus__history {
  background: var(--pl-chip-2);
  border-top: 1.5px solid var(--pl-hairline);
  overflow: hidden;
}
.workout-focus__history-summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  cursor: pointer;
  user-select: none;
  background: var(--pl-chip-2);
  border-bottom: 1.5px solid transparent;
  transition: background 120ms ease, border-color 120ms ease;
}
.workout-focus__history-summary::-webkit-details-marker { display: none; }
.workout-focus__history[open] .workout-focus__history-summary {
  background: var(--pl-chip);
  border-bottom-color: var(--pl-hairline);
}
.workout-focus__history-label {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--pl-stone);
}
.workout-focus__history-meta {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}
.workout-focus__history-expand {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--pl-ink);
  background: var(--pl-chip);
  border: 1px solid var(--pl-hairline);
  padding: 2px 6px;
  line-height: 1;
}
.workout-focus__history[open] .workout-focus__history-expand { content: "HIDE"; }
.workout-focus__history-chevron {
  display: inline-grid;
  place-items: center;
  transition: transform 180ms ease;
  color: var(--pl-stone);
}
.workout-focus__history-chevron .mud-icon-root { font-size: 16px !important; width: 16px !important; height: 16px !important; }
.workout-focus__history[open] .workout-focus__history-chevron { transform: rotate(180deg); }
.workout-focus__history-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 10px 12px 12px;
  background: var(--pl-chip-2);
}
.workout-focus__history-row {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 6px 8px;
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline);
}
.workout-focus__history-row--warmup {
  background: color-mix(in srgb, var(--pl-amber) 8%, var(--pl-chip));
  border-color: color-mix(in srgb, var(--pl-amber) 30%, var(--pl-hairline));
}
.workout-focus__history-set {
  width: 34px;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  color: var(--pl-ink);
  background: var(--pl-chip-2);
  border: 1px solid var(--pl-hairline);
  height: 28px;
}
.workout-focus__history-warmup {
  color: var(--pl-warn-text);
  font-size: 10px;
}
.workout-focus__history-steppers {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.workout-focus__history-steppers .set-metric-stepper__row--compact {
  gap: 6px;
}
.workout-focus__history-steppers .set-metric-stepper__btn--compact {
  width: 48px !important;
  min-width: 48px !important;
  height: 48px !important;
  min-height: 48px !important;
  font-size: 24px !important;
  font-weight: 800 !important;
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  color: var(--pl-ink) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease, color 120ms ease !important;
  user-select: none;
  -webkit-user-select: none;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.workout-focus__history-steppers .set-metric-stepper__btn--compact:hover {
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow) !important;
  background: var(--pl-chip) !important;
}
.workout-focus__history-steppers .set-metric-stepper__btn--compact:active {
  transform: translate(2px, 2px) !important;
  box-shadow: none !important;
  border-color: var(--pl-volt-edge) !important;
  background: var(--pl-chip) !important;
  color: var(--pl-yellow) !important;
}
.workout-focus__history-steppers .set-metric-stepper__value--compact {
  height: 48px !important;
  min-height: 48px !important;
  font-size: 16px !important;
}

/* REST TAKEOVER, two distinct cards, not a fused block */
.workout-deck:has(.workout-rest-takeover) {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
  overflow: visible !important;
}
.workout-deck:has(.workout-rest-takeover)::before {
  display: none !important;
}
.workout-rest-takeover {
  display: flex;
  flex-direction: column;
  gap: 12px;
  background: transparent;
}
.workout-rest-card {
  background: var(--pl-chip);
  border: 2px solid var(--pl-ink-border);
  box-shadow: var(--pl-plate-shadow-md);
  overflow: hidden;
}
.workout-rest-takeover__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px 8px;
  background: var(--pl-chip-2);
  border-bottom: 2px solid var(--pl-ink-border);
}
.workout-rest-takeover__kicker {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--pl-ink);
}
html[data-theme-mode="dark"] .workout-rest-takeover__kicker {
  color: #C0CAF5;
}
.workout-rest-takeover__dot {
  width: 9px;
  height: 9px;
  background: var(--pl-volt-fill);
  border: 1.5px solid var(--pl-ink);
  box-shadow: 1.5px 1.5px 0 var(--pl-plate-shadow-color);
}
.workout-rest-takeover .rest-timer-panel.mud-paper {
  border: none !important;
  box-shadow: none !important;
  border-radius: 0 !important;
  background: var(--pl-chip) !important;
}
.workout-rest-takeover .rest-timer-active {
  padding: 0;
}
.workout-rest-takeover .rest-timer-display {
  padding: 10px 0 6px;
  background: var(--pl-chip) !important;
}
.workout-rest-takeover .rest-timer-digits {
  font-size: clamp(110px, 30vw, 144px) !important;
  font-size: clamp(110px, round(30vw, 11px), 176px) !important;
  padding: 18px 0 10px !important;
  color: var(--pl-ink) !important;
  text-shadow: none !important;
}
html[data-theme-mode="dark"] .workout-rest-takeover .rest-timer-digits {
  color: var(--pl-yellow) !important;
}
.workout-rest-takeover .rest-timer-digits--imminent {
  color: #C2410C !important;
  text-shadow: none !important;
}
.workout-rest-takeover .rest-timer-digits--urgent {
  color: #9F1239 !important;
  text-shadow: none !important;
}
.workout-rest-takeover__next {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 16px 18px 18px;
  background: var(--pl-chip);
  border: 2px solid var(--pl-ink-border);
  box-shadow: 6px 6px 0 var(--pl-plate-shadow-color);
  text-align: center;
  user-select: none;
  touch-action: pan-y;
  cursor: default;
  transition: transform 90ms ease;
}
html[data-theme-mode="dark"] .workout-rest-takeover__next {
  background: #1C2033;
  border-color: #2D3352;
}
.workout-rest-takeover__next--swipeable:active {
  transform: translate(1px, 1px);
}
.workout-rest-takeover__next-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  gap: 8px;
  margin-bottom: 2px;
}
.workout-rest-takeover__next-kicker {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-mono);
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--pl-volt-fg) !important;
  background: var(--pl-volt-fill) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color);
  padding: 3px 10px;
  border-radius: var(--radius);
  line-height: 1;
}
html[data-theme-mode="dark"] .workout-rest-takeover__next-kicker {
  color: #10111A !important;
  background: #FAFF00 !important;
  border-color: #10111A !important;
}
.workout-rest-takeover__next-set {
  display: inline-flex;
  align-items: center;
  font-family: var(--font-mono);
  font-size: 11px !important;
  font-weight: 900 !important;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--pl-ink) !important;
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color);
  padding: 3px 10px;
  border-radius: var(--radius);
  line-height: 1;
}
html[data-theme-mode="dark"] .workout-rest-takeover__next-set {
  color: #C0CAF5 !important;
  background: #10111A !important;
  border-color: #2D3352 !important;
}
.workout-rest-takeover__next-name {
  font-family: var(--font-display);
  font-size: clamp(26px, 7vw, 36px) !important;
  font-weight: 900 !important;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  line-height: 1.08;
  color: var(--pl-ink) !important;
  text-align: center;
  word-break: break-word;
  margin: 4px 0 2px;
}
html[data-theme-mode="dark"] .workout-rest-takeover__next-name {
  color: #FFFFFF !important;
}
.workout-rest-takeover__next-preview {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-family: var(--font-mono);
  font-size: 1.0625rem !important;
  font-weight: 900 !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--pl-ink) !important;
  background: var(--pl-chip-2) !important;
  border: 2px solid var(--pl-ink-border) !important;
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color) !important;
  border-radius: var(--radius);
  padding: 8px 18px;
  line-height: 1;
  margin-top: 4px;
}
html[data-theme-mode="dark"] .workout-rest-takeover__next-preview {
  color: var(--pl-yellow) !important;
  background: #10111A !important;
  border-color: #2D3352 !important;
  box-shadow: 3px 3px 0 #000000 !important;
}
.workout-rest-takeover__next-preview:empty { display: none; }

/* Override rest timer controls inside takeover to be brutal */
.workout-rest-takeover .rest-timer-controls {
  padding: 8px 14px 16px !important;
  gap: 12px !important;
  display: grid !important;
  grid-template-columns: repeat(3, 1fr) !important;
  background: transparent !important;
  border-top: none !important;
}
.workout-rest-takeover .rest-timer-add-btn,
.workout-rest-takeover .rest-timer-icon-btn {
  width: 100% !important;
  min-width: 0 !important;
  height: 54px !important;
  min-height: 54px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  background: var(--pl-chip-2) !important;
  border: 2px solid var(--pl-ink-border) !important;
  color: var(--pl-ink) !important;
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color) !important;
  border-radius: var(--radius) !important;
  font-family: var(--font-mono) !important;
  font-size: 1.0625rem !important;
  font-weight: 900 !important;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease, color 120ms ease !important;
  box-sizing: border-box !important;
  cursor: pointer !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.workout-rest-takeover .rest-timer-add-btn:hover,
.workout-rest-takeover .rest-timer-icon-btn:hover {
  background: var(--pl-chip) !important;
  color: var(--pl-ink) !important;
}
.workout-rest-takeover .rest-timer-add-btn:active,
.workout-rest-takeover .rest-timer-icon-btn:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 1px 1px 0 var(--pl-plate-shadow-color) !important;
}
.workout-rest-takeover .rest-timer-icon-btn .mud-icon-root {
  font-size: 28px !important;
  width: 28px !important;
  height: 28px !important;
  color: var(--pl-ink) !important;
  fill: var(--pl-ink) !important;
}
html[data-theme-mode="dark"] .workout-rest-takeover .rest-timer-add-btn,
html[data-theme-mode="dark"] .workout-rest-takeover .rest-timer-icon-btn {
  background: #1C2033 !important;
  color: var(--pl-yellow) !important;
  border-color: var(--pl-hairline-strong) !important;
  box-shadow: 3px 3px 0 #10111A !important;
}
html[data-theme-mode="dark"] .workout-rest-takeover .rest-timer-add-btn:hover,
html[data-theme-mode="dark"] .workout-rest-takeover .rest-timer-icon-btn:hover {
  background: #252B42 !important;
  color: var(--pl-yellow) !important;
}
html[data-theme-mode="dark"] .workout-rest-takeover .rest-timer-icon-btn .mud-icon-root {
  color: var(--pl-yellow) !important;
  fill: #FAFF00 !important;
}

/* TRANSPORT, brutal thumb bar */
.workout-transport {
  display: flex;
  align-items: stretch;
  gap: 6px;
  background: var(--pl-chip-2);
  border: 1.5px solid var(--pl-hairline-strong);
  padding: 4px;
  box-shadow: var(--pl-plate-shadow-sm);
}
.workout-transport__btn {
  width: 48px;
  min-width: 48px;
  height: 48px;
  display: inline-grid;
  place-items: center;
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline-strong);
  color: var(--pl-ink);
  cursor: pointer;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), border-color 120ms ease, color 120ms ease, background 120ms ease !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.workout-transport__btn:hover:not(:disabled) {
  border-color: var(--pl-yellow);
  color: var(--pl-yellow);
  background: var(--pl-chip-2);
}
.workout-transport__btn:active:not(:disabled) { transform: translate(1px,1px); }
.workout-transport__btn:disabled {
  opacity: 0.35;
  pointer-events: none;
}
.workout-transport__btn .mud-icon-root {
  font-size: 22px !important;
  width: 22px !important;
  height: 22px !important;
}
.workout-transport__center {
  flex: 1 1 auto;
  min-width: 0;
  display: grid;
  place-items: center;
  padding: 8px;
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline);
  text-align: center;
}
.workout-transport__pos {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.08em;
  color: var(--pl-ink);
  font-variant-numeric: tabular-nums;
}
.workout-transport__name {
  font-family: var(--font-display);
  font-size: 12px;
  font-weight: 800;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  color: var(--pl-ink);
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.workout-transport__hint {
  font-family: var(--font-mono);
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--pl-stone);
}

/* Sequence strip, machined tape of upcoming exercises */
.workout-sequence-strip {
  display: flex;
  align-items: stretch;
  gap: 6px;
  overflow-x: auto;
  padding: 2px 2px 4px;
  scrollbar-width: none;
}
.workout-sequence-strip::-webkit-scrollbar { display: none; }
.workout-sequence-strip__item {
  flex: 0 0 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 5px;
  padding: 7px 8px 6px;
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline);
  cursor: pointer;
  min-width: 62px;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms cubic-bezier(0.2, 0, 0, 1), background 120ms ease, border-color 120ms ease;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.workout-sequence-strip__item:active {
  transform: translate(1px, 1px);
}
.workout-sequence-strip__item--active {
  background: var(--pl-volt-fill);
  border-color: var(--pl-volt-edge);
  box-shadow: var(--pl-plate-shadow-sm);
  transform: translate(-1px, -1px);
}
.workout-sequence-strip__item--active:active {
  transform: translate(2px, 2px) !important;
  box-shadow: none !important;
}
.workout-sequence-strip__num {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.06em;
  color: var(--pl-stone);
}
.workout-sequence-strip__item--active .workout-sequence-strip__num { color: var(--pl-volt-fg); }
.workout-sequence-strip__pips {
  display: flex;
  gap: 4px;
  align-items: center;
  justify-content: center;
}
.workout-sequence-strip__pip {
  width: 8px;
  height: 8px;
  background: var(--pl-paper-2);
  border: 1.5px solid var(--pl-hairline-strong);
  display: block;
  box-sizing: border-box;
  transition: transform 120ms ease, box-shadow 120ms ease, background 120ms ease;
}
.workout-sequence-strip__pip--done {
  background: var(--pl-success) !important;
  border-color: var(--pl-success) !important;
}
.workout-sequence-strip__pip--active {
  width: 8px;
  height: 8px;
  background: var(--pl-volt-fill) !important;
  border: 1.5px solid #10111A !important;
  box-shadow: 0 0 0 1.5px var(--pl-volt-fill), 0 0 0 3px #10111A !important;
  z-index: 1;
}
.workout-sequence-strip__item--active .workout-sequence-strip__pip {
  background: transparent;
  border: 1.5px solid rgba(16, 17, 26, 0.4);
}
.workout-sequence-strip__item--active .workout-sequence-strip__pip--done {
  background: #10111A !important;
  border-color: #10111A !important;
  opacity: 0.95;
}
.workout-sequence-strip__item--active .workout-sequence-strip__pip--active {
  background: #10111A !important;
  border: 2px solid var(--pl-volt-fill) !important;
  box-shadow: 0 0 0 1.5px #10111A !important;
}
.workout-sequence-strip__item--active .workout-sequence-strip__pip--done.workout-sequence-strip__pip--active {
  background: #10111A !important;
  border: 1.5px solid #10111A !important;
  box-shadow: none !important;
  transform: none !important;
}

/* Completed rail, brutal details */
.workout-completed-rail {
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline-strong);
  box-shadow: var(--pl-plate-shadow-sm);
  overflow: hidden;
}
.workout-completed-rail__summary {
  list-style: none;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  cursor: pointer;
  user-select: none;
  background: var(--pl-chip-2);
  border-bottom: 1.5px solid var(--pl-hairline);
}
.workout-completed-rail__summary::-webkit-details-marker { display: none; }
.workout-completed-rail[open] .workout-completed-rail__summary {
  border-bottom: 1.5px solid var(--pl-hairline-strong);
  background: var(--pl-chip);
}
.workout-completed-rail__summary-left {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--pl-ink);
}
.workout-completed-rail__check {
  width: 18px;
  height: 18px;
  display: inline-grid;
  place-items: center;
  background: var(--pl-success);
  color: #FFFFFF !important;
  font-size: 11px;
  font-weight: 900;
  border: 1px solid var(--pl-success);
}
html[data-theme-mode="dark"] .workout-completed-rail__check {
  color: #10111A !important;
}
.workout-completed-rail__summary-right {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--pl-stone);
}
html[data-theme-mode="light"] .workout-completed-rail__summary-right {
  color: var(--pl-ink-2);
}
.workout-completed-rail__icon {
  transition: transform 180ms ease;
}
.workout-completed-rail[open] .workout-completed-rail__icon { transform: rotate(180deg); }
.workout-completed-rail__icon .mud-icon-root { font-size: 16px !important; width: 16px !important; height: 16px !important; }
.workout-completed-rail__list {
  display: flex;
  flex-direction: column;
  padding: 6px;
  gap: 6px;
  background: var(--pl-chip);
}
.workout-completed-rail__item {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 9px 10px;
  background: var(--pl-chip-2);
  border: 1.5px solid var(--pl-hairline);
  cursor: pointer;
  transition: transform 90ms ease, border-color 120ms ease, background 120ms ease !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.workout-completed-rail__item:hover {
  border-color: var(--pl-yellow);
  background: var(--pl-chip);
}
.workout-completed-rail__item:active {
  transform: translate(1px, 1px);
}
.workout-completed-rail__item-num {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  color: var(--pl-purple-text);
  background: var(--pl-chip);
  border: 1px solid var(--pl-hairline);
  padding: 2px 6px;
}
html[data-theme-mode="dark"] .workout-completed-rail__item-num { color: var(--pl-purple); }
.workout-completed-rail__item-name {
  flex: 1 1 auto;
  min-width: 0;
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  color: var(--pl-ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.workout-completed-rail__item-meta {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 800;
  color: #FFFFFF !important;
  background: var(--pl-success);
  border: 1px solid var(--pl-success);
  padding: 2px 6px;
  white-space: nowrap;
}
html[data-theme-mode="dark"] .workout-completed-rail__item-meta {
  color: #10111A !important;
}
.workout-completed-rail__item-chevron .mud-icon-root {
  font-size: 16px !important;
  width: 16px !important;
  height: 16px !important;
  color: var(--pl-stone) !important;
}

/* Actions, brutal end bar */
.workout-actions {
  display: flex;
  gap: 8px;
  padding-top: 2px;
}
.workout-actions__btn {
  flex: 1 1 0;
  height: 48px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  border: 1.5px solid;
  cursor: pointer;
  transition: transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms ease, background 120ms ease, color 120ms ease, border-color 120ms ease !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
}
.workout-actions__btn--discard {
  background: var(--pl-chip);
  color: var(--pl-err-text);
  border-color: color-mix(in srgb, var(--pl-err-text) 45%, var(--pl-hairline-strong));
  box-shadow: var(--pl-plate-shadow-sm);
}
.workout-actions__btn--discard:hover {
  background: var(--pl-error);
  color: #FFFFFF;
  border-color: var(--pl-error);
}
html[data-theme-mode="dark"] .workout-actions__btn--discard:hover { color: #10111A; }
.workout-actions__btn--end {
  background: var(--pl-volt-fill);
  background-image: linear-gradient(180deg, color-mix(in srgb, var(--pl-volt-fill) 84%, #FFFFFF) 0%, var(--pl-volt-fill) 58%, color-mix(in srgb, var(--pl-volt-fill) 88%, #000000) 100%);
  color: var(--pl-volt-fg);
  border-color: var(--pl-volt-edge);
  box-shadow: var(--pl-plate-shadow-sm);
}
.workout-actions__btn--end:hover { filter: brightness(1.08); }
.workout-actions__btn:active { transform: translate(2px, 2px); box-shadow: none !important; }
.workout-actions__btn .mud-icon-root {
  font-size: 18px !important;
  width: 18px !important;
  height: 18px !important;
}

/* Done state */
.workout-done {
  padding: 24px 16px;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
  text-align: center;
  background: color-mix(in srgb, var(--pl-success) 8%, var(--pl-chip));
  border-top: 3px solid var(--pl-success);
  min-height: 180px;
}
.workout-done__plate {
  display: inline-flex;
  padding: 4px 10px;
  background: var(--pl-success);
  color: #FFFFFF !important;
  border: 1.5px solid var(--pl-success);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}
html[data-theme-mode="dark"] .workout-done__plate {
  color: #10111A !important;
}
.workout-done__title {
  margin: 0;
  font-family: var(--font-display) !important;
  font-size: 22px !important;
  font-weight: 900 !important;
  letter-spacing: 0.02em !important;
  color: var(--pl-ink) !important;
}
.workout-done__sub {
  margin: 0;
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--pl-stone);
  max-width: 28ch;
}

/* Legacy workout classes retired, suppress old multi-card layout when brutal is present */
.workout-brutal ~ .workout-exercise-layout,
.workout-top,
.workout-actions-row,
.exercise-accordion-card {
  /* keep for fallback but brutal layout replaces them visually */
}

/* Mobile brutal density, tighten at <=380px */
@media (max-width: 380px) {
  .workout-brutal { gap: 8px; }
  .workout-brutal__title { font-size: 18px !important; }
  .workout-hud__value { font-size: 15px !important; }
  .workout-focus__name { font-size: 20px !important; padding: 12px 10px 10px; }
  .workout-focus__controls { padding: 10px; gap: 6px; }
  .workout-focus__log { width: 68px !important; min-width: 68px !important; }
  .workout-focus__log-label { font-size: 10px !important; letter-spacing: 0.1em !important; }
  .workout-focus__stepper .set-metric-stepper__btn--compact { width: 56px !important; min-width: 56px !important; height: 56px !important; font-size: 28px !important; }
  .workout-focus__stepper .set-metric-stepper__value--compact { height: 56px !important; font-size: 20px !important; }
}

/* Removed duplicates: hide legacy expand labels and duplicated strips */
.workout-hud__exercise-strip,
.workout-focus__edge,
.workout-focus__dots,
.workout-focus__set-hint,
.workout-focus__history-expand,
.workout-focus__history-meta,
.workout-transport__name,
.workout-transport__hint,
.workout-completed-rail__expand,
.workout-brutal__header-meta,
.workout-brutal__header-count {
  display: none !important;
}

/* Desktop: center and cap brutal column, add a touch more breathing */
@media (min-width: 640px) {
  .workout-brutal { max-width: 520px; }
  .workout-brutal__title { font-size: 22px !important; }
  .workout-focus__name { font-size: 26px !important; }
}

/* prefers-contrast: strip shadows, keep brutal borders */
@media (prefers-contrast: more) {
  .workout-brutal__header,
  .workout-hud,
  .workout-deck,
  .workout-transport,
  .workout-completed-rail,
  .workout-actions__btn,
  .workout-focus__log,
  .workout-sequence-strip__item--active {
    box-shadow: none !important;
    transform: none !important;
  }
}

/* ==================================================================
   ACID BRUTALIST LIGHT, extra dosage where light felt too polite.
   Keeps the Tokyo Night discipline (one volt per region, shape+label)
   but lets concrete, hazard, and registration do more work in light.
   Only light theme is touched; dark stays as the reference neon.
   ================================================================== */
html[data-theme-mode="light"] .stat-card.mud-paper {
  border-width: 1.5px !important;
  border-color: var(--pl-ink-border) !important;
  box-shadow: 5px 5px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .stat-card__label {
  background: var(--pl-chip-2) !important;
  border-top: 1.5px solid var(--pl-hairline-strong) !important;
  color: var(--pl-ink-2) !important;
}
html[data-theme-mode="light"] .stat-card:nth-child(1) .stat-card__value {
  background-image: linear-gradient(155deg, color-mix(in srgb, var(--pl-volt-fill) 28%, var(--pl-chip)) 0%, color-mix(in srgb, var(--pl-yellow) 16%, transparent) 100%) !important;
  border-bottom: 3px solid var(--pl-volt-fill) !important;
}
html[data-theme-mode="light"] .stat-card:nth-child(2) .stat-card__value {
  background-image: linear-gradient(155deg, color-mix(in srgb, var(--pl-cyan) 22%, var(--pl-chip)) 0%, color-mix(in srgb, var(--pl-cyan) 12%, transparent) 100%) !important;
  border-bottom: 3px solid var(--pl-cyan) !important;
}
html[data-theme-mode="light"] .stat-card:nth-child(3) .stat-card__value {
  background-image: linear-gradient(155deg, color-mix(in srgb, var(--pl-purple) 22%, var(--pl-chip)) 0%, color-mix(in srgb, var(--pl-purple) 12%, transparent) 100%) !important;
  border-bottom: 3px solid var(--pl-purple) !important;
}
html[data-theme-mode="light"] .stat-card:nth-child(4) .stat-card__value {
  background-image: linear-gradient(155deg, color-mix(in srgb, var(--pl-success) 22%, var(--pl-chip)) 0%, color-mix(in srgb, var(--pl-success) 12%, transparent) 100%) !important;
  border-bottom: 3px solid var(--pl-success) !important;
}
html[data-theme-mode="light"] .home-hero.mud-paper {
  border: 2px solid var(--pl-ink-border) !important;
  background-color: var(--pl-chip) !important;
  background-image:
    repeating-linear-gradient(-45deg, rgba(250, 255, 0, 0.18) 0 14px, transparent 14px 28px),
    linear-gradient(150deg, color-mix(in srgb, var(--pl-volt-fill) 18%, var(--pl-chip)) 0%, color-mix(in srgb, var(--pl-cyan) 8%, var(--pl-chip)) 55%, var(--pl-chip) 100%) !important;
  box-shadow: 6px 6px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .bodyweight-panel.mud-paper,
html[data-theme-mode="light"] .history-heatmap-panel.mud-paper,
html[data-theme-mode="light"] .home-heatmap-panel.mud-paper {
  border: 1.5px solid var(--pl-ink-border) !important;
  background-color: var(--pl-chip) !important;
  box-shadow: 6px 6px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .history-session-card__badge-inprogress {
  background: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .load-dot {
  border-width: 1.5px !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.45), 1px 1px 0 rgba(26,27,38,0.12) !important;
}
html[data-theme-mode="light"] .plan-card__load-dots .load-dot--5 {
  background: var(--pl-chip-2) !important;
  border-color: var(--pl-ink-border) !important;
  color: var(--pl-ink) !important;
}
html[data-theme-mode="light"] .set-metric-stepper__btn.mud-button-root,
html[data-theme-mode="light"] .set-metric-stepper__btn,
html[data-theme-mode="light"] .set-metric-stepper__btn--compact,
html[data-theme-mode="light"] .workout-focus__stepper .set-metric-stepper__btn--compact,
html[data-theme-mode="light"] .workout-focus__history-steppers .set-metric-stepper__btn--compact {
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .set-metric-stepper__value,
html[data-theme-mode="light"] .set-metric-stepper__input {
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .set-metric-stepper__btn.mud-button-root:hover,
html[data-theme-mode="light"] .set-metric-stepper__btn:hover,
html[data-theme-mode="light"] .set-metric-stepper__btn--compact:hover,
html[data-theme-mode="light"] .workout-focus__stepper .set-metric-stepper__btn--compact:hover,
html[data-theme-mode="light"] .workout-focus__history-steppers .set-metric-stepper__btn--compact:hover {
  background: color-mix(in srgb, var(--pl-volt-fill) 8%, var(--pl-chip-2)) !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow-text) !important;
}
html[data-theme-mode="light"] .workout-focus__stepper .set-metric-stepper__value--compact,
html[data-theme-mode="light"] .workout-focus__stepper .set-metric-stepper__input--compact,
html[data-theme-mode="light"] .workout-focus__history-steppers .set-metric-stepper__value--compact,
html[data-theme-mode="light"] .workout-focus__history-steppers .set-metric-stepper__input--compact {
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .exercise-accordion-card {
  border: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme-mode="light"] .exercise-accordion-card--expanded {
  border-color: var(--pl-ink-border) !important;
  box-shadow: 6px 6px 0 var(--pl-plate-shadow-color), inset 0 0 0 1px var(--pl-ink-border) !important;
}
html[data-theme-mode="light"] .workout-deck:has(.workout-rest-takeover) {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
html[data-theme-mode="light"] .workout-rest-card {
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: var(--pl-plate-shadow-md) !important;
}
html[data-theme-mode="light"] .workout-rest-takeover__next {
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: var(--pl-plate-shadow-md) !important;
}
html[data-theme-mode="light"] .workout-hud,
html[data-theme-mode="light"] .workout-focus,
html[data-theme-mode="light"] .workout-brutal__header {
  border: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme-mode="light"] .workout-hud__stat {
  border-color: var(--pl-hairline) !important;
}
html[data-theme-mode="light"] .workout-hud__bar {
  border: 1.5px solid var(--pl-ink-border) !important;
  background: var(--pl-chip-2) !important;
}
html[data-theme-mode="light"] .plan-exercise-row {
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .plan-exercise-row:hover {
  border-color: var(--pl-yellow) !important;
}
html[data-theme-mode="light"] .plan-exercise-handle {
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme-mode="light"] .workout-hud__stat {
  background: var(--pl-chip) !important;
}
html[data-theme-mode="light"] .workout-hud__stat--volume .workout-hud__label {
  color: #0369A1 !important;
}
html[data-theme-mode="light"] .workout-hud__stat--sets .workout-hud__label {
  color: #15803D !important;
}
html[data-theme-mode="light"] .workout-hud__stat--elapsed .workout-hud__label {
  color: #27272A !important;
}
html[data-theme-mode="light"] .workout-hud__bar-label {
  color: var(--pl-ink-2) !important;
  font-weight: 800 !important;
}
html[data-theme-mode="light"] .workout-hud__bar-pct {
  color: var(--pl-ink) !important;
  font-weight: 900 !important;
}
html[data-theme-mode="light"] .workout-hud__value {
  color: var(--pl-ink) !important;
}
html[data-theme-mode="light"] .workout-hud__fill {
  background: var(--pl-volt-fill) !important;
  background-image: repeating-linear-gradient(-45deg, #E6EB00 0 8px, #10111A 8px 10px, #FAFF00 10px 18px) !important;
  border-right: 2px solid #10111A !important;
}
html[data-theme-mode="light"] .workout-focus__head {
  background: var(--pl-chip-2) !important;
  border-bottom: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme-mode="light"] .workout-focus__pill {
  background: var(--pl-chip-2) !important;
  color: var(--pl-ink) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  font-weight: 900 !important;
}
html[data-theme-mode="light"] .workout-focus__pill--done {
  background: #0B6A32 !important;
  color: #FFFFFF !important;
  border-color: #10111A !important;
}
html[data-theme-mode="light"] .workout-focus__dot--done {
  background: #0B6A32 !important;
  color: #FFFFFF !important;
  border-color: #10111A !important;
}
html[data-theme-mode="light"] .workout-focus__dot--active {
  background: #FAFF00 !important;
  color: #10111A !important;
  border: 2px solid #10111A !important;
  box-shadow: 2.5px 2.5px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .workout-focus__steppers {
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme-mode="light"] .workout-focus__name {
  color: var(--pl-ink) !important;
}
html[data-theme-mode="light"] .workout-focus__log {
  background: #FAFF00 !important;
  color: #10111A !important;
  border: 2px solid #10111A !important;
  box-shadow: 4px 4px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .workout-sequence-strip__item {
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .workout-sequence-strip__item:not(.workout-sequence-strip__item--active) .workout-sequence-strip__num {
  color: var(--pl-ink-2) !important;
  font-weight: 800 !important;
}
html[data-theme-mode="light"] .workout-sequence-strip__item--active {
  background: var(--pl-chip) !important;
  border: 2.5px solid var(--pl-ink) !important;
  box-shadow: 4px 4px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .workout-sequence-strip__item--active .workout-sequence-strip__name,
html[data-theme-mode="light"] .workout-sequence-strip__item--active .workout-sequence-strip__num {
  color: var(--pl-ink) !important;
  font-weight: 900 !important;
}
html[data-theme-mode="light"] .workout-sequence-strip__pip--active {
  background: #FAFF00 !important;
  border: 1.5px solid #10111A !important;
}
html[data-theme-mode="light"] .workout-sequence-strip__pip--done {
  background: #0B6A32 !important;
  border: 1.5px solid #10111A !important;
}
html[data-theme-mode="light"] .workout-sequence-strip__pip:not(.workout-sequence-strip__pip--done):not(.workout-sequence-strip__pip--active) {
  border-color: var(--pl-ink-border) !important;
  background: var(--pl-chip) !important;
}
html[data-theme-mode="light"] .workout-completed-rail__check {
  background: #0B6A32 !important;
  border-color: #0B6A32 !important;
  color: #FFFFFF !important;
}
html[data-theme-mode="light"] .workout-completed-rail__item-meta {
  background: #0B6A32 !important;
  border-color: #0B6A32 !important;
  color: #FFFFFF !important;
}
html[data-theme-mode="light"] .workout-completed-rail__item-chevron .mud-icon-root {
  color: var(--pl-ink-2) !important;
}
html[data-theme-mode="light"] .completed-icon {
  background: #0B6A32 !important;
  color: #FFFFFF !important;
}
html[data-theme-mode="light"] .rest-timer-edge-fill {
  background: var(--pl-ink) !important;
}
html[data-theme-mode="light"] .rest-timer-edge-fill--imminent {
  background: #C2410C !important;
}
html[data-theme-mode="light"] .rest-timer-edge-fill--urgent {
  background: #9F1239 !important;
}
html[data-theme-mode="light"] .workout-actions__btn--discard {
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  color: var(--pl-err-text) !important;
}
html[data-theme-mode="light"] .workout-actions__btn--end {
  background: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: var(--pl-plate-shadow-sm) !important;
}
html[data-theme-mode="light"] .workout-actions__btn--end .mud-icon-root {
  color: var(--pl-volt-fg) !important;
  fill: var(--pl-volt-fg) !important;
}
html[data-theme-mode="light"] .workout-actions__btn--end:hover {
  background: var(--pl-volt-fill) !important;
  filter: brightness(1.08) !important;
}
html[data-theme-mode="light"] .app-nav-pill__inner {
  background: var(--pl-chip) !important;
  border: 2px solid var(--pl-ink-border) !important;
  box-shadow: 8px 8px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .mud-dialog {
  border: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme-mode="light"] .mud-dialog-title {
  background: var(--pl-chip-2) !important;
  border-bottom: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme-mode="light"] .home-plans-new-btn.mud-button-root,
html[data-theme-mode="light"] .plan-sheet-save-btn,
html[data-theme-mode="light"] .log-set-btn,
html[data-theme-mode="light"] .workout-focus__log,
html[data-theme-mode="light"] .bodyweight-log-row__log-btn,
html[data-theme-mode="light"] .ai-chat-send-button {
  background: var(--pl-volt-fill) !important;
  color: var(--pl-volt-fg) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 4px 4px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .home-plans-new-btn.mud-button-root:hover,
html[data-theme-mode="light"] .plan-sheet-save-btn:hover,
html[data-theme-mode="light"] .log-set-btn:hover,
html[data-theme-mode="light"] .workout-focus__log:hover {
  background: var(--pl-volt-fill) !important;
  filter: brightness(1.06) !important;
}

/* ==================================================================
   CLIPBOARD TAB FIX, brutalist plate pass made checkboxes 44px
   plates with shadows, so the 3px shadow covered the label text
   and the control looked ugly. Textareas kept the global 48px
   min-height, so long placeholders clipped after two lines.
   Reset checkboxes to a tight 20px square with no shadow and
   give bridge fields enough height to show their full placeholder.
   ================================================================== */
.mud-checkbox {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
  cursor: pointer !important;
  padding: 6px 0 !important;
}
.mud-checkbox .mud-typography {
  font-family: var(--font-body) !important;
  font-size: 0.875rem !important;
  font-weight: 600 !important;
  line-height: 1.4 !important;
  letter-spacing: -0.01em !important;
  color: var(--pl-ink) !important;
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
}
/* The box itself: small brutalist square, not a 44px plate.
   Use #app prefix to beat the brutalist plate's 0,7,1 specificity. */
#app .mud-checkbox .mud-icon-button,
#app .mud-checkbox .mud-button-root.mud-icon-button,
html #app .mud-checkbox .mud-icon-button,
html[data-theme-mode="light"] #app .mud-checkbox .mud-icon-button,
html[data-theme-mode="dark"] #app .mud-checkbox .mud-icon-button {
  width: 20px !important;
  min-width: 20px !important;
  max-width: 20px !important;
  height: 20px !important;
  min-height: 20px !important;
  max-height: 20px !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  box-shadow: none !important;
  transform: none !important;
  flex-shrink: 0 !important;
}
#app .mud-checkbox .mud-icon-button:hover,
html #app .mud-checkbox .mud-icon-button:hover {
  border-color: var(--pl-ink) !important;
  background: var(--pl-chip) !important;
  box-shadow: none !important;
  transform: none !important;
}
html[data-theme-mode="light"] #app .mud-checkbox .mud-icon-button,
html[data-theme-mode="light"] #app .mud-checkbox .mud-button-root.mud-icon-button {
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: none !important;
}
html #app .mud-checkbox .mud-icon-button.mud-checked,
html #app .mud-checkbox .mud-button-root.mud-icon-button.mud-checked,
html #app .mud-checkbox .mud-icon-button.mud-checkbox-true,
html #app .mud-checkbox .mud-button-root.mud-icon-button.mud-checkbox-true,
html #app .mud-checkbox .mud-icon-button:has(.mud-checkbox-input:checked),
html[data-theme-mode="light"] #app .mud-checkbox .mud-icon-button.mud-checked,
html[data-theme-mode="light"] #app .mud-checkbox .mud-icon-button.mud-checkbox-true,
html[data-theme-mode="dark"] #app .mud-checkbox .mud-icon-button.mud-checked,
html[data-theme-mode="dark"] #app .mud-checkbox .mud-icon-button.mud-checkbox-true,
#app .mud-checkbox .mud-icon-button.mud-checked,
#app .mud-checkbox .mud-icon-button.mud-checkbox-true {
  background: var(--pl-volt-fill) !important;
  border: 1.5px solid var(--pl-volt-edge) !important;
  color: var(--pl-volt-fg) !important;
  box-shadow: none !important;
}
#app .mud-checkbox .mud-icon-button .mud-icon-root {
  font-size: 14px !important;
  width: 14px !important;
  height: 14px !important;
}
#app .mud-checkbox .mud-icon-button.mud-checked .mud-icon-root,
#app .mud-checkbox .mud-icon-button.mud-checkbox-true .mud-icon-root,
#app .mud-checkbox .mud-icon-button:has(.mud-checkbox-input:checked) .mud-icon-root {
  color: var(--pl-volt-fg) !important;
  fill: var(--pl-volt-fg) !important;
}

/* Bridge textareas: let the placeholder wrap and breathe */
.ai-bridge-field .mud-input-control { margin-bottom: 8px !important; }
.ai-bridge-field .mud-input.mud-input-outlined {
  background: var(--pl-chip) !important;
  padding: 6px 12px !important;
}
html[data-theme-mode="light"] .ai-bridge-field .mud-input.mud-input-outlined {
  background: #FFFFFF !important;
  border-color: var(--pl-ink-border) !important;
}
.ai-bridge-field .mud-input-outlined-border {
  padding: 0 8px !important;
}
.ai-bridge-field textarea,
.ai-bridge-field input,
.ai-bridge-field textarea.mud-input,
.ai-bridge-field input.mud-input {
  padding: 10px 0 !important;
  font-family: var(--font-body) !important;
  font-size: 0.875rem !important;
  line-height: 1.5 !important;
  white-space: pre-wrap !important;
  word-break: break-word !important;
  overflow-wrap: anywhere !important;
}
.ai-bridge-field textarea,
.ai-bridge-field textarea.mud-input {
  min-height: 96px !important;
  height: auto !important;
  max-height: none !important;
  overflow-y: auto !important;
  resize: vertical !important;
}
.ai-bridge-field textarea::placeholder,
.ai-bridge-field input::placeholder,
.ai-bridge-field textarea.mud-input::placeholder,
.ai-bridge-field input.mud-input::placeholder {
  white-space: normal !important;
  word-break: break-word !important;
  overflow: visible !important;
  text-overflow: clip !important;
  opacity: 1 !important;
  color: var(--pl-stone) !important;
  font-weight: 400 !important;
  line-height: 1.5 !important;
}
.ai-bridge-field .mud-input-helper-text { margin-top: 6px !important; }
.ai-bridge-options {
  gap: 8px 16px !important;
  padding: 10px 0 4px !important;
  align-items: flex-start !important;
}

/* Global text wrapping safeguards for exercise names, plan items, and selects */
.plan-exercise-row__name,
.plan-card-name,
.share-card__exercise-name,
.history-detail-exercise-name,
.exercise-name,
.workout-next__name,
.mud-list-item-text,
.mud-autocomplete-item,
.mud-select-input {
  white-space: normal !important;
  overflow-wrap: break-word !important;
  word-break: break-word !important;
  line-height: 1.35 !important;
  min-width: 0 !important;
}

/* Theme picker - settings appearance panel */
.theme-select-item { display:inline-flex; align-items:center; gap:8px; }
.theme-select-dot { width:14px; height:14px; display:inline-block; border-radius:2px; flex-shrink:0; box-shadow: inset 0 1px 0 rgba(255,255,255,0.3); }
.theme-group-header { opacity:0.7 !important; font-family:var(--font-mono) !important; font-size:0.6875rem !important; font-weight:800 !important; letter-spacing:0.12em !important; text-transform:uppercase !important; color:var(--pl-stone) !important; }
.theme-grid { display:grid; grid-template-columns:repeat(2, minmax(0,1fr)); gap:8px; margin-top:14px; }
@media (min-width:520px) { .theme-grid { grid-template-columns:repeat(3, minmax(0,1fr)); } }
.theme-option { display:flex; flex-direction:column; align-items:stretch; gap:6px; padding:8px; background:var(--pl-chip); border:1.5px solid var(--pl-hairline); border-radius:var(--radius); cursor:pointer; transition: border-color 120ms ease, background 120ms ease, transform 90ms cubic-bezier(0.2, 0, 0, 1), box-shadow 90ms ease !important; text-align:left; touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
.theme-option:hover { border-color:var(--pl-yellow); background:var(--pl-chip-2); }
.theme-option:active { transform: translate(1px, 1px); }
.theme-option--active { border-color:var(--pl-ink) !important; background:var(--pl-chip-2) !important; box-shadow: var(--pl-plate-shadow-sm) !important; }
.theme-option--active:active { transform: translate(2px, 2px) !important; box-shadow: none !important; }
html[data-theme-mode="dark"] .theme-option--active { border-color:var(--pl-yellow) !important; }
.theme-option__preview { display:flex; align-items:center; gap:4px; height:32px; padding:4px 6px; border:1.5px solid; border-radius:var(--radius); position:relative; overflow:hidden; }
.theme-option__chip { width:22px; height:18px; border:1.5px solid; flex-shrink:0; }
.theme-option__accent { width:14px; height:14px; border-radius:2px; flex-shrink:0; border:1px solid rgba(0,0,0,0.2); }
.theme-option__text { font-family:var(--font-display); font-size:11px; font-weight:800; margin-left:auto; }
.theme-option__label { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.06em; color:var(--pl-ink); line-height:1.2; }
.theme-option__group { font-family:var(--font-mono); font-size:0.625rem; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:var(--pl-stone); margin-top:-4px; }

/* Dialog actions & onboarding contrast */
html[data-theme-mode="light"] .mud-dialog-actions {
  border-top: 1.5px solid var(--pl-ink-border) !important;
}
.mud-dialog-actions .mud-button-text {
  color: var(--pl-ink) !important;
}
html[data-theme-mode="light"] .rest-timer-complete-subtitle {
  color: var(--pl-ink-2) !important;
}
.onboarding-tip {
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  border-radius: var(--radius) !important;
}
.onboarding-tip--warning {
  border-color: var(--pl-amber) !important;
  background: color-mix(in srgb, var(--pl-amber) 10%, var(--pl-chip)) !important;
}

/* ==================================================================
   SKELETON SCREENS & LOADING PLACEHOLDERS
   Brutalist plate shimmer with zero radius, crisp hairline borders,
   and high contrast in both dark and light modes.
   ================================================================== */
@keyframes skeleton-shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

.skeleton-block {
  display: block;
  background: linear-gradient(
    90deg,
    var(--pl-chip) 0%,
    var(--pl-chip-2) 50%,
    var(--pl-chip) 100%
  );
  background-size: 200% 100%;
  animation: skeleton-shimmer 1.8s ease-in-out infinite;
  border: 1.5px solid var(--pl-hairline-strong);
  border-radius: var(--radius) !important;
  box-sizing: border-box;
}

html[data-theme-mode="light"] .skeleton-block {
  background: linear-gradient(
    90deg,
    var(--pl-chip-2) 0%,
    color-mix(in srgb, var(--pl-ink) 22%, var(--pl-chip-2)) 50%,
    var(--pl-chip-2) 100%
  );
  background-size: 200% 100%;
  border: 1.5px solid var(--pl-ink-border);
}
html[data-theme-mode="light"] .set-metric-stepper__label {
  color: var(--pl-ink-2) !important;
  font-weight: 800 !important;
}
html[data-theme-mode="light"] .set-metric-stepper__value-unit {
  color: var(--pl-ink-2) !important;
  font-weight: 800 !important;
}
html[data-theme-mode="light"] .mud-table .mud-table-head .mud-table-cell,
html[data-theme-mode="light"] .infinite-table-head,
html[data-theme-mode="light"] th {
  color: var(--pl-ink) !important;
  font-weight: 800 !important;
}
html[data-theme-mode="light"] .mud-typography-caption.mud-text-secondary {
  color: var(--pl-ink-2) !important;
  font-weight: 700 !important;
  opacity: 1 !important;
}
html[data-theme-mode="light"] .mud-progress-circular-primary,
html[data-theme-mode="light"] .mud-progress-circular-primary svg circle {
  stroke: var(--pl-ink) !important;
  color: var(--pl-ink) !important;
}
html[data-theme-mode="light"] .mud-progress-linear-primary {
  background-color: var(--pl-chip-2) !important;
  border: 1px solid var(--pl-ink-border) !important;
}
html[data-theme-mode="light"] .mud-progress-linear-primary .mud-progress-linear-bar {
  background-color: var(--pl-volt-fill) !important;
  border-right: 2px solid var(--pl-ink-border) !important;
}

@media (prefers-reduced-motion: reduce) {
  .skeleton-block {
    animation: none !important;
  }
}

/* Skeleton Layout Containers */
.home-skeleton {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}
.home-skeleton__overview {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.home-skeleton__hero {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline-strong);
  border-radius: var(--radius);
  box-shadow: var(--pl-plate-shadow-md);
}
html[data-theme-mode="light"] .home-skeleton__hero {
  border-color: var(--pl-ink-border);
}
.home-skeleton__stats {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}
.home-skeleton__plans {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.workout-skeleton {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
}
.workout-skeleton__top {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.workout-skeleton__stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
.workout-skeleton__exercise {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.history-skeleton {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
}
.history-skeleton__stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
@media (min-width: 600px) {
  .history-skeleton__stats {
    grid-template-columns: repeat(4, 1fr);
  }
}
.history-skeleton__sessions {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.detail-skeleton {
  display: flex;
  flex-direction: column;
  gap: 14px;
  width: 100%;
}
.detail-skeleton__card {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 16px;
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline-strong);
  border-radius: var(--radius);
  box-shadow: var(--pl-plate-shadow-md);
}
html[data-theme-mode="light"] .detail-skeleton__card {
  border-color: var(--pl-ink-border);
}
.detail-skeleton__stats {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
}
@media (min-width: 600px) {
  .detail-skeleton__stats {
    grid-template-columns: repeat(4, 1fr);
  }
}

/* Tab semantic icon accents & high contrast in both themes */
.settings-tab:not(.settings-tab--active) .settings-tab__icon--general {
  color: var(--pl-yellow-text) !important;
  fill: var(--pl-yellow-text) !important;
}
html[data-theme-mode="dark"] .settings-tab:not(.settings-tab--active) .settings-tab__icon--general {
  color: var(--pl-yellow) !important;
  fill: var(--pl-yellow) !important;
}
.settings-tab:not(.settings-tab--active) .settings-tab__icon--ai {
  color: var(--pl-purple-text) !important;
  fill: var(--pl-purple-text) !important;
}
html[data-theme-mode="dark"] .settings-tab:not(.settings-tab--active) .settings-tab__icon--ai {
  color: var(--pl-purple) !important;
  fill: var(--pl-purple) !important;
}
.settings-tab:not(.settings-tab--active) .settings-tab__icon--data {
  color: var(--pl-cyan-text) !important;
  fill: var(--pl-cyan-text) !important;
}
html[data-theme-mode="dark"] .settings-tab:not(.settings-tab--active) .settings-tab__icon--data {
  color: var(--pl-cyan) !important;
  fill: var(--pl-cyan) !important;
}
.settings-tab:not(.settings-tab--active) .settings-tab__icon--about {
  color: var(--pl-ok-text) !important;
  fill: var(--pl-ok-text) !important;
}
html[data-theme-mode="dark"] .settings-tab:not(.settings-tab--active) .settings-tab__icon--about {
  color: var(--pl-success-text) !important;
  fill: var(--pl-success-text) !important;
}
.settings-tab--active .settings-tab__icon {
  color: var(--pl-volt-fg) !important;
  fill: var(--pl-volt-fg) !important;
}

/* AI Mode Tabs inactive icon color */
.ai-mode-tab:not(.ai-mode-tab--active) .mud-icon-root {
  color: var(--pl-purple-text) !important;
  fill: var(--pl-purple-text) !important;
}
html[data-theme-mode="dark"] .ai-mode-tab:not(.ai-mode-tab--active) .mud-icon-root {
  color: var(--pl-purple) !important;
  fill: var(--pl-purple) !important;
}
.ai-mode-tab--active .mud-icon-root {
  color: var(--pl-volt-fg) !important;
  fill: var(--pl-volt-fg) !important;
}

/* Dialog icon boxes: crisp brutalist outline & shadow */
.dialog-title-icon-box {
  border: 1.5px solid var(--pl-volt-edge) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .dialog-title-icon-box {
  border: 1.5px solid var(--pl-ink-border) !important;
}

.dialog-title-icon-box--error,
html[data-theme-mode="light"] .dialog-title-icon-box--error {
  background: var(--pl-error) !important;
  background-image: none !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
  color: #FFFFFF !important;
}
.dialog-title-icon-box--error .mud-icon-root,
html[data-theme-mode="light"] .dialog-title-icon-box--error .mud-icon-root {
  color: #FFFFFF !important;
  fill: #FFFFFF !important;
}
html[data-theme-mode="dark"] .dialog-title-icon-box--error {
  background: var(--pl-error) !important;
  background-image: none !important;
  border: 1.5px solid #10111A !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
  color: #10111A !important;
}
html[data-theme-mode="dark"] .dialog-title-icon-box--error .mud-icon-root {
  color: #10111A !important;
  fill: #10111A !important;
}

.dialog-title-icon-box--warning,
html[data-theme-mode="light"] .dialog-title-icon-box--warning {
  background: var(--pl-warning) !important;
  background-image: none !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
  color: #FFFFFF !important;
}
.dialog-title-icon-box--warning .mud-icon-root,
html[data-theme-mode="light"] .dialog-title-icon-box--warning .mud-icon-root {
  color: #FFFFFF !important;
  fill: #FFFFFF !important;
}
html[data-theme-mode="dark"] .dialog-title-icon-box--warning {
  background: var(--pl-warning) !important;
  background-image: none !important;
  border: 1.5px solid #10111A !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
  color: #10111A !important;
}
html[data-theme-mode="dark"] .dialog-title-icon-box--warning .mud-icon-root {
  color: #10111A !important;
  fill: #10111A !important;
}

.dialog-title-icon-box--success,
html[data-theme-mode="light"] .dialog-title-icon-box--success {
  background: var(--pl-success) !important;
  background-image: none !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
  color: #FFFFFF !important;
}
.dialog-title-icon-box--success .mud-icon-root,
html[data-theme-mode="light"] .dialog-title-icon-box--success .mud-icon-root {
  color: #FFFFFF !important;
  fill: #FFFFFF !important;
}
html[data-theme-mode="dark"] .dialog-title-icon-box--success {
  background: var(--pl-success) !important;
  background-image: none !important;
  border: 1.5px solid #10111A !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
  color: #10111A !important;
}
html[data-theme-mode="dark"] .dialog-title-icon-box--success .mud-icon-root {
  color: #10111A !important;
  fill: #10111A !important;
}

/* Dialog actions contrast */
html[data-theme-mode="light"] .dialog-cancel-btn {
  background: var(--pl-chip-2) !important;
  color: var(--pl-ink) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .dialog-confirm-btn {
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color) !important;
}

/* Semantic icon buttons contrast in light mode */
html[data-theme-mode="light"] .mud-icon-button.mud-error-text,
html[data-theme-mode="light"] .mud-icon-button-color-error:not(.mud-button-filled),
html[data-theme-mode="light"] .home-hero__discard {
  color: var(--pl-err-text) !important;
}
html[data-theme-mode="light"] .mud-icon-button.mud-error-text .mud-icon-root,
html[data-theme-mode="light"] .mud-icon-button-color-error:not(.mud-button-filled) .mud-icon-root,
html[data-theme-mode="light"] .home-hero__discard .mud-icon-root {
  color: var(--pl-err-text) !important;
  fill: var(--pl-err-text) !important;
}
html[data-theme-mode="light"] .mud-icon-button.mud-error-text:not(.mud-button-disabled):hover,
html[data-theme-mode="light"] .mud-icon-button-color-error:not(.mud-button-disabled):hover,
html[data-theme-mode="light"] .home-hero__discard:hover {
  background: color-mix(in srgb, var(--pl-error) 15%, var(--pl-chip-2)) !important;
  border-color: var(--pl-error) !important;
  color: var(--pl-err-text) !important;
}
html[data-theme-mode="light"] .mud-icon-button.mud-error-text:not(.mud-button-disabled):hover .mud-icon-root,
html[data-theme-mode="light"] .mud-icon-button-color-error:not(.mud-button-disabled):hover .mud-icon-root,
html[data-theme-mode="light"] .home-hero__discard:hover .mud-icon-root {
  color: var(--pl-err-text) !important;
  fill: var(--pl-err-text) !important;
}

html[data-theme-mode="light"] .mud-icon-button.mud-warning-text,
html[data-theme-mode="light"] .mud-icon-button-color-warning:not(.mud-button-filled) {
  color: var(--pl-warn-text) !important;
}
html[data-theme-mode="light"] .mud-icon-button.mud-warning-text .mud-icon-root,
html[data-theme-mode="light"] .mud-icon-button-color-warning:not(.mud-button-filled) .mud-icon-root {
  color: var(--pl-warn-text) !important;
  fill: var(--pl-warn-text) !important;
}
html[data-theme-mode="light"] .mud-icon-button.mud-warning-text:not(.mud-button-disabled):hover,
html[data-theme-mode="light"] .mud-icon-button-color-warning:not(.mud-button-disabled):hover {
  background: color-mix(in srgb, var(--pl-warning) 15%, var(--pl-chip-2)) !important;
  border-color: var(--pl-warning) !important;
  color: var(--pl-warn-text) !important;
}
html[data-theme-mode="light"] .mud-icon-button.mud-warning-text:not(.mud-button-disabled):hover .mud-icon-root,
html[data-theme-mode="light"] .mud-icon-button-color-warning:not(.mud-button-disabled):hover .mud-icon-root {
  color: var(--pl-warn-text) !important;
  fill: var(--pl-warn-text) !important;
}

html[data-theme-mode="light"] .mud-icon-button.mud-success-text,
html[data-theme-mode="light"] .mud-icon-button-color-success:not(.mud-button-filled) {
  color: var(--pl-ok-text) !important;
}
html[data-theme-mode="light"] .mud-icon-button.mud-success-text .mud-icon-root,
html[data-theme-mode="light"] .mud-icon-button-color-success:not(.mud-button-filled) .mud-icon-root {
  color: var(--pl-ok-text) !important;
  fill: var(--pl-ok-text) !important;
}
html[data-theme-mode="light"] .mud-icon-button.mud-success-text:not(.mud-button-disabled):hover,
html[data-theme-mode="light"] .mud-icon-button-color-success:not(.mud-button-disabled):hover {
  background: color-mix(in srgb, var(--pl-success) 15%, var(--pl-chip-2)) !important;
  border-color: var(--pl-success) !important;
  color: var(--pl-ok-text) !important;
}
html[data-theme-mode="light"] .mud-icon-button.mud-success-text:not(.mud-button-disabled):hover .mud-icon-root,
html[data-theme-mode="light"] .mud-icon-button-color-success:not(.mud-button-disabled):hover .mud-icon-root {
  color: var(--pl-ok-text) !important;
  fill: var(--pl-ok-text) !important;
}

/* Semantic icon buttons contrast in dark mode */
html[data-theme-mode="dark"] .mud-icon-button.mud-error-text,
html[data-theme-mode="dark"] .home-hero__discard {
  color: var(--pl-error) !important;
}
html[data-theme-mode="dark"] .mud-icon-button.mud-error-text .mud-icon-root,
html[data-theme-mode="dark"] .home-hero__discard .mud-icon-root {
  color: var(--pl-error) !important;
  fill: var(--pl-error) !important;
}
html[data-theme-mode="dark"] .mud-icon-button.mud-error-text:hover,
html[data-theme-mode="dark"] .home-hero__discard:hover {
  background: color-mix(in srgb, var(--pl-error) 20%, var(--pl-chip-2)) !important;
  border-color: var(--pl-error) !important;
  color: var(--pl-error) !important;
}
html[data-theme-mode="dark"] .mud-icon-button.mud-error-text:hover .mud-icon-root,
html[data-theme-mode="dark"] .home-hero__discard:hover .mud-icon-root {
  color: var(--pl-error) !important;
  fill: var(--pl-error) !important;
}

/* Workout skeleton container plates */
.workout-skeleton__top,
.workout-skeleton__exercise {
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline-strong);
  box-shadow: var(--pl-plate-shadow-sm);
  padding: 12px;
}
html[data-theme-mode="light"] .workout-skeleton__top,
html[data-theme-mode="light"] .workout-skeleton__exercise {
  border-color: var(--pl-ink-border);
}

/* Final override: autocomplete dropdown toggle must be borderless and not clip - must be last to win */
#app .mud-autocomplete .mud-input-adornment .mud-icon-button.mud-input-adornment-icon-button,
#app .mud-autocomplete .mud-input-adornment .mud-icon-button.mud-icon-button-edge-end,
html body #app .mud-autocomplete .mud-input-adornment .mud-icon-button {
  border: none !important;
  border-width: 0 !important;
  background: transparent !important;
  background-color: transparent !important;
  box-shadow: none !important;
  margin: 0 !important;
  outline: none !important;
  padding: 0 !important;
}
#app .mud-autocomplete .mud-input-adornment .mud-icon-button.mud-input-adornment-icon-button:hover,
#app .mud-autocomplete .mud-input-adornment .mud-icon-button.mud-icon-button-edge-end:hover,
html body #app .mud-autocomplete .mud-input-adornment .mud-icon-button:hover {
  background: transparent !important;
  background-color: transparent !important;
  border: none !important;
  border-width: 0 !important;
  box-shadow: none !important;
}
/* Keyboard users still need a focus ring on the borderless toggle. */
#app .mud-autocomplete .mud-input-adornment .mud-icon-button:focus-visible {
  outline: 2px solid var(--pl-focus) !important;
  outline-offset: 2px !important;
}

/* Press states in light mode. The html[]-scoped light rules above carry
   higher specificity than the plain :active rules. Without these rules, the
   shadow collapse never fires and pressed buttons appear unchanged. Each rule
   matches its dark-theme press state exactly. */
html[data-theme-mode="light"] .home-plans-new-btn.mud-button-root:active,
html[data-theme-mode="light"] .plan-sheet-save-btn:active,
html[data-theme-mode="light"] .log-set-btn:active,
html[data-theme-mode="light"] .ai-chat-send-button:active {
  transform: translate(3px, 3px) !important;
  box-shadow: none !important;
}
html[data-theme-mode="light"] .workout-focus__log:active {
  transform: translate(2px, 2px) !important;
  box-shadow: none !important;
  filter: brightness(0.98) !important;
}
html[data-theme-mode="light"] .workout-actions__btn--end:active {
  transform: translate(2px, 2px) !important;
  box-shadow: none !important;
}
html[data-theme-mode="light"] .app-fab--secondary:active {
  box-shadow: none !important;
}
html[data-theme-mode="light"] .mud-icon-button:not(.mud-button-disabled):not(.app-fab):not(.workout-undo-fab):not(.plan-card__start):not(.mud-error-text):not(.mud-warning-text):not(.mud-success-text):not(.home-hero__discard):active {
  transform: translate(2px, 2px) !important;
  box-shadow: inset 0 1px 0 var(--pl-bevel-highlight) !important;
}
html[data-theme-mode="light"] .mud-button-outlined:not(.mud-button-outlined-disabled):active {
  box-shadow: inset 0 1px 0 var(--pl-bevel-highlight) !important;
}
html[data-theme-mode="light"] .settings-tab--active:active,
html[data-theme-mode="light"] .exercise-metric-tab--active:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 1px 1px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .ai-mode-tab--active:active {
  transform: translate(2px, 2px) !important;
  box-shadow: none !important;
}
html[data-theme-mode="light"] .workout-sequence-strip__item:active {
  box-shadow: none !important;
}
html[data-theme-mode="light"] .workout-sequence-strip__item--active:active {
  transform: translate(2px, 2px) !important;
  box-shadow: none !important;
}
html .rest-timer-icon-btn:active,
html .rest-timer-add-btn:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 1px 1px 0 var(--pl-plate-shadow-color) !important;
}
html .workout-rest-takeover .rest-timer-icon-btn:active,
html .workout-rest-takeover .rest-timer-add-btn:active {
  transform: translate(2px, 2px) !important;
  box-shadow: 1px 1px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme-mode="light"] .set-metric-stepper__btn:active,
html[data-theme-mode="light"] .set-metric-stepper__btn.mud-button-root:active,
html[data-theme-mode="light"] .set-metric-stepper__btn--compact:active,
html[data-theme-mode="light"] .workout-focus__stepper .set-metric-stepper__btn--compact:active,
html[data-theme-mode="light"] .workout-focus__history-steppers .set-metric-stepper__btn--compact:active {
  transform: translate(2px, 2px) !important;
  box-shadow: none !important;
  border-color: var(--pl-yellow) !important;
  background: var(--pl-chip) !important;
  color: var(--pl-yellow-text) !important;
}