:root {
  --cosmos-950: #0c1117;
  --cosmos-900: #111923;
  --cosmos-850: #17212d;
  --paper-50: #f7f8f8;
  --ink-900: #17202a;
  --cobalt-500: #3f7bd9;
  --cobalt-400: #5d91e2;
  --silver-400: #aab3c0;
  --x-gold: #b89645;
  --wechat-green: #54b66a;
  --mobile-nav-height: 68px;
  --content-max: 1560px;
}

html[data-theme="moon"] { color-scheme: dark; }
html[data-theme="chat"],html[data-theme="ipod"] { color-scheme: light; }

.workbench-auth { display:flex; align-items:center; gap:7px; min-height:44px; }
.workbench-auth > button {
  min-height:40px; border:1px solid var(--line); border-radius:999px; color:var(--text);
  background:var(--surface-control); padding:8px 13px; cursor:pointer;
}
.workbench-auth-state { display:inline-flex; align-items:center; gap:6px; color:var(--muted); font-size:11px; white-space:nowrap; }
.workbench-auth-state i { width:7px; height:7px; border-radius:50%; background:var(--sage); }
.workbench-auth-dialog {
  width:min(410px,calc(100vw - 28px)); max-height:min(88dvh,650px); overflow:auto;
  overscroll-behavior:contain; border:1px solid var(--line); border-radius:20px; color:var(--text);
  background:var(--panel-strong); box-shadow:0 28px 90px rgba(0,0,0,.38); padding:0;
}
.workbench-auth-dialog::backdrop { background:rgba(4,7,11,.64); backdrop-filter:blur(5px); }
.workbench-auth-dialog form { display:grid; gap:15px; padding:22px; }
.workbench-auth-dialog header { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; }
.workbench-auth-dialog header span { color:var(--gold); font:800 9px/1 var(--font-latin); letter-spacing:.16em; }
.workbench-auth-dialog h2 { margin:7px 0 0; font-size:25px; font-weight:600; }
.workbench-auth-dialog header button { width:44px; border:1px solid var(--line); border-radius:50%; color:var(--muted); background:var(--surface-control); font-size:20px; }
.workbench-auth-dialog label { display:grid; gap:7px; color:var(--muted); font-size:11px; }
.workbench-auth-dialog input { width:100%; min-height:46px; border:1px solid var(--line); border-radius:11px; color:var(--text); background:var(--surface-control); padding:10px 12px; }
.workbench-auth-dialog [data-auth-error] { min-height:20px; margin:0; color:var(--rose); font-size:12px; }
.workbench-auth-dialog footer { display:flex; justify-content:flex-end; gap:8px; }
.workbench-auth-dialog footer button { min-height:42px; border:1px solid var(--line); border-radius:999px; color:var(--text); background:var(--surface-control); padding:8px 16px; }
.workbench-auth-dialog footer button[type="submit"] { color:var(--accent-ink); border-color:var(--gold); background:var(--gold); }

@media(max-width:560px) {
  .workbench-auth-state { display:none; }
  .workbench-auth > button { padding-inline:11px; }
}

body {
  background-attachment: fixed;
}

button,
input,
select,
textarea,
a {
  min-height: 44px;
  touch-action: manipulation;
}

textarea:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 3px;
}

textarea {
  resize: vertical;
}

.brand-mark-logo {
  position: relative;
  overflow: hidden;
  border-color: color-mix(in srgb,var(--text) 18%,var(--line));
  border-radius: 11px;
  background: var(--surface-control);
  box-shadow: none;
  isolation: isolate;
}

.brand-mark-logo img {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 92px;
  max-width: none;
  height: 92px;
  object-fit: contain;
  transform: translate(-43%,-25%);
  filter: none;
}

