/* 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;
}

/* Physiquinator - Cyberpunk Brutalist / Field Terminal World
   PALETTE: Tokyo Night dark void (#1A1B26 ground, #24283B surface, #1F2335 wells, #C0CAF5 ink) with vibrant neon pop:
   - Electric Blue (#7AA2F7)
   - Neon Cyan (#7DCFFF)
   - Solar Amber (#E0AF68)
   - Toxic Green (#9ECE6A)
   - Cyber Crimson (#F7768E)
   - Electric Violet (#BB9AF7)
   TYPE: Departure Mono everywhere with JetBrains Mono secondary. Tabular numerals enforced everywhere.
*/
:root {
  --pl-paper: #E7E3D1; /* acid concrete, slightly brighter and cooler than bone */
  --pl-paper-2: #EFECE0;
  --pl-paper-3: #D8D3C0;
  --pl-ink: #1A1B26; /* deep navy ink */
  --pl-ink-2: #24283B;
  --pl-stone: #5A5644; /* darker warm slate for 7:1 on white */
  --pl-stone-2: #7A7565;
  --pl-hairline: #C6C1AB;
  --pl-hairline-strong: #A39D82;
  --pl-chip: #FFFFFF; /* white plate laid on acid concrete */
  --pl-chip-2: #EDE8D3; /* brutal well, 12pts below chip, visible ladder */
  --pl-rubber: #1A1B26;
  --pl-rubber-2: #24283B;
  --pl-rubber-3: #1F2335;
  /* Brutalist ink border for interactive plates, distinct from hairline-strong cards */
  --pl-ink-border: #1A1B26;
  --pl-ink-border-2: #24283B;

  /* Accent variants reserved for small text and small glyphs, where the
     vibrant accent tokens fall below 4.5:1 on chip surfaces in light mode.
     Volt prints as deep olive ink on paper; the fill stays bright volt. */
  --pl-yellow-text: #6E6400;
  --pl-purple-text: #6D28D9;
  --pl-cyan-text: #0369A1;
  --pl-success-text: #166534;

  /* High-voltage Accents. Volt yellow keeps the signature in light mode:
     fills stay #FAFF00 under ink text, text-sized volt prints as #6E6400. */
  --pl-yellow: #6E6400; /* printed volt ink: timer digits, first stat, warm accents */
  --pl-yellow-bg: rgba(250, 255, 0, 0.30);
  --pl-purple: #7C3AED; /* electric violet, acid */
  --pl-magenta: #E11D48; /* vivid magenta, acid */
  --pl-cyan: #0E7490; /* deeper cyan for 4.5:1 on white tint */
  --pl-amber: #D97706;
  --pl-amber-ink: #5A3E1A;
  --pl-plate-red: #E11D48;
  --pl-plate-blue: #1E5EFF;
  --pl-plate-gold: #D97706;
  --pl-plate-green: #5A8A0B; /* darker lime keeps 4.5:1 on its tint */
  --pl-success: #5A8A0B;
  --pl-error: #BE123C;
  --pl-seal: #7C3AED;
  --pl-dot: rgba(26, 27, 38, 0.09);
  --pl-grid-line: rgba(26, 27, 38, 0.18);

  /* Accent pair for primary buttons & active indicators: volt fill, ink text,
     identical to dark so the signature survives the theme switch */
  --pl-accent-bg: #FAFF00;
  --pl-accent-fg: #10111A;

  /* Text ink for volt-filled controls: ink on neon yellow in both themes */
  --pl-volt-fg: #10111A;
  /* Border ink for volt-filled controls: ink frame in both themes */
  --pl-volt-edge: #10111A;

  /* Status colors */
  --pl-warn-text: #B45309;
  --pl-ok-text: #15803D;
  --pl-err-text: #BE123C;
  --pl-focus: var(--pl-ink);

  --font-display: 'Departure Mono', 'JetBrains Mono', ui-monospace, monospace;
  --font-body: 'Departure Mono', 'JetBrains Mono', ui-monospace, monospace;
  --font-mono: 'Departure Mono', 'JetBrains Mono', ui-monospace, monospace;

  --hairline: 1.5px solid var(--pl-hairline);
  --hairline-strong: 1.5px solid var(--pl-hairline-strong);
  --radius: 0px;
  --rail-h: 56px;
  --page-x: 16px;
  --page-max: 640px;
  --app-page-x: 16px;
  --app-page-bottom-extra: 12px;
  --app-page-top: 16px;
  --app-nav-pill-height: 56px;
  --app-nav-pill-bottom: 12px;
  --app-fab-size: 48px;
  --app-fab-mini-size: 40px;
  --app-fab-bottom: 80px;
  --app-fab-right: 16px;
  --app-fab-left: 16px;
  --app-ime-inset: 0px;
}

html[data-theme="dark"] {
  --pl-paper: #0E0F17; /* deep Tokyo Night dark void */
  --pl-paper-2: #141624;
  --pl-paper-3: #1C1E32;
  --pl-ink: #C0CAF5; /* primary text */
  --pl-ink-2: #A9B1D6;
  --pl-stone: #8A90B8; /* secondary text */
  --pl-stone-2: #7A82B0;
  --pl-hairline: #282B42;
  --pl-hairline-strong: #414770;
  --pl-chip: #181A2A; /* surface card plate */
  --pl-chip-2: #22253B; /* well */
  --pl-dot: rgba(192, 202, 245, 0.04);
  --pl-grid-line: rgba(192, 202, 245, 0.05);

  /* High-voltage Acid Neons */
  --pl-yellow: #FAFF00; /* vibrant electric yellow */
  --pl-yellow-bg: rgba(250, 255, 0, 0.16);
  --pl-purple: #C084FC; /* electric violet */
  --pl-magenta: #FF0055; /* cyber hot magenta / red */
  --pl-cyan: #00E5FF;
  --pl-amber: #FAFF00;
  --pl-plate-red: #FF0055;
  --pl-plate-blue: #4D7FFF;
  --pl-plate-gold: #FAFF00;
  --pl-plate-green: #A3E635;
  --pl-success: #A3E635;
  --pl-error: #FF0055;
  --pl-seal: #C084FC;

  /* Electric acid volt for primary controls, same as light: one signature */
  --pl-accent-bg: #FAFF00;
  --pl-accent-fg: #10111A;

  /* Ink for volt-filled controls (buttons, FABs, active tabs) in both themes */
  --pl-volt-fg: #10111A;
  --pl-warn-text: #FAFF00;
  --pl-ok-text: #A3E635;
  --pl-err-text: #FF5C7A;
  --pl-focus: #FAFF00;
  --pl-amber-ink: #FAFF00;
  --pl-yellow-text: #FAFF00;
  --pl-purple-text: #C084FC;
  --pl-cyan-text: #00E5FF;
  --pl-success-text: #A3E635;
}

