/*
 * My Club styles. One stylesheet for the app, the offline page, dialogs and canvas exports.
 *
 *   - Colours are tokens on :root (light) with one dark block after them; nothing else may hold a literal colour.
 *     tests/colors.cjs enforces this and checks contrast.
 *   - App rules are scoped under .dash-page. Names follow block__part and is-state (e.g. .cc__bubble, .is-me).
 *   - Each section opens with a banner comment: ---------- Area · Name ----------
 *     Search for "Learn ·" (or Home, Progress, Community, Settings, Core) to see every part of one area.
 *
 * Contents, by area (each name is a banner you can search for)
 *   Core       Palette and tokens · Shell · Panels, cards and type · Controls · Overlays · Native patterns
 *              (familiar on first use) · Desktop · Forest backdrop
 *   Home       Children's chips (also on Progress) · Header and calendar · Week, day strip and lessons · Reminders,
 *              moments and the monthly letter
 *   Learn      Reader page · Hand to my child · Fits the screen
 *   Progress   Numbers and the log
 *   Community  Common questions · Learning circle chat
 *   Settings   Lesson night
 */
/* ---------- Core · Palette and tokens: the only place colours live (dark mode below). See COLOR-SYSTEM.md ---------- */
:root {
  color-scheme: light;
  --font-body: "DM Sans", system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --font-display: "Playfair Display", Georgia, serif;

  /* Shared app palette. See COLOR-SYSTEM.md for roles and contrast rules.
     Keep these on :root: dialogs, canvas exports and chat use the same source. */
  --kt-bg: #f3eee6;
  --kt-card: #faf7f2;
  --kt-well: #efe8de;
  --kt-line: #d9d1c5; /* dividers only; controls use --kt-control-line */
  --kt-control-line: #898174;
  --kt-hair: var(--kt-line);
  --kt-ink: #373a32;
  --kt-ink-2: #484b41;
  --kt-soft: #686257;
  --kt-interactive: #595c48; /* muted olive links, focus, selection and partial progress */
  --kt-on-accent: #e5deca; /* warm linen emphasis on dark surfaces */
  --kt-wash: #e9e7db; /* selected / current; never completion */
  --kt-upcoming: #e2dbd0;
  /* Honey: the one warm colour, kept for finished sittings and milestones so success lights up. Never for anything owed. */
  --kt-honey: #93591a;
  --kt-honey-wash: #f6e7cc;
  --kt-go: #2a6560; /* the one primary action per screen (Home's Start); never completion or decoration */
  --kt-go-hover: #22534f;
  /* Family pictures in the circle chat when a family hasn't chosen one: their initial on one of six quiet colours. Identity only. */
  --kt-av-0: #6b5a3e;
  --kt-av-1: #4f6a5a;
  --kt-av-2: #7a4f4a;
  --kt-av-3: #4d5f78;
  --kt-av-4: #6a5576;
  --kt-av-5: #5c6b3a;
  --kt-on: #faf7f2;
  --kt-on-soft: #d9d1c5;
  --kt-on-line: #faf7f240;
  --kt-glass: #373a32f0;
  --kt-glass-lt: #faf7f2e0;
  --kt-backdrop: #373a3299;
  --kt-glow: #595c484d;
  --kt-shadow: 0 1px 2px #373a320a;
  --kt-lift: 0 1px 3px #373a3226;
  --kt-float: 0 10px 30px -10px #373a3259;
  /* Warm stone artwork; relief comes from tonal contrast. */
  --award-seal: #796b53;
  --award-seal-light: #c5b99f;
  --award-seal-shine: #e5deca;
  --award-line: #c9bdab;
  --award-ornament: #eae2d5;
  --award-on-seal: #e2dbd0;
  /* Shared images are always printed on ivory, whatever the phone's theme. */
  --award-ink: #373a32;
  --award-paper: #faf7f2;
  /* Destructive actions only (Restore's Replace). */
  --kt-danger: #9b2c22;
  /* Always white/black in both themes: logo disc and QR need white for scanning; camera letterbox stays black. */
  --kt-white: #fff;
  --kt-camera: #000;
  /* Evergreen backdrop (decorative only; see end of file). */
  --kt-forest-glow: #f6ead6;
  --kt-forest-mist: #eef0e6;
  --kt-forest-1: #c9d3c4;
  --kt-forest-2: #a9bba8;
  --kt-forest-3: #8ea691;
  --kt-forest-o: .55;
  /* Seasonal tree marks: decoration only, one set per Hebrew-calendar season. */
  --kt-season-harvest-1: #a6463c;
  --kt-season-harvest-2: #b8584a;
  --kt-season-harvest-3: #92393a;
  --kt-season-light-1: #d99a3e;
  --kt-season-light-2: #e8b35a;
  --kt-season-light-3: #c98a30;
  --kt-season-blossom-1: #ecc9cf;
  --kt-season-blossom-2: #f4dde0;
  --kt-season-blossom-3: #e3b6be;
  --kt-season-bloom-1: #d9a6c2;
  --kt-season-bloom-2: #e6c07a;
  --kt-season-bloom-3: #b9b0d8;
  --kt-season-fruit-1: #6d4f7a;
  --kt-season-fruit-2: #7e5f8a;
  --kt-season-fruit-3: #5f4469;
}
/* dark palette: only when chosen in Settings → Appearance (html[data-theme="dark"]); light is the default. Same roles, inverted surfaces; contrast checked by tests/colors.cjs. */
  :root[data-theme="dark"] {
    color-scheme: dark;
    --kt-bg: #161714;
    --kt-card: #1d1e1a;
    --kt-well: #272923;
    --kt-line: #393b34;
    --kt-control-line: #858174;
    --kt-ink: #ece6da;
    --kt-ink-2: #d6d0c3;
    --kt-soft: #aba493;
    --kt-interactive: #c3c7a4;
    --kt-on-accent: #e5deca;
    --kt-wash: #30332b;
    --kt-upcoming: #2b2d27;
    --kt-honey: #e6a85c;
    --kt-honey-wash: #3b2c18;
    --kt-go: #86c9c1;
    --kt-go-hover: #a3d8d1;
    --kt-av-0: #c9b48d;
    --kt-av-1: #9cc0aa;
    --kt-av-2: #d3a39c;
    --kt-av-3: #a5b7d4;
    --kt-av-4: #c1aad0;
    --kt-av-5: #b8c78f;
    --kt-on: #161714;
    --kt-on-soft: #4a4c44;
    --kt-on-line: #16171440;
    --kt-glass: #1d1e1af0;
    --kt-glass-lt: #1d1e1ae0;
    --kt-backdrop: #000000aa;
    --kt-glow: #c3c7a44d;
    --kt-shadow: 0 1px 2px #00000033;
    --kt-lift: 0 1px 3px #00000059;
    --kt-float: 0 10px 30px -10px #000000a6;
    --kt-danger: #f0a198;
    --kt-forest-glow: #2a261d;
    --kt-forest-mist: #18201b;
    --kt-forest-1: #1f2a23;
    --kt-forest-2: #24332a;
    --kt-forest-3: #2a3c31;
    --kt-forest-o: .9;
  }
  /* Chrome (header, player, toast) stays a dark bar with light text, as in light mode, one step above the page. */
  :root[data-theme="dark"] body::before, :root[data-theme="dark"] .skip-link, :root[data-theme="dark"] .dash-page :is(.kt-bar, .au, .kt-toast) {
    --kt-ink: #2b2d27;
    --kt-ink-2: #34362f;
    --kt-on: #ece6da;
    --kt-on-soft: #bdb6a6;
    --kt-on-line: #ece6da33;
    --kt-line: #45473f;
    --kt-interactive: #595c48;
    --kt-honey: #93591a;
  }

/* end dark palette */

body::before { content: ""; position: fixed; z-index: 1001; inset: 0 0 auto; height: env(safe-area-inset-top); background: var(--kt-ink); pointer-events: none; }
:where(button, input, select, textarea) { font: inherit; }
:where(img, svg, iframe) { display: block; max-width: 100%; }
img { height: auto; }
a { text-underline-offset: .22em; }
:where(p, li) { overflow-wrap: break-word; }
.skip-link { position: fixed; z-index: 1000; top: 1rem; left: 1rem; padding: .75rem 1rem; border-radius: .75rem; background: var(--kt-ink); color: var(--kt-on); transform: translateY(-200%); }
.skip-link:focus { transform: none; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }

@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/dm-sans-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "DM Sans";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/dm-sans-latin.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;
}