html[data-theme="moon"] .brand-mark-logo { border-color: rgba(229,236,243,.2); background: #111820; }
html[data-theme="chat"] .brand-mark-logo { border-color: rgba(44,68,83,.18); background: #eef3f5; }

.moon-stage {
  position: absolute;
  inset: 0;
  display: none;
  overflow: hidden;
  border-radius: 16px;
  background:
    radial-gradient(circle at 22% 24%, rgba(255,255,255,.9) 0 1px, transparent 2px),
    radial-gradient(circle at 79% 33%, rgba(255,255,255,.55) 0 1px, transparent 2px),
    linear-gradient(145deg, #080c12, #121a24);
}

.moon-sphere {
  position: absolute;
  top: 30px;
  left: 50%;
  width: 72px;
  height: 72px;
  border-radius: 50%;
  transform: translateX(-50%);
  background:
    radial-gradient(circle at 38% 30%, rgba(255,255,255,.4) 0 4px, transparent 5px),
    radial-gradient(circle at 60% 58%, rgba(70,77,86,.22) 0 7px, transparent 8px),
    linear-gradient(135deg, #fff, #bac2ca);
  box-shadow: 0 0 28px rgba(235,242,250,.32);
}

.orbit {
  position: absolute;
  left: 50%;
  top: 62px;
  width: 148px;
  height: 58px;
  border: 1px solid rgba(227,235,244,.38);
  border-radius: 50%;
  transform: translate(-50%,-50%) rotate(-12deg);
}

.orbit-two {
  width: 122px;
  transform: translate(-50%,-50%) rotate(27deg);
  opacity: .46;
}

.star {
  position: absolute;
  color: #f4f7fb;
}

.star-one { left: 22px; top: 21px; }
.star-two { right: 29px; top: 70px; font-size: 24px; }
.star-three { left: 34px; bottom: 24px; }

html[data-theme="moon"] .moon-stage { display: block; }
html[data-theme="moon"] .vinyl-stage,
html[data-theme="moon"] .ipod-player,
html[data-theme="moon"] .sidebar-chat-preview { display: none; }

.sidebar-quick-add {
  display: grid;
  grid-template-columns: 20px minmax(0,1fr) auto;
  align-items: center;
  gap: 10px;
  width: 100%;
  min-height: 44px;
  margin: 2px 0 7px;
  border: 1px solid color-mix(in srgb,var(--gold) 30%,transparent);
  border-radius: 12px;
  color: var(--text);
  background: var(--accent-soft);
  padding: 8px 10px;
  text-align: left;
  cursor: pointer;
}

.sidebar-quick-add kbd {
  border: 1px solid var(--line);
  border-radius: 6px;
  color: var(--muted);
  background: var(--surface-control);
  padding: 2px 6px;
  font-family: var(--font-latin);
  font-size: 10px;
}

.hero {
  position: relative;
}

html[data-momo="off"] .momo-codex-bubble,
html[data-momo="off"] .profile-identity-card img { display: none !important; }

.mobile-bottom-nav { display: none; }

/* All screen sizes use one explicit workspace view. */
body.workspace-routed [data-view-section] { display: none !important; }
body.workspace-routed[data-active-view="overview"] #overview { display: grid !important; }
body.workspace-routed[data-active-view="overview"] #captureRow { display: flex !important; }
body.workspace-routed[data-active-view="overview"] #dailyPulse { display: block !important; }
body.workspace-routed[data-active-view="overview"] #overviewStrips { display: grid !important; }
body.workspace-routed[data-active-view="overview"] #todayLine { display: block !important; }
body.workspace-routed[data-active-view="overview"] #todayDashboard { display: grid !important; }
body.workspace-routed[data-active-view="overview"] #health { display: none !important; }
body.workspace-routed[data-active-view="movement"] [data-view-section="movement"],
body.workspace-routed[data-active-view="workout"] [data-view-section="workout"],
body.workspace-routed[data-active-view="calendar"] [data-view-section="calendar"],
body.workspace-routed[data-active-view="course"] [data-view-section="course"],
body.workspace-routed[data-active-view="library"] [data-view-section="library"],
body.workspace-routed[data-active-view="insights"] [data-view-section="insights"],
body.workspace-routed[data-active-view="daily-review"] [data-view-section="daily-review"],
body.workspace-routed[data-active-view="weekly-review"] [data-view-section="weekly-review"],
body.workspace-routed[data-active-view="monthly-review"] [data-view-section="monthly-review"],
body.workspace-routed[data-active-view="profile"] [data-view-section="profile"],
body.workspace-routed[data-active-view="layout"] [data-view-section="layout"],
body.workspace-routed[data-active-view="customize"] [data-view-section="customize"],
body.workspace-routed[data-active-view="settings"] [data-view-section="settings"] { display: block !important; }

body.workspace-routed[data-active-view="tasks"] #todayDashboard,
body.workspace-routed[data-active-view="health"] #todayDashboard,
body.workspace-routed[data-active-view="learning"] #todayDashboard { display: block !important; }
body.workspace-routed[data-active-view="tasks"] #todayDashboard > .stack:first-child { display: block; }
body.workspace-routed[data-active-view="tasks"] #todayTasks { display: block; }
body.workspace-routed[data-active-view="tasks"] #health,
body.workspace-routed[data-active-view="tasks"] #todayDashboard > .stack:last-child { display: none; }
body.workspace-routed[data-active-view="health"] #todayDashboard > .stack:first-child { display: block; }
body.workspace-routed[data-active-view="health"] #todayTasks,
body.workspace-routed[data-active-view="health"] #todayDashboard > .stack:last-child { display: none; }
body.workspace-routed[data-active-view="health"] #health { display: block; }
body.workspace-routed[data-active-view="learning"] #todayDashboard > .stack:first-child { display: none; }
body.workspace-routed[data-active-view="learning"] #todayDashboard > .stack:last-child { display: grid; max-width: 840px; }
body.workspace-routed[data-active-view="learning"] #frenchLearning,
body.workspace-routed[data-active-view="learning"] .connection-card { display: block; }
body.workspace-routed[data-active-view="learning"] #weeklyHealth { display: none; }

body.workspace-routed[data-active-view="overview"] .dashboard-hidden { display: none !important; }
body.hide-health-summary[data-active-view="overview"] #weeklyHealth,
body.hide-health-summary[data-active-view="overview"] .health-summary-hidden { display: none !important; }

.task-head-actions { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.task-head-actions .resource-ghost { white-space: nowrap; }

.v2-page-heading {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  margin: 4px 2px 20px;
  padding-bottom: 18px;
  border-bottom: 1px solid var(--line);
}

.v2-page-heading h2 {
  margin: 5px 0 7px;
  font-size: clamp(30px,4vw,48px);
  line-height: 1.04;
}

.v2-page-heading p {
  max-width: 720px;
  margin: 0;
  color: var(--muted);
  line-height: 1.65;
}

.v2-date-chip {
  flex: 0 0 auto;
  border: 1px solid var(--line);
  border-radius: 999px;
  color: var(--muted);
  background: var(--surface-soft);
  padding: 9px 13px;
  font-variant-numeric: tabular-nums;
  font-size: 12px;
}

.review-layout,
.layout-editor-grid,
.settings-grid {
  display: grid;
  grid-template-columns: minmax(300px,.72fr) minmax(0,1.28fr);
  gap: 18px;
  align-items: start;
}

.review-summary-card {
  position: sticky;
  top: 92px;
}

.review-period-card { margin-bottom: 18px; }
.review-period-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 16px; }
.review-period-head span { color: var(--gold); font-family: var(--font-latin); font-size: 9px; font-weight: 800; letter-spacing: .15em; }
.review-period-head h2 { margin: 4px 0 0; font-size: 21px; text-wrap: balance; }
.review-period-head small { color: var(--muted); font-size: 10px; }

.review-day-timeline { position: relative; list-style: none; display: grid; gap: 0; margin: 0; padding: 2px 0; }
.review-day-timeline::before { content: ""; position: absolute; left: 8px; top: 14px; bottom: 14px; width: 1px; background: var(--line); }
.review-timeline-item { position: relative; display: grid; grid-template-columns: 17px 72px minmax(0,1fr); align-items: start; gap: 10px; min-width: 0; padding: 10px 0; }
.review-timeline-item > i { position: relative; z-index: 1; width: 9px; height: 9px; margin-top: 4px; border: 2px solid var(--panel); border-radius: 50%; background: var(--muted); box-shadow: 0 0 0 1px var(--line); }
.review-timeline-item.is-done > i { background: var(--sage); }
.review-timeline-item > span { color: var(--muted); font-family: var(--font-latin); font-size: 9px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.review-timeline-item > div { min-width: 0; }
.review-timeline-item strong, .review-timeline-item small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.review-timeline-item strong { font-size: 13px; }
.review-timeline-item small { margin-top: 4px; color: var(--muted); font-size: 10px; }
.review-timeline-empty { color: var(--muted); padding: 18px 4px; font-size: 12px; }

.review-calendar { display: grid; grid-template-columns: repeat(7,minmax(0,1fr)); gap: 5px; }
.review-calendar-weekday { color: var(--muted); padding: 0 4px 4px; text-align: center; font-size: 9px; font-weight: 700; }
.review-calendar-day { min-width: 0; min-height: 104px; overflow: hidden; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); padding: 7px; }
.review-calendar-day.filler { visibility: hidden; }
.review-calendar-day.has-record { background: color-mix(in srgb,var(--gold) 6%,var(--surface-soft)); }
.review-calendar-day.is-today { border-color: color-mix(in srgb,var(--gold) 58%,var(--line)); box-shadow: inset 0 0 0 1px color-mix(in srgb,var(--gold) 24%,transparent); }
.review-calendar-day.is-future { opacity: .48; }
.review-calendar-day-head { display: flex; align-items: baseline; justify-content: space-between; gap: 4px; }
.review-calendar-day-head time { font-family: var(--font-latin); font-size: 10px; font-weight: 800; font-variant-numeric: tabular-nums; }
.review-calendar-day-head span { color: var(--gold); font-size: 8px; }
.review-calendar-chips { display: grid; gap: 3px; margin-top: 7px; }
.review-calendar-chips span { overflow: hidden; border-radius: 5px; color: var(--text); background: var(--panel); padding: 4px 5px; font-size: 8px; line-height: 1.25; text-overflow: ellipsis; white-space: nowrap; }
.review-calendar-chips span.movement { border-left: 2px solid var(--sage); }
.review-calendar-chips small { color: color-mix(in srgb,var(--muted) 70%,transparent); font-size: 8px; }
.review-month-calendar .review-calendar-day { min-height: 86px; }
.review-month-picker { display: grid; gap: 6px; flex: 0 0 auto; color: var(--muted); font-size: 10px; }
.review-month-picker input { border: 1px solid var(--line); border-radius: 11px; color: var(--text); background: var(--surface-control); padding: 9px 11px; font: inherit; font-size: 12px; }
.review-month-picker input:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; }

.review-metrics {
  display: grid;
  grid-template-columns: repeat(2,minmax(0,1fr));
  gap: 9px;
  margin: 18px 0;
}

.review-metric {
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-control);
  padding: 13px;
}

.review-metric strong { display: block; font-size: 22px; font-variant-numeric: tabular-nums; }
.review-metric span { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; }

.v2-insight {
  position: relative;
  margin: 0;
  border-radius: 17px 17px 17px 6px;
  color: var(--text);
  background: var(--accent-soft);
  padding: 14px 15px;
  line-height: 1.7;
}

.v2-insight::after {
  content: "";
  position: absolute;
  left: -7px;
  bottom: 0;
  width: 13px;
  height: 13px;
  clip-path: polygon(100% 0,100% 100%,0 100%);
  background: inherit;
}

.review-form,
.profile-form {
  display: grid;
  gap: 16px;
}

.review-form label,
.profile-form label,
.v2-field {
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-size: 12px;
}

.review-form input,
.review-form textarea,
.profile-form input,
.profile-form select,
.v2-field select {
  width: 100%;
  border: 1px solid var(--line);
  border-radius: 13px;
  color: var(--text);
  background: var(--surface-control);
  padding: 12px 13px;
}

.v2-form-actions {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}

.v2-form-status { color: var(--muted); font-size: 12px; }

.profile-grid {
  display: grid;
  grid-template-columns: minmax(280px,.72fr) minmax(0,1.28fr);
  gap: 18px;
}

.profile-identity-card {
  display: grid;
  grid-template-columns: 118px minmax(0,1fr);
  align-items: center;
  gap: 18px;
}

.profile-identity-card img {
  width: 118px;
  height: 118px;
  border-radius: 22px;
  object-fit: contain;
  background: transparent;
  filter: drop-shadow(0 12px 18px rgba(0,0,0,.2));
  object-position: 52% 28%;
  background: var(--cosmos-950);
}

.profile-identity-card h2 { margin: 6px 0; font-size: 30px; }
.profile-identity-card p { margin: 0; color: var(--muted); line-height: 1.55; }

.profile-menu,
.connection-hub { align-self: stretch; }
.profile-menu { display: grid; padding: 8px; }
.profile-menu button {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 3px 12px;
  align-items: center;
  border: 0;
  border-bottom: 1px solid var(--line);
  color: var(--text);
  background: transparent;
  padding: 13px 12px;
  text-align: left;
  cursor: pointer;
}
.profile-menu button:last-child { border-bottom: 0; }
.profile-menu small { grid-column: 1; color: var(--muted); }
.profile-menu i { grid-column: 2; grid-row: 1 / span 2; color: var(--gold); font-style: normal; }

.connection-buttons { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 16px; }
.connection-buttons a,
.connection-buttons button {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border: 1px solid var(--line);
  border-radius: 13px;
  color: var(--text);
  background: var(--surface-control);
  padding: 12px 13px;
  text-decoration: none;
  cursor: pointer;
}
.connection-buttons span { color: var(--muted); font-size: 11px; }

.module-editor { display: grid; gap: 8px; }
.module-row {
  display: grid;
  grid-template-columns: auto minmax(0,1fr) auto auto;
  align-items: center;
  gap: 10px;
  min-height: 58px;
  border: 1px solid var(--line);
  border-radius: 14px;
  background: var(--surface-control);
  padding: 9px 10px;
}
.module-row .drag-mark { color: var(--muted); font-family: var(--font-latin); letter-spacing: -2px; }
.module-row strong { display: block; }
.module-row small { display: block; margin-top: 2px; color: var(--muted); }
.module-row button { min-width: 44px; border: 0; border-radius: 10px; color: var(--muted); background: var(--surface-soft); cursor: pointer; }

.layout-preview { position: sticky; top: 92px; }
.layout-preview ol { display: grid; gap: 8px; margin: 16px 0; padding: 0; list-style: none; counter-reset: module; }
.layout-preview li { counter-increment: module; display: flex; align-items: center; gap: 9px; border-bottom: 1px solid var(--line); padding: 9px 0; }
.layout-preview li::before { content: counter(module, decimal-leading-zero); color: var(--gold); font-family: var(--font-latin); font-size: 11px; }
.layout-preview p { color: var(--muted); line-height: 1.6; }

.theme-showcase {
  display: grid;
  grid-template-columns: repeat(3,minmax(0,1fr));
  gap: 16px;
}

.theme-showcase-card {
  display: grid;
  grid-template-rows: auto 210px auto;
  gap: 12px;
  min-width: 0;
  border: 1px solid var(--line);
  border-radius: 22px;
  color: var(--text);
  background: var(--panel);
  padding: 16px;
  text-align: left;
  cursor: pointer;
}
.theme-showcase-card[aria-pressed="true"] { border-color: var(--cobalt-400); box-shadow: 0 0 0 3px rgba(63,123,217,.18), var(--shadow); }
.theme-preview-title { font-size: 17px; font-weight: 760; }
.theme-showcase-card > small { color: var(--muted); line-height: 1.55; }

.cosmic-preview,
.chat-preview,
.music-preview {
  position: relative;
  display: block;
  overflow: hidden;
  border-radius: 16px;
}
.cosmic-preview { background: radial-gradient(circle at 25% 22%,#fff 0 1px,transparent 2px),linear-gradient(145deg,#080c12,#182331); }
.cosmic-preview i { position: absolute; left: 50%; top: 50%; width: 84px; height: 84px; border-radius: 50%; transform: translate(-50%,-50%); background: linear-gradient(135deg,#fff,#9fa9b4); box-shadow: 0 0 30px rgba(255,255,255,.3); }
.cosmic-preview i::after { content: ""; position: absolute; inset: -24px -52px; border: 1px solid rgba(255,255,255,.34); border-radius: 50%; transform: rotate(-13deg); }
.cosmic-preview b { position: absolute; inset: 20px; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; }
.cosmic-preview em { position: absolute; top: 18px; right: 24px; color: #fff; font-style: normal; }

.chat-preview { display: grid; align-content: center; gap: 9px; background: #eef1f4; padding: 18px 14px 42px; }
.chat-preview i,
.chat-preview b { position: relative; width: fit-content; max-width: 82%; border-radius: 14px; color: #23303d; background: #fff; padding: 8px 10px; font-size: 10px; font-style: normal; font-weight: 500; }
.chat-preview b { justify-self: end; color: #fff; background: var(--cobalt-500); }
.chat-preview i::after,
.chat-preview b::after { content: ""; position: absolute; bottom: 0; width: 8px; height: 9px; background: inherit; }
.chat-preview i::after { left: -5px; clip-path: polygon(100% 0,100% 100%,0 100%); }
.chat-preview b::after { right: -5px; clip-path: polygon(0 0,100% 100%,0 100%); }
.chat-preview em { position: absolute; left: 12px; right: 12px; bottom: 10px; height: 25px; border: 1px solid #ccd3db; border-radius: 999px; background: #fff; }

.music-preview { display: grid; grid-template-rows: 1fr 92px; gap: 0; background: linear-gradient(#e2e5e8,#cbd0d5); padding: 10px; }
.music-preview > i { position: relative; display: grid; place-items: center; overflow: hidden; border: 2px solid #1a1d20; border-radius: 7px; background: #090c10; }
.music-preview > i img { width: 118px; height: 92px; object-fit: cover; filter: drop-shadow(0 0 14px rgba(255,255,255,.2)); }
.music-preview > b { position: relative; display: block; width: 78px; height: 78px; margin: 7px auto 0; border-radius: 50%; background: #f6f6f5; box-shadow: inset 0 0 0 1px #c8cdd2; }
.music-preview > b::after { content: ""; position: absolute; inset: 27px; border-radius: 50%; background: #d4d8dc; }
.music-preview > b em { position: absolute; top: 6px; left: 50%; color: #59616a; transform: translateX(-50%); font-size: 7px; font-style: normal; }

.customize-controls { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px; margin-top: 18px; }
.v2-segmented { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; margin-top: 14px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-control); padding: 4px; }
.v2-segmented button { border: 0; border-radius: 9px; color: var(--muted); background: transparent; cursor: pointer; }
.v2-segmented button[aria-pressed="true"] { color: #fff; background: var(--cobalt-500); }

.settings-list { display: grid; padding-block: 8px; }
.settings-list label { display: flex; align-items: center; justify-content: space-between; gap: 18px; border-bottom: 1px solid var(--line); padding: 15px 5px; }
.settings-list label:last-child { border-bottom: 0; }
.settings-list b,
.settings-list small { display: block; }
.settings-list small { margin-top: 4px; color: var(--muted); line-height: 1.45; }
.settings-list input { width: 44px; height: 24px; accent-color: var(--cobalt-500); }
.data-tools p { color: var(--muted); line-height: 1.6; }
.data-tools > div { display: flex; flex-wrap: wrap; gap: 9px; }
.danger-button { margin-top: 24px; border: 1px solid rgba(190,77,77,.35); border-radius: 12px; color: #d67f7f; background: rgba(190,77,77,.08); padding: 10px 13px; cursor: pointer; }
.authority-migration-card { grid-column: 1 / -1; display: grid; gap: 14px; }
.authority-migration-card h2 { margin: 4px 0 0; }
.authority-migration-card > p { max-width: 820px; margin: 0; color: var(--muted); line-height: 1.6; }
.authority-stage { color: var(--cobalt-500); font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.authority-migration-summary { border: 1px solid var(--line); border-radius: 12px; background: var(--surface-control); padding: 12px 14px; color: var(--text) !important; font-variant-numeric: tabular-nums; }
.authority-migration-ack { display: flex; align-items: flex-start; gap: 9px; max-width: 760px; color: var(--muted); font-size: 13px; line-height: 1.5; }
.authority-migration-ack input { width: 17px; height: 17px; margin-top: 1px; accent-color: var(--cobalt-500); }
.authority-migration-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.authority-migration-actions button:disabled { cursor: not-allowed; opacity: .48; }
.authority-migration-status[data-state="working"],.authority-migration-status[data-state="ready"] { color: var(--cobalt-500); }
.authority-migration-status[data-state="success"] { color: #4f9a69; }
.authority-migration-status[data-state="error"] { color: #d67f7f; }

.quick-record-sheet {
  width: min(620px,calc(100% - 24px));
  max-height: min(84dvh,760px);
  margin: auto auto 0;
  border: 1px solid var(--line);
  border-radius: 24px 24px 0 0;
  color: var(--text);
  background: var(--panel-strong);
  box-shadow: 0 -24px 80px rgba(0,0,0,.38);
  padding: 0;
  overscroll-behavior: contain;
}
.quick-record-sheet::backdrop { background: rgba(3,6,10,.62); backdrop-filter: blur(5px); }
.quick-record-sheet[open] { animation: sheet-in .22s ease-out; }
@keyframes sheet-in { from { transform: translateY(26px); opacity: 0; } }
.quick-record-sheet form { display: grid; max-height: inherit; overflow: auto; overscroll-behavior: contain; padding: 10px 20px calc(20px + env(safe-area-inset-bottom)); }
.sheet-handle { width: 46px; height: 4px; margin: 0 auto 12px; border-radius: 999px; background: var(--line); }
.quick-record-sheet header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.quick-record-sheet h2 { margin: 4px 0 0; font-size: 24px; }
.sheet-close { width: 44px; border: 0; border-radius: 50%; color: var(--muted); background: var(--surface-control); cursor: pointer; }
.record-tabs { display: flex; gap: 6px; overflow-x: auto; margin: 17px -4px 14px; padding: 4px; scrollbar-width: none; }
.record-tabs button { flex: 0 0 auto; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); background: var(--surface-control); padding: 8px 12px; cursor: pointer; }
.record-tabs button[aria-selected="true"] { color: #fff; border-color: var(--cobalt-500); background: var(--cobalt-500); }
.record-form-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.record-form-fields label { display: grid; gap: 6px; color: var(--muted); font-size: 12px; }
.record-form-fields label.wide { grid-column: 1 / -1; }
.record-form-fields input,
.record-form-fields select,
.record-form-fields textarea { width: 100%; border: 1px solid var(--line); border-radius: 12px; color: var(--text); background: var(--surface-control); padding: 11px 12px; }
.sheet-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 16px; }
.sheet-actions span { color: var(--muted); font-size: 12px; }

.focus-widget {
  position: fixed;
  z-index: 80;
  right: 24px;
  bottom: 24px;
  display: grid;
  grid-template-columns: minmax(0,1fr) auto auto;
  align-items: center;
  gap: 16px;
  width: min(520px,calc(100% - 32px));
  border: 1px solid rgba(95,139,220,.36);
  border-radius: 18px;
  color: #fff;
  background: rgba(13,20,30,.94);
  box-shadow: 0 20px 60px rgba(0,0,0,.35);
  padding: 12px 14px;
  backdrop-filter: blur(18px);
}
.focus-widget[hidden] { display: none; }
.focus-widget > div:first-child { min-width: 0; }
.focus-label { display: block; color: #9eabc0; font-size: 10px; text-transform: uppercase; letter-spacing: .12em; }
.focus-widget strong { display: block; overflow: hidden; margin-top: 3px; text-overflow: ellipsis; white-space: nowrap; }
.focus-widget time { font-family: var(--font-latin); font-size: 25px; font-variant-numeric: tabular-nums; }
.focus-widget > div:last-child { display: flex; gap: 5px; }
.focus-widget button { border: 1px solid rgba(255,255,255,.14); border-radius: 10px; color: #fff; background: rgba(255,255,255,.06); padding: 8px 10px; cursor: pointer; }

.toast-region {
  position: fixed;
  z-index: 120;
  right: 20px;
  top: 20px;
  display: grid;
  gap: 8px;
  pointer-events: none;
}
.v2-toast { max-width: 360px; border: 1px solid var(--line); border-radius: 13px; color: var(--text); background: var(--panel-strong); box-shadow: var(--shadow); padding: 11px 14px; animation: toast-in .2s ease-out; }
@keyframes toast-in { from { transform: translateY(-8px); opacity: 0; } }

/* Real unified conversation theme. */
html[data-theme="chat"] {
  color-scheme: light;
  --bg: #edf2f6;
  --panel: rgba(255,255,255,.98);
  --panel-strong: #f6f8fa;
  --line: rgba(40,61,82,.15);
  --text: #202a34;
  --muted: #667482;
  --gold: var(--cobalt-500);
  --sage: #5e816d;
  --rose: #95636a;
  --blue: var(--cobalt-500);
  --surface-soft: #edf3f8;
  --surface-control: #f3f6f9;
  --surface-sidebar: rgba(248,251,253,.98);
  --accent-soft: rgba(63,123,217,.11);
  --accent-ink: #fff;
  --page-background: linear-gradient(155deg,#eaf0f5,#fbfcfd 50%,#e7eef4);
}
html[data-theme="chat"][data-bubble-style="wechat"] { --gold: var(--wechat-green); --blue: var(--wechat-green); --accent-soft: rgba(84,182,106,.13); --page-background: linear-gradient(155deg,#edf2ee,#fbfcfb 50%,#e8f0ea); }
html[data-theme="chat"] .moon-stage,
html[data-theme="chat"] .vinyl-stage,
html[data-theme="chat"] .ipod-player { display: none; }
html[data-theme="chat"] .sidebar-chat-preview { display: grid; }
html[data-theme="chat"] .sidebar-chat-preview span { position: relative; border-radius: 15px 15px 15px 5px; }
html[data-theme="chat"] .sidebar-chat-preview span:last-child { justify-self: end; border-radius: 15px 15px 5px 15px; color: #fff; background: var(--blue); }
html[data-theme="chat"] .sidebar-chat-preview span::after { content: ""; position: absolute; left: -5px; bottom: 0; width: 9px; height: 9px; clip-path: polygon(100% 0,100% 100%,0 100%); background: inherit; }
html[data-theme="chat"] .sidebar-chat-preview span:last-child::after { left: auto; right: -5px; clip-path: polygon(0 0,100% 100%,0 100%); }
html[data-theme="chat"] .task,
html[data-theme="chat"] .tutor-entry,
html[data-theme="chat"] .calendar-sync-item,
html[data-theme="chat"] .resource-item,
html[data-theme="chat"] .v2-insight { position: relative; overflow: visible; border-radius: 18px 18px 18px 6px; background: #fff; }
html[data-theme="chat"] .task:nth-child(even),
html[data-theme="chat"] .resource-item:nth-child(even) { margin-left: 26px; border-radius: 18px 18px 6px 18px; color: #fff; background: var(--blue); }
html[data-theme="chat"] .task::after,
html[data-theme="chat"] .resource-item::after { content: ""; position: absolute; left: -6px; bottom: -1px; width: 11px; height: 11px; clip-path: polygon(100% 0,100% 100%,0 100%); background: inherit; }
html[data-theme="chat"] .task:nth-child(even)::after,
html[data-theme="chat"] .resource-item:nth-child(even)::after { left: auto; right: -6px; clip-path: polygon(0 0,100% 100%,0 100%); }

/* Conversation mode keeps a visible speech tail on the main dialogue surfaces. */
html[data-theme="chat"] :is(.card,.pulse-card,.training-today-ribbon,.health-checkin-shortcut) { position: relative; overflow: visible; }
html[data-theme="chat"] :is(.card,.pulse-card,.training-today-ribbon,.health-checkin-shortcut)::after {
  content: "";
  position: absolute;
  left: -7px;
  bottom: 16px;
  width: 13px;
  height: 14px;
  clip-path: polygon(100% 0,100% 100%,0 100%);
  background: inherit;
}
html[data-theme="chat"] :is(#frenchLearning,.pulse-card:nth-child(even),.monthly-card:nth-child(even))::after {
  left: auto;
  right: -7px;
  clip-path: polygon(0 0,100% 100%,0 100%);
}
html[data-theme="chat"][data-bubble-style="wechat"] :is(#frenchLearning,.pulse-card:nth-child(even)) { background: #dff2e4; }
html[data-theme="chat"][data-bubble-style="imessage"] :is(#frenchLearning,.pulse-card:nth-child(even)) { background: #dbeafb; }

html[data-theme="ipod"] .moon-stage,
html[data-theme="ipod"] .sidebar-chat-preview { display: none; }
html[data-theme="ipod"] .ipod-player { display: block; }
html[data-theme="ipod"] .vinyl-stage { display: none; }

@media (min-width: 821px) {
  .shell {
    width: min(var(--content-max),calc(100% - 32px));
    grid-template-columns: 278px minmax(0,1fr);
    column-gap: 30px;
  }
  .desktop-sidebar { border-radius: 24px; padding: 15px 14px; }
  .sidebar-visual { min-height: 138px; }
  .hero { grid-template-columns: minmax(0,1fr); align-items: stretch; }
  .hero > div:first-child { align-self: center; }
  .date-card { align-self: center; min-width: 130px; }
  .daily-pulse { margin-bottom: 18px; }
  .pulse-grid { grid-template-columns: repeat(5,minmax(0,1fr)); }
  body.workspace-routed[data-active-view="overview"] #todayDashboard { grid-template-columns: minmax(0,1.25fr) minmax(330px,.75fr); }
  body.workspace-routed[data-active-view="tasks"] #todayDashboard,
  body.workspace-routed[data-active-view="health"] #todayDashboard,
  body.workspace-routed[data-active-view="learning"] #todayDashboard { max-width: 1040px; }
  body.workspace-routed[data-active-view="health"] #todayDashboard { max-width: 1180px; }
  .topbar { position: sticky; z-index: 30; top: 0; background: color-mix(in srgb,var(--bg) 72%,transparent); backdrop-filter: blur(18px); }
}

@media (max-width: 820px) {
  body { font-size: 15px; }
  .shell { width: min(100% - 28px,680px); padding: calc(14px + env(safe-area-inset-top)) 0 calc(var(--mobile-nav-height) + 28px + env(safe-area-inset-bottom)); }
  .topbar { position: sticky; z-index: 35; top: 0; min-height: 58px; margin: 0 -4px 18px; padding: 7px 4px; background: color-mix(in srgb,var(--bg) 78%,transparent); backdrop-filter: blur(20px); }
  .topbar .brand-note { display: none; }
  .topbar .brand-mark { width: 38px; height: 38px; border-radius: 12px; }
  .topbar .brand-name { font-size: 15px; }
  .workspace-context,
  .secure,
  #installApp { display: none; }
  .appearance-button { min-width: 58px; border-radius: 12px; }
  .view-back-button { min-width: 44px; border-radius: 12px; }
  .hero { grid-template-columns: minmax(0,1fr); gap: 13px; margin-bottom: 18px; padding: 0; }
  .hero > div:first-child { grid-column: 1; }
  .hero h1 { max-width: 340px; margin: 0 0 6px; font-size: clamp(26px,7vw,34px); line-height: 1.08; }
  .hero-copy { font-size: 13px; line-height: 1.65; }
  .date-card { align-self: center; text-align: left; padding: 0; }
  .date-main { font-size: 22px; }
  .section-heading-row { gap: 8px; }
  .section-heading-row p { font-size: 12px; }
  .pulse-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
  .pulse-card { min-height: 94px; border-radius: 17px; padding: 12px; }
  .pulse-card:last-child { grid-column: 1 / -1; }
  .quick-nav { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; }
  .quick-link { min-height: 78px; border-radius: 16px; padding: 13px; }
  .quick-caption { font-size: 10px; }
  body.workspace-routed[data-active-view="overview"] #todayDashboard { display: block !important; }
  body.workspace-routed[data-active-view="overview"] #todayDashboard > .stack:first-child { display: block; }
  body.workspace-routed[data-active-view="overview"] #todayDashboard > .stack:last-child { display: grid; margin-top: 12px; }
  body.workspace-routed[data-active-view="overview"] #weeklyHealth,
  body.workspace-routed[data-active-view="overview"] .connection-card { display: none; }
  body.workspace-routed[data-active-view="overview"] #frenchLearning { display: block; }
  .card { border-radius: 18px; padding: 17px; }
  .card h2,
  .planner-head h2 { font-size: 21px; }
  .mobile-bottom-nav {
    position: fixed;
    z-index: 70;
    left: 50%;
    bottom: 0;
    display: grid;
    grid-template-columns: repeat(5,1fr);
    width: min(100%,680px);
    min-height: calc(var(--mobile-nav-height) + env(safe-area-inset-bottom));
    transform: translateX(-50%);
    border-top: 1px solid var(--line);
    background: color-mix(in srgb,var(--surface-sidebar) 94%,transparent);
    box-shadow: 0 -14px 38px rgba(0,0,0,.18);
    padding: 7px 9px calc(7px + env(safe-area-inset-bottom));
    backdrop-filter: blur(22px);
  }
  .mobile-bottom-nav button { display: grid; place-items: center; gap: 1px; border: 0; border-radius: 13px; color: var(--muted); background: transparent; cursor: pointer; }
  .mobile-bottom-nav button[aria-current="page"] { color: var(--gold); background: var(--accent-soft); }
  .mobile-bottom-nav button span { font-family: var(--font-latin); font-size: 19px; }
  .mobile-bottom-nav button small { font-size: 10px; }
  .mobile-bottom-nav .mobile-add { align-self: start; width: 52px; height: 52px; min-height: 52px; margin: -18px auto 0; border: 5px solid var(--bg); border-radius: 50%; color: #fff; background: var(--cobalt-500); box-shadow: 0 9px 26px rgba(32,85,170,.35); }
  .mobile-bottom-nav .mobile-add span { font-size: 29px; line-height: 1; }
  .v2-page-heading { align-items: flex-start; flex-direction: column; gap: 12px; margin-bottom: 14px; padding-bottom: 14px; }
  .v2-page-heading h2 { font-size: 31px; }
  .review-layout,
  .profile-grid,
  .layout-editor-grid,
  .settings-grid,
  .theme-showcase,
  .customize-controls { grid-template-columns: 1fr; }
  .review-summary-card,
  .layout-preview { position: static; }
  .review-period-card { padding: 14px 10px; }
  .review-period-head { align-items: flex-start; flex-direction: column; gap: 4px; padding-inline: 4px; }
  .review-calendar { gap: 3px; }
  .review-calendar-day { min-height: 86px; border-radius: 7px; padding: 4px; }
  .review-month-calendar .review-calendar-day { min-height: 65px; }
  .review-calendar-day-head span { display: none; }
  .review-calendar-chips { gap: 2px; margin-top: 4px; }
  .review-calendar-chips span { padding: 3px; font-size: 7px; }
  .review-month-calendar .review-calendar-chips span:nth-child(n+3) { display: none; }
  .review-month-picker { width: 100%; }
  .review-month-picker input { width: 100%; }
  .review-timeline-item { grid-template-columns: 17px 58px minmax(0,1fr); gap: 7px; }
  .profile-identity-card { grid-template-columns: 96px minmax(0,1fr); }
  .profile-identity-card img { width: 96px; height: 96px; border-radius: 18px; }
  .connection-buttons { grid-template-columns: 1fr; }
  .theme-showcase-card { grid-template-rows: auto 178px auto; }
  .record-form-fields { grid-template-columns: 1fr; }
  .record-form-fields label.wide { grid-column: auto; }
  .focus-widget { right: 12px; bottom: calc(var(--mobile-nav-height) + 12px + env(safe-area-inset-bottom)); grid-template-columns: minmax(0,1fr) auto; gap: 9px; }
  .focus-widget > div:last-child { grid-column: 1 / -1; }
  .toast-region { left: 14px; right: 14px; top: calc(12px + env(safe-area-inset-top)); }
  .v2-toast { max-width: none; }
  .footer { padding-bottom: 10px; }
}

@media (max-width: 480px) {
  .shell { width: calc(100% - 20px); }
  .top-actions { gap: 4px; }
  .appearance-button { padding: 8px 9px; }
  .quick-nav { grid-template-columns: 1fr 1fr; }
  .exercise-entry { grid-template-columns: minmax(88px,1fr) 74px 80px; gap: 5px; padding-inline: 7px; }
  .exercise-metric span { font-size: 8px; }
  .meal-row { grid-template-columns: 34px minmax(0,1fr); }
  .meal-calorie { grid-column: 2; }
  .supplement-row { grid-template-columns: minmax(0,1fr) 68px 58px 31px; }
  .review-metrics { grid-template-columns: 1fr 1fr; }
  .module-row { grid-template-columns: auto minmax(0,1fr) auto; }
  .module-row button[data-direction="down"] { display: none; }
}

html[data-reduced-motion="true"] *,
html[data-reduced-motion="true"] *::before,
html[data-reduced-motion="true"] *::after {
  scroll-behavior: auto !important;
  animation-duration: .01ms !important;
  animation-iteration-count: 1 !important;
  transition-duration: .01ms !important;
}