* { -webkit-tap-highlight-color: transparent; box-sizing: border-box; }
html, body { margin:0; padding:0; width:100%; height:100%; overflow:hidden; background: var(--pl-paper); color: var(--pl-ink); scrollbar-gutter: stable; }
body { display:flex; flex-direction:column; font-family: var(--font-body); -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; }
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;
}
#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="dark"] ::selection { background: #4D7FFF; color: #10111A; }
: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; }
.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 100ms ease, background 120ms ease; }
.mud-icon-button:hover { background:var(--pl-chip) !important; border-color:var(--pl-yellow) !important; }
.mud-icon-button:active { transform:scale(0.96); }
.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; }
.mud-input-adornment .mud-icon-root { font-size:18px !important; width:18px !important; height:18px !important; color:var(--pl-stone); }
.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:50%; transform:translateX(-50%); bottom:12px; z-index:30; width:calc(100% - 24px); max-width:440px; pointer-events:none; }
.app-nav-pill__inner { pointer-events:all; 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; touch-action:manipulation; }
.app-nav-tab .mud-icon-root { font-size:20px !important; width:20px !important; height:20px !important; }
.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; }
.app-nav-tab:active { opacity:0.9; }
.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:8px; padding:0 20px; } .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;
  transition: opacity 150ms ease, transform 100ms ease, background 120ms ease;
  overflow: hidden;
  box-shadow: none !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-color: var(--pl-yellow) !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="light"] .app-fab--secondary {
  background: #FFFFFF !important;
  color: #1A1B26 !important;
  border: 1.5px solid #A39D82 !important;
}
html[data-theme="light"] .app-fab--secondary .mud-icon-root {
  color: #1A1B26 !important;
  fill: #1A1B26 !important;
}

.app-fab:active { transform:scale(0.96) !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-nav-pill ~ * .app-fab--br-1:not(.dialog-fab),
.app-nav-pill ~ .app-fab--br-1:not(.dialog-fab),
.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;
}

@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;
  }
}

/* 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: 16px !important;
  left: auto !important;
  bottom: 72px !important;
}
.app-fab--bl-1,
.app-fab--back,
.workout-undo-fab {
  left: 16px !important;
  right: auto !important;
  bottom: 16px !important;
}
.app-fab--bl-2,
.dialog-fab.app-fab--bl-2 {
  left: 16px !important;
  right: auto !important;
  bottom: 72px !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;
  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; }
.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:normal; overflow-wrap:anywhere; font-size: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); animation:live-pulse 1.4s ease-in-out infinite; }
.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; align-items:center; justify-content:center; height:24px; min-width:24px; padding:0 8px;
  font-family:var(--font-mono); font-size:0.6875rem; font-weight:800; letter-spacing:0.08em;
  background:var(--pl-volt-fill); color:var(--pl-volt-fg); border:1.5px solid var(--pl-volt-edge);
  border-radius:var(--radius); font-weight:900;
}
.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; }
.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:800 !important; font-size:16px !important; letter-spacing:-0.015em !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; }
.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; height:36px; min-width:36px; min-height:36px;
  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; padding:0; transition:all 120ms ease;
}
.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;
}
.history-action-btn--chevron {
  color:var(--pl-stone); cursor:default;
}
.history-session-card:hover .history-action-btn--chevron {
  color:var(--pl-yellow); border-color:var(--pl-yellow);
}

.history-card-continue-btn {
  display:inline-flex; align-items:center; gap:4px;
  height:36px; padding:0 12px;
  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-volt-edge); border-radius:var(--radius);
  cursor:pointer; transition:all 120ms ease;
}
.history-card-continue-btn:hover { filter:brightness(1.08); }
.rest-timer-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; overflow:hidden; }
.rest-timer-panel--active.mud-paper { padding:0 !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-yellow) !important; transform:translateZ(0); transition:color 220ms ease; }
.rest-timer-digits--imminent { color:var(--pl-magenta) !important; }
.rest-timer-digits--urgent { color:var(--pl-error) !important; animation:urgent-pulse 1.2s infinite alternate; }
.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:8px 12px 12px; box-sizing:border-box; display:flex; gap:8px; justify-content:center; align-items:center; flex-wrap:wrap; }
.rest-timer-icon-btn {
  width: 44px !important;
  height: 44px !important;
  min-width: 44px !important;
  min-height: 44px !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  border-radius: var(--radius) !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  background: var(--pl-chip-2) !important;
  color: var(--pl-ink) !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: all 120ms ease;
  box-sizing: border-box !important;
  padding: 0 !important;
}
.rest-timer-icon-btn:hover {
  background: var(--pl-chip) !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow) !important;
}
.rest-timer-icon-btn .mud-icon-root {
  font-size: 22px !important;
  width: 22px !important;
  height: 22px !important;
  color: var(--pl-ink) !important;
  fill: var(--pl-ink) !important;
}
.rest-timer-icon-btn:hover .mud-icon-root {
  color: var(--pl-yellow) !important;
  fill: var(--pl-yellow) !important;
}
.rest-timer-add-btn {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 16px !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  border-radius: var(--radius) !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: 800 !important;
  letter-spacing: 0.08em !important;
  cursor: pointer !important;
  box-shadow: none !important;
  transition: all 120ms ease;
  box-sizing: border-box !important;
}
.rest-timer-add-btn:hover {
  background: var(--pl-chip) !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow) !important;
}
.rest-timer-controls .mud-icon-button { width:44px !important; height:44px !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:none !important; }
.rest-timer-controls .mud-icon-button[aria-label*="Pause"] { background:color-mix(in srgb, var(--pl-amber) 14%, var(--pl-chip-2)) !important; border-color:var(--pl-warn-text) !important; color:var(--pl-amber-ink) !important; }
.rest-timer-controls .mud-button { height:44px !important; min-width:0 !important; flex:1 1 auto; border-radius:var(--radius) !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; border:1.5px solid var(--hairline-strong) !important; box-shadow:none !important; }
.rest-timer-edge-track { flex-shrink:0; height:6px; margin:0; background:var(--pl-dot); border-top:var(--hairline); 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;}
.rest-timer-edge-fill--imminent { background:var(--pl-warn-text); }
.rest-timer-edge-fill--urgent { background:var(--pl-err-text); animation:urgent-pulse 1.2s infinite alternate; }
@keyframes urgent-pulse { 0%{filter:brightness(1)} 100%{filter:brightness(1.18)} }
.rest-timer-panel--complete.mud-paper { border-color:var(--pl-success) !important; background:color-mix(in srgb, var(--pl-success) 8%, var(--pl-chip)) !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 44px; width:44px !important; min-width:44px !important; max-width:44px; height:44px !important; min-height:44px !important; padding:0 !important; font-family:var(--font-display) !important; font-size:22px !important; font-weight:700 !important; line-height:1; border-radius:var(--radius) !important; border:var(--hairline) !important; background:var(--pl-chip-2) !important; color:var(--pl-ink) !important; box-shadow:none !important; }
.set-metric-stepper__value, .set-metric-stepper__input { flex:1 1 auto; min-width:0; min-height:44px; 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:background 120ms ease, border-color 120ms ease, opacity 120ms ease !important; }
.mud-button-filled-primary { background:var(--pl-accent-bg) !important; color:var(--pl-accent-fg) !important; border:1px solid var(--pl-accent-bg) !important; }
/* Error confirms: pin pairs the audit verified instead of trusting MudBlazor defaults.
   Light: white on #BE123C is 6.4:1. Dark: #10111A on #FF0055 is 4.8:1. */
