:root {
  color-scheme: dark;
  font-family: system-ui, "Microsoft YaHei", sans-serif;
  background: var(--page-bg);
  color: var(--dsw-alias-label-primary);
  --page-bg: #111722;
  --dialog-bg: #182435;
  --chat-bg: #141e2c;
  --line: #34445b;
  --dialog-border: #415473;
  --muted: #b8c9e0;
  --accent: #a9ddff;
  --primary-bg: #a9ddff;
  --primary-fg: #102239;
  --quiet-bg: #27354b;
  --quiet-fg: #e3edfa;
  --quiet-border: #40506a;
  --input-bg: #111b2a;
  --input-border: #495c79;
  --assistant-bubble: #223449;
  --user-bubble: #2e4663;
  --selected-bg: #203d57;
  --danger: #ffc5bc;
  --status-warn: #f2cc89;
  --status-ok: #a0d9be;
  --backdrop: #0a101bc9;
  --dsw-specific-sidebar-fill: #1a2332;
  --dsw-alias-bg-layer-1: #131b29;
  --dsw-alias-label-primary: #eff3f9;
  --dsw-alias-label-secondary: #a5b4c9;
}
:root[data-theme="light"] {
  color-scheme: light;
  --page-bg: #f5f7fb;
  --dialog-bg: #fff;
  --chat-bg: #f6f8fc;
  --line: #d4dfec;
  --dialog-border: #a2b4ca;
  --muted: #425674;
  --accent: #1e5790;
  --primary-bg: #235e9b;
  --primary-fg: #fff;
  --quiet-bg: #e8eff9;
  --quiet-fg: #233e5e;
  --quiet-border: #adc0d8;
  --input-bg: #fff;
  --input-border: #879db8;
  --assistant-bubble: #e5ecf7;
  --user-bubble: #d4e8fd;
  --selected-bg: #dceafb;
  --danger: #9e3428;
  --status-warn: #754910;
  --status-ok: #236548;
  --backdrop: #1d365666;
  --dsw-specific-sidebar-fill: #edf2f8;
  --dsw-specific-sidebar-nav-item-hover: #e4edf8;
  --dsw-alias-bg-layer-1: #fff;
  --dsw-alias-bg-layer-2: #edf3fa;
  --dsw-alias-bg-overlay: #fff;
  --dsw-alias-label-primary: #192d47;
  --dsw-alias-label-secondary: #465c77;
  --dsw-alias-border-l1: #b9c9db;
  --dsw-alias-border-l2-darkmode-thin: #b9c9db;
  --dsw-alias-border-l3: #91a6c0;
  --dsw-alias-button-floating-fill: #fff;
  --dsw-alias-button-floating-hover: #edf3fa;
  --dsw-alias-state-error-primary: #9e3428;
  --dsw-alias-state-success-primary: #236548;
  --dsw-alias-state-warn-primary: #754910;
}
:root[data-theme="light"] #app-mount :is(.eh-week-blk, .eh-tl-block) {
  background: color-mix(in srgb, var(--schedule-color, var(--dsw-alias-bg-layer-2)) 30%, white);
}
* { box-sizing: border-box; -webkit-tap-highlight-color: transparent; }
body { margin: 0; }
button, input, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { opacity: .55; cursor: wait; }
[hidden] { display: none !important; }
[data-auth-mode="tailscale"] #logout { display: none; }
:focus:not(:focus-visible) { outline: none; }
:focus-visible { outline: 2px solid var(--status-ok); outline-offset: 2px; }
:is(button, a, summary, [role="button"], [role="tab"], input[type="checkbox"], input[type="radio"]) {
  touch-action: manipulation;
}
:is(button, a, summary, [role="button"], [role="tab"]):active:not(:disabled) { opacity: .78; }
input:is([type="checkbox"], [type="radio"]) { accent-color: var(--status-ok); }
.workspace :is(input:not([type="checkbox"]):not([type="radio"]), textarea, select):focus {
  border-color: var(--status-ok);
}
.workspace :is(dialog[open], .eh-ctx, .eh-confirm) { animation: interaction-enter 110ms ease-out; }
@keyframes interaction-enter {
  from { opacity: .75; }
  to { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .workspace :is(dialog[open], .eh-ctx, .eh-confirm) { animation: none; }
}
.eh-local-feedback {
  position: fixed;
  z-index: 10000;
  inset: auto 12px calc(68px + env(safe-area-inset-bottom));
  padding: 10px 12px;
  border: 1px solid var(--line);
  border-radius: 9px;
  background: var(--dialog-bg);
  color: var(--dsw-alias-label-primary);
  pointer-events: none;
}
.workspace {
  height: 100dvh;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.app-header {
  display: flex;
  align-items: center;
  gap: 9px;
  padding: calc(10px + env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) 10px max(12px, env(safe-area-inset-left));
  border-bottom: 1px solid var(--line);
}
.app-header img { border-radius: 9px; flex: none; }
.brand { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.brand small { color: var(--status-warn); font-size: 11px; }
.brand small[data-connected="true"] { color: var(--status-ok); }
.primary, .quiet {
  border: 1px solid transparent;
  border-radius: 9px;
  min-height: 44px;
  padding: 8px 12px;
}
.primary { color: var(--primary-fg); background: var(--primary-bg); font-weight: 650; }
.quiet { color: var(--quiet-fg); background: var(--quiet-bg); border-color: var(--quiet-border); }
#app-mount { flex: 1; min-height: 0; }
#app-mount > .eh-panel {
  position: relative !important;
  width: 100% !important;
  height: 100% !important;
  transform: none !important;
  border: 0;
  z-index: auto;
}
#app-mount .eh-top, #app-mount .eh-resize, #app-mount .eh-foot { display: none !important; }
#app-mount .eh-tabs { margin-top: 9px; order: -1; }
#app-mount .eh-tab { min-height: 44px; }
#app-mount .eh-body { overscroll-behavior: contain; }
.today-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; justify-content: space-between; margin: 4px 0 16px; }
.today-heading p { margin: 0 0 3px; color: var(--muted); font-size: 13px; }
.today-heading h1, .section-heading { margin: 0; font-size: 24px; }
.section-heading { margin-bottom: 12px; }
.today-empty { padding: 12px 2px 6px; color: var(--muted); line-height: 1.5; }
#app-mount .today-list .eh-item { min-height: 48px; }
#app-mount .today-complete {
  box-sizing: border-box;
  width: 44px;
  height: 44px;
  padding: 0;
  border-radius: 8px;
  touch-action: manipulation;
  -webkit-tap-highlight-color: transparent;
  user-select: none;
}
#app-mount .today-complete:focus:not(:focus-visible) { outline: none; }
#app-mount .today-complete:focus-visible { outline-color: var(--status-ok); }
#app-mount .today-complete.eh-box-on::after {
  left: 50%;
  top: 48%;
  width: 9px;
  height: 16px;
  transform: translate(-50%, -50%) rotate(45deg);
}
#app-mount .today-list .today-complete + .eh-name { white-space: normal; overflow-wrap: anywhere; }
#app-mount .today-list .today-view { min-width: 44px; min-height: 44px; }
#app-mount .today-list .eh-name-link { min-height: 44px; }
#app-menu, #ai-tools {
  width: min(calc(100vw - 20px), 560px);
  max-height: calc(100dvh - 32px);
  padding: 16px;
  border-radius: 16px;
  border: 1px solid var(--dialog-border);
  background: var(--dialog-bg);
  color: var(--dsw-alias-label-primary);
}
#ai-panel::backdrop, #app-menu::backdrop, #ai-tools::backdrop { background: var(--backdrop); }
#ai-panel {
  width: min(calc(100vw - 32px), 660px);
  height: min(calc(100dvh - 32px), 850px);
  max-width: none;
  max-height: none;
  padding: 0;
  border: 1px solid var(--dialog-border);
  border-radius: 18px;
  background: var(--chat-bg);
  color: var(--dsw-alias-label-primary);
  overflow: hidden;
}
#ai-panel[open] {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  animation: chat-enter 160ms ease-out both;
}
.chat-header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr);
  align-items: center;
  gap: 6px;
  min-height: 60px;
  padding: 6px 16px;
  border-bottom: 1px solid var(--line);
  background: var(--dialog-bg);
}
.chat-heading h1 { font-size: 19px; }
.chat-back {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  justify-self: start;
  padding: 6px 4px;
  min-height: 44px;
  border: 0;
  border-radius: 8px;
  background: transparent;
  color: var(--accent);
}
#open-ai-tools { justify-self: end; }
.chat-scroll {
  overflow-y: auto;
  overscroll-behavior-y: contain;
  overflow-anchor: none;
  min-height: 0;
  min-width: 0;
  padding: 16px 20px 18px;
}
.chat-empty { margin: clamp(24px, 11vh, 96px) 0 0; text-align: center; color: var(--muted); }
.chat-empty img { border-radius: 14px; }
.chat-empty p { color: var(--dsw-alias-label-primary); font-size: 20px; font-weight: 650; margin: 12px 0 6px; }
.chat-empty span { font-size: 14px; }
.chat-history { display: block; margin: 0 auto 18px; font-size: 14px; }
.chat-turn { max-width: 100%; }
.chat-turn:not(:has(> :not([hidden]))) { display: none; }
.chat-composer {
  padding: 10px 16px 12px;
  border-top: 1px solid var(--line);
  background: var(--dialog-bg);
}
#ask { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 8px; }
#request { display: block; min-height: 44px; max-height: min(128px, 22dvh); line-height: 1.45; resize: none; }
#request::placeholder { color: var(--dsw-alias-label-secondary); opacity: 1; }
#send { transition: transform 110ms ease-out; }
#send:active:not(:disabled) { transform: scale(.96); }
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  overflow: hidden;
  clip-path: inset(50%);
  white-space: nowrap;
}
@keyframes chat-enter { from { opacity: .6; } to { opacity: 1; } }
@keyframes chat-message-enter {
  from { opacity: .5; transform: translateY(4px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  #ai-panel[open], #ai-panel .chat-message[data-new] { animation: none; }
  #send { transition: none; }
  #send:active:not(:disabled) { transform: none; }
}
.menu-actions { display: grid; gap: 8px; margin-top: 12px; }
.menu-actions button { text-align: left; }
.theme-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-top: 12px; }
.theme-options { display: flex; gap: 6px; }
.theme-options [aria-pressed="true"] { color: var(--primary-fg); background: var(--primary-bg); border-color: var(--primary-bg); }
.dialog-header, .actions { display: flex; align-items: center; gap: 8px; }
.dialog-header { justify-content: space-between; }
h1 { margin: 0; font-size: 21px; }
.description { color: var(--muted); font-size: 14px; line-height: 1.55; }
.conversation { display: flex; flex-direction: column; gap: 14px; }
.chat-message { align-self: flex-start; max-width: min(92%, 520px); min-width: 0; }
.chat-message[data-new] { animation: chat-message-enter 140ms ease-out both; }
.chat-message p {
  margin: 0;
  padding: 9px 12px;
  border-radius: 13px 13px 13px 4px;
  background: var(--assistant-bubble);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  text-wrap: pretty;
  line-height: 1.55;
}
.chat-message[data-role="user"] { align-self: flex-end; }
.chat-message[data-role="user"] p { background: var(--user-bubble); border-radius: 13px 13px 4px 13px; }
.chat-message time { display: block; margin: 4px 2px 0; color: var(--muted); font-size: 12px; }
.chat-message[data-role="user"] time { text-align: right; }
.chat-message[data-pending] { opacity: .72; }
.assistant-choices { display: flex; flex-wrap: wrap; gap: 8px; margin: 10px 0; }
.assistant-choices button { text-align: left; overflow-wrap: anywhere; }
#plan-options { display: grid; }
#commit { margin-top: 4px; }
#ai-tools summary { cursor: pointer; padding-block: 8px; }
.chat-clear { color: var(--danger); }
#plan-options button[aria-pressed="true"] { border-color: var(--accent); background: var(--selected-bg); }
#plan-options small { display: block; margin-top: 3px; color: var(--muted); }
#remember { margin-block: 8px; }
.draft-items { padding: 0 0 0 22px; }
.draft-items li { margin: 7px 0; overflow-wrap: anywhere; }
.draft-items small { display: block; color: var(--muted); }
.actions { margin: 8px 0 12px; }
.actions:not(:has(button:not([hidden]))) { display: none; }
#login, #preference-form { display: grid; gap: 8px; }
textarea, .login input {
  width: 100%;
  padding: 10px;
  border: 1px solid var(--input-border);
  border-radius: 9px;
  background: var(--input-bg);
  color: var(--dsw-alias-label-primary);
  font-size: 16px;
}
textarea { resize: vertical; }
#availability, #preferences { margin-top: 12px; color: var(--muted); }
.preference-list { display: grid; gap: 8px; padding: 0; list-style: none; }
.preference-list li { padding: 8px 10px; background: var(--assistant-bubble); border-radius: 9px; overflow-wrap: anywhere; }
.preference-list li .actions { margin-block: 6px 0; }
#preference-status { font-size: 13px; color: var(--status-warn); }
.free-slots { padding-left: 18px; font-size: 13px; }
#ai-status, #login-status { min-height: 1em; margin: 8px 0 0; color: var(--status-warn); }
#ai-status { margin: 0 0 8px; font-size: 13px; overflow-wrap: anywhere; }
#ai-status:empty { display: none; }
.login { min-height: 100dvh; display: grid; place-items: center; padding: 18px; }
.login main { width: min(100%, 380px); padding: 22px; border: 1px solid var(--line); border-radius: 16px; background: var(--dialog-bg); }
.login h1 { margin-top: 12px; }
.login p { color: var(--muted); }
.login a { color: var(--accent); }
.eh-daily-compact { display: none; }
.eh-day-nav { display: grid; grid-template-columns: 44px minmax(0, 1fr) 44px auto; gap: 6px; }
.eh-day-nav .eh-cal-year { text-align: center; font-size: 15px; line-height: 1.35; }
.eh-day-nav .eh-mini { min-width: 44px; min-height: 44px; }
.eh-day-nav button:not(.eh-day-today) { font-size: 20px; line-height: 1; }
.eh-day-nav .eh-day-today[aria-current="date"] { color: var(--accent); border-color: var(--accent); }
.eh-day-heading { margin: 14px 0 8px; font-size: 13px; color: var(--muted); font-weight: 650; }
.eh-day-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 8px; }
.eh-day-row { display: grid; grid-template-columns: 48px minmax(0, 1fr); align-items: stretch; gap: 8px; }
.eh-day-row.eh-day-untimed { grid-template-columns: minmax(0, 1fr); }
.eh-day-time {
  display: flex; flex-direction: column; justify-content: center; align-items: flex-end;
  gap: 3px; color: var(--muted); font-size: 12px; font-variant-numeric: tabular-nums;
}
.eh-day-time strong { font-size: 14px; color: var(--dsw-alias-label-primary); }
.eh-day-card {
  display: flex; flex-direction: column; justify-content: center; gap: 3px; min-width: 0;
  min-height: 56px; padding: 8px 10px; border: 1px solid var(--line);
  border-inline-start: 3px solid var(--day-accent, var(--accent));
  border-radius: 10px; background: var(--dsw-alias-bg-layer-1);
}
.eh-day-card.eh-day-editable { flex-direction: row; align-items: center; padding: 0 4px 0 0; }
.eh-day-open {
  display: flex; flex: 1; flex-direction: column; justify-content: center; gap: 3px;
  position: relative; min-height: 54px; min-width: 0; padding: 8px 20px 8px 10px; border: 0;
  border-radius: 7px; text-align: left; background: transparent; color: inherit;
}
.eh-day-open::after {
  content: '›'; position: absolute; right: 6px; top: 50%; transform: translateY(-50%);
  font-size: 19px; color: var(--muted);
}
.eh-day-open strong, .eh-day-content { font-size: 15px; font-weight: 650; line-height: 1.35; overflow-wrap: anywhere; }
.eh-day-meta { font-size: 12px; color: var(--muted); overflow-wrap: anywhere; }
.eh-direction-event .eh-name-link { min-height: 36px; }
.eh-direction-event .eh-meta { white-space: normal; text-align: right; }