@font-face {
  font-family: "Playfair Display";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/playfair-display-700-latin-ext.woff2") format("woff2");
  unicode-range: U+0100-02BA, U+02BD-02C5, U+02C7-02CC, U+02CE-02D7, U+02DD-02FF, U+0304, U+0308, U+0329, U+1D00-1DBF, U+1E00-1E9F, U+1EF2-1EFF, U+2020, U+20A0-20AB, U+20AD-20C0, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

@font-face {
  font-family: "Playfair Display";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/playfair-display-700-latin.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;
}

/* My Club: the Club app (index.html). Scoped under .dash-page.
   Four places: Home (today in both calendars, the week's strip, its lessons in any order), Learn (the reader and its player),
   Progress (the family log) and More (your data).
   Compact app controls, a weekly checklist, and notes expanded only when requested.
   One column, an 8-point spacing scale, one radius family; a tab bar docked at the bottom on phones,
   a quiet rail at the side on wide screens.
   Sections follow the screen: shell, controls, Home, Learn, Read, Progress, More, overlays. */

.dash-page {
  /* ── Geometry: a 4px grid. Every space, size and corner is one of these steps.
     Space: .125 .25 .5 .75 1 1.25 1.5 2 (rem). Nothing between steps.
     Corners, four shapes: --kt-r surfaces (cards, sheets, reader, timer); --kt-r-sm anything inside a surface
       (wells, inputs, day cells, menus); --kt-r-xs inline text marks; 999px pill for any labelled control;
       50% circle for icon-only controls and dots. An inner corner is never rounder than its frame.
     Controls, four heights: --kt-h-lg the one big action, --kt-h every button and input, --kt-h-sm chips,
       --kt-h-xs segments and anything inside a bar. Icons: --kt-i. Borders: 1px, --kt-line or --kt-hair.
     Type, six sizes on a ~1.17 ratio; two weights (600 label, 700 heading; 400 only for reading text);
       three line-heights; caps labels always .1em tracking. */
  --kt-r: .375rem;
  --kt-r-sm: .25rem;
  --kt-r-xs: .375rem;
  --kt-pad: .75rem;        /* inside every card, every row */
  --kt-gap: .75rem;         /* between controls */
  --kt-h-lg: 3.25rem;
  --kt-h: 2.75rem;
  --kt-h-sm: 2.25rem;
  --kt-h-xs: 2rem;
  --kt-i: 1.125rem;
  --kt-t-xs: .75rem;        /* 12: captions, caps labels */
  --kt-t-sm: .875rem;       /* 14: meta, secondary */
  --kt-t-md: .9375rem;      /* 15: body, controls */
  --kt-t-lg: 1.0625rem;     /* 17: titles, inputs */
  --kt-t-xl: 1.25rem;       /* 20: Hebrew lines, section heads */
  --kt-t-2xl: 1.625rem;     /* 26: figures */
  --kt-lh-tight: 1.25;
  --kt-lh: 1.4;
  --kt-lh-read: 1.6;
  --kt-ease: cubic-bezier(.22, .8, .3, 1);
  min-height: 100dvh;
  background: var(--kt-card);
  color: var(--kt-ink);
  -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%;
  overscroll-behavior-y: none;
  touch-action: pan-y pinch-zoom;
}
.dash-page *, .dash-page *::before, .dash-page *::after { box-sizing: border-box; }
.dash-page a { color: var(--kt-interactive); }
.dash-page p, .dash-page h1, .dash-page h2, .dash-page h3 { margin: 0; max-width: none; }
.dash-page button { -webkit-tap-highlight-color: transparent; touch-action: manipulation; }
/* Chrome behaves like an app, not a page: no text selection or long-press callout on controls, bars and labels. */
.dash-page :is(button, summary, label, .kt-bar, .kt-tabs, .kt-label, .kt-tiles, .dash-days, .kt-log__row--head, .au, .kt-timer) {
  -webkit-user-select: none; user-select: none; -webkit-touch-callout: none;
}
.dash-page img, .dash-page svg { -webkit-user-drag: none; }
.dash-page :is(button, select, summary, a, input[type="checkbox"]):focus-visible { outline: 2px solid var(--kt-interactive); outline-offset: 2px; }

/* ---------- Core · Shell: no site nav or footer; fills the screen, never scrolls sideways ---------- */
html { text-size-adjust: 100%; -webkit-text-size-adjust: 100%; scrollbar-gutter: stable; }
html, body, .dash-page { overflow-x: clip; max-width: 100%; }

.dash-page .kt-app {
  --kt-dock: calc(4rem + env(safe-area-inset-bottom)); /* bottom tab bar height */
  --kt-over: 0rem;                                     /* height of whatever is docked above the tab bar */
  display: grid; gap: .5rem; width: 100%; min-width: 0; margin: 0;
  padding: 0 .75rem calc(var(--kt-dock) + var(--kt-over) + .25rem);
}
.dash-page .kt-app:is([data-view="t-learn"], :has(.au.is-playing)) { --kt-over: 5.5rem; }
.dash-page .kt-app > *, .dash-page .kt-panel > * { min-width: 0; }

/* Shared ribbon: today, club context, child switcher and timer. */
.dash-page .kt-bar {
  position: sticky; z-index: 5; top: 0; display: flex; align-items: center; gap: .75rem;
  min-height: calc(env(safe-area-inset-top) + 3.5rem); flex-wrap: nowrap;
  margin-inline: -.75rem; padding: env(safe-area-inset-top) .75rem 0;
  background: var(--kt-ink);
}
/* Profile-style round badge: the square logo sits centered in a white circle. */
.dash-page .kt-bar__mark { flex: none; display: block; width: 2.75rem; height: 2.75rem; overflow: hidden; border-radius: 50%; background: var(--kt-white); box-shadow: 0 0 0 2px var(--kt-on-line); }
.dash-page .kt-bar__mark img { display: block; width: 100%; height: 100%; object-fit: cover; transform: scale(1.12); }

.dash-page .kt-bar .kt-kids:not(:empty) { min-width: var(--kt-h-xs); }

.dash-page .kt-bar .kt-chip[aria-pressed="true"] { border-color: var(--kt-on-accent); background: var(--kt-on-accent); color: var(--kt-ink); }
.dash-page .kt-bar .kt-chip__n { color: var(--kt-on-accent); }
.dash-page .kt-bar .kt-chip[aria-pressed="true"] .kt-chip__n { color: var(--kt-ink); }
.dash-page .kt-bar__timer { display: flex; flex: none; align-items: center; gap: .25rem; min-height: var(--kt-h-xs); padding: 0 .5rem; border: 0; border-radius: 999px; background: transparent; color: var(--kt-on); font: inherit; font-size: var(--kt-t-sm); font-weight: 700; font-variant-numeric: tabular-nums; cursor: pointer; }
.dash-page .kt-bar__timer svg { width: var(--kt-i); height: var(--kt-i); fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.dash-page .kt-bar .kt-awards { position: relative; min-width: 44px; min-height: 44px; justify-content: center; padding: 0; }
.dash-page .kt-awards span { position: absolute; top: 0; right: 0; min-width: 1.15rem; padding: .1rem .2rem; border-radius: 999px; background: var(--kt-on-accent); color: var(--kt-ink); font-size: .7rem; line-height: 1; text-align: center; }
.certificate-dialog.awards-dialog { width: min(100% - 1rem, 460px); }
.awards-list { list-style: none; margin: 0; padding: 0; }
.awards-list li { display: flex; align-items: center; gap: 1rem; padding: .85rem 0; border-top: 1px solid var(--kt-line); }
.awards-list li > span { flex: 1; min-width: 0; }
.awards-list strong, .awards-list li > span > span { display: block; }
.awards-list li > span > span { margin-top: .25rem; font-size: .85rem; }
.awards-list .awards-kid { border-top: 0; padding-top: 1rem; }
.awards-list .awards-book + li:not(.awards-book):not(.awards-kid) { border-top: 0; }
.awards-list li:not(.awards-book):not(.awards-kid) { padding: .4rem 0 .4rem 1rem; }

/* Tab bar: docked to the bottom like a native app. */
.dash-page .kt-tabs {
  position: fixed; z-index: 5; left: 0; right: 0; bottom: 0;
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  height: var(--kt-dock); padding: 0 0 env(safe-area-inset-bottom);
  border-top: 1px solid var(--kt-line);
  background: var(--kt-card);
}
.dash-page .kt-tab {
  display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .25rem; min-width: 0; padding: 0;
  border: 0; background: none; color: var(--kt-soft);
  font: inherit; font-size: var(--kt-t-xs); font-weight: 600; letter-spacing: .01em; white-space: nowrap; cursor: pointer;
  transition: color 180ms var(--kt-ease); user-select: none; -webkit-user-select: none;
}
.dash-page .kt-tab span { overflow: hidden; text-overflow: ellipsis; }
.dash-page .kt-tab svg {
  flex: none; width: 1.5rem; height: 1.5rem; padding: .125rem; box-sizing: content-box; border-radius: 999px;
  fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round;
  transition: background 180ms var(--kt-ease), padding 180ms var(--kt-ease);
}
.dash-page .kt-tab:hover, .dash-page .kt-tab[aria-selected="true"] { color: var(--kt-ink); }
.dash-page .kt-tab:active svg { transform: scale(.88); }
.dash-page .kt-tab svg { transition: background 180ms var(--kt-ease), padding 180ms var(--kt-ease), transform 120ms; }
.dash-page .kt-tab:focus-visible { outline: 0; }
.dash-page .kt-tab:focus-visible svg { outline: 2px solid var(--kt-interactive); outline-offset: 1px; }

/* Wide screens: reserve only the navigation rail; content fills the rest. */
@media (min-width: 60rem) {
  .dash-page .kt-app { --kt-dock: 0rem; padding-left: 6.75rem; }
  .dash-page .kt-tabs {
    top: 0; right: auto; bottom: 0; width: 6rem; height: auto; padding: 1.5rem 0;
    grid-template-columns: 1fr; grid-auto-rows: 4.5rem; align-content: start;
    border-top: 0; border-right: 1px solid var(--kt-line);
  }
  .dash-page .kt-tab { font-size: var(--kt-t-sm); }
  .dash-page :is(.au, .rd-pop) { left: calc(50% + 3rem); }
}

/* ---------- Core · Panels, cards and type ---------- */
.dash-page .kt-panels { display: grid; }
.dash-page .kt-panel { display: grid; align-content: start; gap: .75rem; }
@keyframes kt-fade { from { opacity: 0; } }
@keyframes kt-in { from { opacity: 0; transform: translateY(.375rem); } }
.dash-page .kt-card { display: grid; gap: var(--kt-gap); padding: var(--kt-pad); border-radius: var(--kt-r); background: var(--kt-card); border: 1px solid var(--kt-hair); box-shadow: var(--kt-shadow); }
.dash-page .kt-title { font-size: var(--kt-t-lg); font-weight: 700; line-height: var(--kt-lh); }
/* A group in More: a quiet label, then its card. */
.dash-page .kt-group { display: grid; gap: .5rem; }
.dash-page .kt-group > .kt-label { padding: 0 var(--kt-pad); }
.dash-page .kt-panel > .kt-group + .kt-group { margin-top: .25rem; }
.dash-page .kt-card__top { display: flex; align-items: baseline; justify-content: space-between; gap: .75rem; }
.dash-page .kt-label { font-family: inherit; font-size: var(--kt-t-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--kt-soft); }
.dash-page .kt-count { font-size: var(--kt-t-sm); font-weight: 600; color: var(--kt-interactive); font-variant-numeric: tabular-nums; }
.dash-page .kt-text { font-size: var(--kt-t-md); line-height: var(--kt-lh-read); color: var(--kt-soft); }
.dash-page .kt-hint { padding: .75rem var(--kt-pad) .5rem; font-size: var(--kt-t-sm); line-height: var(--kt-lh); color: var(--kt-soft); }
.dash-page .kt-note { text-align: center; font-size: var(--kt-t-sm); font-weight: 600; line-height: var(--kt-lh); color: var(--kt-interactive); }

.dash-page .kt-out { padding: .75rem .75rem; border-radius: var(--kt-r-sm); background: var(--kt-well); font-size: var(--kt-t-md); line-height: var(--kt-lh-read); }
.dash-page :is(.kt-note, .kt-out, .kt-count, .kt-text):empty { display: none; }

/* ---------- Core · Controls ---------- */
.dash-page .kt-btn {
  position: relative; display: inline-flex; align-items: center; justify-content: center; width: 100%;
  height: var(--kt-h); padding: 0 1.25rem; border: 1px solid var(--kt-ink); border-radius: 999px;
  background: var(--kt-ink); color: var(--kt-on); font: inherit; font-size: var(--kt-t-md); font-weight: 600; white-space: nowrap;
  text-decoration: none; cursor: pointer; transition: background 150ms, border-color 150ms; user-select: none; -webkit-user-select: none;
}
.dash-page .kt-btn:hover { background: var(--kt-ink-2); }
.dash-page .kt-btn--soft { border-color: var(--kt-control-line); background: var(--kt-card); color: var(--kt-ink); }
.dash-page .kt-btn--soft:hover { background: var(--kt-well); }
.dash-page :is(.kt-btn, .kt-icon-btn, .dash-read, .dash-song, .kt-log__cell, .kt-chip, .au__play, .kt-timer__btn, .kt-timer__done):active { transform: scale(.96); filter: brightness(.94); }
.dash-page :is(.kt-btn, .kt-icon-btn, .dash-read, .dash-song, .kt-log__cell, .kt-chip, .au__play, .kt-timer__btn, .kt-timer__done) { transition-property: background, border-color, color, transform; transition-duration: 150ms; }
/* Tappable rows highlight while pressed, like a list cell. */
.dash-page .kt-file:focus-within { outline: 2px solid var(--kt-interactive); outline-offset: 2px; }
.dash-page .kt-link { justify-self: start; display: inline-flex; align-items: center; min-height: 2.75rem; padding: 0; border: 0; background: none; color: var(--kt-interactive); font: inherit; font-size: var(--kt-t-md); font-weight: 600; cursor: pointer; text-decoration: underline; text-underline-offset: .2em; }

/* Small outlined pills: Read on a lesson; Song and Start in a note. */
.dash-page :is(.dash-read, .dash-song) {
  display: inline-flex; align-items: center; justify-content: center; height: var(--kt-h-sm); padding: 0 .75rem;
  border: 1px solid var(--kt-control-line); border-radius: 999px; background: var(--kt-card); color: var(--kt-ink);
  font: inherit; font-size: var(--kt-t-sm); font-weight: 600; text-decoration: none; cursor: pointer; transition: background 150ms;
}
.dash-page .dash-read:hover { background: var(--kt-well); }
.dash-page .dash-song { border-color: var(--kt-interactive); background: var(--kt-interactive); color: var(--kt-on); }
.dash-page .dash-song:hover { background: var(--kt-interactive); }

.dash-page .kt-icon-btn {
  display: grid; place-items: center; width: var(--kt-h); height: var(--kt-h); padding: 0;
  border: 1px solid var(--kt-control-line); border-radius: 50%; background: var(--kt-card); color: var(--kt-ink); cursor: pointer; transition: background 150ms;
}

.dash-page .kt-icon-btn svg { width: var(--kt-i); height: var(--kt-i); fill: none; stroke: currentColor; stroke-width: 2.25; stroke-linecap: round; stroke-linejoin: round; }

.dash-page .kt-form { display: grid; gap: var(--kt-gap); }
.dash-page .kt-file { overflow: hidden; }
.dash-page .kt-file input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }

/* A segmented switch: Hebrew / Both / English in the reader, the converter's two directions. */
.dash-page .rd-seg, .dash-page .rd-size { display: flex; padding: .1875rem; border-radius: 999px; background: var(--kt-well); }
.dash-page .rd-seg button, .dash-page .rd-size button {
  flex: 1; min-width: 2.75rem; height: var(--kt-h-sm); padding: 0 .75rem; border: 0; border-radius: 999px; background: none; color: var(--kt-soft);
  font: inherit; font-size: var(--kt-t-sm); font-weight: 600; white-space: nowrap; cursor: pointer; transition: background 150ms, color 150ms;
}
.dash-page .rd-seg button[aria-checked="true"] { background: var(--kt-card); color: var(--kt-ink); box-shadow: var(--kt-lift); }

/* Folded sections: a row with a chevron. */

.dash-page .kt-more summary::-webkit-details-marker { display: none; }
.dash-page .kt-more summary > span:first-child { flex: 1; }
.dash-page .kt-more summary::after { content: ""; width: .45rem; height: .45rem; margin: 0 .25rem; border: solid var(--kt-soft); border-width: 0 2px 2px 0; transform: rotate(45deg); transition: transform 150ms var(--kt-ease); }
.dash-page .kt-more[open] summary::after { transform: rotate(-135deg); }

/* ---------- Home · Children's chips (also on Progress) ---------- */
.dash-page .kt-kids { display: flex; flex-wrap: wrap; gap: .5rem; }
.dash-page .kt-kids[hidden] { display: none; }
.dash-page .kt-chip {
  display: inline-flex; align-items: center; gap: .5rem; height: var(--kt-h-sm); padding: 0 1rem; border: 1px solid var(--kt-line); border-radius: 999px;
  background: var(--kt-card); color: var(--kt-ink); font: inherit; font-size: var(--kt-t-md); font-weight: 600; cursor: pointer; transition: background 150ms;
}
.dash-page .kt-chip[aria-pressed="true"] { border-color: var(--kt-ink); background: var(--kt-ink); color: var(--kt-on); }
.dash-page .kt-chip__n { font-size: var(--kt-t-sm); font-weight: 600; color: var(--kt-interactive); font-variant-numeric: tabular-nums; }
.dash-page .kt-chip[aria-pressed="true"] .kt-chip__n { color: var(--kt-on-accent); }

/* ---------- Home · Header and calendar ---------- */
/* Dates remain readable and distinct from the week being browsed on Home. */
.dash-page .kt-bar__today { flex: 1 1 0; min-width: 0; padding-block: .375rem; line-height: var(--kt-lh); }

.dash-page #today-club:not(:empty) + #week-title::before { content: "·"; margin-inline-end: .5rem; }

.dash-page #week-sub:not(:empty) + #today-event:not([hidden])::before { content: "·"; margin-inline-end: .5rem; }

.dash-page .kt-week .kt-card__top { padding-top: .5rem; border-top: 1px solid var(--kt-hair); }

/* ---------- Home · Week, day strip and lessons ---------- */
.dash-page .kt-week { --kt-pad: .75rem; --kt-r: .375rem; --kt-r-sm: .25rem; gap: .5rem; scroll-margin-top: 1rem; box-shadow: none; }
.dash-page .kt-week__head { display: grid; grid-template-columns: 2.5rem 2.5rem; justify-content: space-between; align-items: center; gap: .5rem; text-align: center; }
.dash-page .kt-week__title h2 { font-family: inherit; font-size: var(--kt-t-lg); font-weight: 700; line-height: var(--kt-lh-tight); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-page .kt-week__title p { margin-top: .125rem; font-size: var(--kt-t-sm); line-height: var(--kt-lh); color: var(--kt-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.dash-page .dash-days { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: .25rem; margin: 0; padding: .25rem; list-style: none; border-radius: var(--kt-r-sm); background: var(--kt-well); }
.dash-page .dash-day { display: grid; justify-items: center; align-content: start; gap: .125rem; padding: .25rem 0; border-radius: var(--kt-r-sm); text-align: center; line-height: var(--kt-lh-tight); }
.dash-page .dash-day__name { font-size: var(--kt-t-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--kt-soft); }
.dash-page .dash-day__num { font-size: var(--kt-t-lg); font-weight: 700; font-variant-numeric: tabular-nums; }
.dash-page .dash-day__he { min-height: 1.15em; font-size: var(--kt-t-xs); color: var(--kt-soft); white-space: nowrap; }
.dash-page .dash-day__ev { width: .3125rem; height: .3125rem; border-radius: 50%; background: var(--kt-interactive); font-size: 0; }
.dash-page .dash-day__ev:empty { visibility: hidden; }
.dash-page .dash-day.is-today { background: var(--kt-ink); color: var(--kt-on); }
.dash-page .dash-day.is-today .dash-day__name { color: var(--kt-on-accent); }
.dash-page .dash-day.is-today .dash-day__he { color: var(--kt-on-soft); }

/* Lessons: tick, name (opens the note), Read. They sit full-bleed at the foot of their card. */
.dash-page .dash-plan { margin: 0; padding: 0; list-style: none; }
.dash-page .kt-week .dash-plan { margin: 0 calc(-1 * var(--kt-pad)) 0; }
.dash-page .dash-lesson, .dash-page .dash-plan__off { border-top: 1px solid var(--kt-hair); }
.dash-page .dash-plan__off { padding: .75rem var(--kt-pad); text-align: center; font-style: italic; color: var(--kt-soft); }

.dash-page .dash-check { width: 1.375rem; height: 1.375rem; margin: 0; accent-color: var(--kt-honey); cursor: pointer; }
.dash-page .dash-lesson__name { display: flex; align-items: baseline; gap: .5rem; min-width: 0; padding: .25rem 0; border: 0; border-radius: var(--kt-r-xs); background: none; color: inherit; font: inherit; text-align: start; cursor: pointer; }
.dash-page .dash-lesson__book { order: 1; min-width: 0; font-size: var(--kt-t-sm); color: var(--kt-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-page .dash-lesson__title { flex: none; max-width: 70%; font-weight: 600; line-height: var(--kt-lh); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-page .dash-lesson.is-done { background: var(--kt-honey-wash); }
.dash-page .is-done .dash-lesson__title::after { content: " ✓"; color: var(--kt-honey); }
/* Brief neutral feedback after marking a lesson. */
.dash-page .dash-lesson.is-just { animation: kt-settle 1.4s var(--kt-ease); }
@keyframes kt-settle { 0% { background: var(--kt-wash); } 100% { background: transparent; } }

/* The note: what to know before you sit. */
.dash-page .dash-note { display: grid; gap: .5rem; margin: 0 var(--kt-pad) .75rem; padding: .75rem; border-radius: var(--kt-r-sm); background: var(--kt-well); font-size: var(--kt-t-md); line-height: var(--kt-lh-read); }
.dash-page .dash-note__he { font-size: var(--kt-t-xl); line-height: var(--kt-lh-read); }
.dash-page .dash-note__en { font-style: italic; }
.dash-page .dash-note__ans { font-size: var(--kt-t-md); color: var(--kt-soft); }
.dash-page .dash-note__reveal { justify-self: start; padding: 0; border: 0; background: none; color: var(--kt-interactive); font: inherit; font-size: var(--kt-t-md); font-weight: 600; cursor: pointer; text-decoration: underline; text-underline-offset: .2em; }
.dash-page .dash-note__acts { display: flex; flex-wrap: wrap; gap: .5rem; padding-top: .25rem; }
/* Notes expand within their lesson, using normal page scrolling. */
.dash-page .dash-preview { padding: .5rem 0 0; border-top: 1px solid var(--kt-hair); }
.dash-page .dash-preview__head { display: flex; align-items: center; justify-content: space-between; gap: .5rem; padding: 0 var(--kt-pad) .5rem; }
.dash-page .dash-preview__head > .dash-lesson__book { display: none; }
.dash-page .dash-preview__title { font-size: var(--kt-t-md); font-weight: 600; line-height: var(--kt-lh); }
.dash-page .dash-preview__head .kt-link { min-height: var(--kt-h); flex: none; }
.dash-page .dash-lesson.is-shown { background: var(--kt-well); }
.dash-page .dash-say { display: inline-grid; place-items: center; width: var(--kt-h-xs); height: var(--kt-h-xs); margin-inline-start: .5rem; padding: 0; border: 1px solid var(--kt-control-line); border-radius: 999px; background: var(--kt-card); color: var(--kt-ink); vertical-align: middle; cursor: pointer; }

/* From earlier weeks: folded away until wanted. */
.dash-page .kt-more { padding: 0; gap: 0; }
.dash-page .kt-more summary { display: flex; align-items: center; gap: .5rem; cursor: pointer; list-style: none; min-height: var(--kt-h-lg); padding: 0 var(--kt-pad); border-radius: var(--kt-r); font-size: var(--kt-t-md); font-weight: 600; }

/* ---------- Progress · Numbers and the log ----------
   One row per week, newest first; one box per book in the same order as Learn. A filled box carries the day it was learned.
   Empty is a quiet well, never a warning colour. This week has a neutral highlight. */

.dash-page .kt-tiles span { font-size: var(--kt-t-xs); font-weight: 600; color: var(--kt-soft); white-space: nowrap; }

.dash-page .kt-log { gap: 1rem; }

.dash-page .kt-log__row--head span:first-child { text-align: start; }
.dash-page .kt-log__row.is-now { background: color-mix(in srgb, var(--kt-wash) 45%, transparent); }
.dash-page .kt-log__wk { display: grid; gap: .125rem; min-width: 0; line-height: var(--kt-lh-tight); }
.dash-page .kt-log__wk strong { font-size: var(--kt-t-md); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-page .kt-log__wk span { font-size: var(--kt-t-sm); color: var(--kt-soft); }
.dash-page .kt-log__wk span:empty { display: none; }

.dash-page .kt-log__cell:hover { border-color: var(--kt-line); }

.dash-page .kt-log__tick { position: absolute; top: 0; right: .1875rem; color: var(--kt-honey); font-size: .75rem; font-weight: 700; line-height: 1; pointer-events: none; }
.dash-page .kt-log__tick:empty { display: none; }
.dash-page .kt-log__date { max-width: 100%; font-size: var(--kt-t-xs); font-weight: 600; line-height: var(--kt-lh); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-page .kt-log__cell:not(.is-on) .kt-log__date { color: var(--kt-soft); }
.dash-page .kt-log__cell.is-on { background: var(--kt-honey-wash); border-color: var(--kt-honey); color: var(--kt-ink); }
.dash-page .kt-log__empty { padding: 1rem var(--kt-pad); border-top: 1px solid var(--kt-hair); }

/* ---------- Learn · Reader page: paper, a serif, wide margins, the Hebrew set large ---------- */
@font-face {
  font-family: "Frank Ruhl Libre";
  font-style: normal;
  font-weight: 400 700;
  font-display: swap;
  src: url("fonts/frank-ruhl-libre-hebrew.woff2") format("woff2");
  unicode-range: U+0307-0308, U+0590-05FF, U+200C-2010, U+20AA, U+25CC, U+FB1D-FB4F;
}
.dash-page [lang="he"] { font-family: "Frank Ruhl Libre", "Taamey Frank CLM", "SBL Hebrew", "David", serif; }

/* Learn: chapter navigation only; language and size fold behind the dots. */
.dash-page .learn-controls { min-width: 0; }

.dash-page .rd-nav .rd-more { margin-left: auto; }
.dash-page .kt-week__head .kt-icon-btn:disabled { opacity: .3; cursor: default; pointer-events: none; }
.dash-page .rd-select {
  flex: 1; min-width: 0; height: var(--kt-h-sm); padding: 0 2rem 0 .75rem; border: 1px solid var(--kt-control-line); border-radius: 999px;
  background: var(--kt-card);
  color: var(--kt-ink); font: inherit; font-size: var(--kt-t-md); font-weight: 600; text-overflow: ellipsis; cursor: pointer;
  -webkit-appearance: auto; appearance: auto;
}
.dash-page .rd-select option { color: var(--kt-ink); background: var(--kt-card); }
.dash-page :is(#rd-pick, #rd-verse) { flex: 1 1 0; max-width: 9rem; }
.dash-page .rd-more { position: relative; flex: none; }
.dash-page .rd-more summary { display: grid; place-items: center; width: var(--kt-h-sm); height: var(--kt-h-sm); border-radius: 50%; list-style: none; cursor: pointer; color: var(--kt-ink); }
.dash-page .rd-more summary::-webkit-details-marker { display: none; }
.dash-page .rd-more[open] summary { background: var(--kt-wash); }
.dash-page .rd-more svg { width: var(--kt-i); height: var(--kt-i); fill: currentColor; }
.dash-page .rd-tools { position: absolute; z-index: 6; top: calc(100% + .5rem); right: 0; display: flex; align-items: center; gap: .5rem; padding: .5rem; border-radius: 999px; background: var(--kt-card); box-shadow: var(--kt-float); }
.dash-page .rd-tools .rd-seg button { flex: none; }
.dash-page .rd-seg button[lang="he"] { font-size: var(--kt-t-lg); }
.dash-page #rd-smaller { font-size: var(--kt-t-sm); }
.dash-page #rd-bigger { font-size: var(--kt-t-lg); }
.dash-page .rd-size button:disabled { opacity: .35; cursor: default; }

.dash-page .rd-head__book { min-height: 1em; font-size: var(--kt-t-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--kt-interactive); }

.dash-page .rd-head__he { min-height: 1.5em; font-size: var(--kt-t-xl); color: var(--kt-soft); }
.dash-page :is(.dash-say, .rd-pop__say) svg { width: var(--kt-i); height: var(--kt-i); fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.dash-page :is(.dash-say, .rd-pop__say) svg path:first-child { fill: currentColor; }

/* A mishna's introduction: folded until asked for. */

.dash-page .rd-intro summary::-webkit-details-marker { display: none; }
.dash-page .rd-intro summary::after { content: "+"; font-size: var(--kt-t-xl); font-weight: 400; letter-spacing: 0; }
.dash-page .rd-intro[open] summary::after { content: "−"; }

.dash-page :is(.rd-intro p, .rd-v__en) { font-family: "Iowan Old Style", "Charter", "Palatino Linotype", Georgia, serif; font-size: var(--rd-en); line-height: var(--kt-lh-read); color: var(--kt-ink-2); }

/* The text: one verse per block, the number in the margin. */
.dash-page .rd-text { display: grid; gap: 1.25rem; }

.dash-page .rd-v__n { position: absolute; left: .375rem; top: .45rem; font-size: var(--kt-t-xs); font-weight: 700; font-variant-numeric: tabular-nums; color: var(--kt-interactive); }
.dash-page .rd-v__he { font-size: var(--rd-he); line-height: var(--kt-lh-read); text-align: right; }
.dash-page .rd-v__en { hyphens: auto; }
.dash-page .rd-v.is-at, .dash-page .rd-v.is-saying { background: var(--kt-wash); }
.dash-page .rd-book[data-lang="he"] .rd-v__en, .dash-page .rd-book[data-lang="en"] .rd-v__he { display: none; }
.dash-page .rd-book[data-lang="he"] .rd-v__he { font-size: calc(var(--rd-he) * 1.08); }
.dash-page .rd-msg { text-align: center; color: var(--kt-soft); }
.dash-page .rd-text > .kt-btn { justify-self: center; width: auto; }
.dash-page .rd-skel { height: 1.1rem; border-radius: var(--kt-r-xs); background: linear-gradient(90deg, var(--kt-well), var(--kt-card), var(--kt-well)); background-size: 200% 100%; animation: rd-shine 1.2s linear infinite; }
.dash-page .rd-skel:nth-child(3n) { width: 70%; }
@keyframes rd-shine { to { background-position: -200% 0; } }

/* Each Hebrew word a quiet tap target. */
.dash-page .rd-w { border-radius: var(--kt-r-xs); cursor: pointer; transition: background 150ms; -webkit-tap-highlight-color: transparent; }
.dash-page .rd-w:hover { background: var(--kt-well); }
.dash-page .rd-w.is-on { background: var(--kt-wash); color: var(--kt-interactive); }
.dash-page .rd-w.is-said { background: var(--kt-ink); color: var(--kt-on); }

.dash-page .rd-foot { display: grid; grid-template-columns: 2.75rem 1fr 2.75rem; align-items: center; gap: .75rem; padding-top: 1rem; border-top: 1px solid var(--kt-line); }
.dash-page .rd-foot .kt-icon-btn:disabled { visibility: hidden; }
.dash-page .rd-count { margin: 0; text-align: center; color: var(--kt-soft); font-size: var(--kt-t-sm); font-variant-numeric: tabular-nums; }
/* One pasuk at a time, on a calm stage of fixed height: a short pasuk and a long one leave the buttons where they are. */
.dash-page .rd-text.is-one { display: grid; align-content: center; min-height: max(14rem, 34dvh); touch-action: pan-y; }
.dash-page .rd-text.is-one > :not(.is-on) { display: none; }
.dash-page .rd-text.is-one > .rd-v.is-on + .rd-head__ask { display: inline-flex; justify-self: center; margin-top: 1rem; }
.dash-page .rd-text.is-one .rd-v.is-on { padding-block: 1.25rem; background: transparent; }
.dash-page .rd-text.is-one .rd-v.is-on .rd-v__he { font-size: calc(var(--rd-he) * 1.15); }
.dash-page .rd-text.is-one .rd-v.is-in { animation: rd-in 260ms var(--kt-ease); }
@keyframes rd-in { from { opacity: 0; } to { opacity: 1; } }
.dash-page .rd-foot .kt-btn { grid-column: 2; }
.dash-page #rd-prev { grid-column: 1; }
.dash-page #rd-next { grid-column: 3; }

/* ---------- Core · Overlays: timer, player, toasts, dialogs (docked just above the tab bar) ---------- */
.dash-page :is(.au, .rd-pop) {
  position: fixed; left: 50%; bottom: calc(var(--kt-dock) + .625rem); width: min(28rem, calc(100% - 2rem));
  transform: translateX(-50%); box-shadow: var(--kt-float);
}

/* Timer: part of the sticky app bar; secondary actions live in its menu. */

.dash-page .kt-timer__more { position: relative; }
.dash-page .kt-timer__more summary { display: grid; place-items: center; width: var(--kt-h-xs); height: var(--kt-h-xs); border-radius: 50%; list-style: none; cursor: pointer; color: var(--kt-on); }
.dash-page .kt-timer__more summary::-webkit-details-marker { display: none; }
.dash-page .kt-timer__more[open] summary { background: var(--kt-on-line); }
.dash-page .kt-timer__more svg { width: var(--kt-i); height: var(--kt-i); fill: currentColor; }
.dash-page .kt-timer__menu { position: absolute; z-index: 6; top: calc(100% + .5rem); right: 0; display: grid; gap: .5rem; width: min(20rem, calc(100vw - 2rem)); padding: .75rem; border: 1px solid var(--kt-on-line); border-radius: var(--kt-r-sm); background: var(--kt-ink); box-shadow: var(--kt-float); }
.dash-page .kt-timer__close { min-height: var(--kt-h); padding: 0 .75rem; border: 0; border-radius: var(--kt-r-sm); background: var(--kt-on-line); color: var(--kt-on); font: inherit; font-size: var(--kt-t-md); font-weight: 600; text-align: start; cursor: pointer; }
/* The time sits inside the progress circle; controls stay on the toolbar's first line. */

.dash-page .kt-timer__face > * { grid-area: 1 / 1; }
.dash-page .kt-timer__rings { width: 100%; height: 100%; overflow: visible; }
/* A hairline circle; each book learned this week closes its quarter, the book on the clock fills as it goes. */
.dash-page .kt-ring__bg { fill: none; stroke: var(--kt-line); stroke-width: 1; }
.dash-page .kt-ring { fill: none; stroke: var(--kt-on-accent); stroke-width: 3.5; stroke-linecap: round; transition: stroke-dasharray 250ms linear, opacity 200ms; }
.dash-page .kt-ring.is-empty { opacity: 0; }
.dash-page .kt-timer.is-up .kt-ring.is-on { animation: kt-ring-up 1.2s ease-in-out 3; }
@keyframes kt-ring-up { 50% { opacity: .35; } }

.dash-page .kt-timer__clock { font-size: var(--kt-t-xs); font-weight: 700; font-variant-numeric: tabular-nums; line-height: 1; }
.dash-page .kt-timer.is-up .kt-timer__clock { color: var(--kt-on-accent); }
.dash-page .kt-timer__what { font-size: var(--kt-t-sm); color: var(--kt-on-soft); overflow-wrap: anywhere; }
.dash-page .kt-timer__btn, .dash-page .kt-timer__x { display: grid; place-items: center; width: var(--kt-h); height: var(--kt-h); padding: 0; border: 0; border-radius: 50%; cursor: pointer; }
.dash-page .kt-timer__btn { width: var(--kt-h-xs); height: var(--kt-h-xs); background: var(--kt-on-line); color: var(--kt-on); }
.dash-page .kt-timer__btn svg { width: 1rem; height: 1rem; fill: currentColor; }

.dash-page .kt-timer.is-up .kt-timer__done { border-color: var(--kt-interactive); background: var(--kt-interactive); color: var(--kt-on); }
.dash-page .kt-timer__x { width: var(--kt-h-xs); height: var(--kt-h-xs); background: none; color: var(--kt-soft); }
.dash-page .kt-timer__x svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.dash-page :is(.kt-timer, .au) .i-pause { display: none; }
.dash-page :is(.kt-timer.is-running, .au.is-playing) .i-pause { display: inline; }
.dash-page :is(.kt-timer.is-running, .au.is-playing) .i-play { display: none; }

/* The Learn player: play, what's playing over its slider, and Song / Read when the psalm has a song.
   Docked above the tabs in Learn; elsewhere only while it plays. */
.dash-page .au {
  z-index: 4; grid-template-columns: 2.75rem minmax(0, 1fr) auto; grid-template-areas: "play body mode" "x x x";
  align-items: center; gap: .5rem .75rem; padding: .75rem; background: var(--kt-ink); color: var(--kt-on);
}
.dash-page .kt-app:not([data-view="t-learn"]) .au:not(.is-playing) { display: none; }
/* The YouTube frame plays the sound but is never seen. */
.dash-page .au__frame { position: fixed; left: 0; bottom: 0; z-index: -1; width: 200px; height: 200px; overflow: hidden; opacity: 0; pointer-events: none; }
.dash-page .au__frame iframe { display: block; width: 200px; height: 200px; border: 0; }
.dash-page .au__play { grid-area: play; display: grid; place-items: center; width: var(--kt-h); height: var(--kt-h); padding: 0; border: 0; border-radius: 50%; background: var(--kt-on); color: var(--kt-ink); cursor: pointer; }
.dash-page .au__play:disabled { opacity: .4; cursor: default; }
.dash-page .au__play svg { width: var(--kt-i); height: var(--kt-i); fill: currentColor; }
.dash-page .au__body { grid-area: body; display: grid; gap: .25rem; min-width: 0; }
.dash-page .au__now { display: flex; align-items: baseline; gap: .5rem; min-width: 0; line-height: var(--kt-lh); white-space: nowrap; }
.dash-page #au-what { flex: none; font-size: var(--kt-t-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--kt-on-accent); }
.dash-page #au-sub { min-width: 0; overflow: hidden; text-overflow: ellipsis; font-size: var(--kt-t-md); font-weight: 600; }
.dash-page .au__bar { display: flex; align-items: center; gap: .5rem; font-size: var(--kt-t-xs); color: var(--kt-on-soft); font-variant-numeric: tabular-nums; }
.dash-page .au__bar span { flex: none; min-width: 1.75rem; }
.dash-page .au__bar span:last-child { text-align: end; }
.dash-page .au__bar input { flex: 1 1 0; width: 0; min-width: 0; height: 1rem; margin: 0; accent-color: var(--kt-on-accent); }
.dash-page .au__mode { grid-area: mode; padding: .125rem; background: var(--kt-on-line); }
.dash-page .au__mode button { display: grid; place-items: center; min-width: 0; width: var(--kt-h-xs); height: var(--kt-h-xs); padding: 0; color: var(--kt-on-soft); }
.dash-page .au__mode svg { width: 1.125rem; height: 1.125rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.dash-page .au__mode button[aria-checked="true"] { background: var(--kt-on); color: var(--kt-ink); box-shadow: none; }
.dash-page :is(.au__credit, .au__err) { grid-area: x; align-self: center; min-width: 0; margin: 0; padding-inline-start: 3.5rem; font-size: var(--kt-t-xs); line-height: var(--kt-lh); color: var(--kt-on-soft); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.dash-page .au__err { font-size: var(--kt-t-sm); color: var(--kt-on); white-space: normal; }
.dash-page .au a { color: var(--kt-on-accent); }

/* The word sheet: rises over the tab bar, one word at a time. */
.dash-page .rd-pop { z-index: 6; gap: .5rem; padding: 1.5rem 1.25rem 1.25rem; animation: kt-sheet 280ms var(--kt-ease); }
/* The grabber: reads as a sheet that came up from the bottom. */
.dash-page .rd-pop::before { content: ""; position: absolute; top: .5rem; left: 50%; width: var(--kt-h-sm); height: .3125rem; border-radius: 999px; background: var(--kt-line); transform: translateX(-50%); }
@keyframes kt-sheet { from { opacity: 0; transform: translate(-50%, 2rem); } }
.dash-page .rd-pop__top { display: flex; align-items: center; gap: .5rem; }
.dash-page .rd-pop__word { flex: 1; font-size: var(--kt-t-2xl); line-height: var(--kt-lh); text-align: right; }
.dash-page .rd-pop__say { display: grid; place-items: center; width: var(--kt-h); height: var(--kt-h); padding: 0; border: 1px solid var(--kt-line); border-radius: 50%; background: var(--kt-well); color: var(--kt-ink); cursor: pointer; }
.dash-page .rd-pop .kt-timer__x { position: static; }
.dash-page .rd-pop__say-it { font-size: var(--kt-t-sm); color: var(--kt-soft); }
.dash-page .rd-pop__mean { font-size: var(--kt-t-lg); line-height: var(--kt-lh-read); }
.dash-page .rd-pop__root { font-size: var(--kt-t-md); line-height: var(--kt-lh-read); color: var(--kt-interactive); }
.dash-page .rd-pop__say-it:empty, .dash-page .rd-pop__root:empty { display: none; }

/* The note: one line, an emoji and two words, dropped in at the top. */

@keyframes kt-slip { from { opacity: 0; transform: translate(-50%, -.75rem) scale(.92); } }
.dash-page .kt-toast[data-kind="big"] { background: var(--kt-honey); }

@media (prefers-reduced-motion: reduce) {
  .dash-page *, .dash-page *::before, .dash-page *::after { animation: none !important; transition: none !important; }
}

/* Last, so it beats every display rule above. */
.dash-page [hidden] { display: none !important; }

/* Home: familiar list controls and compact spacing. */
.dash-page #t-home { gap: .5rem; animation: none; }
.dash-page #t-home .kt-title { font-size: var(--kt-t-md); }

.dash-page #t-home .dash-lesson__name { position: relative; min-height: var(--kt-h); padding-inline-end: 1.5rem; }
.dash-page #t-home .dash-lesson__name::after { content: ""; position: absolute; right: .375rem; top: 50%; width: .4375rem; height: .4375rem; border: solid var(--kt-soft); border-width: 0 1.5px 1.5px 0; transform: translateY(-70%) rotate(45deg); transition: transform .2s var(--kt-ease), border-color .2s; }
.dash-page #t-home .dash-lesson__name:hover::after { border-color: var(--kt-ink, currentColor); }
.dash-page #t-home .dash-lesson__name[aria-expanded="true"]::after { border-color: var(--kt-interactive); transform: translateY(-30%) rotate(225deg); }

.dash-page #t-home .dash-check { width: 1.375rem; height: 1.375rem; }

.dash-page #t-home .kt-fine { padding: 0; text-align: start; font-size: var(--kt-t-xs); }
/* Home has one canvas. Sections use rules rather than raised containers. */
.dash-page #t-home :is(.kt-week, .kt-more) {
  --kt-pad: .75rem;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
}
.dash-page #t-home .kt-week .dash-plan { margin: 0; }

.dash-page #t-home .kt-week .kt-card__top { padding: .75rem 0 .25rem; }
.dash-page #t-home #week > .kt-card__top:first-child { border-top: 0; padding-top: 0; }
.dash-page #t-home .dash-days { padding: 0; border-radius: 0; background: transparent; }
.dash-page #t-home .dash-day.is-today { background: var(--kt-well); color: var(--kt-ink); }
.dash-page #t-home .dash-day.is-today :is(.dash-day__name, .dash-day__he) { color: var(--kt-soft); }
.dash-page #t-home .dash-day.is-today .dash-day__num { color: var(--kt-interactive); }
.dash-page #t-home .dash-lesson__row { gap: .625rem; min-height: 3.5rem; padding-block: .25rem; padding-inline: 0; }
.dash-page #t-home .dash-lesson.is-shown { background: transparent; }

.dash-page #t-home .dash-note { margin: 0 0 .75rem; padding: 0; border-radius: 0; background: transparent; }
.dash-page #t-home .kt-more { border-top: 1px solid var(--kt-line); }
.dash-page #t-home .kt-more summary { padding-inline: 0; border-radius: 0; }
.dash-page #t-home .kt-hint { padding-inline: 0; }
.dash-page #t-home .dash-read { height: var(--kt-h); border-radius: var(--kt-r-sm); background: transparent; }
.dash-page #t-home :is(.dash-read, .kt-week__head .kt-icon-btn):hover { background: var(--kt-well); }

/* Every tab shares the same flat canvas and a single outer gutter. */
.dash-page .kt-panel .kt-card {
  padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none;
}
.dash-page .kt-panel .kt-card + .kt-card { padding-top: .75rem; border-top: 1px solid var(--kt-line); }
.dash-page :is(.kt-group > .kt-label, .kt-fine, .kt-hint) { padding-inline: 0; }
.dash-page .kt-fine { padding: 0 var(--kt-pad); font-size: var(--kt-t-sm); line-height: var(--kt-lh-read); color: var(--kt-soft); text-align: start; }
.dash-page .kt-panel .kt-more summary { padding-inline: 0; border-radius: 0; min-height: var(--kt-h); }
.dash-page .kt-panel .kt-out { padding: .5rem 0; border-radius: 0; background: transparent; }
.dash-page :is(.kt-btn, .dash-read, .dash-song, .kt-chip, .rd-select) { border-radius: var(--kt-r-sm); }

/* Progress: a ruled summary and full-width log rather than nested tiles. */
.dash-page .kt-tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); margin: 0; gap: 0; padding-bottom: .75rem; border-bottom: 1px solid var(--kt-line); }
.dash-page .kt-tiles p { display: grid; justify-items: center; gap: .125rem; text-align: center; padding: .25rem; border: 0; border-radius: 0; background: transparent; }
.dash-page .kt-tiles p + p { border-left: 1px solid var(--kt-line); }
.dash-page .kt-tiles strong { font-size: var(--kt-t-2xl); line-height: var(--kt-lh-tight); font-variant-numeric: lining-nums tabular-nums; font-family: inherit; }
.dash-page .kt-log { gap: .5rem; }
.dash-page .kt-log__table { display: grid; margin: 0; }
.dash-page .kt-log__row { display: grid; align-items: center; border-top: 1px solid var(--kt-hair); grid-template-columns: minmax(4.25rem, 2fr) repeat(4, minmax(0, 1fr)); gap: .25rem; padding: .5rem 0; }
.dash-page .kt-log__cell { position: relative; display: grid; place-items: center; align-content: center; gap: 0; height: var(--kt-h); min-width: 0; padding: 0 .25rem; border: 1px solid transparent; border-radius: var(--kt-r-sm); color: var(--kt-soft); font: inherit; cursor: pointer; transition: background 200ms var(--kt-ease), color 200ms var(--kt-ease); background: transparent; border-color: var(--kt-control-line); }
.dash-page .kt-log__cell.is-none { background: none; cursor: default; border-color: transparent; }

/* Learn: text on the page, with no inset reader window or introduction well. */
.dash-page .rd-book { --rd-step: 0; --rd-en: calc(1.0625rem + var(--rd-step) * .125rem); --rd-he: calc(1.5rem + var(--rd-step) * .1875rem); display: grid; padding: 0; gap: .75rem; border-radius: 0; background: transparent; box-shadow: none; }
.dash-page .rd-head { display: grid; gap: .25rem; border-bottom: 1px solid var(--kt-line); text-align: center; padding-bottom: .75rem; }
.dash-page .rd-head__ask { justify-self: center; margin-top: .25rem; font-size: var(--kt-t-sm); }
.dash-page .rd-head__title { line-height: var(--kt-lh-tight); font-family: inherit; font-size: var(--kt-t-xl); }
.dash-page .rd-head__he:empty { display: none; }
.dash-page .rd-intro { border-radius: 0; background: transparent; border-bottom: 1px solid var(--kt-line); }
.dash-page .rd-intro summary { display: flex; align-items: center; justify-content: space-between; cursor: pointer; list-style: none; font-size: var(--kt-t-sm); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--kt-interactive); padding: .5rem 0; border-radius: 0; }
.dash-page .rd-intro p { padding: 0 0 .75rem; }
.dash-page .rd-v { position: relative; display: grid; gap: .5rem; padding: .25rem .5rem .25rem 1.5rem; border-radius: var(--kt-r-sm); scroll-margin-block: 6rem; transition: background 600ms var(--kt-ease); margin-inline: 0; padding-right: 0; }
.dash-page .rd-text.is-prose .rd-v { padding-left: .5rem; padding-inline: 0; }

.dash-page .kt-log__row--head { padding-block: .5rem; border-top: 0; font-weight: 700; text-align: center; color: var(--kt-soft); font-size: var(--kt-t-xs); letter-spacing: 0; text-transform: none; }

/* Keep the reading choices still while notes, dates and timer state change. */
.dash-page .kt-panels { width: 100%; max-width: 72rem; justify-self: center; padding-block: .5rem; }
.dash-page .dash-study { display: grid; gap: 1rem; min-width: 0; align-items: start; }
.dash-page #t-home .dash-preview { max-height: 22rem; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; padding: .75rem 0; border: 0; border-top: 1px solid var(--kt-line); border-radius: 0; background: transparent; }
.dash-page #t-home .dash-preview__head { padding: 0; justify-content: space-between; }
.dash-page #t-home .dash-preview__title { display: block; }
.dash-page .kt-bar__timer { margin-inline-start: auto; }
/* Timer opens in place of its button, inside the bar: nothing floats over the page or tabs. */
.dash-page .kt-timer { min-width: 0; color: var(--kt-on); position: static; flex: none; margin-inline-start: auto; padding: 0; border: 0; background: none; box-shadow: none; }
.dash-page .kt-timer__face { display: grid; place-items: center; width: var(--kt-h-xs); height: var(--kt-h-xs); }
.dash-page .kt-timer__row { display: flex; align-items: center; padding: 0; gap: .125rem; }
.dash-page .kt-awards .kt-awards__dot { position: absolute; top: 8px; right: 8px; width: .625rem; height: .625rem; border-radius: 50%; background: var(--kt-honey); box-shadow: 0 0 0 2px var(--kt-bg, var(--kt-card)); }
.dash-page .kt-awards .kt-awards__dot[hidden] { display: none; }
.dash-page .kt-timer__done:disabled { display: none; }
.dash-page .kt-tab svg { transition: background 150ms, color 150ms; }
.dash-page .kt-tab:active svg,
.dash-page :is(.kt-btn, .kt-icon-btn, .dash-read, .dash-song, .kt-log__cell, .kt-chip, .au__play, .kt-timer__btn, .kt-timer__done):active { transform: none; }
.dash-page :is(.rd-skel, .rd-pop, .kt-toast.is-in, .dash-lesson.is-just) { animation: none; }
@media (min-width: 48rem) {
  .dash-page .dash-study { grid-template-columns: minmax(0, 1.2fr) minmax(0, 1fr); gap: 1.5rem; }
  .dash-page #t-home .dash-lesson__row { min-height: 3.5rem; }
  .dash-page #t-home .dash-preview { border-top: 0; border-left: 1px solid var(--kt-line); padding: 0 0 0 1.5rem; }
}

/* Compact metrics and secondary actions share the navigation's icon language. */
.dash-page .kt-glyph { flex: none; width: var(--kt-i); height: var(--kt-i); fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.dash-page .kt-icon-btn:hover { background: var(--kt-well); }

/* One composer and one-click channel destinations. */

/* A single writing surface and a brief clipboard notification. */

/* Community: one task at a time, with a stable way back. */

/* Learning progress and square milestone artwork. */
.dash-page .milestones { gap: 1rem; }

.dash-page .milestone { min-width: 0; padding: 1rem 0; border-top: 1px solid var(--kt-line); display: grid; align-content: start; gap: .7rem; }
.dash-page .milestone h3 { margin: 0; font-family: var(--font-display); font-size: 1.35rem; line-height: 1.35; overflow-wrap: anywhere; }
.dash-page .milestone p { margin: 0; }
.dash-page .milestone .kt-btn { justify-self: start; white-space: normal; }
.dash-page .milestone progress { width: 100%; height: .6rem; accent-color: var(--kt-interactive); }
.certificate-dialog { box-sizing: border-box; width: min(100% - 1rem, 700px); max-height: 92dvh; padding: 1.25rem; border: 1px solid var(--kt-interactive); border-radius: 12px; background: var(--kt-card); color: var(--kt-ink); overflow: auto; font-family: 'DM Sans', sans-serif; }
.certificate-dialog::backdrop { background: var(--kt-backdrop); }
.certificate-heading { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.certificate-heading h2 { margin: 0; font-size: 1.35rem; }
.certificate-dialog p { line-height: 1.5; }
.certificate-dialog input { box-sizing: border-box; display: block; width: 100%; font: inherit; padding: .7rem; margin-top: .4rem; border: 1px solid var(--kt-control-line); border-radius: 5px; background: var(--kt-card); color: var(--kt-ink); }
.certificate-dialog canvas { display: block; width: min(100%, 460px); height: auto; margin: 1.5rem auto; border-radius: 3px; box-shadow: var(--kt-float); }
.certificate-dialog .kt-btn { min-height: 44px; padding: .6rem .85rem; border: 1px solid var(--kt-ink); border-radius: 5px; background: var(--kt-ink); color: var(--kt-on); font: inherit; cursor: pointer; }
.certificate-dialog .kt-btn:disabled { opacity: .5; cursor: wait; }
.certificate-dialog .kt-fine { font-size: .82rem; }
.certificate-dialog :focus-visible { outline: 3px solid var(--kt-interactive); outline-offset: 3px; }

/* Four horizontal bars, with gaps at curriculum checkpoints. */
.dash-page .milestones { gap: .65rem; }
.dash-page .milestone-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: .15rem; }
.dash-page .curriculum { min-width: 0; display: grid; grid-template-columns: 4.5rem minmax(0, 1fr) max-content; align-items: center; column-gap: .5rem; }
.dash-page .curriculum-heading { display: contents; }
.dash-page .curriculum-heading h3 { grid-column: 1; grid-row: 1; margin: 0; font-family: var(--font-display); font-size: var(--kt-t-md); white-space: nowrap; }
.dash-page .curriculum-heading > span { grid-column: 3; grid-row: 1; color: var(--kt-soft); white-space: nowrap; font-variant-numeric: tabular-nums; }
.dash-page .curriculum-heading > .kt-link { grid-column: 4; grid-row: 1; font-size: var(--kt-t-sm); white-space: nowrap; }
.dash-page .curriculum-bar { grid-column: 2; grid-row: 1; min-width: 0; display: flex; gap: 3px; }
.dash-page .curriculum-checkpoint { position: relative; display: flex; align-items: center; flex-basis: 0; min-width: 0; height: 32px; padding: 0; border: 0; background: transparent; cursor: pointer; }
.dash-page .checkpoint-track { display: block; width: 100%; height: 8px; overflow: hidden; border-radius: 2px; background: var(--kt-well); box-shadow: inset 0 0 0 1px var(--kt-control-line); }
.dash-page .checkpoint-fill { display: block; height: 100%; background: var(--kt-interactive); }
.dash-page .curriculum-checkpoint.is-upcoming .checkpoint-track { background: var(--kt-upcoming); box-shadow: none; }
.dash-page .curriculum-checkpoint.is-earned .checkpoint-fill { background: var(--kt-honey); }
.dash-page .curriculum-checkpoint:hover .checkpoint-track,
.dash-page .curriculum-checkpoint[aria-pressed="true"] .checkpoint-track { outline: 1px solid var(--kt-interactive); outline-offset: 2px; }
.dash-page .checkpoint-detail { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: baseline; gap: .35rem 1rem; font-size: var(--kt-t-sm); color: var(--kt-soft); }
.dash-page .checkpoint-detail[hidden] { display: none; }

/* One destination selector and one primary action. */
.certificate-close { display: grid; place-items: center; flex: none; width: 44px; height: 44px; padding: 0; border: 0; background: transparent; color: var(--kt-ink); font: 1.8rem/1 sans-serif; cursor: pointer; }
.certificate-intro { margin-top: .3rem; color: var(--kt-soft); }
#certificate-action { display: flex; align-items: center; justify-content: center; gap: .5rem; width: 100%; min-height: 52px; font-weight: 700; font-size: 1.05rem; }
.certificate-dialog .kt-ic { width: 1.25rem; height: 1.25rem; flex: none; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
/* Same pill switch as Settings → Appearance. */
.certificate-format { display: flex; margin-top: 1.25rem; padding: .1875rem; border-radius: 999px; background: var(--kt-well); }
.certificate-format button { flex: 1; min-height: 40px; border: 0; border-radius: 999px; background: none; color: var(--kt-soft); font: inherit; font-weight: 600; cursor: pointer; }
.certificate-format button[aria-checked="true"] { background: var(--kt-card); color: var(--kt-ink); box-shadow: var(--kt-lift); }
.certificate-dialog canvas[data-format] { width: auto; max-width: 100%; height: min(54vh, calc((100vw - 4rem) * var(--ratio)), calc(460px * var(--ratio))); --ratio: 1; }
.certificate-dialog canvas[data-format="story"] { --ratio: 1.7778; }
.certificate-more { display: flex; justify-content: center; gap: 1.5rem; margin-top: .5rem; }
.certificate-more .kt-link { display: inline-flex; align-items: center; gap: .375rem; min-height: 44px; padding: 0 .25rem; border: 0; background: none; color: var(--kt-interactive); font: inherit; font-weight: 600; cursor: pointer; }
.certificate-more .kt-ic { width: 1.125rem; height: 1.125rem; }
#certificate-status { white-space: pre-line; font-size: .85rem; }
#certificate-status:empty { display: none; }
@media (max-width: 480px) {
  .certificate-dialog { padding: 1rem; }
}

/* Chat is a persistent app screen, inside the same canvas and navigation. */
.dash-page .club-chat { gap: .75rem; width: 100%; max-width: 56rem; }
.dash-page .club-chat__heading { padding-block: .25rem .75rem; border-bottom: 1px solid var(--kt-line); }
.dash-page .club-chat__heading p { margin: .25rem 0 0; }
.dash-page .club-chat__mount { position: relative; min-width: 0; height: var(--club-chat-height, 65dvh); min-height: 16rem; }
.dash-page .club-chat__status { display: grid; justify-items: start; align-content: center; gap: .75rem; min-height: 16rem; color: var(--kt-soft); }
.dash-page .club-chat__status p { margin: 0; }
chat-widget { display: none !important; }
.dash-page .club-chat__mount > chat-widget { display: block !important; position: relative !important; inset: auto !important; width: 100% !important; height: 100% !important; z-index: 0 !important; }
@media (max-width: 359px) {
  .dash-page .kt-tab { font-size: .6875rem; letter-spacing: 0; }
}
.dash-page .kt-log__cell.is-locked { background: var(--kt-upcoming); color: var(--kt-ink); border-color: transparent; cursor: default; opacity: 1; }
.dash-page .kt-log__cell.is-locked.is-on { background: var(--kt-honey-wash); color: var(--kt-ink); }
.dash-page .dash-check-target { display: grid; place-items: center; width: 2.75rem; min-height: var(--kt-h); cursor: pointer; position: relative; }
.dash-page .dash-check:disabled { opacity: .35; }
.dash-page :is(.dash-read, .dash-lesson__name):disabled { opacity: .5; cursor: default; }

/* Focus must contrast with the actual surface, including dark chrome. */
.dash-page :is(.kt-bar, .au) :focus-visible { outline-color: var(--kt-on-accent); }
.certificate-dialog .kt-btn:hover { background: var(--kt-ink-2); }
::selection { background: var(--kt-wash); color: var(--kt-ink); }

/* Tonight: the next sitting, picked for you. The first thing on Home. */
/* This week: a calm note that drops in from the top, then slides away. */
.dash-page .kt-tonight {
  position: fixed; z-index: 60; top: max(.75rem, env(safe-area-inset-top)); left: 50%;
  width: min(26rem, calc(100% - 2rem)); display: grid; gap: .125rem; padding: .75rem 2.75rem .875rem 1rem;
  border: 1px solid var(--kt-line); border-radius: var(--kt-r); background: var(--kt-card);
  box-shadow: var(--kt-float);
  opacity: 0; transform: translate(-50%, -1rem); transition: opacity 250ms ease, transform 250ms ease;
}
.dash-page .kt-tonight.is-in { opacity: 1; transform: translate(-50%, 0); }
.dash-page .kt-tonight__x {
  position: absolute; top: .25rem; right: .25rem; width: 44px; height: 44px; border: 0; background: none;
  color: var(--kt-soft); font-size: 1.25rem; cursor: pointer;
}
.dash-page .kt-tonight[hidden] { display: none; }
.dash-page .kt-tonight__kicker { margin: 0; font-size: var(--kt-t-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--kt-soft); }
.dash-page .kt-tonight__title { margin: 0; font-family: var(--font-display); font-size: var(--kt-t-lg); line-height: var(--kt-lh-tight); }
.dash-page .kt-tonight__sub { margin: 0; color: var(--kt-soft); font-size: var(--kt-t-sm, .875rem); }
.dash-page .kt-tonight__acts { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1.25rem; margin-top: .5rem; }

/* The count keeps its line even before the first tick, so the first “1 done” doesn't nudge the list. */
.dash-page #week-count:empty { display: inline; }
.dash-page #week-count:empty::before { content: "\200b"; }
.dash-page .kt-next { display: flex; align-items: center; gap: .75rem; height: 3.75rem; margin: 0 0 .5rem; }
.dash-page .kt-next[hidden] { display: none; }
.dash-page .kt-next__text { flex: 1 1 auto; min-width: 0; margin: 0; font-weight: 600; }
.dash-page .kt-next__name { display: block; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.dash-page .kt-next__kicker { display: block; font-size: var(--kt-t-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--kt-soft); }
.dash-page .kt-next__go { flex: none; width: auto; min-width: 7rem; font-weight: 700; }
.dash-page .kt-next__go.is-gone { visibility: hidden; }
.dash-page :is(#tonight-go, #next-go) { border-color: var(--kt-go); background: var(--kt-go); color: var(--kt-on); }
.dash-page :is(#tonight-go, #next-go):hover { border-color: var(--kt-go-hover); background: var(--kt-go-hover); }
.dash-page .kt-tonight__acts [hidden] { display: none; }

/* Welcome: the first open asks one warm question, then gets out of the way. */

/* Milestones always sit in the header: the trophy opens the family's full record. */
.dash-page .kt-bar__keep { min-width: 44px; min-height: 44px; justify-content: center; padding: 0; color: var(--kt-on-soft); }
.dash-page .kt-app[data-view="t-data"] .kt-bar__keep { color: var(--kt-on-accent); }
.dash-page .kt-tonight.is-done { background: var(--kt-honey-wash); }

/* Progress before the first sitting: a promise, not empty meters. */
.dash-page .kt-empty { display: grid; gap: .5rem; justify-items: start; padding-block: 2rem 1rem; }
.dash-page .kt-empty .kt-btn { width: auto; margin-top: .75rem; }

/* Help: two doors, nothing to configure. */
.dash-page .help { gap: .75rem; max-width: 44rem; }
.dash-page .help__head { display: grid; gap: .5rem; padding-block: 1rem .5rem; }
.dash-page .help__head .kt-title { font-family: var(--font-display); font-size: var(--kt-t-2xl); line-height: var(--kt-lh-tight); }
.dash-page .help__door {
  position: relative; display: grid; gap: .25rem; width: 100%; padding: 1rem 3rem 1rem 1rem;
  border: 1px solid var(--kt-line); border-radius: var(--kt-r); background: var(--kt-card); color: var(--kt-ink);
  font: inherit; text-align: start; text-decoration: none; cursor: pointer; transition: background 150ms;
}
.dash-page .help__door:hover { background: var(--kt-well); }
.dash-page #help-club { border-color: var(--kt-ink); background: var(--kt-ink); color: var(--kt-on); }
.dash-page #help-club .help__eyebrow, .dash-page #help-club .kt-text { color: var(--kt-on-accent); }
.dash-page .help__ours { display: grid; gap: .625rem; margin-top: 1.5rem; padding: 1rem; border-radius: var(--kt-r); background: var(--kt-well); }
.dash-page .help__ours > .help__eyebrow { margin: 0; }

.dash-page .help__title { font-size: var(--kt-t-lg); font-weight: 700; line-height: var(--kt-lh); }
.dash-page .help__go { position: absolute; right: 1rem; top: 50%; transform: translateY(-50%); font-size: var(--kt-t-xl); }
.dash-page .help .kt-fine { padding: 0; text-align: start; }

.dash-page .kt-bar__club { align-items: baseline; gap: .125rem .75rem; color: var(--kt-on-soft); font-size: var(--kt-t-sm); flex-wrap: nowrap; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; display: block; }
.dash-page .kt-tonight__acts .kt-btn { font-weight: 700; width: auto; min-width: 8rem; }

/* Help: the guided community flow (restored from the original Community tab). */
.dash-page .community-directory { list-style: none; margin: 0; padding: 0; }
.dash-page .community-directory li { padding-block: .875rem; border-bottom: 1px solid var(--kt-line); }
.dash-page .community-directory li:first-child { padding-top: 0; }
.dash-page .community-directory li:last-child { border-bottom: 0; padding-bottom: 0; }
.dash-page .community-directory p { margin: .125rem 0 0; color: var(--kt-soft); font-size: var(--kt-t-sm); line-height: 1.5; }
.dash-page .community-directory-note { max-width: 48rem; }
.dash-page #support-copy-status:empty { display: none; }

.dash-page .support-library h3 { margin: 0; font-size: var(--kt-t-lg); }
.dash-page .support-search-form { display: flex; align-items: end; flex-wrap: wrap; gap: .5rem; max-width: 48rem; }
.dash-page .support-search-form label { display: grid; flex: 1 1 15rem; gap: .375rem; font-size: var(--kt-t-sm); font-weight: 600; }
.dash-page .support-search-form input { width: 100%; min-width: 0; min-height: var(--kt-h); padding: .625rem; box-sizing: border-box; font: inherit; font-weight: 400; color: var(--kt-ink); background: var(--kt-card); border: 1px solid var(--kt-control-line); border-radius: var(--kt-r-sm); }
.dash-page .support-search-form .kt-btn { width: auto; }
.dash-page .support-search-results { display: grid; gap: 1rem; }
.dash-page .support-result { display: grid; gap: .5rem; padding-top: .75rem; border-top: 1px solid var(--kt-line); }
.dash-page .support-result h4 { margin: 0; font-size: var(--kt-t-md); }
.dash-page .support-result a { color: var(--kt-ink); text-underline-offset: .2em; }
.dash-page .support-result > button { width: auto; justify-self: start; }
.dash-page .support-answer-list { display: grid; gap: 1rem; padding-inline-start: 1rem; border-inline-start: 2px solid var(--kt-line); }
.dash-page .support-answer { display: grid; gap: .5rem; }
.dash-page .support-answer-body { white-space: pre-wrap; overflow-wrap: anywhere; max-height: 28rem; overflow-y: auto; font-size: var(--kt-t-sm); line-height: 1.65; }
.dash-page :is(.support-library) { padding: 0; border: 0; display: block; }
.dash-page :is(.support-library) > summary { min-height: var(--kt-h); display: list-item; align-content: center; cursor: pointer; font-size: var(--kt-t-sm); font-weight: 600; }
.dash-page :is(.support-library)[open] > summary { margin-bottom: .625rem; }
.dash-page .support-library > :not(summary) { margin-bottom: .625rem; }
.dash-page #support-copy { justify-self: start; min-height: var(--kt-h); }
.dash-page .community-channel { display: inline; min-height: var(--kt-h); padding: .25rem 0; font: inherit; font-weight: 600; line-height: 1.5; text-align: start; white-space: normal; overflow-wrap: anywhere; text-decoration: underline; text-underline-offset: .2em; }
.dash-page :is(.support-library) > h3 { margin: 0; font-size: var(--kt-t-lg); }
.dash-page .support-library { padding-block: .75rem 1rem; border-block: 1px solid var(--kt-line); display: grid; gap: .75rem; }
.dash-page .support-library > :not(summary) { margin-bottom: 0; }
.dash-page #support-back { min-height: var(--kt-h); }
.dash-page .community-directory .community-channel { display: inline-block; max-width: 100%; min-height: var(--kt-h); padding: .25rem 0; align-content: center; text-decoration: none; line-height: 1.4; }
.dash-page .community-directory .community-channel:hover { text-decoration: underline; }
.dash-page .community-channel > [aria-hidden] { display: inline; margin-inline-start: .2em; color: var(--kt-soft); font-size: .85em; }

/* Check-in: one question at a few turning points, answered in a tap. */
/* Check-in: reads as a text thread. Grey bubble in from Menachem, her reply out on the right, quick replies as pills. */
.dash-page .kt-checkin { display: grid; gap: .5rem; padding-block: .75rem 1rem; border-bottom: 1px solid var(--kt-line); }
.dash-page .kt-sms__head { display: flex; align-items: center; gap: .5rem; }
.dash-page .kt-sms__avatar { display: grid; place-items: center; flex: none; width: 2rem; height: 2rem; border-radius: 50%; background: var(--kt-interactive); color: var(--kt-on); font-weight: 600; font-size: var(--kt-t-xs); }
.dash-page .kt-sms__who { display: grid; flex: 1; font-weight: 600; font-size: var(--kt-t-sm, .9375rem); color: var(--kt-ink); line-height: 1.2; }
.dash-page .kt-sms__who small { font-weight: 400; font-size: var(--kt-t-xs); color: var(--kt-soft); }
.dash-page .kt-sms__thread { display: flex; flex-direction: column; gap: .25rem; margin: 0; padding: 0; list-style: none; }
.dash-page .kt-sms__time { align-self: center; margin-bottom: .25rem; font-size: var(--kt-t-xs); color: var(--kt-soft); }
.dash-page .kt-sms__in, .dash-page .kt-sms__out { max-width: min(80%, 26rem); padding: .5rem .875rem; border-radius: 1.125rem; font-size: var(--kt-t-md); line-height: 1.4; overflow-wrap: anywhere; animation: kt-pop 260ms cubic-bezier(.3, 1.3, .5, 1) both; }
.dash-page .kt-sms__in { align-self: flex-start; border-bottom-left-radius: .3rem; background: var(--kt-well); color: var(--kt-ink); transform-origin: bottom left; }
.dash-page .kt-sms__out { align-self: flex-end; border-bottom-right-radius: .3rem; background: var(--kt-interactive); color: var(--kt-on); transform-origin: bottom right; }
.dash-page .kt-sms__in + .kt-sms__in { border-top-left-radius: .3rem; }
.dash-page .kt-sms__seen { align-self: flex-end; font-size: var(--kt-t-xs); color: var(--kt-soft); }
.dash-page .kt-sms__typing { display: inline-flex; gap: .25rem; padding: .75rem .875rem; }
.dash-page .kt-sms__typing i { width: .4375rem; height: .4375rem; border-radius: 50%; background: var(--kt-soft); animation: kt-dot 1s infinite ease-in-out; }
.dash-page .kt-sms__typing i:nth-child(2) { animation-delay: .15s; }
.dash-page .kt-sms__typing i:nth-child(3) { animation-delay: .3s; }
.dash-page .kt-sms__replies { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: .375rem; margin-top: .25rem; }
.dash-page .kt-sms__replies > * { min-height: 2.75rem; padding: .375rem 1rem; border: 1px solid var(--kt-interactive); border-radius: 999px; background: transparent; color: var(--kt-interactive); font: inherit; font-size: var(--kt-t-sm, .9375rem); font-weight: 500; text-decoration: none; display: inline-flex; align-items: center; cursor: pointer; }
.dash-page .kt-sms__replies > .is-main { background: var(--kt-interactive); color: var(--kt-on); }
.dash-page .kt-sms__replies > :active { transform: scale(.96); }
.dash-page .kt-bell span { top: .5rem; right: .5rem; min-width: .625rem; height: .625rem; padding: 0; border: 2px solid var(--kt-ink); background: var(--kt-honey); font-size: 0; animation: kt-pop 300ms cubic-bezier(.3, 1.3, .5, 1); }
@keyframes kt-pop { from { opacity: 0; transform: scale(.85); } }
@keyframes kt-dot { 0%, 60%, 100% { opacity: .35; transform: none; } 30% { opacity: 1; transform: translateY(-.1875rem); } }

/* First-run setup: a full-screen, centred two-step sheet over the app. Shown once. */
.dash-page .kt-setup { position: fixed; inset: 0; z-index: 60; display: grid; place-items: center; overflow-y: auto; padding: max(1.5rem, env(safe-area-inset-top)) 1rem max(1.5rem, env(safe-area-inset-bottom)); background: var(--kt-card); }
.dash-page .kt-setup[hidden], .dash-page .kt-setup__step[hidden] { display: none; }
body.kt-setting-up { overflow: hidden; }
.dash-page .kt-setup__step { display: grid; gap: .75rem; width: min(100%, 26rem); }
.dash-page .kt-setup__mark { justify-self: center; width: 72px; height: 72px; margin-bottom: .5rem; }
.dash-page .kt-setup__back { justify-self: start; margin-bottom: .5rem; }
.dash-page .kt-setup__step-n { margin: 0; font-size: var(--kt-t-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--kt-soft); }
.dash-page .kt-setup__title { margin: 0; font-family: var(--font-display); font-size: var(--kt-t-2xl); line-height: var(--kt-lh-tight); }
.dash-page .kt-setup__sub { margin: 0 0 .75rem; color: var(--kt-soft); line-height: 1.5; }
.dash-page .kt-setup__label { margin: .5rem 0 0; font-size: var(--kt-t-sm); font-weight: 700; }
.dash-page .kt-setup__input { box-sizing: border-box; width: 100%; min-height: 48px; padding: 0 .85rem; font-size: 1.0625rem; }
.dash-page .kt-setup__go { width: 100%; min-height: 48px; margin-top: .75rem; font-weight: 700; }
.dash-page .kt-setup__fine { margin: 0; text-align: center; }
.dash-page .kt-setup__how { display: grid; gap: .6rem; margin: 0; padding: 0; list-style: none; counter-reset: how; }
.dash-page .kt-setup__how li { display: flex; gap: .75rem; align-items: center; padding: .75rem .85rem; border: 1px solid var(--kt-line); border-radius: var(--kt-r-sm); font-size: 1.0625rem; line-height: 1.4; counter-increment: how; }
.dash-page .kt-setup__how li::before { content: counter(how); flex: none; display: grid; place-items: center; width: 1.75rem; height: 1.75rem; border-radius: 50%; background: var(--kt-line); font-weight: 700; font-size: var(--kt-t-sm); }
.dash-page .kt-setup__skip { justify-self: center; margin-top: .25rem; }
.dash-page .kt-setup__pick { max-width: 100%; font: inherit; color: inherit; background: transparent; border: 0; border-bottom: 1px solid var(--kt-line); padding: .15rem 0; }
.dash-page .kt-setup__books { display: grid; border: 1px solid var(--kt-line); border-radius: var(--kt-r-sm); overflow: hidden; }
.dash-page .kt-book { display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: 1rem; min-height: 60px; padding: .7rem 1rem; border: 0; border-top: 1px solid var(--kt-line); background: var(--kt-card); color: var(--kt-ink); font: inherit; text-align: start; cursor: pointer; }
.dash-page .kt-book:first-child { border-top: 0; }
.dash-page .kt-book:hover { background: var(--kt-well); }
.dash-page .kt-book__name { font-weight: 700; }
.dash-page .kt-book__note { grid-row: 2; font-size: var(--kt-t-sm); color: var(--kt-soft); }
.dash-page .kt-book__tick { grid-column: 2; grid-row: 1 / span 2; display: grid; place-items: center; width: 24px; height: 24px; border: 1.5px solid var(--kt-control-line); border-radius: 50%; font-size: .8rem; font-weight: 700; }
.dash-page .kt-book[aria-pressed="true"] .kt-book__tick { border-color: var(--kt-ink); background: var(--kt-ink); color: var(--kt-on); }
.dash-page .kt-book:focus-visible { outline: 3px solid var(--kt-interactive); outline-offset: -3px; }
.dash-page #t-data .kt-form .kt-input { box-sizing: border-box; width: 100%; min-height: 44px; padding: 0 .85rem; }

/* ---------- Core · Native patterns (familiar on first use) ---------- */
/* Header: Back chevron (sub-screens) or the logo, then the screen's title over today's context, then at most three icons. */
.dash-page .kt-bar__back { display: grid; place-items: center; flex: none; width: 44px; height: 44px; margin-inline-start: -.5rem; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--kt-on); cursor: pointer; }
.dash-page .kt-bar__back svg { width: 1.5rem; height: 1.5rem; fill: none; stroke: currentColor; stroke-width: 2.25; stroke-linecap: round; stroke-linejoin: round; }
.dash-page .kt-bar__back:not([hidden]) + .kt-bar__mark { display: none; }
.dash-page .kt-bar__title { overflow: hidden; color: var(--kt-on); font-size: var(--kt-t-sm); font-weight: 600; line-height: var(--kt-lh-tight); white-space: nowrap; text-overflow: ellipsis; }
.dash-page .kt-bar__club > * + *:not(:empty)::before, .dash-page #today-club:not(:empty) + #bar-heb:not(:empty)::before { content: " · "; }
.dash-page .kt-bar .kt-timer__x { color: var(--kt-on); }
.dash-page .kt-bar .kt-timer__x:hover { background: var(--kt-on-line); }
.dash-page .kt-timer__done { border: 0; font: inherit; font-weight: 600; cursor: pointer; width: auto; height: var(--kt-h-xs); padding: 0 .75rem; border-radius: 999px; background: var(--kt-on-line); color: var(--kt-on); font-size: var(--kt-t-sm); }

/* Tab bar: the selected tab gets a pill behind a filled icon (Material 3; filled-when-selected as on iOS). The only selected-tab rule. */
.dash-page .kt-tab { position: relative; }
.dash-page .kt-tab[aria-selected="true"] { background: none; color: var(--kt-ink); font-weight: 700; }
.dash-page .kt-tab[aria-selected="true"] svg { padding: .125rem 1.25rem; border-radius: 999px; background: var(--kt-wash); fill: currentColor; stroke-width: 2; }
/* The open book keeps its spine and the chart its bars once filled. */
.dash-page #tab-learn[aria-selected="true"] svg path { stroke: var(--kt-wash); stroke-width: 1.4; fill: currentColor; }
.dash-page #tab-progress[aria-selected="true"] svg { fill: none; stroke-width: 2.6; }
/* Unread badge: on the Community tab and its Message door, never a header icon that comes and goes. */
.dash-page .kt-tab__dot { width: .5rem; height: .5rem; border-radius: 50%; background: var(--kt-interactive); box-shadow: 0 0 0 2px var(--kt-card); }
.dash-page .kt-tab .kt-tab__dot { position: absolute; top: .6rem; left: calc(50% + .75rem); }
.dash-page .help__dot { display: inline-block; vertical-align: middle; box-shadow: none; }
.dash-page .kt-tab__dot[hidden] { display: none; }
/* Screen titles: Home shows today and the parasha; every other screen shows its name instead. */
.dash-page .kt-app:not([data-view="t-home"]) :is(#today-club, #bar-heb, .kt-bar__club) { display: none; }
.dash-page #dash-title:not(.visually-hidden) { font-size: var(--kt-t-lg, 1.125rem); font-weight: 700; }
/* The title never gives way: the child chips scroll instead, and sub-screens (Settings, Chat) drop them like any pushed screen. */
.dash-page .kt-app:not([data-view="t-home"]) .kt-bar__today { flex: 1 0 auto; }
.dash-page .kt-app:is([data-view="t-data"], [data-view="t-chat"]) .kt-bar .kt-kids { display: none; }
.dash-page .kt-app:not([data-view="t-home"]) .kt-bar__mark { display: none; }
.dash-page .kt-app:not([data-view="t-home"]) .kt-bar .kt-kids { -webkit-mask-image: linear-gradient(to right, currentColor calc(100% - 1.5rem), transparent); mask-image: linear-gradient(to right, currentColor calc(100% - 1.5rem), transparent); }
/* Settings: the gear sits in the header on every tab, where mothers look for it first. */
.dash-page .kt-app[data-view="t-chat"] #keep-open { display: none; }
/* The timer belongs to the reader (Start opens it there); the trophy shows only when something is waiting, and always on Progress. */
.dash-page .kt-app:not([data-view="t-learn"]) #timer-open { display: none; }
.dash-page .kt-app:not([data-view="t-progress"]) #awards-open.is-quiet { display: none; }
/* Header targets reach 44px without making the chips look bigger. */
.dash-page .kt-bar__timer { min-height: 44px; min-width: 44px; justify-content: center; }
.dash-page .kt-bar .kt-kids { flex: 0 1 auto; flex-wrap: nowrap; margin-inline-start: auto; min-width: 0; overflow-x: auto; scrollbar-width: none; align-self: stretch; align-items: center; }
.dash-page .kt-bar .kt-chip { flex: none; height: var(--kt-h-xs); padding: 0 .75rem; border-color: var(--kt-on-line); background: transparent; color: var(--kt-on); position: relative; }
.dash-page .kt-bar .kt-chip::after { content: ""; position: absolute; inset: -.375rem 0; }
/* While the timer runs it needs the header's room: the logo and subtitle step aside, the title stays. */
.dash-page .kt-bar:has(.kt-timer:not([hidden])) :is(.kt-bar__mark, .kt-bar__club) { display: none; }

/* The current week's range sits in the header, so the card keeps only its arrows. */
.dash-page #t-home .kt-week.is-now .kt-week__title h2 { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.dash-page #t-home .kt-week.is-now .kt-week__head { justify-content: space-between; }

/* Home's week: ‹ title › together, with Today when browsing another week. */

.dash-page .kt-week__title { flex: 1 1 0; min-width: 0; padding-inline: .25rem; }
.dash-page #week-title { color: var(--kt-ink); font-weight: 700; }
.dash-page .kt-week .kt-today { margin-top: -.5rem; flex: none; justify-self: auto; margin: 0; min-height: 44px; padding: 0 .75rem; border: 1px solid var(--kt-control-line); border-radius: 999px; text-decoration: none; }

/* Lesson rows: checkbox, then the whole row opens its notes; no third button. */
.dash-page .dash-lesson__row { display: grid; align-items: center; gap: .75rem; min-height: 3.75rem; padding: .5rem var(--kt-pad); grid-template-columns: auto minmax(0, 1fr) 2.75rem; }
.dash-page .dash-lesson__row::after { content: ""; }
.dash-page .dash-lesson__row.has-song::after { content: none; }
.dash-page .dash-row-song { display: grid; place-items: center; width: 2.75rem; height: 2.75rem; justify-self: center; padding: 0; border: 0; border-radius: 999px; background: transparent; color: var(--kt-interactive); font-size: 1.125rem; line-height: 1; cursor: pointer; }
.dash-page .dash-row-song:hover { background: var(--kt-well); }
.dash-page .dash-row-song:disabled { opacity: .5; cursor: default; }

/* Progress is read-only: log cells are records, not buttons. */
.dash-page .kt-log__cell, .dash-page .kt-log__cell:hover { border-color: var(--kt-line); cursor: default; }
.dash-page .kt-log__cell:active { transform: none; filter: none; }

/* Learn: text settings behind Aa (Apple Books, Kindle). */
.dash-page .rd-nav { display: flex; align-items: center; gap: .5rem; min-width: 0; flex-wrap: wrap; }
@media (min-width: 40rem) { .dash-page .rd-nav { flex-wrap: nowrap; } }
/* Rashi under its pasuk, smaller and set off by a rule. */
.dash-page .rd-rashi { display: block; margin-top: .5rem; padding-top: .5rem; border-top: 1px solid var(--kt-line); font-size: .85em; color: var(--kt-ink-2); }
.dash-page .rd-rashi__c { display: block; margin-top: .375rem; }
.dash-page .rd-rashi__he { display: block; text-align: right; }
.dash-page .rd-rashi__en { display: block; }
.dash-page .rd-book[data-lang="he"] .rd-rashi__en, .dash-page .rd-book[data-lang="en"] .rd-rashi__he { display: none; }
.dash-page .rd-aa { font-family: var(--font-display); font-size: 1.125rem; font-weight: 700; line-height: 1; }
.dash-page .rd-aa small { font-size: .75em; }

/* Settings: grouped rows with a chevron, like a phone's Settings. */
.dash-page .kt-settings { gap: 1rem; }
.dash-page .kt-rows { gap: 0; padding: 0; overflow: hidden; }
.dash-page .kt-rows > * + * { border-top: 1px solid var(--kt-line); }
.dash-page .kt-row { position: relative; display: flex; align-items: center; gap: .75rem; width: 100%; min-height: 3.5rem; padding: .5rem var(--kt-pad); border: 0; background: none; color: var(--kt-ink); font: inherit; font-size: var(--kt-t-md); font-weight: 600; text-align: start; text-decoration: none; cursor: pointer; }
.dash-page .kt-row:hover { background: var(--kt-well); }
.dash-page .kt-row__main { display: grid; flex: 1; min-width: 0; }
.dash-page .kt-row__main small { color: var(--kt-soft); font-size: var(--kt-t-sm); font-weight: 400; }
.dash-page .kt-row__go { flex: none; color: var(--kt-soft); font-size: var(--kt-t-xl); line-height: 1; }
.dash-page .kt-rows .kt-book { border-radius: 0; }

/* Confirm sheet: Cancel and a destructive Replace. */
.kt-confirm { width: min(100% - 2rem, 400px); }
.kt-confirm h2 { margin: 0 0 .5rem; font-size: var(--kt-t-lg); }
.kt-confirm__acts { display: flex; gap: .75rem; margin-top: 1.25rem; }
.kt-confirm__acts .kt-btn { flex: 1; width: auto; }
.kt-confirm .kt-btn--soft { border-color: var(--kt-control-line); background: var(--kt-card); color: var(--kt-ink); }
.kt-confirm .kt-btn--go { border-color: var(--kt-interactive); background: var(--kt-interactive); color: var(--kt-card); }
.kt-confirm .kt-btn:hover { filter: brightness(.94); }

/* One toast for the whole app: bottom, above the tab bar and player (Material snackbar), with an optional Undo. */
.dash-page .kt-toast { position: fixed; z-index: 6; left: 50%; padding: .5rem 1.25rem; border-radius: 999px; background: var(--kt-ink); color: var(--kt-on); font-size: var(--kt-t-md); font-weight: 600; white-space: nowrap; cursor: pointer; box-shadow: var(--kt-float); transform: translateX(-50%); top: auto; bottom: calc(var(--kt-dock) + var(--kt-over) + .75rem); display: flex; align-items: center; gap: 1rem; max-width: calc(100vw - 2rem); }
.dash-page .kt-toast.is-in { animation: kt-slip 320ms cubic-bezier(.3, 1.4, .5, 1); animation-name: kt-rise; }
@keyframes kt-rise { from { opacity: 0; transform: translate(-50%, .75rem) scale(.96); } }
.dash-page .kt-toast__act { min-height: 2.75rem; margin: -.25rem -.75rem -.25rem 0; padding: 0 .75rem; border: 0; border-radius: 999px; background: transparent; color: var(--kt-on-accent); font: inherit; font-weight: 700; cursor: pointer; }
.dash-page .kt-toast__act:hover { background: var(--kt-on-line); }
@media (min-width: 60rem) { .dash-page .kt-toast { left: calc(50% + 3rem); } }

/* Tap targets: at least 44 × 44 even where the drawn control is smaller. */
.dash-page :is(.kt-bar .kt-chip, .kt-timer__btn, .kt-timer__done, .kt-timer__more summary, .kt-timer__x, .rd-more summary, .dash-say, .rd-seg button, .rd-size button) { position: relative; }
.dash-page :is(.kt-bar .kt-chip, .kt-timer__btn, .kt-timer__done, .kt-timer__more summary, .kt-timer__x, .rd-more summary, .dash-say)::after { content: ""; position: absolute; top: 50%; left: 50%; width: max(100%, 44px); height: max(100%, 44px); transform: translate(-50%, -50%); }
.dash-page :is(.rd-seg button, .rd-size button)::after { content: ""; position: absolute; inset: auto 0; top: 50%; height: max(100%, 44px); transform: translateY(-50%); }

/* Settings → Appearance: a three-way segment. */
.dash-page .kt-theme { display: flex; padding: .25rem; }
.dash-page .kt-theme button { flex: 1; height: var(--kt-h-sm); }

@media (prefers-reduced-motion: reduce) { .dash-page .kt-tonight { transition: none; } }
.dash-page .help__eyebrow { font-size: var(--kt-t-xs); font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--kt-soft); display: inline-flex; align-items: center; gap: .35em; }

/* Home: one save line, then three help rows */
.dash-page .kt-home-save { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .5rem; margin: 1.25rem 0 .75rem; padding: 0 .25rem; font-size: var(--kt-t-sm); color: var(--kt-soft); }
.dash-page .kt-home-save .kt-link { font-weight: 600; }

/* ---------- Core · Desktop: an app frame (dark bar across the top, rail beneath it) around one centred column ---------- */
@media (min-width: 60rem) {
  .dash-page .kt-app { --kt-col: 48rem; --kt-bar-h: calc(env(safe-area-inset-top) + 3.5rem); padding-right: 1.5rem; }
  /* The bar runs edge to edge over the rail: logo above the rail, tools at the far right. */
  .dash-page .kt-bar { margin-inline: -6.75rem -1.5rem; padding-inline: 1.625rem 1.5rem; }
  .dash-page .kt-tabs { top: var(--kt-bar-h); padding-top: 1rem; }
  /* Every tab shares one reading width, so switching tabs never shifts the page. */
  .dash-page .kt-panels { max-width: var(--kt-col); padding-block: 2rem 0; }
  .dash-page :is(.kt-settings, .help, .rd) { width: 100%; max-width: none; justify-self: stretch; }
  /* Home: lesson notes sit beside the list only while open; otherwise the list takes the full column. */
  .dash-page .dash-study:not(:has(> .dash-preview:not([hidden]))) { grid-template-columns: minmax(0, 1fr); }
  .dash-page .dash-study { gap: 2rem; }
  /* Pop-ups centre on the column, below the bar. */
  .dash-page .kt-tonight { top: calc(var(--kt-bar-h) + .75rem); left: calc(50% + 3rem); }
  .dash-page .kt-tab { border-radius: var(--kt-r-sm, .5rem); margin-inline: .375rem; }
  .dash-page .kt-tab:hover { background: var(--kt-well); }
}

/* Move to another device: a QR to show, a camera to scan one. */
.kt-move__qr { display: grid; place-items: center; margin: .5rem auto 1rem; padding: .75rem; width: min(100%, 18rem); background: var(--kt-white); border-radius: var(--kt-r-sm); }
.kt-move__qr svg { width: 100%; height: auto; display: block; }
.kt-move__cam { display: block; width: 100%; max-height: 60vh; aspect-ratio: 1; object-fit: cover; border-radius: var(--kt-r-sm); background: var(--kt-camera); }
#move-dialog .kt-setup__how { display: grid; gap: .5rem; margin: 0 0 .75rem; padding: 0; list-style: none; counter-reset: how; }
#move-dialog .kt-setup__how li { display: flex; gap: .6rem; align-items: center; counter-increment: how; }
#move-dialog .kt-setup__how li::before { content: counter(how); flex: none; display: grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; background: var(--kt-line); font-weight: 700; font-size: var(--kt-t-xs); }

/* Week ribbon: one tight row (‹ parasha · dates  Today ›) over a compact strip of days. */
.dash-page #t-home .kt-week { gap: .25rem; }
.dash-page #t-home .kt-week__head { grid-template-columns: 2.75rem minmax(0, 1fr) 2.75rem; padding-inline: .25rem; display: flex; align-items: center; gap: .25rem; text-align: start; min-height: 2.5rem; }
.dash-page #t-home .kt-week__head .kt-icon-btn { border: 0; border-radius: var(--kt-r-sm); background: transparent; width: 2.75rem; height: 2.75rem; }
.dash-page #t-home .kt-week__title { display: flex; align-items: baseline; gap: .5rem; }
.dash-page #t-home .kt-week__title h2 { font-size: var(--kt-t-md); }
.dash-page #t-home .kt-week__title p { margin: 0; flex: 0 1 auto; }
.dash-page #t-home .kt-week__title p:empty { display: none; }
.dash-page #t-home .kt-week .kt-today { min-height: 2.75rem; padding: 0 .625rem; font-size: var(--kt-t-sm); }
.dash-page #t-home .dash-day { gap: 0; padding: .125rem 0; }
.dash-page #t-home .dash-day__name { letter-spacing: .04em; font-weight: 600; }
.dash-page #t-home .dash-day__num { font-size: 1.0625rem; }

/* ---------- Home · Reminders, moments and the monthly letter ---------- */

.dash-page .kt-streak { margin: 0; font-size: var(--kt-t-sm); font-weight: 700; color: var(--kt-honey); }
.dash-page .kt-streak[hidden] { display: none; }

.dash-page .kt-moment { display: grid; gap: .75rem; border-color: var(--kt-honey); background: var(--kt-honey-wash); animation: kt-moment-rise 420ms var(--kt-ease); }
@keyframes kt-moment-rise { from { opacity: 0; transform: translateY(.5rem); } }
.dash-page .kt-moment[hidden] { display: none; }
.dash-page .kt-moment__moods { display: grid; grid-template-columns: repeat(3, 1fr); gap: .5rem; }
.dash-page .kt-moment__moods button { display: grid; justify-items: center; gap: .25rem; min-height: 64px; padding: .5rem .25rem; border: 1px solid var(--kt-line); border-radius: var(--kt-r-sm); background: var(--kt-card); color: var(--kt-ink); font: inherit; font-size: 1.375rem; cursor: pointer; }
.dash-page .kt-moment__moods span { font-size: var(--kt-t-xs); font-weight: 600; text-align: center; }
.dash-page .kt-moment__moods button[aria-pressed="true"] { border-color: var(--kt-honey); box-shadow: inset 0 0 0 1px var(--kt-honey); }
.dash-page .kt-moment .kt-input { box-sizing: border-box; width: 100%; min-height: 44px; padding: 0 .85rem; }
.dash-page .kt-moment__acts { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem 1rem; }
.dash-page .kt-moment__acts .kt-btn { margin-inline-start: auto; }
.dash-page .kt-moment__acts .kt-btn:disabled { opacity: .45; cursor: default; }

.dash-page .kt-moments[hidden] { display: none; }
.dash-page .kt-moments__list { display: grid; margin: 0; padding: 0; list-style: none; }
.dash-page .kt-moments__item { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: .75rem; padding: .75rem 0; border-top: 1px solid var(--kt-line); }
.dash-page .kt-moments__item:first-child { border-top: 0; }
.dash-page .kt-moments__mood { font-size: 1.25rem; }
.dash-page .kt-moments__txt { display: grid; gap: .125rem; min-width: 0; font-size: var(--kt-t-sm); color: var(--kt-soft); }
.dash-page .kt-moments__txt strong { color: var(--kt-ink); }
.dash-page .kt-moments__img { width: 56px; height: 56px; object-fit: cover; border-radius: var(--kt-r-sm); }

.kt-letter { width: min(100% - 1rem, 440px); }
.kt-letter h2 { margin: .25rem 0 .75rem; font-family: var(--font-display); }
.kt-letter .kt-label { margin: 0; font-size: .75rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--kt-honey); }
.kt-letter__photo { display: block; width: 100%; max-height: 40dvh; object-fit: cover; border-radius: 8px; margin-bottom: .75rem; }
.kt-letter__photo[hidden] { display: none; }
.kt-letter__sign { font-family: var(--font-display); font-style: italic; }

/* A sitting finished: a honey glow rises from the bottom of the screen and fades. */
.kt-glow { position: fixed; inset: 0; z-index: 50; pointer-events: none; opacity: 0; background: radial-gradient(120% 70% at 50% 100%, var(--kt-honey-wash), transparent 70%); }
.kt-glow.is-on { animation: kt-glow 1.6s var(--kt-ease, ease-out); }
@keyframes kt-glow { 0% { opacity: 0; } 25% { opacity: 1; } 100% { opacity: 0; } }
@media (prefers-reduced-motion: reduce) { .kt-glow.is-on, .dash-page .kt-moment { animation: none; } }
.dash-page #t-home .kt-moment { padding: 1rem; border: 1px solid var(--kt-honey-wash); border-radius: var(--kt-r); background: var(--kt-honey-wash); }
.dash-page #t-home .kt-moment .kt-btn { width: auto; }

/* Shabbos mode: one calm banner over everything, in the app's own ink and linen. */
.kt-shabbos { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center; padding: 1.5rem 1rem; background: var(--kt-ink); color: var(--kt-on-accent); text-align: center; font-family: var(--font-body); }
.kt-shabbos[hidden] { display: none; }
.kt-shabbos__in { display: grid; gap: .75rem; max-width: 26rem; }
.kt-shabbos__candles { font-size: 2.75rem; }
.kt-shabbos__title { margin: 0; font-family: var(--font-display); font-size: 2.25rem; }
.kt-shabbos__he { margin: 0; font-family: "Frank Ruhl Libre", serif; font-size: 1.75rem; }
.kt-shabbos__until { margin: .5rem 0 0; font-size: 1.0625rem; line-height: 1.5; opacity: .9; }
body.kt-shabbos-on { overflow: hidden; }

/* ---------- Settings · Lesson night: day toggles like a phone's alarm repeat ---------- */
.kt-cal__days { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0; }
.kt-cal__days button { min-width: 44px; min-height: 44px; padding: 0 .75rem; border: 1px solid var(--kt-line); border-radius: 999px; background: var(--kt-card); color: var(--kt-ink); font: inherit; font-weight: 600; cursor: pointer; }
.kt-cal__days button[aria-pressed="true"] { border-color: var(--kt-ink); background: var(--kt-ink); color: var(--kt-on); }
.kt-cal__label { display: block; margin-bottom: .375rem; font-weight: 600; }
.kt-cal__time { box-sizing: border-box; width: 100%; min-height: 44px; padding: 0 .85rem; font: inherit; }
.kt-cal__cancel { margin-top: .75rem; text-align: center; }
.kt-cal__cancel button { min-height: 44px; padding: 0 1rem; border: 0; background: none; color: var(--kt-soft); font: inherit; font-weight: 600; cursor: pointer; }

/* ---------- Learn · Hand to my child: only the text and its player; the hold-to-exit pill fills while held ---------- */
.dash-page .rd-kid { flex: none; }
.dash-page .kt-app.is-kid :is(.kt-bar, .kt-tabs, .learn-controls, #rd-credit, #support-library, .rd-head__ask) { display: none !important; }
.dash-page .kt-app.is-kid { padding-top: calc(env(safe-area-inset-top) + 4rem); }
.dash-page .kt-kidexit {
  position: fixed; z-index: 6; top: calc(env(safe-area-inset-top) + .75rem); right: .75rem; overflow: hidden;
  display: flex; align-items: center; min-height: 44px; padding: 0 1rem; border: 1px solid var(--kt-line); border-radius: 999px;
  background: var(--kt-card); color: var(--kt-soft); font: inherit; font-size: var(--kt-t-sm); font-weight: 600; cursor: pointer;
  user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; touch-action: none;
}
.dash-page .kt-kidexit[hidden] { display: none; }
.dash-page .kt-kidexit span { position: relative; z-index: 1; }
.dash-page .kt-kidexit i { position: absolute; inset: 0; background: var(--kt-wash); transform: scaleX(0); transform-origin: left; }
.dash-page .kt-kidexit.is-holding i { transform: scaleX(1); transition: transform 1200ms linear; }
.dash-page .kt-kidexit.is-holding { color: var(--kt-ink); }

/* ---------- Community · Common questions: folded answers, like a help centre ---------- */
.dash-page .help__faq { margin-block: 1.5rem; }
.dash-page .kt-faq { border-top: 1px solid var(--kt-line); }
.dash-page .kt-faq:last-child { border-bottom: 1px solid var(--kt-line); }
.dash-page .kt-faq summary { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 44px; padding-block: .75rem; font-weight: 600; cursor: pointer; list-style: none; }
.dash-page .kt-faq summary::-webkit-details-marker { display: none; }
.dash-page .kt-faq summary::after { content: "+"; flex: none; color: var(--kt-soft); font-size: 1.25rem; font-weight: 400; }
.dash-page .kt-faq[open] summary::after { content: "−"; }
.dash-page .kt-faq p { margin: 0 0 1rem; }

/* Icon set: 24px grid, 1.75 stroke, round caps, outline only, currentColor. Icons sit beside a label, never alone in meaning. */
.dash-page .kt-ic, .certificate-close .kt-ic { width: var(--kt-i, 1.5rem); height: var(--kt-i, 1.5rem); flex: none; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.dash-page .kt-ic--in { width: 1em; height: 1em; vertical-align: -.125em; margin-inline: .25em; }
.dash-page .kt-row__ic { flex: none; display: grid; place-items: center; width: 2.25rem; height: 2.25rem; border-radius: 50%; background: var(--kt-well); color: var(--kt-interactive); }
.dash-page .kt-row__ic .kt-ic { width: 1.25rem; height: 1.25rem; }
.dash-page .kt-row__go .kt-ic { width: 1.125rem; height: 1.125rem; }
.dash-page .kt-row:hover .kt-row__go { color: var(--kt-ink); }
.dash-page .help__go .kt-ic { width: 1.25rem; height: 1.25rem; color: var(--kt-soft); }
.dash-page .community-channel > [aria-hidden] .kt-ic { width: .9em; height: .9em; vertical-align: -.1em; }
.dash-page .kt-moment__ic { width: 1.5rem; height: 1.5rem; color: var(--kt-soft); }
.dash-page .kt-moment__moods button[aria-pressed="true"] .kt-moment__ic { color: var(--kt-honey); fill: var(--kt-honey-wash); }
.dash-page .kt-moments__mood .kt-ic { width: 1.25rem; height: 1.25rem; color: var(--kt-honey); }
.dash-page .kt-faq > summary::after { content: ""; flex: none; width: .5rem; height: .5rem; border-right: 1.75px solid var(--kt-soft); border-bottom: 1.75px solid var(--kt-soft); transform: rotate(45deg) translateY(-2px); transition: transform 180ms var(--kt-ease, ease); }
.dash-page .kt-faq[open] > summary::after { transform: rotate(-135deg) translateY(-2px); }
@media (prefers-reduced-motion: reduce) { .dash-page .kt-faq > summary::after { transition: none; } }

/* ---------- Core · Forest backdrop: decorative only, behind every card. Muted sage-to-pine tones stay far from completion honey in strength and never carry meaning. ---------- */
body { margin: 0; padding-top: env(safe-area-inset-top); font: 400 1rem/1.6 var(--font-body); background: var(--kt-bg); }
body::after {
  content: ""; position: fixed; z-index: -2; inset: 0; pointer-events: none;
  background:
    radial-gradient(60rem 30rem at 85% -5%, var(--kt-forest-glow), transparent 70%),
    linear-gradient(to bottom, var(--kt-bg) 0%, var(--kt-forest-mist) 100%);
}
.dash-page { background: transparent; }
/* Cards float softly over the forest: slightly translucent with a gentle blur. */
.dash-page .kt-card { background: color-mix(in srgb, var(--kt-card) 90%, transparent); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
/* The forest itself is drawn by the app from the club's shared count (drawForest); it grows a tree at a time. */
.kt-forest { position: fixed; z-index: -1; inset: 0; width: 100%; height: 100%; max-width: none; pointer-events: none; opacity: var(--kt-forest-o); }
.kt-forest__0 { fill: var(--kt-forest-1); }
.kt-forest__1 { fill: var(--kt-forest-2); }
.kt-forest__2 { fill: var(--kt-forest-3); }
.kt-forest .is-new { transform-box: fill-box; transform-origin: 50% 100%; animation: kt-tree-grow 1.6s var(--kt-ease) both; }
@keyframes kt-tree-grow { from { opacity: 0; transform: scaleY(.1); } }
@media (prefers-reduced-motion: reduce) { .kt-forest .is-new { animation: none; } }
.dash-page .kt-together { margin: 0; font-size: var(--kt-t-sm); font-weight: 600; color: var(--kt-soft); }
.dash-page .kt-together[hidden] { display: none; }
.dash-page .cc-home { display: flex; align-items: center; gap: .5rem; min-height: 2.75rem; padding: 0; border: 0; background: none; color: var(--kt-interactive); font: inherit; font-size: var(--kt-t-sm); font-weight: 600; text-align: left; cursor: pointer; }
.dash-page .cc-home[hidden] { display: none; }
.dash-page .cc-home__faces { display: flex; flex: none; }
.dash-page .cc-home__faces .cc-av + .cc-av { margin-left: -.5rem; }
.dash-page .cc-home__faces .cc-av { box-shadow: 0 0 0 2px var(--kt-card); }

/* The family's own tree, on Home: one leaf per finished lesson. */
.dash-page .kt-sapling { display: flex; align-items: center; gap: .75rem; margin: 0; padding: .5rem 0; }
.dash-page .kt-sapling__art { flex: none; width: 4.5rem; height: 4.5rem; overflow: visible; }
.dash-page .kt-sapling__text { margin: 0; display: flex; flex-direction: column; font-size: var(--kt-t-sm); color: var(--kt-soft); line-height: 1.35; }
.dash-page .kt-sapling__text b { color: var(--kt-ink, inherit); font-weight: 600; }
.kt-sapling__ground { fill: none; stroke: var(--kt-forest-2); stroke-width: 2; stroke-linecap: round; }
.kt-sapling__trunk { fill: none; stroke: var(--kt-forest-3); stroke-width: 3; stroke-linecap: round; }
.kt-sapling__trunk.is-branch { stroke-width: 2; }
.kt-sapling__leaf { fill: var(--kt-forest-3); }
.kt-sapling__leaf.is-seed { fill: var(--kt-honey); }
.kt-sapling__leaf.is-new { fill: var(--kt-honey); transform-box: fill-box; transform-origin: center; animation: kt-leaf 1.6s var(--kt-ease) both; }
/* Seasonal marks on this season's newest leaves (decoration; the season follows the Hebrew calendar). */
.kt-sapling__mark { fill: var(--kt-season-1); }
.kt-sapling__mark.is-t1 { fill: var(--kt-season-2); }
.kt-sapling__mark.is-t2 { fill: var(--kt-season-3); }
.kt-sapling__mark.is-new { transform-box: fill-box; transform-origin: center; animation: kt-leaf 1.6s var(--kt-ease) both; }
.kt-sapling__heart { fill: var(--kt-honey); }
.kt-sapling__crown { fill: none; stroke: var(--kt-forest-3); stroke-width: .9; stroke-linecap: round; }
.kt-sapling__mark.is-harvest { --kt-season-1: var(--kt-season-harvest-1); --kt-season-2: var(--kt-season-harvest-2); --kt-season-3: var(--kt-season-harvest-3); }
.kt-sapling__mark.is-light { --kt-season-1: var(--kt-season-light-1); --kt-season-2: var(--kt-season-light-2); --kt-season-3: var(--kt-season-light-3); }
.kt-sapling__mark.is-blossom { --kt-season-1: var(--kt-season-blossom-1); --kt-season-2: var(--kt-season-blossom-2); --kt-season-3: var(--kt-season-blossom-3); }
.kt-sapling__mark.is-bloom { --kt-season-1: var(--kt-season-bloom-1); --kt-season-2: var(--kt-season-bloom-2); --kt-season-3: var(--kt-season-bloom-3); }
.kt-sapling__mark.is-fruit { --kt-season-1: var(--kt-season-fruit-1); --kt-season-2: var(--kt-season-fruit-2); --kt-season-3: var(--kt-season-fruit-3); }
@keyframes kt-leaf { 0% { transform: scale(0); } 45% { transform: scale(1.5); } 100% { transform: scale(1); } }

/* Rain over the whole screen when a lesson is finished; a downpour when the week is done. */
.kt-rain { position: fixed; inset: 0; z-index: 999; pointer-events: none; overflow: hidden; visibility: hidden; transition: background-color .6s; }
.kt-rain.is-on { visibility: visible; }
.kt-rain.is-on.is-heavy { background-color: color-mix(in srgb, var(--kt-ink) 14%, transparent); }
.kt-rain i { position: absolute; top: -18vh; width: 3px; height: 14vh; border-radius: 3px; background: linear-gradient(to bottom, transparent, color-mix(in srgb, var(--kt-ink) 60%, transparent)); opacity: 0; }
.kt-rain.is-heavy i { width: 3.5px; height: 18vh; }
.kt-rain.is-on i { animation: kt-drop .8s linear both; }
.kt-rain.is-on.is-heavy i { animation-name: kt-pour; }
.kt-bird { position: fixed; top: var(--y, 25vh); left: 0; z-index: 998; width: 3.75rem; pointer-events: none; animation: kt-bird-fly 3.6s cubic-bezier(.45, .05, .55, .95) both; }
.kt-bird.is-back { animation-name: kt-bird-back; }
.kt-bird.is-back svg { transform: scaleX(-1); }
.kt-bird svg { display: block; width: 100%; overflow: visible; }
.kt-bird__body, .kt-bird__tail, .kt-bird__wing { fill: var(--kt-ink-2); }
.kt-bird__breast { fill: var(--kt-honey); }
.kt-bird__beak { fill: var(--kt-honey); }
.kt-bird__eye { fill: var(--kt-card); }
.kt-bird__wing { transform-box: fill-box; transform-origin: 30% 100%; animation: kt-flap .18s ease-in-out infinite alternate; }
@keyframes kt-flap { to { transform: scaleY(-.55); } }
@keyframes kt-bird-fly { 0% { transform: translate(-4rem, 0); } 30% { transform: translate(30vw, -3vh); } 55% { transform: translate(55vw, 1vh); } 80% { transform: translate(82vw, -4vh); } 100% { transform: translate(calc(100vw + 4rem), -9vh); } }
@keyframes kt-bird-back { 0% { transform: translate(calc(100vw + 4rem), 0); } 30% { transform: translate(68vw, -3vh); } 55% { transform: translate(42vw, 1vh); } 80% { transform: translate(16vw, -4vh); } 100% { transform: translate(-4rem, -9vh); } }
@media (prefers-reduced-motion: reduce) { .kt-bird { display: none; } }
@keyframes kt-drop { 0% { transform: translateY(0); opacity: 0; } 10% { opacity: .9; } 90% { opacity: .9; } 100% { transform: translateY(136vh); opacity: 0; } }
@keyframes kt-pour { 0% { transform: translate(0, 0) rotate(12deg); opacity: 0; } 8% { opacity: .9; } 92% { opacity: .9; } 100% { transform: translate(-30vh, 136vh) rotate(12deg); opacity: 0; } }
/* Less motion: the drops stand scattered over the screen and shimmer in place. */
@media (prefers-reduced-motion: reduce) {
  .kt-rain i { top: calc(var(--y, 50) * 1%); height: 4vh; }
  .kt-rain.is-on i, .kt-rain.is-on.is-heavy i { animation-name: kt-shimmer; }
  .kt-sapling__leaf.is-new, .kt-sapling__mark.is-new { animation: none; }
}
@keyframes kt-shimmer { 0%, 100% { opacity: 0; } 50% { opacity: .8; } }

/* ---------- Community · Learning circle chat ---------- */
.dash-page .cc { display: grid; gap: .75rem; margin: 0 0 1.5rem; padding: 0 0 1.5rem; border-bottom: 1px solid var(--kt-line); }
.dash-page .cc .kt-title { margin: 0; }
.dash-page .cc__step { display: grid; gap: .625rem; }
.dash-page .cc__step[hidden] { display: none; }
.dash-page .cc__step > p { margin: 0; }
.dash-page .cc__go { justify-self: start; width: auto; }
.dash-page .cc__lead { font-family: var(--font-display); font-size: var(--kt-t-lg); line-height: var(--kt-lh-tight); color: var(--kt-ink); }
.dash-page .cc__opt { display: flex; align-items: center; gap: .625rem; min-height: 2.75rem; color: var(--kt-ink); }
.dash-page .cc__opt input { width: 1.25rem; height: 1.25rem; margin: 0; accent-color: var(--kt-interactive); }
.dash-page .cc__leave { color: var(--kt-danger); }
/* In a circle, the Community tab is the chat: the outside groups wait behind Circle settings. */
.dash-page #t-help.is-chat .cc { margin: 0; padding: 0; border: 0; }
.dash-page #t-help.is-chat #cc-title { display: none; }
/* The chat fills the screen between the top bar and the tabs: header, thread (its own scroll) and message box. */
.dash-page .cc__chat:not([hidden]) { position: fixed; z-index: 4; top: calc(env(safe-area-inset-top) + 3.5rem); bottom: var(--kt-dock, 0px); left: 0; right: 0; display: flex; flex-direction: column; gap: 0; background: var(--kt-bg); }
@media (min-width: 60rem) { .dash-page .cc__chat:not([hidden]) { left: 6.75rem; } }
.dash-page .cc__chat > * { width: 100%; max-width: 48rem; margin-inline: auto; box-sizing: border-box; }
.dash-page .cc__bar { flex: none; display: flex; align-items: center; gap: .5rem; max-width: none; padding: .375rem .5rem .375rem 1rem; border-bottom: 1px solid var(--kt-line); background: var(--kt-card); }
.dash-page .cc__faces { display: flex; flex: none; }
.dash-page .cc__faces .cc-av + .cc-av { margin-left: -.5rem; }
.dash-page .cc__faces .cc-av { box-shadow: 0 0 0 2px var(--kt-card); }
.dash-page .cc__name { flex: 1 1 auto; min-width: 0; margin: 0; display: grid; line-height: 1.2; }
.dash-page .cc__name b { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: var(--kt-ink); }
.dash-page .cc__name span { color: var(--kt-soft); font-size: var(--kt-t-xs); }
.dash-page .cc__out { position: relative; flex: none; display: inline-flex; align-items: center; gap: .375rem; min-height: 2.75rem; padding: 0 .75rem; border: 1px solid var(--kt-line); border-radius: 999px; background: var(--kt-card); color: var(--kt-ink); font: inherit; font-size: var(--kt-t-xs); font-weight: 600; white-space: nowrap; cursor: pointer; }
.dash-page .cc__out:hover { background: var(--kt-well); }
.dash-page .cc__out .kt-ic { width: 1.125rem; height: 1.125rem; }
.dash-page .cc__out-dot { position: absolute; top: .25rem; right: .25rem; }
@media (max-width: 24rem) { .dash-page .cc__out span { display: none; } .dash-page .cc__out { padding: 0; width: 2.75rem; justify-content: center; } }
.dash-page .cc__hbtn { flex: none; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; padding: 0; border: 0; border-radius: 50%; background: transparent; color: var(--kt-ink); cursor: pointer; }
.dash-page .cc__hbtn:hover { background: var(--kt-well); }
.dash-page .cc__hbtn .kt-ic { width: 1.375rem; height: 1.375rem; }
.dash-page .cc__hbtn circle[r="1.3"] { fill: currentColor; }
/* Side panels (Groups & help, Circle settings): from the right on wide screens, full height; a sheet from the bottom on phones. */
.dash-page .cc-side { box-sizing: border-box; width: min(100%, 30rem); max-width: 100%; height: 100dvh; max-height: 100dvh; margin: 0 0 0 auto; padding: 0; border: 0; border-left: 1px solid var(--kt-line); background: var(--kt-card); color: var(--kt-ink); }
.dash-page .cc-side::backdrop { background: var(--kt-backdrop); }
.dash-page .cc-side[open] { display: flex; flex-direction: column; }
.dash-page .cc-side__head { position: sticky; top: 0; display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: calc(env(safe-area-inset-top) + .5rem) .5rem .5rem 1.25rem; border-bottom: 1px solid var(--kt-line); background: var(--kt-card); }
.dash-page .cc-side__head h2 { margin: 0; font-size: var(--kt-t-lg); }
.dash-page .cc-side__body { display: flex; flex-direction: column; gap: 1.5rem; flex: 1 1 auto; overflow-y: auto; padding: 1.25rem 1.25rem calc(env(safe-area-inset-bottom) + 1.5rem); }
/* Message us and the Club's own group come first in the Groups panel: the quickest way to reach a person. */
.dash-page .cc-side__body > .help__ours { order: -1; margin: 0; }
@media (max-width: 40rem) {
  .dash-page .cc-side { width: 100%; height: 92dvh; margin: auto 0 0; border: 0; border-radius: var(--kt-r) var(--kt-r) 0 0; }
}
.dash-page .cc__set { display: grid; gap: .5rem; padding-bottom: 1.25rem; border-bottom: 1px solid var(--kt-line); }
.dash-page .cc__set:last-child { border-bottom: 0; }
.dash-page .cc__set .kt-label { margin: 0; }
.dash-page .cc__icons { display: grid; grid-template-columns: repeat(auto-fill, minmax(2.75rem, 1fr)); gap: .375rem; }
.dash-page .cc__icon { width: 2.75rem; height: 2.75rem; padding: 0; border: 1px solid var(--kt-line); border-radius: 50%; background: var(--kt-card); font: inherit; font-size: 1.375rem; cursor: pointer; }
.dash-page .cc__icon.is-letter { font-size: var(--kt-t-md); font-weight: 700; color: var(--kt-ink); }
.dash-page .cc__icon[aria-checked="true"] { border: 2px solid var(--kt-interactive); background: var(--kt-wash); }
.dash-page .cc__fams { display: grid; gap: .5rem; margin: 0; padding: 0; list-style: none; }
.dash-page .cc__fam { display: flex; align-items: center; gap: .625rem; color: var(--kt-ink); }
.dash-page .cc__fam > span:not(.cc-av) { flex: 1 1 auto; min-width: 0; }
.dash-page .cc__rm { flex: none; color: var(--kt-danger); font-weight: 500; font-size: var(--kt-t-sm); }
.dash-page .cc__queue { flex: none; display: grid; gap: .5rem; margin: 0 auto; padding: .5rem 1rem 0; list-style: none; }
.dash-page .cc__queue:empty { display: none; }
.dash-page .cc__ask { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem 1rem; padding: .75rem 1rem; border-radius: var(--kt-r); background: var(--kt-wash); }
.dash-page .cc__ask span { flex: 1 1 100%; }
.dash-page .cc__yes { width: auto; }

/* Pictures: a chosen emoji, or the family's initial on its own quiet colour. */
.dash-page .cc-av { flex: none; display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 50%; color: var(--kt-on); font-weight: 700; font-size: var(--kt-t-sm); line-height: 1; user-select: none; }
.dash-page .cc-av.is-small { width: 1.75rem; height: 1.75rem; font-size: var(--kt-t-xs); }
.dash-page .cc-av.is-icon { background: var(--kt-wash); font-size: 1.125rem; }
.dash-page .cc-av.is-small.is-icon { font-size: 1rem; }
.dash-page .cc-av.is-gap { visibility: hidden; }
.dash-page .cc-av.is-c0 { background: var(--kt-av-0); } .dash-page .cc-av.is-c1 { background: var(--kt-av-1); } .dash-page .cc-av.is-c2 { background: var(--kt-av-2); }
.dash-page .cc-av.is-c3 { background: var(--kt-av-3); } .dash-page .cc-av.is-c4 { background: var(--kt-av-4); } .dash-page .cc-av.is-c5 { background: var(--kt-av-5); }

/* The thread. */
.dash-page .cc__scroll { flex: 1 1 auto; min-height: 0; max-width: none; overflow-y: auto; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.dash-page .cc__thread { display: flex; flex-direction: column; gap: 2px; max-width: 48rem; min-height: 100%; margin: 0 auto; padding: .75rem .75rem 1rem; box-sizing: border-box; justify-content: flex-end; list-style: none; }
.dash-page .cc__empty { margin: auto 0; padding: 2rem 1rem; text-align: center; color: var(--kt-soft); }
.dash-page .cc__day { position: sticky; top: .375rem; z-index: 1; align-self: center; margin: .75rem 0 .375rem; padding: .25rem .75rem; border-radius: 999px; background: var(--kt-card); box-shadow: var(--kt-shadow); color: var(--kt-soft); font-size: var(--kt-t-xs); font-weight: 600; }
.dash-page .cc__msg { display: flex; align-items: flex-end; gap: .375rem; }
.dash-page .cc__msg.is-first { margin-top: .5rem; }
.dash-page .cc__msg.has-react { margin-bottom: .875rem; }
.dash-page .cc__msg.is-me { justify-content: flex-end; }
.dash-page .cc__bubble { position: relative; max-width: min(78%, 30rem); min-width: 3.5rem; padding: .375rem .625rem .375rem .75rem; border-radius: 1.125rem; background: var(--kt-card); box-shadow: var(--kt-shadow); color: var(--kt-ink); text-align: left; cursor: default; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; transition: transform 150ms var(--kt-ease); touch-action: pan-y; }
.dash-page .cc__bubble:focus-visible { outline: 2px solid var(--kt-interactive); outline-offset: 2px; }
/* Tails: the last bubble of a run points at its sender. */
.dash-page .cc__msg:not(.is-me).is-last .cc__bubble { border-bottom-left-radius: .25rem; }
.dash-page .cc__msg:not(.is-me):not(.is-first) .cc__bubble { border-top-left-radius: .375rem; }
.dash-page .cc__msg.is-me .cc__bubble { background: var(--kt-interactive); color: var(--kt-on); }
.dash-page .cc__msg.is-me.is-last .cc__bubble { border-bottom-right-radius: .25rem; }
.dash-page .cc__msg.is-me:not(.is-first) .cc__bubble { border-top-right-radius: .375rem; }
.dash-page .cc__msg.is-pending .cc__bubble { opacity: .7; }
.dash-page .is-held .cc__bubble, .dash-page .cc__win.is-held .cc__win-pill { box-shadow: 0 0 0 2px var(--kt-interactive), var(--kt-float); }
.dash-page .cc__from { display: block; margin-bottom: .125rem; font-size: var(--kt-t-sm); color: var(--kt-interactive); }
.dash-page .cc__body { display: block; white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.4; }
/* The time tucks into the bubble's last line, bottom right. */
.dash-page .cc__time { float: right; margin: .375rem 0 -.125rem .625rem; font-size: .6875rem; line-height: 1; opacity: .75; white-space: nowrap; }
.dash-page .cc__quote { display: grid; margin: .125rem 0 .375rem; padding: .25rem .5rem; border-left: 3px solid currentColor; border-radius: .375rem; background: color-mix(in srgb, currentColor 10%, transparent); font-size: var(--kt-t-sm); cursor: pointer; }
.dash-page .cc__quote b { font-size: var(--kt-t-xs); }
.dash-page .cc__quote-text { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; opacity: .9; }
/* One badge for the reactions, on the bubble's bottom corner. */
.dash-page .cc__chips { position: absolute; bottom: -.875rem; right: .5rem; display: inline-flex; align-items: center; gap: .125rem; min-height: 1.625rem; padding: 0 .375rem; border: 2px solid var(--kt-bg); border-radius: 999px; background: var(--kt-card); box-shadow: var(--kt-shadow); color: var(--kt-ink); font: inherit; font-size: .8125rem; line-height: 1; cursor: pointer; }
.dash-page .cc__msg.is-me .cc__chips { right: auto; left: .5rem; }
.dash-page .cc__chips.is-mine { background: var(--kt-wash); }
.dash-page .cc__win { display: flex; justify-content: center; margin: .75rem 0; }
.dash-page .cc__win-pill { position: relative; display: inline-flex; align-items: center; gap: .5rem; max-width: 92%; min-height: 2.5rem; padding: .25rem .875rem .25rem .25rem; border-radius: 999px; background: var(--kt-honey-wash); color: var(--kt-honey); font-size: var(--kt-t-sm); font-weight: 600; cursor: default; user-select: none; -webkit-user-select: none; -webkit-touch-callout: none; }
.dash-page .cc__win-pill:focus-visible { outline: 2px solid var(--kt-interactive); outline-offset: 2px; }
.dash-page .cc__win-pill .cc__chips { right: -.25rem; bottom: -.75rem; }
.dash-page .is-found .cc__bubble, .dash-page .is-found .cc__win-pill { animation: cc-found 1.4s var(--kt-ease); }
@keyframes cc-found { 0%, 40% { box-shadow: 0 0 0 3px var(--kt-interactive); } 100% { box-shadow: 0 0 0 3px transparent; } }
.dash-page .cc__newpill { position: absolute; z-index: 2; left: 50%; bottom: 5.25rem; width: auto; max-width: none; margin: 0; padding: .5rem 1rem; border: 0; border-radius: 999px; background: var(--kt-ink); color: var(--kt-on); box-shadow: var(--kt-float); font: inherit; font-size: var(--kt-t-sm); font-weight: 600; transform: translateX(-50%); cursor: pointer; }
.dash-page .cc__newpill[hidden] { display: none; }

/* The message box. */
.dash-page .cc__dock { flex: none; max-width: none; padding: .5rem .75rem calc(.5rem); border-top: 1px solid var(--kt-line); background: var(--kt-card); }
.dash-page .cc__dock > * { max-width: 46.5rem; margin-inline: auto; }
.dash-page .cc__hint { margin: 0 auto .375rem; text-align: center; color: var(--kt-soft); font-size: var(--kt-t-xs); }
.dash-page .cc__hint[hidden] { display: none; }
.dash-page .cc__replying { display: flex; align-items: center; gap: .5rem; margin: 0 auto .5rem; padding: .375rem .25rem .375rem .75rem; border-left: 3px solid var(--kt-interactive); border-radius: .375rem; background: var(--kt-well); color: var(--kt-soft); font-size: var(--kt-t-sm); }
.dash-page .cc__replying[hidden] { display: none; }
.dash-page .cc__replying span { flex: 1 1 auto; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.dash-page .cc__compose { display: flex; align-items: flex-end; gap: .5rem; }
.dash-page .cc__text { flex: 1 1 auto; min-width: 0; min-height: 2.75rem; max-height: 8.75rem; padding: .625rem 1rem; border-radius: 1.375rem; background: var(--kt-bg); resize: none; font: inherit; line-height: 1.4; }
.dash-page .cc__send { flex: none; display: grid; place-items: center; width: 2.75rem; height: 2.75rem; padding: 0; border: 0; border-radius: 50%; background: var(--kt-interactive); color: var(--kt-on); cursor: pointer; transition: opacity 150ms; }
.dash-page .cc__send svg { width: 1.25rem; height: 1.25rem; fill: currentColor; }
.dash-page .cc__send:disabled { opacity: .35; cursor: default; }
.dash-page .cc__status:empty { display: none; }

/* Hold a message: reactions and actions rise from the bottom, like any chat app. */
.dash-page .cc__sheet { position: fixed; z-index: 70; outline: 100vmax solid var(--kt-backdrop); left: 50%; bottom: calc(var(--kt-dock, 0px) + .75rem); width: min(26rem, calc(100% - 2rem)); display: grid; gap: .25rem; padding: .75rem; border: 1px solid var(--kt-line); border-radius: var(--kt-r); background: var(--kt-card); box-shadow: var(--kt-float); transform: translateX(-50%); }
.dash-page .cc__sheet[hidden] { display: none; }
.dash-page .cc__reacts { display: flex; justify-content: space-between; padding-bottom: .5rem; border-bottom: 1px solid var(--kt-line); }
.dash-page .cc__react { width: 2.75rem; height: 2.75rem; padding: 0; border: 0; border-radius: 50%; background: transparent; font-size: 1.5rem; cursor: pointer; }
.dash-page .cc__react[aria-pressed="true"] { background: var(--kt-wash); }
.dash-page .cc__act { min-height: 2.75rem; padding: 0 .75rem; border: 0; border-radius: var(--kt-r-sm); background: transparent; color: var(--kt-ink); font: inherit; font-weight: 600; text-align: left; cursor: pointer; }
.dash-page .cc__act:hover { background: var(--kt-well); }
.dash-page .cc__act.is-danger { color: var(--kt-danger); }
.dash-page .cc__act--soft { color: var(--kt-soft); }
@media (min-width: 60rem) { .dash-page .cc__sheet { left: calc(50% + 3rem); } }
@media (prefers-reduced-motion: reduce) { .dash-page .is-found .cc__win-pill { animation: none; } }

/* ---------- Learn · Fits the screen ----------
   The tools, the heading, one pasuk and Back/Next fill exactly the space between the top bar and the listen bar;
   the pasuk's stage takes whatever is left. A long pasuk (or Rashi) still grows and the page scrolls, as it should.
   Question on this text opens from the link under the heading, so its fold no longer waits at the bottom. */
.dash-page #t-learn:not([hidden]) { display: flex; flex-direction: column; min-height: calc(100dvh - env(safe-area-inset-top) - 3.5rem - var(--kt-dock) - var(--kt-over) - 2rem); }
.dash-page #t-learn > #rd-book { flex: 1 0 auto; display: flex; flex-direction: column; }
.dash-page #t-learn .rd-text.is-one { flex: 1 0 auto; min-height: 10rem; }
.dash-page #support-library:not([open]) { display: none; }
/* Short phones: the heading gives up its kicker and some air, and the pasuk takes only the room it needs. */
@media (max-height: 760px) {
  .dash-page #t-learn .rd-head { gap: .125rem; padding-bottom: .5rem; }
  .dash-page #t-learn #rd-kicker { display: none; }
  .dash-page #t-learn .rd-text.is-one { min-height: 0; }
  .dash-page #t-learn .rd-text.is-one .rd-v.is-on { padding-block: .5rem; }
  .dash-page #t-learn .rd-text.is-one .rd-v.is-on .rd-v__he { font-size: var(--rd-he); }
  .dash-page #t-learn .rd-foot { padding-top: .5rem; }
}
@media (min-width: 60rem) { .dash-page #t-learn:not([hidden]) { min-height: calc(100dvh - env(safe-area-inset-top) - 3.5rem - var(--kt-over) - 2.75rem); } }

/* ---------- Classic patterns (Oct 2026): to-do rows, labelled child mode, a book-app reader, phone-style settings ---------- */
/* Lesson rows: a round tick on the left, a › on the right that opens the notes. */
.dash-page .dash-check { -webkit-appearance: none; appearance: none; display: grid; place-items: center; width: 1.625rem; height: 1.625rem; border: 2px solid var(--kt-control-line); border-radius: 50%; background: var(--kt-card); transition: background-color .15s, border-color .15s; }
.dash-page .dash-check::after { content: ""; width: .375rem; height: .7rem; margin-top: -.15rem; border: solid transparent; border-width: 0 2.5px 2.5px 0; transform: rotate(45deg); }
.dash-page .dash-check:checked { border-color: var(--kt-honey); background: var(--kt-honey); }
.dash-page .dash-check:checked::after { border-color: var(--kt-on); }
.dash-page #t-home .dash-check { width: 1.625rem; height: 1.625rem; }
.dash-page #t-home .dash-lesson__name::after { width: .5rem; height: .5rem; transform: translateY(-50%) rotate(-45deg); }
.dash-page #t-home .dash-lesson__name[aria-expanded="true"]::after { transform: translateY(-50%) rotate(45deg); }

/* Child mode: a labelled pill, there for every book. */
.dash-page .rd-kid { display: inline-flex; align-items: center; gap: .375rem; height: var(--kt-h-sm); padding: 0 .875rem; border: 1px solid var(--kt-control-line); border-radius: 999px; background: var(--kt-card); color: var(--kt-ink); font: inherit; font-size: var(--kt-t-sm); font-weight: 600; cursor: pointer; }
.dash-page .rd-kid svg { width: 1.125rem; height: 1.125rem; fill: none; stroke: currentColor; stroke-width: 1.75; }
.dash-page .kt-app.is-kid .au { display: grid; }

/* Reader: the place you're at is the toolbar's title (tap to jump), a thin progress line under the page. */
.dash-page .rd-nav { flex-wrap: nowrap; }
.dash-page .rd-where { display: inline-flex; align-items: center; gap: .25rem; min-width: 0; height: var(--kt-h-sm); margin-inline-end: auto; padding: 0 .25rem; border: 0; background: none; color: var(--kt-ink); font: inherit; font-size: var(--kt-t-lg, 1.125rem); font-weight: 700; cursor: pointer; }
.dash-page .rd-where span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dash-page .rd-where svg { flex: none; width: 1.125rem; height: 1.125rem; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; }
.dash-page .rd-where:disabled { cursor: default; }
.dash-page .rd-where:disabled svg { display: none; }
.dash-page .rd-nav .rd-more { margin-left: 0; }
.rd-goto { width: min(28rem, 100%); max-width: 100%; margin: auto auto 0; padding: .5rem 1.25rem calc(1.25rem + env(safe-area-inset-bottom)); border: 0; border-radius: 1rem 1rem 0 0; background: var(--kt-card); color: var(--kt-ink); }

.rd-goto__head { display: flex; align-items: center; justify-content: space-between; min-height: 3rem; margin: 0; }
.rd-goto__head h2 { margin: 0; font-size: 1.0625rem; }
.rd-goto__head button { min-height: 44px; border: 0; background: none; font: inherit; font-weight: 700; color: var(--kt-interactive); cursor: pointer; }
.rd-goto__row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; min-height: 3.25rem; border-top: 1px solid var(--kt-line); font-weight: 600; }
.rd-goto__row[hidden] { display: none; }
.dash-page .rd-goto .rd-select, .rd-goto .rd-select { flex: none; width: 10rem; max-width: 60%; }
.dash-page .rd-progress { height: 3px; margin-top: 1rem; border-radius: 3px; background: var(--kt-line); overflow: hidden; }
.dash-page .rd-progress i { display: block; height: 100%; background: var(--kt-interactive); transform: scaleX(0); transform-origin: left; transition: transform .25s var(--kt-ease); }
.dash-page .rd-progress + .rd-foot { border-top: 0; }
.dash-page .au { background: var(--kt-ink); opacity: 1; }

/* Settings: books as on/off switches, notes as small grey footnotes under their group. */
.dash-page .kt-book__tick { width: 2.75rem; height: 1.625rem; border: 0; border-radius: 999px; background: var(--kt-control-line); font-size: 0; position: relative; transition: background-color .2s; }
.dash-page .kt-book__tick::after { content: ""; position: absolute; top: 3px; left: 3px; width: 1.25rem; height: 1.25rem; border-radius: 50%; background: var(--kt-card); box-shadow: var(--kt-float); transition: transform .2s var(--kt-ease); }
.dash-page .kt-book[aria-pressed="true"] .kt-book__tick { background: var(--kt-interactive); border: 0; }
.dash-page .kt-book[aria-pressed="true"] .kt-book__tick::after { transform: translateX(1.125rem); }
.dash-page .kt-settings .kt-out, .dash-page .kt-settings .kt-hint { padding: .5rem 0 0; background: none; font-size: var(--kt-t-xs, .8125rem); line-height: 1.45; color: var(--kt-soft); }
.rd-goto::backdrop { background: var(--kt-backdrop); }

/* ---------- Clean canvas (Oct 2026): one flat background, solid cards, no scenery behind text. The family's own tree stays on Home. ---------- */
body::after { background: var(--kt-bg); }
.kt-forest { display: none; }
.dash-page .kt-card { background: var(--kt-card); -webkit-backdrop-filter: none; backdrop-filter: none; }
/* One primary button style app-wide: the green of Start. */
.dash-page .kt-btn:not(.kt-btn--soft) { border-color: var(--kt-go); background: var(--kt-go); color: var(--kt-on); }
.dash-page .kt-btn:not(.kt-btn--soft):hover { border-color: var(--kt-go-hover); background: var(--kt-go-hover); }
/* Community: the open-outside icon sits at the end of the group's name, not on a line of its own. */
.dash-page .community-directory .community-channel { display: flex; width: 100%; align-items: center; justify-content: space-between; gap: .75rem; }
.dash-page .community-directory .community-channel > span[aria-hidden] { display: flex; flex: none; }
.dash-page .community-directory .community-channel > span[aria-hidden] .kt-ic { width: 1.1rem; height: 1.1rem; }

/* Reader: a calm book page. One narrow column, quiet chrome, serif type, generous margins. */
.dash-page #t-learn { --rd-serif: "Iowan Old Style", "Charter", "Palatino Linotype", Georgia, serif; }
.dash-page #t-learn > #rd-book { width: 100%; max-width: 36rem; margin-inline: auto; gap: 1.5rem; }
.dash-page #t-learn .learn-controls { max-width: 36rem; width: 100%; margin-inline: auto; opacity: .72; transition: opacity 200ms var(--kt-ease); }
.dash-page #t-learn .learn-controls:is(:hover, :focus-within) { opacity: 1; }
.dash-page #t-learn .rd-head { gap: .375rem; padding: 1.5rem 0 1.25rem; border-bottom: 0; }
.dash-page #t-learn .rd-head::after { content: ""; justify-self: center; width: 2.5rem; height: 1px; margin-top: 1rem; background: var(--kt-line); }
.dash-page #t-learn .rd-head__book { color: var(--kt-soft); font-weight: 600; letter-spacing: .16em; }
.dash-page #t-learn .rd-head__title { font-family: var(--font-display); font-weight: 500; font-size: var(--kt-t-2xl, 1.75rem); letter-spacing: -.01em; }
.dash-page #t-learn .rd-head > .rd-head__ask { display: none; }
.dash-page #t-learn .rd-intro { border-bottom: 0; }
.dash-page #t-learn .rd-intro summary { justify-content: center; gap: .5rem; color: var(--kt-soft); font-weight: 600; }
.dash-page #t-learn .rd-v__en { font-family: var(--rd-serif); color: var(--kt-ink); }
.dash-page #t-learn .rd-v.is-at, .dash-page #t-learn .rd-text.is-one .rd-v.is-on { background: transparent; }
.dash-page #t-learn .rd-text.is-one .rd-v.is-on { gap: 1rem; }
.dash-page #t-learn .rd-v__n { color: var(--kt-soft); font-weight: 500; }
.dash-page #t-learn .rd-progress { height: 2px; margin-top: 1.5rem; background: var(--kt-hair, var(--kt-line)); }
.dash-page #t-learn .rd-progress i { background: var(--kt-soft); }
.dash-page #t-learn .rd-foot { padding-top: .75rem; }
.dash-page #t-learn .rd-foot .kt-icon-btn { border-color: transparent; background: transparent; color: var(--kt-soft); }
.dash-page #t-learn .rd-count { font-size: var(--kt-t-xs); letter-spacing: .06em; }
.dash-page #t-learn #rd-credit { max-width: 36rem; margin-inline: auto; text-align: center; opacity: .6; }
/* The opening page: the lesson's verse and question, then Begin. The text waits behind it. */
.dash-page .rd-book.is-opening :is(.rd-intro, .rd-text, .rd-progress, .rd-foot) { display: none !important; }
.dash-page .rd-book.is-opening ~ #rd-credit { visibility: hidden; }
.dash-page .rd-open { flex: 1 0 auto; display: grid; align-content: center; animation: rd-in 320ms var(--kt-ease); }
.dash-page .rd-open[hidden] { display: none; }
.dash-page .rd-open .dash-note { gap: 1.125rem; margin: 0; padding: 0 0 2rem; background: transparent; border-radius: 0; font-family: var(--rd-serif); font-size: var(--rd-en); line-height: var(--kt-lh-read); color: var(--kt-ink); text-align: center; }
.dash-page .rd-open .dash-note__he { font-family: inherit; font-size: var(--rd-he); }
.dash-page .rd-open .dash-note__en { color: var(--kt-ink-2); }
.dash-page .rd-open .dash-note__ask { padding: 1rem 0 0; border-top: 1px solid var(--kt-line); }
.dash-page .rd-open .dash-note__reveal { justify-self: center; font-family: inherit; }
.dash-page .rd-open .dash-note__acts { flex-direction: column; align-items: center; gap: .75rem; padding-top: 1rem; }
.dash-page .rd-open .rd-open__go { min-width: 12rem; }
.dash-page .rd-open .dash-song { order: 3; }
@media (prefers-reduced-motion: reduce) { .dash-page .rd-open { animation: none; } }
.dash-page:has(.rd-book.is-opening) .au:not(.is-playing) { display: none; }