.mud-button-filled-error { background:var(--pl-error) !important; color:#FFFFFF !important; border:1px solid var(--pl-error) !important; }
html[data-theme="dark"] .mud-button-filled-error { color:#10111A !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; }
}

/* 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(--hairline-strong) !important;
  border-radius: var(--radius) !important;
  background: var(--pl-chip) !important;
  box-shadow: var(--pl-plate-shadow-md) !important;
  z-index: 1400 !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.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: 16px 12px 76px !important;
  box-sizing: border-box !important;
  overflow-y: auto !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) !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: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !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: 16px !important;
  right: auto !important;
  bottom: 16px !important;
}
.dialog-fab.app-fab--br-1 {
  right: 16px !important;
  left: auto !important;
  bottom: 16px !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) {
  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 .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;
}

.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: 2px 0 4px !important;
  background: transparent !important;
  border: none !important;
  border-radius: 0 !important;
  margin-bottom: 10px !important;
  width: 100% !important;
}
.plan-section-header__title {
  display: inline !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 !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  margin: 0 !important;
  box-shadow: none !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-volt-edge) !important;
  border-radius: var(--radius) !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: 44px;
  height: 44px;
  min-width: 44px;
  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: var(--pl-chip);
  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; }
.rest-timer-complete-content { display:flex; align-items:center; justify-content:center; width:100%; padding:10px 16px; box-sizing:border-box; animation:rest-complete-bounce 350ms cubic-bezier(0.34, 1.56, 0.64, 1); }
@keyframes rest-complete-bounce { 0%{transform:scale(0.92); opacity:0;} 100%{transform:scale(1); opacity:1;} }
.rest-timer-complete-icon-box { display:none; }
.rest-timer-complete-text { display:flex; flex-direction:column; align-items:center; justify-content:center; gap:6px; text-align:center; width:100%; }
.rest-timer-complete-title { font-family:'Departure Mono','JetBrains Mono',monospace; font-size:clamp(3.2rem,14vw,4.4rem); font-size:clamp(44px, round(14vw, 11px), 66px); font-weight:900; letter-spacing:0.02em; line-height:1; color:var(--pl-ok-text); text-align:center; white-space:nowrap; }
.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); }

/* 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%; }
.plan-add-exercise__input { flex:1; }
.plan-add-exercise__btn.mud-button-root { height:40px !important; min-height:40px !important; flex-shrink:0; }

/* 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; align-items:center; gap:6px; height:34px; padding:0 14px;
  font-family:var(--font-mono); font-size:0.6875rem; font-weight:800;
  letter-spacing:0.08em; text-transform:uppercase; color:var(--pl-ink);
  background:var(--pl-chip-2); border:1.5px solid var(--hairline-strong);
  border-radius:var(--radius); cursor:pointer; text-decoration:none;
  flex-shrink:0; transition:all 120ms ease;
}
.bodyweight-panel__details-link:hover { background:var(--pl-chip); border-color:var(--pl-yellow); color:var(--pl-yellow); }
.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;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  min-width: 48px;
  min-height: 48px;
  border-radius: var(--radius);
  border: 1.5px solid var(--pl-volt-edge);
  background: var(--pl-volt-fill);
  color: var(--pl-volt-fg);
  cursor: pointer;
  padding: 0;
  transition: transform 100ms ease, background 120ms ease, opacity 120ms ease;
  touch-action: manipulation;
  flex-shrink: 0;
}
.bodyweight-log-row__log-btn:hover:not(:disabled) { filter:brightness(1.08); }
.bodyweight-log-row__log-btn:active:not(:disabled) { transform:scale(0.96); }
.bodyweight-log-row__log-btn:disabled { opacity:0.38; cursor:not-allowed; }
.bodyweight-log-row__log-btn .mud-icon-root { font-size:22px !important; width:22px !important; height:22px !important; }

/* Set Metric Stepper Global Polish */
.set-metric-stepper__btn, .set-metric-stepper__btn.mud-button-root { flex:0 0 48px !important; width:48px !important; min-width:48px !important; max-width:48px !important; height:48px !important; min-height:48px !important; padding:0 !important; font-family:var(--font-display) !important; font-size:26px !important; font-weight:700 !important; line-height:1 !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; border-radius:var(--radius) !important; border:var(--hairline-strong) !important; background:var(--pl-chip-2) !important; color:var(--pl-ink) !important; box-shadow:none !important; cursor:pointer !important; }
.set-metric-stepper__value, .set-metric-stepper__value--compact { height:48px !important; min-height:48px !important; font-size:22px !important; font-weight:800 !important; }
.set-metric-stepper__input, .set-metric-stepper__input--compact { height:48px !important; min-height:48px !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="dark"] .share-card { color:#C0CAF5; }
.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="dark"] .share-card__logo { fill:#7AA2F7; }
.share-card__brand { font-size:13px; font-weight:700; letter-spacing:0.14em; text-transform:uppercase; color:#565A6E; }
html[data-theme="dark"] .share-card__brand { color:#787C99; }
.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="dark"] .share-card__date { color:#787C99; }
.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="dark"] .share-card__stat { background:#1F2335; }
.share-card__stat-value { font-size:17px; font-weight:700; white-space:nowrap; color:#1A1B26; }
html[data-theme="dark"] .share-card__stat-value { color:#7AA2F7; }
.share-card__stat-label { font-size:10px; font-weight:700; letter-spacing:0.08em; text-transform:uppercase; color:#565A6E; }
html[data-theme="dark"] .share-card__stat-label { color:#787C99; }
.share-card__exercises { margin-top:4px; }
.share-card__exercise { padding:12px 0; border-top:1px solid #B4B8C5; }
html[data-theme="dark"] .share-card__exercise { border-top-color:#32344A; }
.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="dark"] .share-card__set--warmup { color:#787C99; }
.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="dark"] .share-card__warmup { color:#E0AF68; }
.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="dark"] .share-card__footer { border-top-color:#32344A; color:#787C99; }

/* 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-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-name { font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; width:100%; }
.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); }
/* 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%; }
.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;
}
.plan-exercise-row:hover { border-color: var(--pl-yellow) !important; }
.plan-exercise-row__main { display: flex; align-items: center; gap: 8px; flex: 1; min-width: 0; }
.plan-exercise-handle {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 32px !important;
  height: 32px !important;
  min-width: 32px !important;
  border: 1.5px solid var(--hairline-strong) !important;
  border-radius: var(--radius) !important;
  background: var(--pl-chip-2) !important;
  color: var(--pl-stone) !important;
  cursor: grab !important;
  touch-action: none;
  padding: 0 !important;
  flex-shrink: 0;
}
.plan-exercise-handle:active { cursor: grabbing !important; }
.plan-exercise-handle .mud-icon-root { font-size: 18px !important; width: 18px !important; height: 18px !important; }
.plan-exercise-row__body { display: flex; align-items: center; gap: 10px; flex: 1; min-width: 0; border: none; background: transparent; padding: 4px 6px; text-align: left; cursor: pointer; color: var(--pl-ink); font: inherit; }
.plan-exercise-row__index {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 2px 8px !important;
  font-family: var(--font-mono) !important;
  font-size: 0.6875rem !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;
  min-width: 34px !important;
}
.plan-exercise-row__text { display: flex; flex-direction: column; gap: 2px; flex: 1; min-width: 0; }
.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; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.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; }
.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; }
.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(--hairline-strong) !important;
  background: var(--pl-chip-2) !important;
  border-radius: var(--radius) !important;
  color: var(--pl-ink) !important;
}
.plan-exercise-row--ghost { opacity: 0.4; border-style: dashed !important; }
.plan-exercise-row--chosen { background: var(--pl-chip-2) !important; }
.plan-exercise-row--drag { box-shadow: none !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; }
html[data-theme="dark"] .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; }
.header-left { display:flex !important; align-items:center !important; gap:8px !important; min-width:0 !important; flex:1 !important; padding-left:12px !important; }
.header-right { display:flex !important; align-items:center !important; gap:6px !important; flex-shrink:0 !important; padding-right:12px !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="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:var(--pl-ink) !important; flex-shrink:0; }
html[data-theme="dark"] .completed-icon { color:var(--pl-rubber) !important; }
.completed-icon .mud-icon-root { font-size:16px !important; width:16px !important; height:16px !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="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:#10111A !important; border-color:var(--pl-success) !important; font-weight:800 !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: all 120ms ease;
  touch-action: manipulation;
  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:scale(0.96); }
.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-panel__icon { background:transparent !important; border:none !important; color:var(--pl-stone) !important; }

/* 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); 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:all 120ms ease; white-space:nowrap; touch-action:manipulation; }
.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, .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:focus-visible { outline:2px solid var(--pl-focus); outline-offset:-2px; }

/* 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%; text-align:left; }
.settings-panel__icon { display:inline-flex; align-items:center; justify-content:center; width:32px; height:32px; flex-shrink:0; color:var(--pl-stone); }
.settings-panel__icon .mud-icon-root { font-size:18px !important; width:18px !important; height:18px !important; }
.settings-panel__text { display:flex; flex-direction:column; gap:2px; min-width:0; flex:1; }
.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:hidden; text-overflow:ellipsis; white-space:nowrap; }
.settings-panel__subtitle { font-family:var(--font-mono); font-size:0.6875rem; font-weight:700; letter-spacing:0.1em; text-transform:uppercase; color:var(--pl-stone); line-height:1.3; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.settings-panel__content { display:flex; flex-direction:column; gap:10px; padding-top:6px; }
.settings-panels { display:flex; flex-direction:column; gap:8px; }
.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; }
.settings-panel.mud-expand-panel .mud-expand-panel-header { padding:10px 12px !important; min-height:56px; }
.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); 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:all 120ms ease; user-select:none; -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[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: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; transition:color 120ms ease, background 120ms ease; }
.history-filter-chip__remove:hover, .history-filter-chip__remove:active { color:var(--pl-err-text); background:color-mix(in srgb, var(--pl-error) 12%, transparent); }
.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; transition:color 120ms ease, border-color 120ms ease; }
.history-filter-bar__clear:hover { color:var(--pl-err-text); border-color:var(--pl-hairline-strong); }

/* 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); color:var(--pl-ink); cursor:pointer; transition:all 120ms ease; }
.history-select-bar__btn:hover { background:var(--pl-chip-2); border-color:var(--pl-ink); }
.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:#1A1B26 !important; border-color:var(--pl-error) !important; }
.history-select-bar__btn--delete:disabled { opacity:0.4; cursor:not-allowed; }
.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="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:all 120ms ease; white-space:nowrap; }
.exercise-metric-tab:hover { color:var(--pl-ink); }
.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; }

/* 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: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:var(--hairline-strong) !important;
  border-radius:0px !important;
  background:var(--pl-chip) !important;
  box-shadow: var(--pl-plate-shadow-md) !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="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:var(--pl-rubber) !important; color:var(--pl-paper) !important; font-family:var(--font-body) !important; }
.app-splash__logo svg g { fill:var(--pl-paper) !important; }
html[data-theme="light"] .app-splash { background:var(--pl-paper) !important; color:var(--pl-ink) !important; }
html[data-theme="light"] .app-splash__logo svg g { fill: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. */
@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; }
}
@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; }

/* 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="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; }

/* 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 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--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);
  color: var(--pl-ink);
  cursor: pointer;
  transition: all 120ms ease;
}
.ai-quick-btn:hover:not(:disabled) {
  transform: translateY(-1px);
  border-color: var(--pl-yellow);
}
/* 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 Container & Cards */
.ai-bridge-container {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}
.ai-bridge-card {
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--hairline-strong) !important;
  border-radius: var(--radius) !important;
  padding: 16px !important;
  box-sizing: border-box;
}
.ai-bridge-card__header {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}
.ai-bridge-step-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  min-width: 28px;
  min-height: 28px;
  border-radius: var(--radius);
  background: var(--pl-volt-fill);
  color: var(--pl-volt-fg);
  font-family: var(--font-display);
  font-size: 16px;
  font-weight: 900;
  flex-shrink: 0;
}
.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;
  align-items: center;
  justify-content: space-between;
  padding: 8px 12px;
  background: var(--pl-chip);
  border: 1.5px solid var(--hairline-strong);
  border-radius: var(--radius);
  margin-bottom: 12px;
}
.home-plans-header__title {
  font-family: var(--font-display) !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  letter-spacing: 0.04em !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
}
.home-plans-count-chip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 2px 8px;
  font-family: var(--font-mono);
  font-size: 0.6875rem;
  font-weight: 800;
  background: var(--pl-volt-fill);
  color: var(--pl-volt-fg);
  border-radius: var(--radius);
  margin-left: 8px;
}

#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 {
  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 {
  background: color-mix(in srgb, #FF0055 15%, var(--pl-chip-2)) !important;
  border-color: #FF0055 !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: all 120ms ease;
  white-space: nowrap !important;
}
.ai-mode-tab:hover {
  background: var(--pl-chip) !important;
  color: var(--pl-ink) !important;
  border-color: var(--hairline-strong) !important;
}
.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 .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;
}
.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-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-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;
}
.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);
}