.direction-page-head, .direction-progress-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.direction-page-head h1, .direction-progress-head h2 {
  margin: 0;
  font-size: 24px;
  overflow-wrap: anywhere;
}
.direction-page-head button, .direction-progress-head button { flex: none; }
.direction-page-description, .direction-empty {
  margin: 10px 0 16px;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.6;
}
.direction-list { display: grid; gap: 8px; }
.direction-card {
  display: flex;
  width: 100%;
  min-height: 68px;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 12px;
  text-align: start;
  border: 1px solid var(--line);
  border-radius: 12px;
  background: var(--dsw-alias-bg-layer-1);
  color: var(--dsw-alias-label-primary);
}
.direction-card-content { display: grid; gap: 4px; min-width: 0; }
.direction-card-heading { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; overflow-wrap: anywhere; }
.direction-card-heading strong { min-width: 0; }
.direction-card small, .direction-card-status { color: var(--muted); font-size: 12px; }
.direction-card-open { flex: none; color: var(--quiet-fg); font-size: 12px; }
.direction-archive { margin-top: 12px; }
.direction-archive summary, .direction-manage summary {
  min-height: 44px;
  padding: 12px 0;
  cursor: pointer;
  color: var(--quiet-fg);
  font-size: 14px;
}
.direction-progress {
  width: min(500px, calc(100vw - 24px));
  max-height: min(80dvh, 720px);
  overflow: auto;
  padding: 16px;
  border: 1px solid var(--dialog-border);
  border-radius: 16px;
  background: var(--dialog-bg);
  color: var(--dsw-alias-label-primary);
}
.direction-progress::backdrop { background: var(--backdrop); }
.direction-progress h3 { font-size: 15px; margin: 20px 0 4px; }
.direction-progress .eh-stats { margin-top: 12px; }
.direction-progress .eh-name { white-space: normal; overflow-wrap: anywhere; }
.direction-progress .eh-name-link { white-space: normal; overflow-wrap: anywhere; min-height: 44px; }
.direction-manage { margin-top: 8px; border-block: 1px solid var(--line); }
.direction-manage-actions { display: flex; flex-wrap: wrap; gap: 8px; padding-bottom: 10px; }
.direction-remove { color: var(--danger); }

