:root {
  --posui-navy-950: #081521;
  --posui-navy-900: #0d2032;
  --posui-navy-800: #17344d;
  --posui-blue: #397fbe;
  --posui-blue-strong: #236ba8;
  --posui-blue-soft: #eaf3fb;
  --posui-cyan: #62c2d0;
  --posui-bg: #eef3f7;
  --posui-surface: #ffffff;
  --posui-surface-soft: #f7f9fb;
  --posui-line: #d8e2e9;
  --posui-line-strong: #bfd0dc;
  --posui-ink: #162b3a;
  --posui-muted: #607483;
  --posui-green: #2c7041;
  --posui-green-soft: #e5f3e9;
  --posui-amber: #8a6100;
  --posui-amber-soft: #fff4d4;
  --posui-red: #a13d3a;
  --posui-red-soft: #fbe9e7;
  --posui-shadow-sm: 0 3px 12px rgba(14, 38, 57, .06);
  --posui-shadow: 0 14px 40px rgba(14, 38, 57, .09);
  --posui-radius-sm: 12px;
  --posui-radius: 18px;
  --posui-radius-lg: 24px;
}

html.pos-ui-v20 {
  color-scheme: light;
  background: var(--posui-bg);
  font-family: Inter, ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

html.pos-ui-v20 body {
  min-width: 320px;
  min-height: 100vh;
  margin: 0;
  overflow-x: hidden;
  background:
    radial-gradient(circle at 78% -12%, rgba(98, 194, 208, .14), transparent 31rem),
    var(--posui-bg);
  color: var(--posui-ink);
}

html.pos-ui-v20 *,
html.pos-ui-v20 *::before,
html.pos-ui-v20 *::after { box-sizing: border-box; }

html.pos-ui-v20 button,
html.pos-ui-v20 input,
html.pos-ui-v20 select,
html.pos-ui-v20 textarea { font: inherit; }

html.pos-ui-v20 button,
html.pos-ui-v20 a,
html.pos-ui-v20 input,
html.pos-ui-v20 select,
html.pos-ui-v20 textarea { -webkit-tap-highlight-color: transparent; }

html.pos-ui-v20 button:focus-visible,
html.pos-ui-v20 a:focus-visible,
html.pos-ui-v20 input:focus-visible,
html.pos-ui-v20 select:focus-visible,
html.pos-ui-v20 textarea:focus-visible {
  outline: 3px solid rgba(78, 164, 224, .72) !important;
  outline-offset: 2px !important;
}

/* Shell */
html.pos-ui-v20 .app-shell {
  display: grid;
  grid-template-columns: 272px minmax(0, 1fr);
  min-height: 100vh;
  background: transparent;
}

html.pos-ui-v20 .sidebar {
  z-index: 100;
  display: flex;
  flex-direction: column;
  height: 100vh;
  padding: 20px 16px 16px;
  overflow: hidden;
  position: sticky;
  top: 0;
  color: #fff;
  background:
    radial-gradient(circle at 25% 0, rgba(98, 194, 208, .16), transparent 18rem),
    linear-gradient(180deg, var(--posui-navy-900), var(--posui-navy-950));
  border-right: 1px solid rgba(255, 255, 255, .08);
  box-shadow: 12px 0 36px rgba(8, 21, 33, .09);
}

html.pos-ui-v20 .brand {
  display: flex;
  align-items: center;
  gap: 12px;
  min-height: 52px;
  margin: 0 4px 14px;
  color: #fff;
}

html.pos-ui-v20 .posui-brand-mark {
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 42px;
  height: 42px;
  border: 1px solid rgba(255,255,255,.26);
  border-radius: 14px;
  background: linear-gradient(145deg, #4e9acb, #2c6f9e);
  box-shadow: 0 8px 18px rgba(0,0,0,.2), inset 0 1px rgba(255,255,255,.24);
  font-size: 1.08rem;
  font-weight: 900;
}
html.pos-ui-v20 .posui-brand-mark img { display: block; width: 100%; height: 100%; border-radius: inherit; }

html.pos-ui-v20 .posui-brand-copy { display: grid; gap: 2px; min-width: 0; }
html.pos-ui-v20 .posui-brand-copy strong { font-size: 1rem; letter-spacing: -.01em; }
html.pos-ui-v20 .posui-brand-copy small { color: #a9bfce; font-size: .7rem; font-weight: 700; letter-spacing: .04em; }

html.pos-ui-v20 .shell-connection {
  margin: 0 4px 13px;
  padding: 9px 11px;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 12px;
  background: rgba(255,255,255,.055);
  color: #d9e7ef;
  box-shadow: none;
  font-size: .74rem;
}

html.pos-ui-v20 .shell-connection::before {
  content: "";
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-right: 7px;
  border-radius: 50%;
  background: #69d08b;
  box-shadow: 0 0 0 4px rgba(105,208,139,.11);
}

html.pos-ui-v20 .shell-connection--offline::before { background: #efc55b; box-shadow: 0 0 0 4px rgba(239,197,91,.12); }
html.pos-ui-v20 .shell-connection--conflict::before { background: #ef837e; box-shadow: 0 0 0 4px rgba(239,131,126,.12); }

html.pos-ui-v20 .sidebar nav {
  display: grid;
  flex: 1 1 auto;
  align-content: start;
  gap: 4px;
  min-height: 0;
  padding: 3px 2px 12px;
  overflow-y: auto;
  scrollbar-width: thin;
  scrollbar-color: rgba(255,255,255,.18) transparent;
}

html.pos-ui-v20 .sidebar nav::before {
  content: "COMMANDS";
  padding: 6px 10px 5px;
  color: #7893a7;
  font-size: .62rem;
  font-weight: 850;
  letter-spacing: .13em;
}

html.pos-ui-v20 .sidebar nav button {
  display: grid;
  grid-template-columns: 29px minmax(0, 1fr);
  align-items: center;
  width: 100%;
  min-height: 43px;
  padding: 7px 10px;
  border: 1px solid transparent;
  border-radius: 12px;
  background: transparent;
  color: #c8d7e2;
  text-align: left;
  font-size: .85rem;
  font-weight: 720;
  transition: color .16s ease, background .16s ease, border-color .16s ease, transform .16s ease;
}

html.pos-ui-v20 .sidebar nav button::before {
  content: attr(data-posui-icon);
  display: grid;
  place-items: center;
  width: 27px;
  height: 27px;
  border-radius: 9px;
  color: #9bb3c4;
  font-size: .88rem;
  font-weight: 900;
}

html.pos-ui-v20 .sidebar nav button:hover {
  border-color: rgba(255,255,255,.08);
  background: rgba(255,255,255,.065);
  color: #fff;
  transform: translateX(1px);
}

html.pos-ui-v20 .sidebar nav button.active,
html.pos-ui-v20 .sidebar nav button.posrc-more-button.active {
  border-color: rgba(119,194,229,.28);
  background: linear-gradient(90deg, rgba(64,140,191,.34), rgba(64,140,191,.17));
  color: #fff;
  box-shadow: inset 3px 0 #66c5d2;
}

html.pos-ui-v20 .sidebar nav button.active::before { color: #8cdae4; background: rgba(98,194,208,.12); }

html.pos-ui-v20 .sidebar nav .posrc-more-button {
  min-height: 43px;
  background: transparent;
  color: #c8d7e2;
}

html.pos-ui-v20 .account-panel {
  display: grid;
  flex: 0 0 auto;
  grid-template-columns: 34px minmax(0, 1fr);
  grid-template-rows: auto auto;
  align-items: center;
  column-gap: 10px;
  row-gap: 1px;
  min-height: 54px;
  max-height: none;
  margin: 10px 2px 0;
  padding: 9px 10px;
  position: static;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 14px;
  background: rgba(255,255,255,.055);
}

html.pos-ui-v20 .account-panel::before {
  content: "T";
  display: grid;
  flex: 0 0 auto;
  place-items: center;
  width: 34px;
  height: 34px;
  grid-column: 1;
  grid-row: 1 / 3;
  border-radius: 11px;
  background: #d7eaf5;
  color: var(--posui-navy-900);
  font-weight: 900;
}

html.pos-ui-v20 .account-panel > .s02-version-badge {
  grid-column: 2;
  grid-row: 1;
  min-width: 0;
  margin: 0;
  overflow: hidden;
  color: #8fa7b8;
  font-size: .59rem;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html.pos-ui-v20 .account-panel > small:not(.s02-version-badge) {
  grid-column: 2;
  grid-row: 2;
  min-width: 0;
  overflow: hidden;
  color: #d8e5ed;
  font-size: .69rem;
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

html.pos-ui-v20 .sidebar .account-actions { display: none; }

/* Main content */
html.pos-ui-v20 .app-shell > main {
  width: 100%;
  max-width: none;
  min-width: 0;
  margin: 0;
  padding: 31px clamp(24px, 4vw, 58px) 110px;
  background: transparent;
}

html.pos-ui-v20 .app-shell > main:not(#posrc-root) > * { width: 100%; max-width: 1320px; margin-left: auto; margin-right: auto; }
html.pos-ui-v20 #posrc-root.posrc-page { max-width: none; background: transparent; color: var(--posui-ink); }

html.pos-ui-v20 .topbar,
html.pos-ui-v20 .page-heading,
html.pos-ui-v20 .planner-topbar,
html.pos-ui-v20 .today-v3__header {
  margin-bottom: 20px;
}

html.pos-ui-v20 .topbar h1,
html.pos-ui-v20 .page-heading h1,
html.pos-ui-v20 .planner-topbar h1,
html.pos-ui-v20 .today-v3__header h1,
html.pos-ui-v20 .posrc-page h1 {
  color: var(--posui-navy-900);
  font-size: clamp(1.75rem, 3vw, 2.55rem);
  line-height: 1.08;
  letter-spacing: -.04em;
}

html.pos-ui-v20 .eyebrow {
  color: #6f8595 !important;
  font-size: .68rem;
  font-weight: 850;
  letter-spacing: .12em;
}

html.pos-ui-v20 p { line-height: 1.55; }
html.pos-ui-v20 .status-text,
html.pos-ui-v20 .page-heading p,
html.pos-ui-v20 .topbar p { color: var(--posui-muted); }

html.pos-ui-v20 button {
  border-radius: 11px;
  transition: filter .14s ease, transform .14s ease, box-shadow .14s ease;
}
html.pos-ui-v20 button:not(:disabled):active { transform: translateY(1px) scale(.99); }

html.pos-ui-v20 input,
html.pos-ui-v20 select,
html.pos-ui-v20 textarea {
  border-color: var(--posui-line-strong) !important;
  border-radius: 11px !important;
  background: #fff !important;
  color: var(--posui-ink) !important;
  box-shadow: inset 0 1px 2px rgba(13,32,50,.025);
}

html.pos-ui-v20 input:focus,
html.pos-ui-v20 select:focus,
html.pos-ui-v20 textarea:focus {
  border-color: #6ca3c8 !important;
  box-shadow: 0 0 0 3px rgba(57,127,190,.11) !important;
}

/* Cards shared by the established app and new modules */
html.pos-ui-v20 .task-card,
html.pos-ui-v20 .metric-card,
html.pos-ui-v20 .score-model-note,
html.pos-ui-v20 .development-progress,
html.pos-ui-v20 .settings-card,
html.pos-ui-v20 .account-control-card,
html.pos-ui-v20 .foundation-final-proof,
html.pos-ui-v20 .planner-intelligence,
html.pos-ui-v20 .planner-day,
html.pos-ui-v20 .s07-source-card,
html.pos-ui-v20 .s08-card,
html.pos-ui-v20 .s08-time-card,
html.pos-ui-v20 .s08-time-history,
html.pos-ui-v20 .s09-card,
html.pos-ui-v20 .posrc-card,
html.pos-ui-v20 .posrc-existing-links,
html.pos-ui-v20 .posrc-module-grid article,
html.pos-ui-v20 .posrc-status-strip article,
html.pos-ui-v20 .posrc-kpi-grid article,
html.pos-ui-v20 .posrc-trend-grid article,
html.pos-ui-v20 .posrc-release-grid article {
  border: 1px solid var(--posui-line) !important;
  border-radius: var(--posui-radius) !important;
  background: rgba(255,255,255,.95) !important;
  box-shadow: var(--posui-shadow-sm) !important;
}

html.pos-ui-v20 .task-card:hover,
html.pos-ui-v20 .posrc-module-grid article:hover,
html.pos-ui-v20 .s08-card:hover,
html.pos-ui-v20 .s09-card:hover {
  border-color: #c3d5e1 !important;
  box-shadow: var(--posui-shadow) !important;
}

html.pos-ui-v20 .task-card--current {
  border-color: #6a9fbe !important;
  background: linear-gradient(145deg, #fff, #f4f9fc) !important;
  box-shadow: 0 18px 48px rgba(29, 80, 116, .13) !important;
}

html.pos-ui-v20 .sync-chip,
html.pos-ui-v20 .posrc-sync-chip {
  min-height: 38px;
  border: 1px solid #c6d6df !important;
  border-radius: 999px !important;
  background: rgba(255,255,255,.85) !important;
  color: var(--posui-green) !important;
  box-shadow: var(--posui-shadow-sm);
}

html.pos-ui-v20 .sync-chip--offline { background: var(--posui-amber-soft) !important; color: var(--posui-amber) !important; }

/* Today */
html.pos-ui-v20 .today-v3 { gap: 18px; }
html.pos-ui-v20 .today-v3__header {
  padding: 22px 24px;
  border: 1px solid #d7e3ea;
  border-radius: var(--posui-radius-lg);
  background:
    radial-gradient(circle at 88% 12%, rgba(98,194,208,.17), transparent 16rem),
    linear-gradient(145deg, rgba(255,255,255,.98), rgba(242,248,251,.96));
  box-shadow: var(--posui-shadow-sm);
}

html.pos-ui-v20 .today-v3__clock { color: var(--posui-navy-900); }
html.pos-ui-v20 .today-core-viewport { min-width: 0; }
html.pos-ui-v20 .today-core-grid { gap: 16px; }
html.pos-ui-v20 .today-command-card,
html.pos-ui-v20 .today-mini-card,
html.pos-ui-v20 .today-empty-focus,
html.pos-ui-v20 .today-tomorrow-section,
html.pos-ui-v20 .today-timeline-section,
html.pos-ui-v20 .today-overdue-section {
  border-color: var(--posui-line) !important;
  border-radius: var(--posui-radius) !important;
  background: rgba(255,255,255,.94) !important;
  box-shadow: var(--posui-shadow-sm) !important;
}

html.pos-ui-v20 .today-day-progress__track,
html.pos-ui-v20 .subtask-rollup__track { overflow: hidden; border-radius: 999px; background: #dfe8ed; }

html.pos-ui-v20 .today-block-nav {
  display: grid;
  grid-template-columns: minmax(150px, 1fr) auto minmax(150px, 1fr);
  align-items: center;
  gap: 10px;
  margin: 0 0 12px;
  padding: 9px;
  border: 1px solid var(--posui-line);
  border-radius: 15px;
  background: rgba(255,255,255,.82);
  box-shadow: var(--posui-shadow-sm);
}

html.pos-ui-v20 .today-block-nav button {
  min-height: 42px;
  border: 1px solid #b7cad6;
  border-radius: 11px;
  background: #f5f9fb;
  color: var(--posui-navy-800);
  font-weight: 850;
}

html.pos-ui-v20 .today-block-nav button:first-child { justify-self: start; }
html.pos-ui-v20 .today-block-nav button:last-child { justify-self: end; }
html.pos-ui-v20 .today-block-nav__now { min-width: 128px; background: var(--posui-navy-800) !important; color: #fff !important; }
html.pos-ui-v20 .today-block-nav__now.active { border-color: #84b994 !important; background: var(--posui-green-soft) !important; color: var(--posui-green) !important; opacity: 1; }

html.pos-ui-v20 .today-focus-wrap--gap {
  border-radius: 20px;
  box-shadow: 0 14px 34px rgba(19,54,79,.09);
}

html.pos-ui-v20 .today-empty-focus--gap {
  min-height: 326px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  justify-content: center;
  gap: 14px;
  padding: 34px;
  border: 1px solid #bcd4e1 !important;
  background:
    radial-gradient(circle at 92% 4%, rgba(88,190,205,.18), transparent 14rem),
    linear-gradient(145deg, #fff, #f2f8fb) !important;
  text-align: left;
}

html.pos-ui-v20 .today-empty-focus__time { display: flex; align-items: baseline; justify-content: space-between; gap: 14px; }
html.pos-ui-v20 .today-empty-focus__time h2 { margin: 0; font-size: clamp(1.8rem, 3vw, 2.7rem); letter-spacing: -.045em; }
html.pos-ui-v20 .today-empty-focus__time span { border-radius: 999px; background: var(--posui-blue-soft); padding: 7px 11px; color: var(--posui-blue-strong); font-weight: 900; }
html.pos-ui-v20 .today-empty-focus--gap > p:not(.eyebrow) { max-width: 560px; margin: 0; color: var(--posui-muted); font-size: .98rem; line-height: 1.55; }
html.pos-ui-v20 .today-empty-focus__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 4px; }
html.pos-ui-v20 .today-empty-focus__actions button { min-height: 46px; border: 0; border-radius: 11px; padding: 10px 16px; background: var(--posui-navy-800); color: #fff; font-weight: 900; }
html.pos-ui-v20 .today-empty-focus__actions button.secondary { border: 1px solid #b7cad6; background: #f5f9fb; color: var(--posui-navy-800); }

html.pos-ui-v20 .today-mini-card--gap { border-style: dashed !important; border-color: #9cbccc !important; background: #f6fbfd !important; }
html.pos-ui-v20 .today-mini-card__actions { display: grid; grid-template-columns: 1fr; gap: 7px; }
html.pos-ui-v20 .today-mini-card__actions button { margin-top: 0; }
html.pos-ui-v20 .today-mini-card__actions button:first-child { margin-top: 8px; }

html.pos-ui-v20 .today-completed-section {
  margin: 0 0 18px;
  padding: 19px 20px;
  border: 1px solid #bcd9bf;
  border-radius: var(--posui-radius);
  background: linear-gradient(145deg, rgba(249,253,248,.98), rgba(239,248,238,.95));
  box-shadow: var(--posui-shadow-sm);
}

html.pos-ui-v20 .today-completed-list { display: grid; gap: 8px; }
html.pos-ui-v20 .today-completed-list article { display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 11px 12px; border: 1px solid #d4e6d3; border-radius: 12px; background: rgba(255,255,255,.88); }
html.pos-ui-v20 .today-completed-list article > div { display: grid; gap: 2px; }
html.pos-ui-v20 .today-completed-list small { color: var(--posui-muted); }
html.pos-ui-v20 .today-completed-list button { min-height: 36px; border: 1px solid #a9c6aa; border-radius: 9px; background: #fff; color: var(--posui-green); font-weight: 850; }

html.pos-ui-v20 .today-timeline-gap {
  grid-template-columns: minmax(0,1fr) auto !important;
  gap: 8px !important;
  padding: 6px !important;
  border-color: #9ebdcd !important;
  background: #f1f8fb !important;
}

html.pos-ui-v20 .today-timeline-gap.is-focused { border-style: solid !important; box-shadow: 0 0 0 2px var(--posui-navy-800) inset; }
html.pos-ui-v20 .today-timeline-gap__focus { display: grid; grid-template-columns: 78px minmax(0,1fr) auto; align-items: center; gap: 14px; min-height: 54px; border: 0; border-radius: 9px; padding: 9px 10px; background: transparent; color: var(--posui-navy-900); text-align: left; }
html.pos-ui-v20 .today-timeline-gap__focus > span { display: grid; gap: 2px; }
html.pos-ui-v20 .today-timeline-gap__focus small { color: var(--posui-muted); }
html.pos-ui-v20 .today-timeline-gap__focus em { border-radius: 999px; padding: 5px 8px; background: var(--posui-blue-soft); color: var(--posui-blue-strong); font-size: .72rem; font-style: normal; font-weight: 900; }
html.pos-ui-v20 .today-timeline-gap__add { min-height: 42px; align-self: center; border: 1px solid #9fbdce; border-radius: 9px; padding: 8px 12px; background: #fff; color: var(--posui-navy-800); font-weight: 900; white-space: nowrap; }

html.pos-ui-v20 .today-quick-add { width: min(650px, 100%); padding: 22px; border-radius: 20px; }
html.pos-ui-v20 .today-quick-add__check { display: flex; grid-template-columns: none; align-items: center; gap: 9px; }
html.pos-ui-v20 .today-quick-add__check input { width: 19px; min-height: 19px; }
html.pos-ui-v20 .today-quick-add__fit { display: flex; justify-content: space-between; gap: 14px; border-radius: 11px; padding: 11px 13px; background: var(--posui-blue-soft); color: var(--posui-navy-800); }
html.pos-ui-v20 .planner-dialog__actions { display: flex; justify-content: flex-end; gap: 9px; }
html.pos-ui-v20 .planner-dialog__actions button { min-height: 44px; border: 0; border-radius: 10px; padding: 9px 15px; background: var(--posui-navy-800); color: #fff; font-weight: 900; }
html.pos-ui-v20 .planner-dialog__actions button.secondary { border: 1px solid #b7cad6; background: #f5f9fb; color: var(--posui-navy-800); }

html.pos-ui-v20 .occurrence-actions__danger { grid-template-columns: repeat(2, minmax(0,1fr)); }
html.pos-ui-v20 .occurrence-actions__danger span { grid-column: 1 / -1; }
html.pos-ui-v20 .occurrence-actions__danger button.danger { border-color: #d7a7a3; background: #fff4f3; color: #8f2520; }

/* Planner, templates, projects, time and fitness */
html.pos-ui-v20 .planner-toolbar,
html.pos-ui-v20 .s07-library__status,
html.pos-ui-v20 .s08-time-controls,
html.pos-ui-v20 .s09-tabs {
  padding: 12px;
  border: 1px solid var(--posui-line);
  border-radius: 16px;
  background: rgba(255,255,255,.88);
  box-shadow: var(--posui-shadow-sm);
}

html.pos-ui-v20 .planner-task,
html.pos-ui-v20 .s07-preview-item,
html.pos-ui-v20 .s08-milestone-list article,
html.pos-ui-v20 .s08-template-list article,
html.pos-ui-v20 .s08-material-list article,
html.pos-ui-v20 .s08-ledger article,
html.pos-ui-v20 .s09-list article,
html.pos-ui-v20 .s09-history article,
html.pos-ui-v20 .s09-template-items article,
html.pos-ui-v20 .s09-session-queue article {
  border-color: var(--posui-line) !important;
  border-radius: 13px !important;
  background: #fff !important;
}

html.pos-ui-v20 .planner-task--conflict { border-color: #d98f89 !important; background: var(--posui-red-soft) !important; }
html.pos-ui-v20 .planner-task--compatible { border-color: #82b991 !important; background: var(--posui-green-soft) !important; }
html.pos-ui-v20 .planner-day__header { border-radius: 14px 14px 0 0; }

html.pos-ui-v20 .planner-remove-button {
  border-color: #d7a7a3 !important;
  background: #fff4f3 !important;
  color: #8f2520 !important;
  font-weight: 800 !important;
}

html.pos-ui-v20 .planner-remove-button:hover {
  border-color: #bd746e !important;
  background: #f8dedd !important;
}

html.pos-ui-v20 main.planner-page > * { width: 100%; max-width: 1600px !important; }

@media (min-width: 1500px) {
  html.pos-ui-v20 main.planner-page { padding-inline: 28px; }
  html.pos-ui-v20 .planner-days--week {
    grid-template-columns: repeat(7, minmax(0, 1fr));
    overflow-x: visible;
  }
}

@media (min-width: 761px) and (max-width: 1499px) {
  html.pos-ui-v20 .planner-days--week {
    grid-template-columns: repeat(7, minmax(210px, 1fr));
    overflow-x: auto;
    scrollbar-gutter: stable;
  }
}

html.pos-ui-v20 .s07-library__tabs button,
html.pos-ui-v20 .s08-project-tabs button,
html.pos-ui-v20 .s09-tabs button {
  min-height: 39px;
  border-radius: 999px !important;
}

html.pos-ui-v20 .s07-library__tabs button.active,
html.pos-ui-v20 .s08-project-tabs button.active,
html.pos-ui-v20 .s09-tabs button.active {
  border-color: var(--posui-navy-800) !important;
  background: var(--posui-navy-800) !important;
  color: #fff !important;
}

/* More and the new modules */
html.pos-ui-v20 .posrc-page-head,
html.pos-ui-v20 .posrc-home-head { max-width: 1320px; }

html.pos-ui-v20 .posrc-home-head {
  padding: 24px;
  border: 1px solid #d4e2ea;
  border-radius: var(--posui-radius-lg);
  background:
    radial-gradient(circle at 88% 8%, rgba(98,194,208,.2), transparent 17rem),
    linear-gradient(145deg, rgba(255,255,255,.98), rgba(239,247,251,.96));
  box-shadow: var(--posui-shadow-sm);
}

html.pos-ui-v20 .posrc-quick-grid { gap: 14px; }
html.pos-ui-v20 .posrc-quick-grid button {
  border-color: #d3e0e8;
  border-radius: 16px;
  background: #fff;
  box-shadow: var(--posui-shadow-sm);
}
html.pos-ui-v20 .posrc-quick-grid button:hover { border-color: #9fc2d8; box-shadow: var(--posui-shadow); }
html.pos-ui-v20 .posrc-quick-grid button > span { background: var(--posui-blue-soft); color: var(--posui-blue-strong); }

html.pos-ui-v20 .posrc-module-grid { gap: 15px; }
html.pos-ui-v20 .posrc-module-grid article { min-height: 176px; padding: 20px; }
html.pos-ui-v20 .posrc-module-grid article button,
html.pos-ui-v20 .posrc-page button:not(.quiet):not(.secondary):not(.posrc-sync-chip):not(.posrc-back) {
  background: linear-gradient(145deg, var(--posui-navy-800), #245778);
  color: #fff;
  box-shadow: 0 5px 14px rgba(23,52,77,.13);
}

html.pos-ui-v20 .posrc-quick-grid button {
  border: 1px solid #d3e0e8 !important;
  background: #fff !important;
  color: var(--posui-navy-900) !important;
  box-shadow: var(--posui-shadow-sm) !important;
}

html.pos-ui-v20 .posrc-quick-grid button small { color: var(--posui-muted) !important; }

html.pos-ui-v20 .posrc-existing-links button {
  border: 1px solid #c9dbe7 !important;
  background: var(--posui-blue-soft) !important;
  color: var(--posui-navy-800) !important;
  box-shadow: none !important;
}

html.pos-ui-v20 .posrc-faith-card {
  border-color: transparent !important;
  background: linear-gradient(145deg, #102a40, #24536f) !important;
  box-shadow: var(--posui-shadow) !important;
}

html.pos-ui-v20 .posrc-privacy-banner,
html.pos-ui-v20 .posrc-notice { border-radius: 15px; }

/* Settings, account and diagnostics */
html.pos-ui-v20 .settings-grid,
html.pos-ui-v20 .account-overview { gap: 16px; }
html.pos-ui-v20 .settings-card,
html.pos-ui-v20 .account-control-card { padding: 20px; }
html.pos-ui-v20 .diagnostic-privacy { border-radius: 14px; }

html.pos-ui-v20 #personal-os-offline-readiness {
  right: 18px !important;
  bottom: 18px !important;
  border-radius: 999px !important;
  box-shadow: 0 10px 30px rgba(8,21,33,.16) !important;
  font-family: inherit !important;
}

/* Mobile command bar, hidden on desktop */
html.pos-ui-v20 .posui-mobile-header { display: none; }

/* Mid-sized desktop */
@media (max-width: 1120px) and (min-width: 761px) {
  html.pos-ui-v20 .app-shell { grid-template-columns: 230px minmax(0, 1fr); }
  html.pos-ui-v20 .sidebar { padding-inline: 12px; }
  html.pos-ui-v20 .app-shell > main { padding-inline: 24px; }
  html.pos-ui-v20 .posrc-module-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* iPhone and narrow browser layout */
@media (max-width: 760px) {
  html.pos-ui-v20 body {
    background:
      radial-gradient(circle at 90% -5%, rgba(98,194,208,.15), transparent 20rem),
      var(--posui-bg);
  }

  html.pos-ui-v20 .app-shell { display: block; min-height: 100dvh; }
  html.pos-ui-v20 .sidebar { display: none !important; }

  html.pos-ui-v20 .posui-mobile-header {
    z-index: 80;
    display: flex;
    align-items: center;
    justify-content: space-between;
    min-height: calc(58px + env(safe-area-inset-top));
    padding: calc(8px + env(safe-area-inset-top)) 15px 8px;
    position: sticky;
    top: 0;
    border-bottom: 1px solid rgba(197,213,223,.82);
    background: rgba(245,248,250,.9);
    backdrop-filter: blur(18px) saturate(1.3);
    -webkit-backdrop-filter: blur(18px) saturate(1.3);
  }

  html.pos-ui-v20 .posui-mobile-brand {
    display: flex;
    align-items: center;
    gap: 9px;
    border: 0;
    background: transparent;
    color: var(--posui-navy-900);
    font-weight: 900;
    letter-spacing: -.02em;
  }

  html.pos-ui-v20 .posui-mobile-brand img {
    display: block;
    width: 31px;
    height: 31px;
    border-radius: 10px;
    box-shadow: 0 5px 13px rgba(35,97,141,.2);
  }

  html.pos-ui-v20 .posui-mobile-state {
    display: flex;
    align-items: center;
    gap: 6px;
    color: var(--posui-green);
    font-size: .68rem;
    font-weight: 800;
  }
  html.pos-ui-v20 .posui-mobile-state::before { content: ""; width: 7px; height: 7px; border-radius: 50%; background: #4bb96d; }
  html.pos-ui-v20 .posui-mobile-state.offline { color: var(--posui-amber); }
  html.pos-ui-v20 .posui-mobile-state.offline::before { background: #d8a92d; }

  html.pos-ui-v20 .app-shell > main,
  html.pos-ui-v20 .app-shell > main#posrc-root {
    width: 100%;
    min-height: calc(100dvh - 58px);
    padding: 18px 13px calc(94px + env(safe-area-inset-bottom));
  }

  html.pos-ui-v20 .topbar,
  html.pos-ui-v20 .page-heading,
  html.pos-ui-v20 .planner-topbar,
  html.pos-ui-v20 .today-v3__header,
  html.pos-ui-v20 .posrc-page-head,
  html.pos-ui-v20 .posrc-home-head { gap: 11px; margin-bottom: 15px; }

  html.pos-ui-v20 .topbar h1,
  html.pos-ui-v20 .page-heading h1,
  html.pos-ui-v20 .planner-topbar h1,
  html.pos-ui-v20 .today-v3__header h1,
  html.pos-ui-v20 .posrc-page h1 { font-size: 1.72rem; }

  html.pos-ui-v20 .today-v3__header,
  html.pos-ui-v20 .posrc-home-head { padding: 17px 15px; border-radius: 18px; }

  html.pos-ui-v20 .task-card,
  html.pos-ui-v20 .settings-card,
  html.pos-ui-v20 .account-control-card,
  html.pos-ui-v20 .s08-card,
  html.pos-ui-v20 .s08-time-card,
  html.pos-ui-v20 .s09-card,
  html.pos-ui-v20 .posrc-card,
  html.pos-ui-v20 .posrc-existing-links,
  html.pos-ui-v20 .posrc-module-grid article {
    border-radius: 16px !important;
    box-shadow: 0 6px 20px rgba(14,38,57,.065) !important;
  }

  html.pos-ui-v20 .task-card--current { padding: 18px 15px; }
  html.pos-ui-v20 .status-row button,
  html.pos-ui-v20 .s09-status-row button { min-height: 50px; }

  html.pos-ui-v20 .planner-toolbar,
  html.pos-ui-v20 .s07-library__status,
  html.pos-ui-v20 .s08-time-controls,
  html.pos-ui-v20 .s09-tabs { padding: 10px; border-radius: 14px; }

  html.pos-ui-v20 .posrc-quick-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
  html.pos-ui-v20 .posrc-quick-grid button { min-height: 98px; }
  html.pos-ui-v20 .posrc-module-grid { grid-template-columns: 1fr; gap: 11px; }
  html.pos-ui-v20 .posrc-module-grid article { min-height: 0; }

  html.pos-ui-v20 .bottom-nav {
    z-index: 120;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0, 1fr)) !important;
    grid-auto-flow: initial !important;
    grid-auto-columns: initial !important;
    align-items: stretch;
    height: calc(70px + env(safe-area-inset-bottom));
    padding: 7px 8px calc(7px + env(safe-area-inset-bottom));
    position: fixed;
    right: 0;
    bottom: 0;
    left: 0;
    overflow: visible !important;
    border-top: 1px solid rgba(187,205,216,.8);
    background: rgba(250,252,253,.92) !important;
    color: var(--posui-muted) !important;
    box-shadow: 0 -10px 34px rgba(8,21,33,.1) !important;
    backdrop-filter: blur(20px) saturate(1.35);
    -webkit-backdrop-filter: blur(20px) saturate(1.35);
  }

  html.pos-ui-v20 .bottom-nav .posrc-mobile-secondary { display: none !important; }

  html.pos-ui-v20 .bottom-nav button {
    display: grid !important;
    grid-template-rows: 25px auto;
    place-items: center;
    min-width: 0 !important;
    min-height: 54px;
    padding: 4px 2px !important;
    border: 0 !important;
    border-radius: 13px !important;
    background: transparent !important;
    color: #687e8d !important;
    text-align: center !important;
    font-size: .66rem !important;
    font-weight: 780 !important;
  }

  html.pos-ui-v20 .bottom-nav button::before {
    content: attr(data-posui-icon);
    display: grid;
    place-items: center;
    width: 27px;
    height: 25px;
    border-radius: 9px;
    color: #687e8d;
    font-size: 1rem;
    font-weight: 900;
  }

  html.pos-ui-v20 .bottom-nav button.active {
    background: var(--posui-blue-soft) !important;
    color: var(--posui-blue-strong) !important;
  }
  html.pos-ui-v20 .bottom-nav button.active::before { color: var(--posui-blue-strong); }

  html.pos-ui-v20 #personal-os-offline-readiness {
    right: 12px !important;
    bottom: calc(79px + env(safe-area-inset-bottom)) !important;
    max-width: calc(100vw - 24px);
  }
}

/* v22 — category colour identifies the kind of planned block. Traffic-light colours
   are reserved exclusively for recorded outcomes. */
html.pos-ui-v20 .planner-calendar-event--personal { border-left-color: #7c3aed; background: #f1edff; color: #3f2378; }
html.pos-ui-v20 .planner-calendar-event--work { border-left-color: #2563eb; background: #eaf1ff; color: #173b80; }
html.pos-ui-v20 .planner-calendar-event--commute { border-left-color: #4f46e5; background: #eeedff; color: #302d86; }
html.pos-ui-v20 .planner-calendar-event--home { border-left-color: #9333ea; background: #f6ebff; color: #55207c; }
html.pos-ui-v20 .planner-calendar-event--faith { border-left-color: #9a6700; background: #fff6dc; color: #634400; }
html.pos-ui-v20 .planner-calendar-event--fitness { border-left-color: #c026d3; background: #fbeafa; color: #711b78; }
html.pos-ui-v20 .planner-calendar-event--gym { border-left-color: #c026d3; background: #fbeafa; color: #711b78; }
html.pos-ui-v20 .planner-calendar-event--skincare { border-left-color: #db2777; background: #fcebf3; color: #831843; }
html.pos-ui-v20 .planner-calendar-event--food { border-left-color: #0891b2; background: #e7f7fb; color: #15566a; }
html.pos-ui-v20 .planner-calendar-event--routine { border-left-color: #0e7490; background: #e8f5f8; color: #164e63; }
html.pos-ui-v20 .planner-calendar-event--sleep { border-left-color: #475569; background: #eef1f6; color: #263243; }

html.pos-ui-v20 .planner-calendar-event.is-done,
html.pos-ui-v20 .planner-calendar-event.is-done.is-conflict { border-color: #57a36a; border-left-color: #31834a; background: #e5f5e8; color: #205b32; opacity: 1; filter: none; }
html.pos-ui-v20 .planner-calendar-event.is-half,
html.pos-ui-v20 .planner-calendar-event.is-half.is-conflict { border-color: #d2a634; border-left-color: #a97b00; background: #fff2c6; color: #725300; }
html.pos-ui-v20 .planner-calendar-event.is-missed,
html.pos-ui-v20 .planner-calendar-event.is-missed.is-conflict { border-color: #dc7770; border-left-color: #bd3a33; background: #fde6e4; color: #84251f; }
html.pos-ui-v20 .planner-calendar-event.is-unlogged,
html.pos-ui-v20 .planner-calendar-event.is-unlogged.is-conflict { border-color: #98a2ad; border-left-color: #68727d; background: #edf0f3; color: #3f4852; }

html.pos-ui-v20 .posrc-search-target-flash {
  outline: 4px solid color-mix(in srgb, var(--helm-accent, #54b8d0) 42%, transparent) !important;
  outline-offset: 4px;
  animation: posrc-search-target-pulse 700ms ease 2;
}
@keyframes posrc-search-target-pulse {
  50% { outline-color: color-mix(in srgb, var(--helm-accent, #54b8d0) 82%, white); }
}

/* v23.3 iPhone quality pass: comfortable controls, compact pages and dependable sheets. */
@media (max-width: 760px) {
  html.pos-ui-v20 body { overscroll-behavior-x: none; }
  html.pos-ui-v20 #posrc-root[data-route] { max-width: 100vw; overflow-x: clip; }
  html.pos-ui-v20 #posrc-root[data-route] *,
  html.pos-ui-v20 #posrc-root[data-route] *::before,
  html.pos-ui-v20 #posrc-root[data-route] *::after { box-sizing: border-box; }
  html.pos-ui-v20 #posrc-root button,
  html.pos-ui-v20 #posrc-root a,
  html.pos-ui-v20 #posrc-root summary { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
  html.pos-ui-v20 #posrc-root button,
  html.pos-ui-v20 #posrc-root [role="button"] { min-height: 44px; }
  html.pos-ui-v20 #posrc-root input:not([type="checkbox"]):not([type="radio"]),
  html.pos-ui-v20 #posrc-root select,
  html.pos-ui-v20 #posrc-root textarea {
    min-height: 48px;
    max-width: 100%;
    font-size: 16px;
  }
  html.pos-ui-v20 #posrc-root textarea { min-height: 104px; }
  html.pos-ui-v20 #posrc-root details > summary { display: flex; align-items: center; min-height: 48px; }
  html.pos-ui-v20 #posrc-root h1,
  html.pos-ui-v20 #posrc-root h2,
  html.pos-ui-v20 #posrc-root h3,
  html.pos-ui-v20 #posrc-root p,
  html.pos-ui-v20 #posrc-root strong,
  html.pos-ui-v20 #posrc-root span { overflow-wrap: anywhere; }

  html.pos-ui-v20 .posrc-page-head,
  html.pos-ui-v20 .helm-page-head {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: start;
    gap: 7px 10px;
    padding: 15px 14px;
    border-radius: 17px;
  }
  html.pos-ui-v20 .posrc-page-head > div,
  html.pos-ui-v20 .helm-page-head > div { min-width: 0; }
  html.pos-ui-v20 .posrc-page-head h1,
  html.pos-ui-v20 .helm-page-head h1 { margin: 2px 0; font-size: clamp(1.55rem, 8vw, 2rem); line-height: 1.02; }
  html.pos-ui-v20 .posrc-page-head p:not(.eyebrow),
  html.pos-ui-v20 .helm-page-head p:not(.eyebrow) { margin: 5px 0 0; font-size: .84rem; line-height: 1.4; }
  html.pos-ui-v20 .posrc-back,
  html.pos-ui-v20 .helm-back { min-width: 44px; padding-inline: 12px; }
  html.pos-ui-v20 .posrc-card,
  html.pos-ui-v20 .helm-card { min-width: 0; padding: 15px; border-radius: 17px; }

  html.pos-ui-v20 .posrc-tabs,
  html.pos-ui-v20 .helm-tabs,
  html.pos-ui-v20 .s07-library__tabs,
  html.pos-ui-v20 .s09-tabs {
    display: flex;
    flex-wrap: nowrap;
    gap: 7px;
    max-width: 100%;
    overflow-x: auto;
    padding: 4px 2px 7px;
    scroll-snap-type: x proximity;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
  }
  html.pos-ui-v20 .posrc-tabs::-webkit-scrollbar,
  html.pos-ui-v20 .helm-tabs::-webkit-scrollbar,
  html.pos-ui-v20 .s07-library__tabs::-webkit-scrollbar,
  html.pos-ui-v20 .s09-tabs::-webkit-scrollbar { display: none; }
  html.pos-ui-v20 .posrc-tabs > *,
  html.pos-ui-v20 .helm-tabs > *,
  html.pos-ui-v20 .s07-library__tabs > *,
  html.pos-ui-v20 .s09-tabs > * { flex: 0 0 auto; scroll-snap-align: start; white-space: nowrap; }

  html.pos-ui-v20 .posrc-table-wrap,
  html.pos-ui-v20 .helm-table-wrap,
  html.pos-ui-v20 .table-wrap {
    max-width: 100%;
    overflow-x: auto;
    border-radius: 13px;
    overscroll-behavior-inline: contain;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
  }
  html.pos-ui-v20 .posrc-table-wrap table,
  html.pos-ui-v20 .helm-table-wrap table,
  html.pos-ui-v20 .table-wrap table { min-width: 620px; }

  html.pos-ui-v20 .planner-dialog-backdrop,
  html.pos-ui-v20 .posrc-dialog-backdrop,
  html.pos-ui-v20 .helm-dialog-backdrop {
    align-items: flex-end;
    padding: 0 !important;
  }
  html.pos-ui-v20 .planner-dialog,
  html.pos-ui-v20 .planner-history-dialog,
  html.pos-ui-v20 .planner-global-history,
  html.pos-ui-v20 .planner-calendar-create,
  html.pos-ui-v20 .posrc-dialog,
  html.pos-ui-v20 .helm-dialog {
    width: 100% !important;
    max-width: none !important;
    max-height: calc(92dvh - env(safe-area-inset-top)) !important;
    margin: 0 !important;
    padding: 16px 14px calc(16px + env(safe-area-inset-bottom)) !important;
    overflow: auto;
    border-radius: 23px 23px 0 0 !important;
    -webkit-overflow-scrolling: touch;
  }
  html.pos-ui-v20 .planner-dialog__actions,
  html.pos-ui-v20 .posrc-dialog__actions,
  html.pos-ui-v20 .helm-dialog__actions,
  html.pos-ui-v20 .helm-sticky-actions {
    position: sticky;
    z-index: 4;
    bottom: calc(-16px - env(safe-area-inset-bottom));
    gap: 8px;
    padding: 11px 0 calc(12px + env(safe-area-inset-bottom));
    background: linear-gradient(180deg, transparent, var(--helm-surface, #fff) 16%);
  }
  html.pos-ui-v20 .planner-dialog__actions button,
  html.pos-ui-v20 .posrc-dialog__actions button,
  html.pos-ui-v20 .helm-dialog__actions button { flex: 1 1 120px; min-height: 48px; }

  html.pos-ui-v20 .planner-task-drawer {
    right: 0;
    bottom: calc(68px + env(safe-area-inset-bottom));
    left: 0;
    width: 100%;
    max-height: 74dvh;
    padding: 16px 14px calc(14px + env(safe-area-inset-bottom));
    border-radius: 23px 23px 0 0;
    -webkit-overflow-scrolling: touch;
  }
  html.pos-ui-v20 .planner-drawer-status { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html.pos-ui-v20 .planner-drawer-status button { min-height: 48px; font-size: .8rem; }
  html.pos-ui-v20 .planner-drawer-fields > label { grid-template-columns: 1fr; align-items: stretch; }
  html.pos-ui-v20 .planner-drawer-duration { grid-template-columns: minmax(64px, 1fr) auto minmax(64px, 1fr) auto; }
  html.pos-ui-v20 .planner-drawer-options { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html.pos-ui-v20 .planner-drawer-options .danger { margin-left: 0; }
  html.pos-ui-v20 .planner-global-history > header { align-items: flex-start; gap: 8px; }
  html.pos-ui-v20 .planner-global-history > header > div:last-child { flex-wrap: wrap; justify-content: flex-end; }
  html.pos-ui-v20 .planner-calendar-scroll { overscroll-behavior-inline: contain; scroll-snap-type: x proximity; -webkit-overflow-scrolling: touch; }
  html.pos-ui-v20 .planner-calendar-day { scroll-snap-align: start; }
}
html.pos-ui-v20 .planner-calendar-event.is-done strong { text-decoration: none; }
html.pos-ui-v20 .planner-calendar-event.is-done::after,
html.pos-ui-v20 .planner-calendar-event.is-half::after,
html.pos-ui-v20 .planner-calendar-event.is-missed::after,
html.pos-ui-v20 .planner-calendar-event.is-unlogged::after {
  position: absolute; top: 4px; right: 4px; display: grid; place-items: center;
  min-width: 18px; height: 18px; border-radius: 999px; color: #fff; font-size: .66rem; font-weight: 900;
}
html.pos-ui-v20 .planner-calendar-event.is-done::after { content: "✓"; background: #31834a; }
html.pos-ui-v20 .planner-calendar-event.is-half::after { content: "½"; background: #a97b00; }
html.pos-ui-v20 .planner-calendar-event.is-missed::after { content: "×"; background: #bd3a33; }
html.pos-ui-v20 .planner-calendar-event.is-unlogged::after { content: "?"; background: #68727d; }

html.pos-ui-v20 .pos-notification-task-focus {
  scroll-margin-top: 12px;
  outline: 4px solid rgba(14, 116, 144, .25);
  box-shadow: 0 18px 45px rgba(14, 70, 100, .22);
}

@media (max-width: 760px) {
  html.pos-ui-v20 main#today { padding: 10px 12px calc(88px + env(safe-area-inset-bottom)); }
  html.pos-ui-v20 #today .today-focus-wrap { scroll-margin-top: 68px; }
  html.pos-ui-v20 #today .task-card--current { border-radius: 18px; padding: 16px 14px; }
  html.pos-ui-v20 #today .task-card--current h2 { font-size: 1.42rem; line-height: 1.12; }
  html.pos-ui-v20 #today .capture-strip { gap: 7px; }
  html.pos-ui-v20 #today .capture-strip > div { min-width: 0; padding: 8px 7px; }
  html.pos-ui-v20 #today .status-row { position: sticky; z-index: 20; bottom: calc(64px + env(safe-area-inset-bottom)); gap: 7px; padding: 8px; border: 1px solid #c9d8e1; border-radius: 14px; background: rgba(255,255,255,.96); box-shadow: 0 8px 24px rgba(12,42,61,.16); }
  html.pos-ui-v20 #today .status-row button { min-height: 50px; }
  html.pos-ui-v20 #today .subtask-row { padding: 10px; }
  html.pos-ui-v20 #today .subtask-actions { grid-template-columns: repeat(5, minmax(0, 1fr)); }
  html.pos-ui-v20 #today .subtask-actions button { min-width: 42px; min-height: 42px; }
  html.pos-ui-v20 .planner-calendar-toolbar__views button,
  html.pos-ui-v20 .planner-calendar-toolbar__dates button,
  html.pos-ui-v20 .planner-calendar-toolbar__actions button { min-height: 44px; }
  html.pos-ui-v20 .planner-calendar-scroll { max-height: calc(100vh - 280px); border-radius: 14px; }
  html.pos-ui-v20 .planner-task-drawer { max-height: calc(100vh - 94px); }
}

@media (max-width: 390px) {
  html.pos-ui-v20 .app-shell > main,
  html.pos-ui-v20 .app-shell > main#posrc-root { padding-inline: 10px; }
  html.pos-ui-v20 .posrc-quick-grid { grid-template-columns: 1fr 1fr; }
  html.pos-ui-v20 .posrc-quick-grid button { padding: 10px; }
}

@media (prefers-reduced-motion: reduce) {
  html.pos-ui-v20 *, html.pos-ui-v20 *::before, html.pos-ui-v20 *::after {
    scroll-behavior: auto !important;
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}

/* v21 desktop calendar and clarity pass */
html.pos-ui-v20 .planner-calendar-page {
  --calendar-border: #d4e0e8;
  --calendar-line: rgba(41, 79, 104, .1);
  gap: 14px;
  padding-top: 24px;
}

html.pos-ui-v20 .planner-calendar-page > * { max-width: 1560px !important; }
html.pos-ui-v20 .planner-calendar-page .planner-topbar { align-items: end; }
html.pos-ui-v20 .planner-calendar-page .planner-topbar h1 { margin-bottom: 2px; }

html.pos-ui-v20 .planner-calendar-toolbar {
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: center;
  gap: 14px;
  padding: 10px;
  border: 1px solid var(--calendar-border);
  border-radius: 16px;
  background: rgba(255, 255, 255, .9);
  box-shadow: 0 10px 26px rgba(18, 49, 69, .07);
  backdrop-filter: blur(16px);
}

html.pos-ui-v20 .planner-calendar-toolbar > div { display: flex; align-items: center; gap: 7px; }
html.pos-ui-v20 .planner-calendar-toolbar__actions { justify-content: flex-end; }
html.pos-ui-v20 .planner-calendar-toolbar button { min-height: 38px; padding: 7px 13px; }
html.pos-ui-v20 .planner-calendar-toolbar button.active,
html.pos-ui-v20 .planner-calendar-toolbar .planner-add-main { border-color: var(--posui-navy-800); background: var(--posui-navy-800); color: #fff; }

html.pos-ui-v20 .planner-all-day {
  display: grid;
  grid-template-columns: 72px 1fr;
  align-items: center;
  gap: 10px;
  min-height: 48px;
  padding: 8px 12px;
  border: 1px solid var(--calendar-border);
  border-radius: 14px;
  background: rgba(255, 255, 255, .82);
}

html.pos-ui-v20 .planner-all-day > span { color: var(--posui-muted); font-size: .74rem; font-weight: 850; text-transform: uppercase; letter-spacing: .08em; }
html.pos-ui-v20 .planner-all-day > div { display: flex; flex-wrap: wrap; gap: 7px; }
html.pos-ui-v20 .planner-all-day button { display: inline-flex; align-items: center; gap: 8px; min-height: 32px; padding: 6px 10px; border-color: #b8d6e8; background: #eef8ff; color: var(--posui-navy-900); }
html.pos-ui-v20 button.planner-all-day--empty { width: 100%; text-align: left; }

html.pos-ui-v20 .planner-clash-notice {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 10px 14px;
  border: 1px solid #efb0a8;
  border-radius: 14px;
  background: #fff3f1;
  color: #71251d;
}

html.pos-ui-v20 .planner-clash-notice div { display: grid; gap: 2px; }
html.pos-ui-v20 .planner-clash-notice span { font-size: .82rem; }

html.pos-ui-v20 .planner-calendar-shell {
  overflow: hidden;
  border: 1px solid var(--calendar-border);
  border-radius: 18px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(18, 49, 69, .08);
}

html.pos-ui-v20 .planner-calendar-head {
  display: grid;
  grid-template-columns: 62px repeat(var(--planner-days), minmax(150px, 1fr));
  position: sticky;
  top: 0;
  z-index: 20;
  min-width: calc(62px + var(--planner-days) * 150px);
  border-bottom: 1px solid var(--calendar-border);
  background: rgba(250, 253, 255, .96);
}

html.pos-ui-v20 .planner-calendar-head > button {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: baseline;
  gap: 7px;
  min-height: 54px;
  padding: 10px 12px;
  border: 0;
  border-left: 1px solid var(--calendar-border);
  border-radius: 0;
  background: transparent;
  color: var(--posui-navy-900);
  text-align: left;
}

html.pos-ui-v20 .planner-calendar-head > button.is-today { background: #e9f7fc; box-shadow: inset 0 -3px #37a8ca; }
html.pos-ui-v20 .planner-calendar-head span { color: var(--posui-muted); font-size: .72rem; font-weight: 800; text-transform: uppercase; }
html.pos-ui-v20 .planner-calendar-head strong { font-size: .96rem; }
html.pos-ui-v20 .planner-calendar-head em { color: #a53228; font-size: .68rem; font-style: normal; font-weight: 850; }

html.pos-ui-v20 .planner-calendar-scroll { max-height: calc(100vh - 330px); min-height: 480px; overflow: auto; }
html.pos-ui-v20 .planner-calendar-body {
  display: grid;
  grid-template-columns: 62px repeat(var(--planner-days), minmax(150px, 1fr));
  position: relative;
  min-width: calc(62px + var(--planner-days) * 150px);
}

html.pos-ui-v20 .planner-time-axis { position: relative; border-right: 1px solid var(--calendar-border); background: #fbfdfe; }
html.pos-ui-v20 .planner-time-axis time { position: absolute; right: 8px; transform: translateY(-50%); color: #6d8190; font-size: .7rem; font-variant-numeric: tabular-nums; }
html.pos-ui-v20 .planner-day-track {
  position: relative;
  border-right: 1px solid var(--calendar-border);
  background-color: #fff;
  background-image: linear-gradient(to bottom, var(--calendar-line) 1px, transparent 1px), linear-gradient(to bottom, rgba(41, 79, 104, .045) 1px, transparent 1px);
  background-size: 100% 52px, 100% 13px;
  cursor: cell;
}

html.pos-ui-v20 .planner-day-track:hover { background-color: #fbfdff; }
html.pos-ui-v20 .planner-now-line { position: absolute; right: 0; left: 0; z-index: 12; height: 2px; background: #e74d3d; pointer-events: none; }
html.pos-ui-v20 .planner-now-line i { position: absolute; left: -4px; top: -3px; width: 8px; height: 8px; border-radius: 50%; background: #e74d3d; }
html.pos-ui-v20 .planner-now-line small { position: absolute; right: 3px; top: -15px; padding: 1px 4px; border-radius: 4px; background: #fff; color: #b43126; font-size: .63rem; font-weight: 800; }

html.pos-ui-v20 .planner-calendar-event {
  position: absolute;
  z-index: 5;
  display: grid;
  align-content: start;
  gap: 1px;
  min-height: 24px;
  overflow: hidden;
  padding: 5px 7px 9px 22px;
  border: 1px solid #7eb8d7;
  border-left: 4px solid #3186b2;
  border-radius: 8px;
  background: #eaf6fc;
  color: #092e45;
  text-align: left;
  cursor: pointer;
  box-shadow: 0 3px 8px rgba(25, 70, 96, .1);
}

html.pos-ui-v20 .planner-calendar-event:hover,
html.pos-ui-v20 .planner-calendar-event.is-selected { z-index: 15; border-color: #0b5f8a; box-shadow: 0 0 0 2px rgba(14, 105, 151, .17), 0 8px 18px rgba(25, 70, 96, .15); }
html.pos-ui-v20 .planner-calendar-event strong { overflow: hidden; font-size: .78rem; line-height: 1.2; text-overflow: ellipsis; }
html.pos-ui-v20 .planner-calendar-event span,
html.pos-ui-v20 .planner-calendar-event em { overflow: hidden; font-size: .64rem; line-height: 1.2; font-style: normal; text-overflow: ellipsis; white-space: nowrap; }
html.pos-ui-v20 .planner-calendar-event.is-done { opacity: .64; filter: saturate(.65); }
html.pos-ui-v20 .planner-calendar-event.is-done strong { text-decoration: line-through; }
html.pos-ui-v20 .planner-calendar-event.is-conflict { border-color: #e07e72; border-left-color: #cf3d31; background: #fff0ee; }
html.pos-ui-v20 .planner-calendar-event.is-compatible { border-style: dashed; }
html.pos-ui-v20 .planner-calendar-event--work { border-left-color: #5f6fda; background: #eef0ff; }
html.pos-ui-v20 .planner-calendar-event--fitness { border-left-color: #168469; background: #e9f8f3; }
html.pos-ui-v20 .planner-calendar-event--routine { border-left-color: #a66c18; background: #fff6df; }
html.pos-ui-v20 .planner-calendar-event--admin { border-left-color: #777; background: #f3f5f7; }
html.pos-ui-v20 .planner-calendar-event--stained-glass { border-left-color: #ad4e94; background: #f9edf7; }

html.pos-ui-v20 .planner-calendar-event__drag,
html.pos-ui-v20 .planner-calendar-event__resize {
  position: absolute;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  touch-action: none;
}

html.pos-ui-v20 .planner-calendar-event__drag { top: 3px; bottom: 3px; left: 3px; width: 16px; cursor: grab; font-size: .58rem; }
html.pos-ui-v20 .planner-calendar-event__resize { right: 4px; bottom: 0; left: 22px; height: 8px; cursor: ns-resize; font-size: .58rem; opacity: .55; }
html.pos-ui-v20 .planner-calendar-event__drag:disabled { cursor: default; opacity: .45; }
html.pos-ui-v20 .planner-calendar-event.is-short {
  align-content: center;
  padding: 3px 27px 3px 25px;
}
html.pos-ui-v20 .planner-calendar-event.is-short > span,
html.pos-ui-v20 .planner-calendar-event.is-short > em { display: none; }
html.pos-ui-v20 .planner-calendar-event.is-short strong { font-size: .7rem; white-space: nowrap; }
html.pos-ui-v20 .planner-calendar-event.is-short .planner-calendar-event__drag { width: 20px; }
html.pos-ui-v20 .planner-calendar-event.is-short .planner-calendar-event__resize {
  top: 2px;
  right: 2px;
  bottom: 2px;
  left: auto;
  width: 21px;
  height: auto;
  border-left: 1px solid currentColor;
  border-radius: 4px;
  background: rgba(255, 255, 255, .55);
  opacity: .9;
}
html.pos-ui-v20 .planner-calendar-help { margin: -4px 4px 0; color: var(--posui-muted); font-size: .76rem; text-align: right; }

html.pos-ui-v20 .planner-task-drawer {
  position: fixed;
  z-index: 150;
  top: 72px;
  right: 16px;
  bottom: auto;
  width: min(370px, calc(100vw - 32px));
  max-height: calc(100vh - 88px);
  overflow: auto;
  padding: 14px;
  border: 1px solid #bfd2de;
  border-radius: 16px;
  background: rgba(253, 254, 255, .98);
  color: var(--posui-ink);
  box-shadow: 0 24px 70px rgba(6, 27, 43, .28);
}

html.pos-ui-v20 .planner-task-drawer > header { display: flex; justify-content: space-between; gap: 12px; margin-bottom: 11px; }
html.pos-ui-v20 .planner-task-drawer h2 { margin: 3px 0; font-size: 1.3rem; }
html.pos-ui-v20 .planner-task-drawer header p:last-child { margin: 0; color: var(--posui-muted); }
html.pos-ui-v20 .planner-drawer-status { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }
html.pos-ui-v20 .planner-drawer-status button { min-height: 42px; padding: 7px 4px; font-size: .74rem; }
html.pos-ui-v20 .planner-drawer-status button.active { outline: 2px solid var(--posui-navy-900); outline-offset: 1px; }
html.pos-ui-v20 .planner-drawer-status .status-done { background: #e7f6e4; }
html.pos-ui-v20 .planner-drawer-status .status-half { background: #fff2c8; }
html.pos-ui-v20 .planner-drawer-status .status-missed { background: #fde4e3; }
html.pos-ui-v20 .planner-drawer-timer { width: 100%; margin: 10px 0; }
html.pos-ui-v20 .planner-drawer-timer.active { background: #173d5a; color: #fff; }
html.pos-ui-v20 .planner-drawer-fields { display: grid; gap: 10px; padding: 12px 0; border-block: 1px solid #d9e3e9; }
html.pos-ui-v20 .planner-drawer-fields > label { display: grid; grid-template-columns: 78px 1fr auto; align-items: end; gap: 8px; }
html.pos-ui-v20 .planner-drawer-fields > label > span { align-self: center; color: var(--posui-muted); font-size: .76rem; font-weight: 800; }
html.pos-ui-v20 .planner-drawer-duration { display: grid; grid-template-columns: 56px auto 56px auto; align-items: center; gap: 4px; }
html.pos-ui-v20 .planner-drawer-options { display: flex; flex-wrap: wrap; gap: 7px; padding: 12px 0; }
html.pos-ui-v20 .planner-drawer-options .danger { margin-left: auto; border-color: #e7a39c; background: #fff4f2; color: #9d2920; }
html.pos-ui-v20 .planner-task-drawer details.completion-history { margin-top: 8px; }
html.pos-ui-v20 .planner-task-drawer details.completion-history > summary { cursor: pointer; font-weight: 800; }

html.pos-ui-v20 .planner-calendar-create { width: min(560px, calc(100vw - 32px)); max-height: calc(100vh - 40px); overflow: auto; padding: 18px; }
html.pos-ui-v20 .planner-calendar-create > label { display: grid; gap: 5px; }
html.pos-ui-v20 .planner-calendar-create .planner-dialog__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
html.pos-ui-v20 .planner-create-duration > div { display: flex; gap: 8px; }
html.pos-ui-v20 .planner-create-duration label { display: grid; grid-template-columns: 74px auto; align-items: center; gap: 5px; }
html.pos-ui-v20 .planner-create-overlap { display: grid; gap: 3px; padding: 10px 12px; border: 1px solid #efaaa2; border-radius: 11px; background: #fff3f1; color: #7b2820; }
html.pos-ui-v20 .planner-calendar-create .planner-dialog__checks { display: flex; flex-wrap: wrap; gap: 14px; }
html.pos-ui-v20 .planner-dialog__escape-hint { display: block; margin-top: 8px; color: var(--posui-muted); text-align: right; }

html.pos-ui-v20 .planner-global-history { width: min(760px, calc(100vw - 32px)); max-height: calc(100vh - 40px); overflow: auto; padding: 20px; border-radius: 20px; background: #fff; box-shadow: 0 24px 70px rgba(6, 27, 43, .28); }
html.pos-ui-v20 .planner-global-history > header { display: flex; justify-content: space-between; gap: 18px; margin-bottom: 14px; }
html.pos-ui-v20 .planner-global-history > header > div:last-child { display: flex; align-items: start; gap: 8px; }
html.pos-ui-v20 .planner-global-history__list { display: grid; gap: 7px; }
html.pos-ui-v20 .planner-global-history__list article { display: grid; grid-template-columns: 1fr 160px auto; gap: 10px; align-items: center; padding: 10px; border: 1px solid #dbe5eb; border-radius: 11px; }
html.pos-ui-v20 .planner-global-history__list article > div { display: grid; gap: 2px; }
html.pos-ui-v20 .planner-global-history__list span,
html.pos-ui-v20 .planner-global-history__list time { color: var(--posui-muted); font-size: .72rem; }

html.pos-ui-v20 .progress-page { gap: 16px; }
html.pos-ui-v20 .progress-page > * { max-width: 1320px !important; }
html.pos-ui-v20 .progress-range { display: inline-flex; width: max-content; padding: 4px; border: 1px solid #cfdae2; border-radius: 12px; background: #fff; }
html.pos-ui-v20 .progress-range button { min-height: 34px; padding: 6px 13px; border: 0; background: transparent; color: var(--posui-muted); }
html.pos-ui-v20 .progress-range button.active { background: var(--posui-navy-800); color: #fff; }
html.pos-ui-v20 .progress-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
html.pos-ui-v20 .progress-result-card { display: grid; gap: 7px; min-height: 160px; padding: 18px; border: 1px solid #d6e1e8; border-radius: 17px; background: #fff; box-shadow: 0 8px 22px rgba(18, 49, 69, .06); }
html.pos-ui-v20 .progress-result-card > span { color: #627b8b; font-size: .75rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
html.pos-ui-v20 .progress-result-card > strong { font-size: 2rem; }
html.pos-ui-v20 .progress-result-card > small { color: var(--posui-muted); }
html.pos-ui-v20 .progress-bar { align-self: end; height: 8px; overflow: hidden; border-radius: 999px; background: #e4edf1; }
html.pos-ui-v20 .progress-bar i { display: block; height: 100%; border-radius: inherit; background: #3b9a70; }
html.pos-ui-v20 .progress-bar--blue i { background: #308ec0; }
html.pos-ui-v20 .progress-bar--amber i { background: #d3952e; }
html.pos-ui-v20 .progress-status-note { padding: 16px 18px; border: 1px solid #e5cc8d; border-radius: 15px; background: #fff8e7; }
html.pos-ui-v20 .progress-status-note p { margin: 4px 0 0; color: #705729; }
html.pos-ui-v20 .progress-explainer,
html.pos-ui-v20 .progress-development { padding: 0 18px; border: 1px solid #d6e1e8; border-radius: 15px; background: #fff; }
html.pos-ui-v20 .progress-explainer summary,
html.pos-ui-v20 .progress-development summary { padding: 15px 0; cursor: pointer; font-weight: 850; }
html.pos-ui-v20 .progress-explainer > div,
html.pos-ui-v20 .progress-development > div { padding: 0 0 16px; }

html.pos-ui-v20 .in-app-alert-centre { position: relative; padding: 0 14px 12px; }
html.pos-ui-v20 .in-app-alert-centre > summary { min-height: 54px; padding: 10px 0; cursor: pointer; list-style: none; }
html.pos-ui-v20 .in-app-alert-centre > summary::-webkit-details-marker { display: none; }
html.pos-ui-v20 .in-app-alert-centre > summary strong { font-size: 1rem; }
html.pos-ui-v20 .in-app-alert-centre > summary > span { color: #7a5919; font-size: .78rem; font-weight: 800; }
html.pos-ui-v20 .in-app-alert-centre__refresh { position: absolute; top: 10px; right: 108px; min-height: 32px; padding: 5px 9px; }
html.pos-ui-v20 .in-app-alert-centre:not([open]) .in-app-alert-centre__refresh { display: none; }
html.pos-ui-v20 .in-app-alert-centre__item { cursor: pointer; transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease; }
html.pos-ui-v20 .in-app-alert-centre__item:hover,
html.pos-ui-v20 .in-app-alert-centre__item:focus-visible { outline: none; border-color: #66aaca; box-shadow: 0 5px 14px rgba(18, 49, 69, .1); transform: translateY(-1px); }
html.pos-ui-v20 .today-overdue-section { overflow: hidden; padding: 0 !important; border-color: #e1a39d !important; background: #fff8f7 !important; }
html.pos-ui-v20 .today-overdue-section > summary { min-height: 70px; padding: 14px 18px; cursor: pointer; list-style: none; }
html.pos-ui-v20 .today-overdue-section > summary::-webkit-details-marker { display: none; }
html.pos-ui-v20 .today-overdue-section > summary::after { content: "Review"; align-self: center; border-radius: 999px; padding: 7px 11px; background: #8b2f29; color: #fff; font-size: .78rem; font-weight: 900; }
html.pos-ui-v20 .today-overdue-section[open] > summary::after { content: "Hide"; background: #f1dddd; color: #7a2924; }
html.pos-ui-v20 .today-overdue-section > summary > span { display: none; }
html.pos-ui-v20 .today-overdue-help { margin: 0; padding: 0 18px 12px; color: #735551; }
html.pos-ui-v20 .today-overdue-list { display: grid; gap: 8px; padding: 0 12px 12px; }
html.pos-ui-v20 .today-overdue-list article { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: 10px; padding: 8px; border: 1px solid #ebc4c0; border-radius: 13px; background: #fff; cursor: pointer; transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease; }
html.pos-ui-v20 .today-overdue-list article:hover,
html.pos-ui-v20 .today-overdue-list article:focus-visible { outline: none; border-color: #bf7771; box-shadow: 0 5px 15px rgba(84, 36, 31, .1); transform: translateY(-1px); }
html.pos-ui-v20 .today-overdue-open { display: grid; gap: 3px; min-width: 0; min-height: 48px; border: 0; padding: 7px 9px; background: transparent; color: var(--posui-navy-900); text-align: left; }
html.pos-ui-v20 .today-overdue-open strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.pos-ui-v20 .today-overdue-open span { color: var(--posui-muted); font-size: .78rem; }
html.pos-ui-v20 .today-overdue-actions { display: grid; grid-template-columns: repeat(4, minmax(72px, 1fr)); gap: 6px; }
html.pos-ui-v20 .today-overdue-actions button { min-height: 42px; border-radius: 10px; padding: 7px 9px; font-weight: 900; }
html.pos-ui-v20 .today-overdue-actions button:nth-child(1) { border-color: #8cc49a; background: #e5f5e8; color: #205b32; }
html.pos-ui-v20 .today-overdue-actions button:nth-child(2) { border-color: #ddb94f; background: #fff2c6; color: #725300; }
html.pos-ui-v20 .today-overdue-actions button:nth-child(3) { border-color: #e29a94; background: #fde6e4; color: #84251f; }
html.pos-ui-v20 .today-overdue-list .today-overdue-clear { border-color: #c7d5dc; background: #f1f5f7; color: #506671; }
html.pos-ui-v20 .today-overdue-list .today-overdue-clear:hover { border-color: #869ba6; background: #e6edef; color: #233e4d; }

html.pos-ui-v20 .task-context-action {
  width: 100%;
  min-height: 46px;
  margin: 0 0 12px;
  border: 1px solid #7cb6d3;
  border-radius: 12px;
  background: #e5f4fb;
  color: #073f63;
  font-weight: 800;
  font-size: 0.95rem;
}

html.pos-ui-v20 .task-context-action:hover,
html.pos-ui-v20 .task-context-action:focus-visible { background: #d3edf9; border-color: #3585ad; }

html.pos-ui-v20 .in-app-alert-centre__clear {
  border-color: #c7d5dc;
  background: #f1f5f7;
  color: #506671;
}

@media (max-width: 760px) {
  html.pos-ui-v20 .task-context-action { min-height: 52px; font-size: 1rem; }
  html.pos-ui-v20 .in-app-alert-centre__clear { min-width: 92px; }
}
html.pos-ui-v20 .s09-start-selected { margin-top: 12px; }
html.pos-ui-v20 .s09-workout-picker { display: grid; gap: 6px; margin: 12px 0; }
html.pos-ui-v20 .s09-workout-picker span { color: var(--posui-muted); font-size: .8rem; font-weight: 900; }
html.pos-ui-v20 .s09-add-item { grid-template-columns: 1.4fr 1.2fr 1fr 1fr auto; }
html.pos-ui-v20 .s09-add-help { grid-column: 1 / -1; color: var(--posui-muted); }
html.pos-ui-v20 .today-date-context { min-height: 0; padding: 9px 13px; }
html.pos-ui-v20 .today-date-context p { margin: 2px 0 0; }
html.pos-ui-v20 .today-date-context button { min-height: 34px; padding: 6px 11px; }
html.pos-ui-v20 .today-command-card { padding: 12px 18px; }
html.pos-ui-v20 .today-command-card__summary { min-height: 40px; }
html.pos-ui-v20 .today-block-nav { position: sticky; top: 8px; z-index: 25; box-shadow: 0 6px 18px rgba(18, 49, 69, .08); }
html.pos-ui-v20 .today-mini-task { cursor: pointer; transition: border-color .16s ease, transform .16s ease, box-shadow .16s ease; }
html.pos-ui-v20 .today-mini-task:hover { transform: translateY(-1px); border-color: #75afd0; box-shadow: 0 8px 18px rgba(18, 49, 69, .1); }
html.pos-ui-v20 details.completion-history > summary { display: flex; justify-content: space-between; gap: 10px; padding: 10px 0; cursor: pointer; }

html.pos-ui-v20 .s07-date-field { position: relative; }
html.pos-ui-v20 .s07-date-picker { position: fixed; z-index: 260; top: 50%; left: 50%; width: min(430px, calc(100vw - 40px)); max-height: min(640px, calc(100vh - 40px)); overflow: auto; transform: translate(-50%, -50%); box-shadow: 0 24px 70px rgba(6, 27, 43, .32); }
html.pos-ui-v20 .s07-date-picker__calendar { grid-auto-rows: 43px; }
html.pos-ui-v20 .s07-series-conflicts { display: grid; gap: 5px; padding: 12px; border: 1px solid #a9cfb0; border-radius: 12px; background: #eff9ef; color: #24582b; }
html.pos-ui-v20 .s07-series-conflicts.has-conflicts { border-color: #e4a197; background: #fff1ef; color: #842d24; }
html.pos-ui-v20 .s07-series-conflicts ul { margin: 4px 0; padding-left: 20px; }
html.pos-ui-v20 .s07-series-conflicts small { line-height: 1.4; }

@media (max-width: 1120px) and (min-width: 761px) {
  html.pos-ui-v20 .planner-calendar-toolbar { grid-template-columns: auto 1fr; }
  html.pos-ui-v20 .planner-calendar-toolbar__actions { grid-column: 1 / -1; justify-content: flex-end; }
  html.pos-ui-v20 .progress-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* The three-card Today layout needs more room than the desktop sidebar leaves at narrow PC widths. */
@media screen and (min-width: 761px) and (max-width: 1180px) {
  html.pos-ui-v20 #today .today-core-grid { grid-template-columns: minmax(0, 1fr) !important; }
  html.pos-ui-v20 #today .today-core-grid > .today-mini-card { display: none !important; }
  html.pos-ui-v20 #today .today-focus-wrap { grid-column: 1 !important; min-width: 0; }
}

@media (max-width: 760px) {
  html.pos-ui-v20 .planner-calendar-toolbar { display: flex; flex-wrap: wrap; }
  html.pos-ui-v20 .planner-calendar-toolbar__actions { width: 100%; overflow-x: auto; }
  html.pos-ui-v20 .planner-calendar-scroll { max-height: 62vh; }
  html.pos-ui-v20 .planner-calendar-head,
  html.pos-ui-v20 .planner-calendar-body { grid-template-columns: 52px repeat(var(--planner-days), minmax(190px, 1fr)); min-width: calc(52px + var(--planner-days) * 190px); }
  html.pos-ui-v20 .planner-task-drawer { top: auto; right: 8px; bottom: 78px; left: 8px; width: auto; max-height: 72vh; border-radius: 20px 20px 14px 14px; }
  html.pos-ui-v20 .progress-summary { grid-template-columns: 1fr; }
  html.pos-ui-v20 .planner-global-history__list article { grid-template-columns: 1fr auto; }
  html.pos-ui-v20 .planner-global-history__list article > div:nth-child(2) { display: none; }
  html.pos-ui-v20 .planner-calendar-create .planner-dialog__grid { grid-template-columns: 1fr; }
}

/* v22.1 mobile Today: one decision at a time. Detailed review stays in Planner. */
@media (max-width: 760px) {
  html.pos-ui-v20 #today.today-v3 { gap: 10px; }
  html.pos-ui-v20 #today .today-date-navigation.is-live { display: none; }
  html.pos-ui-v20 #today .today-date-navigation.is-browsing { grid-template-columns: auto minmax(0, 1fr) auto; gap: 6px; padding: 7px; }
  html.pos-ui-v20 #today .today-date-navigation.is-browsing label { grid-column: 1 / -1; grid-row: 1; }
  html.pos-ui-v20 #today .today-date-navigation.is-browsing button { min-height: 42px; padding: 7px 9px; }
  html.pos-ui-v20 #today .today-date-navigation.is-browsing .today-date-navigation__today { grid-column: 2; }
  html.pos-ui-v20 #today .today-return-live-banner { padding: 9px 11px; border-radius: 12px; }
  html.pos-ui-v20 #today .today-return-live-banner span { display: none; }
  html.pos-ui-v20 #today .today-return-live-banner button { min-height: 40px; white-space: nowrap; }
  html.pos-ui-v20 #today .today-v3__header { min-height: 0; padding: 12px 14px; border-radius: 15px; }
  html.pos-ui-v20 #today .today-v3__header .eyebrow { display: none; }
  html.pos-ui-v20 #today .today-v3__header h1 { margin: 0; font-size: 1.25rem; }
  html.pos-ui-v20 #today .today-v3__clock { margin: 2px 0 0; font-size: .82rem; }
  html.pos-ui-v20 #today .today-v3__header-status { display: none; }
  html.pos-ui-v20 #today .today-command-card,
  html.pos-ui-v20 #today .in-app-alert-centre,
  html.pos-ui-v20 #today .today-completed-section,
  html.pos-ui-v20 #today .today-timeline-section,
  html.pos-ui-v20 #today .today-tomorrow-section,
  html.pos-ui-v20 #today .capture-strip { display: none !important; }
  html.pos-ui-v20 #today .notification-fallback-card { padding: 13px; }
  html.pos-ui-v20 #today .notification-fallback-card > p { display: none; }
  html.pos-ui-v20 #today .notification-fallback-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html.pos-ui-v20 #today .notification-fallback-actions button:last-child { grid-column: 1 / -1; }
  html.pos-ui-v20 #today .today-overdue-section > summary { min-height: 60px; padding: 10px 12px; }
  html.pos-ui-v20 #today .today-overdue-section > summary h2 { margin: 1px 0 0; font-size: 1.03rem; }
  html.pos-ui-v20 #today .today-overdue-help { padding: 0 12px 9px; font-size: .8rem; }
  html.pos-ui-v20 #today .today-overdue-list { padding: 0 8px 8px; }
  html.pos-ui-v20 #today .today-overdue-list article { grid-template-columns: 1fr; gap: 4px; padding: 5px; }
  html.pos-ui-v20 #today .today-overdue-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  html.pos-ui-v20 #today .today-overdue-actions button { min-height: 46px; padding: 8px 4px; }
  html.pos-ui-v20 #today .today-block-nav { position: static; grid-template-columns: minmax(0, 1fr) 72px minmax(0, 1fr); gap: 7px; margin: 0; padding: 7px; box-shadow: none; }
  html.pos-ui-v20 #today .today-block-nav button { width: 100%; min-width: 0; min-height: 44px; padding: 7px 5px; font-size: .78rem; white-space: nowrap; }
  html.pos-ui-v20 #today .today-block-nav__now { min-width: 0; }
  html.pos-ui-v20 #today { overflow-x: hidden; }
  html.pos-ui-v20 #today .today-core-viewport {
    width: 100%;
    max-width: 100%;
    min-width: 0;
    overflow: hidden;
    overflow: clip;
    contain: layout paint;
  }
  html.pos-ui-v20 #today .today-core-grid {
    display: flex !important;
    gap: 0 !important;
    width: 300%;
    max-width: none;
    margin: 0;
    transform: translate3d(calc(-33.333333% + var(--today-swipe-x, 0px)), 0, 0);
    transition: transform 220ms cubic-bezier(.22,.8,.3,1);
    touch-action: pan-y;
    overflow-anchor: none;
  }
  html.pos-ui-v20 #today .today-core-grid.is-swiping {
    transition: none;
    will-change: transform;
  }
  html.pos-ui-v20 #today .today-core-grid.is-swipe-settling { will-change: transform; }
  html.pos-ui-v20 #today .today-core-grid > * {
    display: flex !important;
    flex: 0 0 33.333333%;
    width: 33.333333%;
    max-width: 33.333333%;
    min-width: 0;
    margin: 0 !important;
    box-sizing: border-box;
  }
  html.pos-ui-v20 #today .today-core-grid > .today-mini-card {
    min-height: 220px;
    align-items: center;
    justify-content: center;
  }
  html.pos-ui-v20 #today .today-focus-wrap {
    grid-column: auto !important;
    align-items: stretch;
    transform: none;
    transition: none;
    touch-action: auto;
    overflow-anchor: none;
  }
  html.pos-ui-v20 #today .today-focus-wrap > * { width: 100%; max-width: 100%; min-width: 0; }
  html.pos-ui-v20 #today .today-focus-wrap h2,
  html.pos-ui-v20 #today .today-mini-card h3 { overflow-wrap: anywhere; }
  html.pos-ui-v20 #today .today-empty-focus--gap { min-height: 210px; padding: 20px 17px; }
  html.pos-ui-v20 #today .today-empty-focus__time { align-items: flex-start; flex-direction: column; gap: 7px; }
  html.pos-ui-v20 #today .today-empty-focus__time h2 { font-size: 1.7rem; }
  html.pos-ui-v20 #today .today-empty-focus__actions { display: grid; grid-template-columns: 1fr; }
  html.pos-ui-v20 #today .today-empty-focus__actions button { min-height: 50px; }
  html.pos-ui-v20 #today .subtask-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  html.pos-ui-v20 #today .subtask-actions button:nth-child(n+4) { display: none; }
  html.pos-ui-v20 #today .subtask-actions button { min-height: 48px; font-size: 1rem; }
  html.pos-ui-v20 #today .subtask-history,
  html.pos-ui-v20 #today .subtask-quick-actions,
  html.pos-ui-v20 #today .subtask-rollup,
  html.pos-ui-v20 #today .status-row-secondary,
  html.pos-ui-v20 #today details.completion-history,
  html.pos-ui-v20 #today .completion-state { display: none !important; }
  html.pos-ui-v20 #today .task-card--current .optional-details { margin-top: 6px; }
  html.pos-ui-v20 .s09-workout-picker { display: grid; gap: 6px; margin: 12px 0; }
  html.pos-ui-v20 .s09-workout-picker span { font-weight: 900; }
  html.pos-ui-v20 .s09-workout-picker select { min-height: 52px; font-size: 1rem; }
  html.pos-ui-v20 .s09-add-item { grid-template-columns: 1fr; }
  html.pos-ui-v20 .s09-add-help { grid-column: 1; }
}

/* Final v22 precedence: later legacy rules must never replace category/result colours. */
html.pos-ui-v20 .planner-calendar-event--personal { border-left-color: #7c3aed; background: #f1edff; color: #3f2378; }
html.pos-ui-v20 .planner-calendar-event--work { border-left-color: #2563eb; background: #eaf1ff; color: #173b80; }
html.pos-ui-v20 .planner-calendar-event--commute { border-left-color: #4f46e5; background: #eeedff; color: #302d86; }
html.pos-ui-v20 .planner-calendar-event--home { border-left-color: #9333ea; background: #f6ebff; color: #55207c; }
html.pos-ui-v20 .planner-calendar-event--faith { border-left-color: #9a6700; background: #fff6dc; color: #634400; }
html.pos-ui-v20 .planner-calendar-event--fitness { border-left-color: #c026d3; background: #fbeafa; color: #711b78; }
html.pos-ui-v20 .planner-calendar-event--gym { border-left-color: #c026d3; background: #fbeafa; color: #711b78; }
html.pos-ui-v20 .planner-calendar-event--skincare { border-left-color: #db2777; background: #fcebf3; color: #831843; }
html.pos-ui-v20 .planner-calendar-event--food { border-left-color: #0891b2; background: #e7f7fb; color: #15566a; }
html.pos-ui-v20 .planner-calendar-event--routine { border-left-color: #0e7490; background: #e8f5f8; color: #164e63; }
html.pos-ui-v20 .planner-calendar-event--sleep { border-left-color: #475569; background: #eef1f6; color: #263243; }
html.pos-ui-v20 .planner-calendar-event.is-done,
html.pos-ui-v20 .planner-calendar-event.is-done.is-conflict { border-color: #57a36a; border-left-color: #31834a; background: #e5f5e8; color: #205b32; opacity: 1; filter: none; }
html.pos-ui-v20 .planner-calendar-event.is-half,
html.pos-ui-v20 .planner-calendar-event.is-half.is-conflict { border-color: #d2a634; border-left-color: #a97b00; background: #fff2c6; color: #725300; }
html.pos-ui-v20 .planner-calendar-event.is-missed,
html.pos-ui-v20 .planner-calendar-event.is-missed.is-conflict { border-color: #dc7770; border-left-color: #bd3a33; background: #fde6e4; color: #84251f; }
html.pos-ui-v20 .planner-calendar-event.is-unlogged,
html.pos-ui-v20 .planner-calendar-event.is-unlogged.is-conflict { border-color: #98a2ad; border-left-color: #68727d; background: #edf0f3; color: #3f4852; }