/* ==================================================================
   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="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="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="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="dark"] .app-main-scroll {
  background: transparent;
}
html[data-theme="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="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,
.home-plans-header,
.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 actually 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;
}
.workout-undo-fab:active {
  transform: translate(5px, 5px);
  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 {
  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 100ms ease, filter 120ms ease;
}
.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,
.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: var(--pl-plate-shadow-md) !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;
}

/* ==================================================================
   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="light"] .mud-button-outlined:not(.mud-button-filled-disabled):not(.mud-button-outlined-disabled) {
  background: #FFFFFF !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="light"] .mud-button-outlined:not(.mud-button-outlined-disabled):hover {
  background: color-mix(in srgb, var(--pl-volt-fill) 8%, #FFFFFF) !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow-text) !important;
}
html[data-theme="light"] .mud-icon-button:not(.mud-button-disabled):not(.app-fab):not(.workout-undo-fab):not(.plan-card__start):not(.rest-timer-icon-btn) {
  background: #FFFFFF !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="light"] .mud-icon-button:not(.mud-button-disabled):not(.app-fab):not(.workout-undo-fab):hover {
  background: #FFFFFF !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow-text) !important;
}
html[data-theme="light"] .mud-icon-button:not(.mud-button-disabled):not(.app-fab):not(.workout-undo-fab):hover .mud-icon-root {
  color: var(--pl-yellow-text) !important;
  fill: var(--pl-yellow-text) !important;
}
html[data-theme="light"] .app-fab--secondary {
  background: #FFFFFF !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="light"] .app-fab--secondary:hover {
  background: #FFFFFF !important;
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow-text) !important;
}
html[data-theme="light"] .app-fab--secondary:hover .mud-icon-root {
  color: var(--pl-yellow-text) !important;
}
html[data-theme="light"] .settings-tab,
html[data-theme="light"] .exercise-metric-tab,
html[data-theme="light"] .ai-quick-btn,
html[data-theme="light"] .history-filter-chip,
html[data-theme="light"] .progress-exercise-card {
  background: #FFFFFF !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  box-shadow: none !important;
}
html[data-theme="light"] .settings-tab--active,
html[data-theme="light"] .exercise-metric-tab--active,
html[data-theme="light"] .history-filter-chip--selected,
html[data-theme="light"] .ai-mode-tab--active {
  background: var(--pl-volt-fill) !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="light"] .settings-tab:hover,
html[data-theme="light"] .exercise-metric-tab:hover,
html[data-theme="light"] .ai-quick-btn:hover,
html[data-theme="light"] .history-filter-chip:hover,
html[data-theme="light"] .progress-exercise-card:hover {
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow-text) !important;
}
html[data-theme="light"] .mud-input-outlined-border {
  border-color: var(--pl-ink-border) !important;
  border-width: 1.5px !important;
}
html[data-theme="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="light"] .history-session-card,
html[data-theme="light"] .plan-card.mud-card,
html[data-theme="light"] .exercise-accordion-card {
  border-color: var(--pl-hairline-strong) !important;
}
html[data-theme="light"] .home-plans-header__title {
  background: #FFFFFF !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  border-left: 5px solid var(--pl-volt-fill) !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,
.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-hairline-strong) !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(2px, 2px) !important;
  box-shadow: inset 0 1px 0 var(--pl-bevel-highlight) !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="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);
}

/* 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, .home-plans-header, .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 .app-fab.app-fab--br-1:not(.dialog-fab),
  .app-shell .home-page ~ .app-fab--br-1:not(.dialog-fab) {
    right: calc(50% - 320px - 64px) !important;
    bottom: 84px !important;
  }
  .app-shell .app-fab.app-fab--br-2:not(.dialog-fab) {
    right: calc(50% - 320px - 64px) !important;
    bottom: 140px !important;
  }
  .app-shell .app-fab.app-fab--bl-1:not(.dialog-fab),
  .app-shell .app-fab.app-fab--back:not(.dialog-fab),
  .app-shell .workout-undo-fab {
    left: calc(50% - 320px - 64px) !important;
    bottom: 84px !important;
  }
  .app-shell .app-fab.app-fab--bl-2:not(.dialog-fab) {
    left: calc(50% - 320px - 64px) !important;
    bottom: 140px !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="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 {
  display: inline-flex !important;
  align-items: center !important;
  padding: 7px 12px !important;
  background: var(--pl-chip) !important;
  background-image: none !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  border-left: 4px solid var(--pl-volt-fill) !important;
  border-radius: var(--radius) !important;
  font-size: 18px !important;
  font-weight: 900 !important;
  letter-spacing: 0.04em !important;
  line-height: 1 !important;
  color: var(--pl-ink) !important;
  box-shadow: 4px 4px 0 var(--pl-plate-shadow-color) !important;
  margin-bottom: 6px !important;
  margin-right: 6px !important;
}
/* Diagram and section plates: give the shadow room to breathe */
.bodyweight-panel__title,
.settings-card__title,
.exercise-progress-chart .settings-card__title,
.history-detail-table .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 {
  border-left: 0 !important;
  font-size: 16px !important;
}
/* Settings panel headers: hard offset with clearance, parent overflow made visible so shadow never clips */
.settings-panel__title {
  display: inline !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.1 !important;
  color: var(--pl-ink) !important;
  box-shadow: none !important;
  margin: 0 !important;
}
.settings-panel.mud-expand-panel,
.settings-panel.mud-expand-panel .mud-expand-panel-header {
  overflow: visible !important;
}
.settings-panel.mud-expand-panel .mud-expand-panel-header {
  padding-bottom: 8px !important;
  padding-right: 10px !important;
}
.settings-panel__subtitle {
  font-weight: 700 !important;
  letter-spacing: 0.08em !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: 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;
}
.exercise-accordion-header .exercise-name {
  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: 18px !important;
  margin: 0 !important;
  flex: 1 1 auto !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,
.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;
}
.exercise-progress-chart .exercise-progress-chart__plot,
.bodyweight-chart-panel .bodyweight-chart {
  overflow: visible !important;
}