@media (max-width: 768px) {
  .app-header { gap: 7px; }
  .app-header button { padding-inline: 10px; }
  #app-mount .eh-tabs {
    order: 1;
    margin: 0;
    padding: 4px max(8px, env(safe-area-inset-right)) calc(4px + env(safe-area-inset-bottom)) max(8px, env(safe-area-inset-left));
    border-width: 1px 0 0;
    border-radius: 0;
  }
  #app-mount .eh-tab { flex-direction: column; gap: 3px; min-height: 52px; padding: 5px 0; }
  #app-mount .eh-ico svg { width: 18px; height: 18px; }
  #app-mount .eh-body { padding: 14px max(14px, env(safe-area-inset-right)) 14px max(14px, env(safe-area-inset-left)); }
  #app-mount :is(input, select, textarea) { font-size: 16px; }
  #app-mount :is(.eh-cal-compact, .eh-cal-mobile-day) .eh-cal-upper { height: auto !important; overflow: visible; }
  #app-mount :is(.eh-cal-compact, .eh-cal-mobile-day) .eh-cal-div { display: none; }
  #app-mount :is(.eh-cal-compact, .eh-cal-mobile-day) .eh-cal-lower { overflow: visible; }
  #app-mount .eh-daily-compact { display: block; margin-bottom: 14px; }
  #app-mount :is(.eh-daily-grid, .eh-course-list-desktop) { display: none; }
  #app-mount .eh-cal-compact .eh-cal-cell { min-height: 34px; }
  #app-mount .eh-edit-sched-btn { min-height: 44px; }
  .workspace .eh-ctx {
    min-width: 0;
    width: min(420px, calc(100vw - 16px));
    max-height: calc(100dvh - 16px);
    overflow: auto;
  }
  #app-menu, #ai-tools {
    width: 100%;
    max-width: none;
    max-height: calc(100dvh - env(safe-area-inset-top) - 10px);
    margin: auto 0 0;
    padding-bottom: calc(16px + env(safe-area-inset-bottom));
    border-radius: 16px 16px 0 0;
  }
  #ai-panel {
    inset: var(--chat-top, 0px) 0 auto;
    width: 100%;
    height: var(--chat-height, 100dvh);
    margin: 0;
    border: 0;
    border-radius: 0;
  }
  .chat-header { padding: calc(6px + env(safe-area-inset-top)) max(12px, env(safe-area-inset-right)) 6px max(12px, env(safe-area-inset-left)); }
  .chat-scroll { padding-inline: max(14px, env(safe-area-inset-left)) max(14px, env(safe-area-inset-right)); }
  .chat-composer { padding: 8px max(12px, env(safe-area-inset-right)) max(10px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left)); }
  .actions { flex-wrap: wrap; }
}