/* 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,
.bodyweight-panel__title,
.settings-card__title,
.plan-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,
.bodyweight-panel__title,
.settings-card__title,
.plan-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,
.bodyweight-panel__title::after,
.settings-card__title::after,
.plan-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__kicker {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--pl-stone);
  margin-bottom: 3px;
}
.workout-brutal__kicker::before {
  content: '';
  width: 7px;
  height: 7px;
  background: var(--pl-volt-fill);
  border: 1px solid var(--pl-volt-edge);
  box-shadow: 2px 2px 0 var(--pl-plate-shadow-color);
  flex-shrink: 0;
}
.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);
  animation: workout-alert-pulse 1.0s infinite alternate;
}
@keyframes workout-alert-pulse { 0%{opacity:1} 100%{opacity:0.5} }
.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;
}
html[data-theme="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: 1fr 1fr;
  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: 3px;
  padding: 10px 6px 8px;
  background: var(--pl-chip);
  position: relative;
}
.workout-hud__stat + .workout-hud__stat { border-left: 1.5px solid var(--pl-hairline); }
.workout-hud__stat--volume { background: color-mix(in srgb, var(--pl-cyan) 6%, var(--pl-chip)); }
.workout-hud__stat--sets { background: color-mix(in srgb, var(--pl-purple) 6%, var(--pl-chip)); }
.workout-hud__label {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--pl-stone);
  line-height: 1;
}
.workout-hud__value {
  font-family: var(--font-display);
  font-size: 15px;
  font-weight: 900;
  letter-spacing: -0.015em;
  line-height: 1;
  color: var(--pl-ink);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
.workout-hud__stat--volume .workout-hud__value { color: var(--pl-cyan-text); }
html[data-theme="dark"] .workout-hud__stat--volume .workout-hud__value { color: var(--pl-cyan); }
.workout-hud__bar-wrap {
  padding: 8px 10px 8px;
  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: 6px;
  gap: 8px;
}
.workout-hud__bar-label {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  color: var(--pl-stone);
}
.workout-hud__bar-pct {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.04em;
  color: var(--pl-ink);
  font-variant-numeric: tabular-nums;
}
.workout-hud__bar {
  height: 10px;
  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: #10111A;
}
.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;
  animation: workout-dot-ping 1.2s infinite;
}
@keyframes workout-dot-ping { 0%{transform:scale(1); opacity:0.6} 100%{transform:scale(1.25); opacity:0} }
.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 {
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline-strong);
  box-shadow: var(--pl-plate-shadow-md);
  overflow: hidden;
  position: relative;
}
/* Subtle acid grid over deck — brutal but quiet */
.workout-deck::before {
  content: '';
  position: absolute;
  inset: 0;
  pointer-events: none;
  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: 16px 16px;
  opacity: 0.35;
  z-index: 0;
}
.workout-deck > * { position: relative; z-index: 1; }

/* Focus card */
.workout-focus {
  display: flex;
  flex-direction: column;
  gap: 0;
  padding: 0;
  position: relative;
}
.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));
}
.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="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: 22px;
  padding: 0 7px;
  background: var(--pl-cyan);
  color: #10111A;
  border: 1.5px solid var(--pl-cyan);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.06em;
}
.workout-focus__pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  height: 22px;
  padding: 0 8px;
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline-strong);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.06em;
  color: var(--pl-ink);
  font-variant-numeric: tabular-nums;
}
.workout-focus__pill--done {
  background: var(--pl-success);
  border-color: var(--pl-success);
  color: #10111A;
}
.workout-focus__menu-btn {
  width: 36px;
  height: 36px;
  display: inline-grid;
  place-items: center;
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline-strong);
  cursor: pointer;
}
.workout-focus__menu-dots {
  display: flex;
  flex-direction: column;
  gap: 3px;
  align-items: center;
}
.workout-focus__menu-dots i {
  width: 4px;
  height: 4px;
  background: var(--pl-ink);
  display: block;
}
.workout-focus__name {
  margin: 0;
  padding: 12px 12px 10px;
  font-family: var(--font-display) !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  letter-spacing: -0.015em !important;
  line-height: 1.15 !important;
  text-transform: uppercase !important;
  color: var(--pl-ink) !important;
  border-bottom: 1.5px solid var(--pl-hairline);
  background: var(--pl-chip);
  word-break: break-word;
}
.workout-focus__dots {
  display: flex;
  align-items: center;
  gap: 5px;
  padding: 9px 12px;
  background: var(--pl-chip-2);
  border-bottom: 1.5px solid var(--pl-hairline);
  flex-wrap: wrap;
}
.workout-focus__dot {
  width: 22px;
  height: 22px;
  display: inline-grid;
  place-items: center;
  background: var(--pl-chip);
  border: 1.5px solid var(--pl-hairline-strong);
  position: relative;
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 800;
  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: #10111A;
}
.workout-focus__dot--active {
  background: var(--pl-volt-fill);
  border-color: var(--pl-ink);
  border-width: 1.5px;
  color: var(--pl-volt-fg);
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color), inset 0 0 0 1.5px var(--pl-volt-edge);
  transform: translate(-1px, -1px) scale(1.12);
  width: 26px;
  height: 26px;
  z-index: 1;
}
.workout-focus__dot--active .workout-focus__dot-pulse {
  position: absolute;
  inset: -4px;
  border: 2px solid var(--pl-volt-fill);
  animation: workout-dot-ping 1.0s infinite;
}
.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 12px 8px;
  background: var(--pl-chip);
  border-bottom: 1.5px solid var(--pl-hairline);
}
.workout-focus__set-label {
  font-family: var(--font-mono);
  font-size: 12px;
  font-weight: 900;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--pl-ink);
}
.workout-focus__set-label-dim {
  font-weight: 700;
  color: var(--pl-stone);
}
.workout-focus__warmup {
  display: inline-flex;
  align-items: center;
  padding: 3px 8px;
  background: color-mix(in srgb, var(--pl-amber) 18%, transparent);
  border: 1.5px solid var(--pl-warn-text);
  color: var(--pl-warn-text);
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.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: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  min-height: 44px !important;
  font-size: 20px !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  color: var(--pl-ink) !important;
  box-shadow: none !important;
}
.workout-focus__stepper .set-metric-stepper__btn--compact:hover {
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow) !important;
}
.workout-focus__stepper .set-metric-stepper__value--compact {
  height: 44px !important;
  min-height: 44px !important;
  font-size: 20px !important;
  font-weight: 900 !important;
  background: var(--pl-chip) !important;
  border: 1.5px solid var(--pl-volt-edge) !important;
  color: var(--pl-ink) !important;
  box-shadow: inset 0 0 0 1px var(--pl-volt-fill) !important;
}
.workout-focus__stepper .set-metric-stepper__value-unit {
  color: var(--pl-stone);
  font-size: 10px !important;
  letter-spacing: 0.06em;
}
.workout-focus__log {
  width: 68px;
  min-width: 68px;
  display: grid;
  place-items: center;
  background: var(--pl-volt-fill);
  color: var(--pl-volt-fg);
  border: 1.5px solid var(--pl-volt-edge);
  box-shadow: var(--pl-plate-shadow-sm);
  cursor: pointer;
  padding: 0;
  transition: transform 90ms ease, filter 120ms ease, box-shadow 90ms ease, background 120ms ease;
  touch-action: manipulation;
  flex-shrink: 0;
  align-self: stretch;
}
.workout-focus__log:hover { filter: brightness(1.08); transform: translate(-1px, -1px); box-shadow: var(--pl-plate-shadow-sm); }
.workout-focus__log:active {
  transform: translate(1px, 1px);
  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-icon .mud-icon-root {
  font-size: 32px !important;
  width: 32px !important;
  height: 32px !important;
}
.workout-focus__log-icon {
  display: grid;
  place-items: center;
}
.workout-next {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 9px 12px;
  background: var(--pl-chip-2);
  border-top: 1.5px solid var(--pl-hairline);
  flex-wrap: wrap;
}
.workout-next__kicker {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.10em;
  text-transform: uppercase;
  line-height: 1;
  color: var(--pl-stone);
  flex-shrink: 0;
}
.workout-next__name {
  font-family: var(--font-display);
  font-size: 13px;
  font-weight: 800;
  letter-spacing: -0.01em;
  text-transform: uppercase;
  color: var(--pl-ink);
  line-height: 1.1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.workout-next__preview {
  font-family: var(--font-mono);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.04em;
  color: var(--pl-stone);
  line-height: 1;
  white-space: nowrap;
}
html[data-theme="dark"] .workout-next__preview { color: var(--pl-stone); }
.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: 36px !important;
  min-width: 36px !important;
  height: 36px !important;
  min-height: 36px !important;
  font-size: 16px !important;
}
.workout-focus__history-steppers .set-metric-stepper__value--compact {
  height: 36px !important;
  min-height: 36px !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: 1.5px solid var(--pl-hairline-strong);
  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: 1.5px solid var(--pl-hairline-strong);
}
.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);
}
.workout-rest-takeover__dot {
  width: 9px;
  height: 9px;
  background: var(--pl-cyan);
  border: 1.5px solid var(--pl-ink);
  animation: workout-rest-dot 0.9s infinite alternate;
}
@keyframes workout-rest-dot { 0%{box-shadow:0 0 0 0 rgba(0,229,255,0.5)} 100%{box-shadow:0 0 0 6px rgba(0,229,255,0)} }
.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;
}
.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-yellow) !important;
  text-shadow: none !important;
}
html[data-theme="light"] .workout-rest-takeover .rest-timer-digits { color: var(--pl-yellow-text) !important; }
.workout-rest-takeover__next {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 14px 12px 16px;
  background: var(--pl-volt-fill);
  border: 1.5px solid var(--pl-volt-edge);
  box-shadow: var(--pl-plate-shadow-md);
  text-align: center;
}
.workout-rest-takeover__next-kicker {
  font-family: var(--font-mono);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--pl-volt-fg);
  opacity: 0.7;
  line-height: 1;
}
.workout-rest-takeover__next-name {
  font-family: var(--font-display);
  font-size: 22px;
  font-weight: 900;
  letter-spacing: -0.02em;
  text-transform: uppercase;
  line-height: 1;
  color: var(--pl-volt-fg);
  text-align: center;
  word-break: break-word;
}
.workout-rest-takeover__next-preview {
  font-family: var(--font-mono);
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  color: var(--pl-volt-fg);
  background: rgba(16,17,26,0.10);
  border: 1px solid rgba(16,17,26,0.18);
  padding: 4px 10px;
  line-height: 1;
}
.workout-rest-takeover__next-preview:empty { display: none; }

/* Override rest timer controls inside takeover to be brutal */
.workout-rest-takeover .rest-timer-controls {
  padding: 10px 12px 12px !important;
  gap: 8px !important;
  background: var(--pl-chip);
}
.workout-rest-takeover .rest-timer-add-btn {
  flex: 1 1 auto;
  height: 44px !important;
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-hairline-strong) !important;
  font-weight: 900 !important;
  letter-spacing: 0.06em !important;
}
.workout-rest-takeover .rest-timer-icon-btn {
  width: 44px !important;
  height: 44px !important;
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-hairline-strong) !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: all 100ms ease;
}
.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: all 120ms ease;
}
.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__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: 3px;
  align-items: center;
}
.workout-sequence-strip__pip {
  width: 7px;
  height: 7px;
  background: var(--pl-paper-2);
  border: 1px solid var(--pl-hairline-strong);
  display: block;
}
.workout-sequence-strip__pip--done {
  background: var(--pl-success);
  border-color: var(--pl-success);
}
.workout-sequence-strip__pip--active {
  background: var(--pl-ink);
  border-color: var(--pl-ink);
  box-shadow: 0 0 0 1px var(--pl-chip);
}
.workout-sequence-strip__item--active .workout-sequence-strip__pip { border-color: rgba(16,17,26,0.3); }
.workout-sequence-strip__item--active .workout-sequence-strip__pip--done { background: var(--pl-ink); border-color: var(--pl-ink); }

/* 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: #10111A;
  font-size: 11px;
  font-weight: 900;
  border: 1px solid var(--pl-success);
}
.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);
}
.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;
  text-align: left;
  transition: all 120ms ease;
}
.workout-completed-rail__item:hover {
  border-color: var(--pl-yellow);
  background: var(--pl-chip);
}
.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="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: var(--pl-ink);
  background: var(--pl-success);
  border: 1px solid var(--pl-success);
  padding: 2px 6px;
  white-space: nowrap;
}
.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: all 100ms ease;
}
.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="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: #10111A;
  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;
}
.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: 14px; }
  .workout-focus__name { font-size: 18px !important; padding: 10px 10px 8px; }
  .workout-focus__controls { padding: 10px; gap: 6px; }
  .workout-focus__log { width: 60px; min-width: 60px; }
  .workout-focus__stepper .set-metric-stepper__btn--compact { width: 40px !important; min-width: 40px !important; height: 40px !important; }
  .workout-focus__stepper .set-metric-stepper__value--compact { height: 40px !important; font-size: 18px !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: 22px !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="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="light"] .stat-card__label {
  background: var(--pl-chip-2) !important;
  border-top: 1.5px solid var(--pl-hairline-strong) !important;
  color: var(--pl-stone) !important;
}
html[data-theme="light"] .stat-card:nth-child(1) .stat-card__value {
  background-image: linear-gradient(155deg, color-mix(in srgb, var(--pl-volt-fill) 22%, #FFFFFF) 0%, color-mix(in srgb, var(--pl-yellow) 14%, transparent) 100%) !important;
  border-bottom: 3px solid var(--pl-volt-fill) !important;
}
html[data-theme="light"] .stat-card:nth-child(2) .stat-card__value {
  background-image: linear-gradient(155deg, color-mix(in srgb, var(--pl-cyan) 18%, #FFFFFF) 0%, color-mix(in srgb, var(--pl-cyan) 10%, transparent) 100%) !important;
  border-bottom: 3px solid var(--pl-cyan) !important;
}
html[data-theme="light"] .stat-card:nth-child(3) .stat-card__value {
  background-image: linear-gradient(155deg, color-mix(in srgb, var(--pl-purple) 18%, #FFFFFF) 0%, color-mix(in srgb, var(--pl-purple) 10%, transparent) 100%) !important;
  border-bottom: 3px solid var(--pl-purple) !important;
}
html[data-theme="light"] .stat-card:nth-child(4) .stat-card__value {
  background-image: linear-gradient(155deg, color-mix(in srgb, var(--pl-success) 18%, #FFFFFF) 0%, color-mix(in srgb, var(--pl-success) 10%, transparent) 100%) !important;
  border-bottom: 3px solid var(--pl-success) !important;
}
html[data-theme="light"] .home-hero.mud-paper {
  border: 1.5px solid var(--pl-ink-border) !important;
  background-color: #FFFFFF !important;
  background-image:
    repeating-linear-gradient(-45deg, color-mix(in srgb, var(--pl-volt-fill) 10%, transparent) 0 14px, transparent 14px 28px),
    linear-gradient(150deg, color-mix(in srgb, var(--pl-volt-fill) 14%, #FFFFFF) 0%, color-mix(in srgb, var(--pl-cyan) 6%, #FFFFFF) 55%, #FFFFFF 100%) !important;
  box-shadow: 6px 6px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme="light"] .bodyweight-panel.mud-paper,
html[data-theme="light"] .history-heatmap-panel.mud-paper,
html[data-theme="light"] .home-heatmap-panel.mud-paper {
  border: 1.5px solid var(--pl-ink-border) !important;
  background-color: #FFFFFF !important;
  box-shadow: 6px 6px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme="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="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="light"] .plan-card__load-dots .load-dot--5 {
  background: var(--pl-chip-2) !important;
  border-color: var(--pl-ink-border) !important;
  color: var(--pl-stone) !important;
}
html[data-theme="light"] .rest-timer-panel.mud-paper {
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 6px 6px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme="light"] .rest-timer-digits {
  color: var(--pl-yellow-text) !important;
  text-shadow: 1px 0 0 rgba(250,255,0,0.18) !important;
}
html[data-theme="light"] .rest-timer-digits--imminent { color: #B45309 !important; }
html[data-theme="light"] .rest-timer-digits--urgent { color: #9F1239 !important; }
html[data-theme="light"] .rest-timer-edge-track {
  background: var(--pl-chip-2) !important;
  border-top: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme="light"] .rest-timer-edge-fill { background: var(--pl-volt-fill) !important; }
html[data-theme="light"] .rest-timer-controls .mud-icon-button,
html[data-theme="light"] .rest-timer-icon-btn,
html[data-theme="light"] .rest-timer-add-btn {
  background: #FFFFFF !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme="light"] .rest-timer-controls .mud-icon-button:hover,
html[data-theme="light"] .rest-timer-icon-btn:hover,
html[data-theme="light"] .rest-timer-add-btn:hover {
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow-text) !important;
}
html[data-theme="light"] .set-metric-stepper__btn.mud-button-root,
html[data-theme="light"] .set-metric-stepper__btn {
  background: #FFFFFF !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme="light"] .set-metric-stepper__value,
html[data-theme="light"] .set-metric-stepper__input {
  background: #FFFFFF !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: inset 0 1px 0 var(--pl-bevel-highlight) !important;
}
html[data-theme="light"] .set-metric-stepper__btn.mud-button-root:hover {
  border-color: var(--pl-yellow) !important;
  color: var(--pl-yellow-text) !important;
}
html[data-theme="light"] .exercise-accordion-card {
  border: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme="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="light"] .workout-deck:has(.workout-rest-takeover) {
  background: transparent !important;
  border: none !important;
  box-shadow: none !important;
}
html[data-theme="light"] .workout-rest-card {
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: var(--pl-plate-shadow-md) !important;
}
html[data-theme="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="light"] .workout-hud,
html[data-theme="light"] .workout-deck,
html[data-theme="light"] .workout-brutal__header {
  border: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme="light"] .workout-hud__stat {
  border-color: var(--pl-hairline) !important;
}
html[data-theme="light"] .workout-hud__bar {
  border: 1.5px solid var(--pl-ink-border) !important;
  background: var(--pl-chip-2) !important;
}
html[data-theme="light"] .plan-exercise-row {
  background: #FFFFFF !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 3px 3px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme="light"] .plan-exercise-row:hover {
  border-color: var(--pl-yellow) !important;
}
html[data-theme="light"] .plan-exercise-handle {
  background: var(--pl-chip-2) !important;
  border: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme="light"] .workout-actions__btn--discard {
  background: #FFFFFF !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  color: var(--pl-err-text) !important;
}
html[data-theme="light"] .workout-actions__btn--end {
  border: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme="light"] .app-nav-pill__inner {
  background: #FFFFFF !important;
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 8px 8px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme="light"] .mud-dialog {
  border: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme="light"] .mud-dialog-title {
  background: var(--pl-chip-2) !important;
  border-bottom: 1.5px solid var(--pl-ink-border) !important;
}
html[data-theme="light"] .home-plans-new-btn.mud-button-root,
html[data-theme="light"] .plan-sheet-save-btn,
html[data-theme="light"] .log-set-btn,
html[data-theme="light"] .bodyweight-log-row__log-btn,
html[data-theme="light"] .ai-chat-send-button {
  border: 1.5px solid var(--pl-ink-border) !important;
  box-shadow: 4px 4px 0 var(--pl-plate-shadow-color) !important;
}
html[data-theme="light"] .home-plans-new-btn.mud-button-root:hover,
html[data-theme="light"] .plan-sheet-save-btn:hover,
html[data-theme="light"] .log-set-btn:hover {
  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="light"] #app .mud-checkbox .mud-icon-button,
html[data-theme="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="light"] #app .mud-checkbox .mud-icon-button,
html[data-theme="light"] #app .mud-checkbox .mud-button-root.mud-icon-button {
  background: #FFFFFF !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="light"] #app .mud-checkbox .mud-icon-button.mud-checked,
html[data-theme="light"] #app .mud-checkbox .mud-icon-button.mud-checkbox-true,
html[data-theme="dark"] #app .mud-checkbox .mud-icon-button.mud-checked,
html[data-theme="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="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;
}

