:root {
  --font-cn:"Noto Serif SC",serif;
  --font-en:"Cormorant Garamond",serif;
  --bg:#f7f3ea;
  --panel:rgba(255,252,246,.76);
  --text:#403b38;
  --soft:#746d67;
  --faint:#9b9289;
  --line:rgba(87,75,67,.16);
  --accent:#9c675e;
  --accent-soft:rgba(156,103,94,.12);
  --track:rgba(156,103,94,.12);
  --selected:rgba(156,103,94,.18);
  --bright:#9c675e;
  --action-text:#403b38;
  --danger:#a45e58;
  --shadow:0 16px 44px rgba(79,61,52,.10);
  --wall:url("pink-room-photo.webp");
  color-scheme:light;
}
:root[data-theme="harbor"] {
  --bg:#202808;
  --panel:rgba(22,31,18,.78);
  --text:#eef1df;
  --soft:#bbc3a5;
  --faint:#8e9a7d;
  --line:rgba(225,235,204,.14);
  --accent:#9ca463;
  --accent-soft:rgba(156,164,99,.12);
  --track:rgba(32,40,8,.48);
  --selected:#566343;
  --bright:#9ca463;
  --action-text:#eef1df;
  --danger:#d97757;
  --shadow:0 16px 44px rgba(0,0,0,.16);
  --wall:url("chat-forest-scales-v2.webp");
  color-scheme:dark;
}
* { box-sizing:border-box; }
html,body { margin:0;min-height:100%;background:var(--bg);color:var(--text);font:400 13px/1.75 var(--font-cn); }
button,input,select { font:inherit;color:inherit; }
button { cursor:pointer; }
button,a,input,select,summary { -webkit-tap-highlight-color:transparent; }
button:active,a:active { filter:brightness(.90); }
button:disabled { opacity:.5;cursor:wait; }
:where(button,a,input,select,summary):focus-visible { outline:2px solid var(--bright);outline-offset:4px; }
h1,h2,p { margin:0; }
h2 { font-size:19px;line-height:1.5;font-weight:400; }
[hidden],.hidden { display:none!important; }
.activity-wall { position:fixed;inset:0;background:var(--wall) center/cover no-repeat;opacity:.9;pointer-events:none; }
.activity-wall:after { content:"";position:absolute;inset:0;background:color-mix(in srgb,var(--bg) 58%,transparent); }
.activity-shell { position:relative;width:min(720px,calc(100% - 40px));margin:auto;padding:28px 0 max(40px,env(safe-area-inset-bottom)); }
.activity-header { display:grid;grid-template-columns:44px minmax(0,1fr) 44px;align-items:center;gap:4px;margin-bottom:22px; }
.activity-header h1 { font:400 32px/1.35 var(--font-en);text-align:center; }
.icon-button { width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:var(--soft);font:32px/1 var(--font-en); }
.connection { grid-column:2;display:flex;justify-content:center;align-items:center;gap:8px;color:var(--soft);font-size:12px;line-height:1.5; }
.connection i { width:6px;height:6px;flex:none;border-radius:50%;background:var(--bright); }
.connection.online i { background:var(--bright); }
.connection.offline i { background:var(--danger); }
.activity-status { color:var(--soft);font-size:12px;line-height:1.7; }
.activity-status:empty { display:none; }
.activity-status:not(:empty) { margin:0 0 12px;text-align:center; }
.activity-tabs { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:3px;margin:0 0 24px;padding:3px;border:0;border-radius:13px;background:var(--track); }
.activity-tab { position:relative;min-height:36px;padding:8px 10px;border:0;border-radius:10px;background:transparent;color:var(--soft);font-size:12px;line-height:1.5;transition:background .18s,color .18s; }
.activity-tab:before { content:"";position:absolute;inset:-4px 0; }
.activity-tab.active { background:var(--selected);color:var(--action-text);box-shadow:0 2px 9px rgba(10,14,4,.24); }
.activity-panel { padding:20px;border:0;border-radius:16px;background:var(--panel);backdrop-filter:blur(18px);box-shadow:var(--shadow); }
.activity-grid { display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px; }
.activity-card { min-width:0;padding:22px 24px;border:0;border-radius:16px;background:var(--panel);backdrop-filter:blur(18px); }
.session-card { grid-column:1; }
.wake-card { grid-column:2; }
.notebook-card { grid-column:1/-1;padding:26px 28px; }
.reminder-card { grid-column:1/-1;display:flex;align-items:baseline;gap:28px; }
.reminder-card .card-top { flex:none; }
.reminder-card .reminder-body { margin:0; }
.card-top,.section-head { display:flex;justify-content:space-between;align-items:center;gap:12px; }
.card-top>div,.section-head>div { min-width:0; }
.state-pill,.readonly { flex:none;font-size:11.5px;line-height:1.6;color:var(--soft); }
.state-pill { padding:3px 9px;border:0;border-radius:12px;background:var(--accent-soft); }
.state-pill.off { color:var(--soft); }
.session-summary { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:16px 20px;margin-top:20px; }
.session-fact { min-width:0;display:flex;flex-direction:column;gap:3px;padding:0;border:0;font-size:13px;line-height:1.75; }
.session-fact:last-child { border-bottom:0; }
.session-fact span { color:var(--soft);flex:none;font-size:12px; }
.session-fact strong { min-width:0;overflow-wrap:anywhere;font-weight:400; }
.detail-links { display:flex;flex-wrap:wrap;gap:0 16px;margin-top:16px;padding-top:6px;border-top:1px solid var(--line); }
.detail-links a { display:inline-flex;align-items:center;min-height:44px;color:var(--bright);font-size:12px;text-decoration:none; }
.detail-links a:hover { text-decoration:underline;text-underline-offset:4px; }
.wake-clock { margin:18px 0 12px; }
.wake-time { display:block;font:400 42px/1.1 var(--font-en);font-variant-numeric:lining-nums tabular-nums;overflow-wrap:anywhere; }
.wake-time:not([datetime]),.wake-time[datetime=""] { font:400 19px/1.6 var(--font-cn); }
.wake-date { display:block;margin-top:6px;color:var(--soft);font-size:12px; }
.wake-date:empty { display:none; }
.wake-note { color:var(--text);font-size:13px;line-height:1.75;white-space:pre-wrap;overflow-wrap:anywhere; }
.wake-upcoming { margin-top:16px;border-top:1px solid var(--line); }
.wake-upcoming summary { cursor:pointer;min-height:44px;align-content:center;color:var(--bright);font-size:12px; }
.wake-upcoming ol { list-style:none;margin:0;padding:0; }
.wake-upcoming li { padding:12px 0;border-top:1px solid var(--line); }
.wake-upcoming time { color:var(--soft);font-size:12px;overflow-wrap:anywhere; }
.wake-upcoming .wake-note { margin:6px 0 0; }
.toggle-row { display:flex;justify-content:space-between;align-items:center;gap:20px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line); }
.toggle-row strong,.toggle-row small { display:block; }
.toggle-row strong { font-size:13px;font-weight:400; }
.toggle-row small { max-width:34em;margin-top:4px;color:var(--soft);font-size:12px;line-height:1.7; }
.system-activity-hint { margin-top:16px;color:var(--soft);font-size:12px;line-height:1.7; }
.switch { position:relative;flex:none;width:46px;height:27px;padding:4px;border:0;border-radius:999px;background:var(--selected); }
.switch:before { content:"";position:absolute;inset:-9px -1px; }
.switch i { display:block;width:19px;height:19px;border-radius:50%;background:var(--soft);transition:transform .18s,background .18s; }
.switch[aria-checked="true"] { background:var(--bright); }
.switch[aria-checked="true"] i { background:var(--bg);transform:translateX(19px); }
.notebook { margin-top:20px;padding-left:18px;border-left:1px solid var(--bright);color:var(--text);font-size:13px;line-height:1.9;white-space:pre-wrap;overflow-wrap:anywhere; }
.card-time { display:block;margin-top:16px;color:var(--soft);font-size:12px;line-height:1.7; }
.reminder-body { margin-top:16px;color:var(--text);font-size:13px;line-height:1.75; }
.reminder-item { display:flex;align-items:baseline;gap:8px;padding:4px 0; }
.reminder-item i { width:4px;height:4px;flex:none;align-self:center;border-radius:50%;background:var(--bright); }
.runs-section { margin-top:20px;padding:22px 24px; }
.runs-disclosure { margin-top:8px; }
.notebook-disclosure { margin-top:0; }
.notebook-heading { display:flex;align-items:center;gap:10px;min-width:0; }
.notebook-heading { color:var(--text); }
.runs-disclosure>summary { display:flex;justify-content:space-between;align-items:center;gap:12px;min-height:44px;cursor:pointer;list-style:none;color:var(--soft);font-size:12px; }
.runs-disclosure>summary::-webkit-details-marker { display:none; }
.disclosure-label { display:flex;align-items:center;gap:8px;flex:none;color:var(--bright); }
.disclosure-chevron { font:20px/1 var(--font-cn);transition:transform .18s; }
.runs-disclosure[open] .disclosure-chevron { transform:rotate(180deg); }
.runs-disclosure .when-open,.runs-disclosure[open] .when-closed { display:none; }
.runs-disclosure[open] .when-open { display:inline; }
.has-failure { color:var(--danger); }
.runs-disclosure[open]>summary { padding-bottom:10px;border-bottom:1px solid var(--line); }
.refresh-button,.retry-button,.primary-button { position:relative;display:inline-flex;justify-content:center;align-items:center;min-height:34px;padding:6px 12px;border:0;border-radius:10px;font-size:12px;line-height:1.5; }
.refresh-button,.primary-button { background:var(--selected);color:var(--action-text); }
.refresh-button:before,.retry-button:before { content:"";position:absolute;inset:-5px 0; }
.runs-list { margin-top:16px; }
.run-row { display:grid;grid-template-columns:100px minmax(0,1fr) auto;gap:16px;padding:16px 0;border-bottom:1px solid var(--line); }
.run-row:first-child { padding-top:0; }
.run-row:last-child { border-bottom:0;padding-bottom:0; }
.run-kind { color:var(--text);font-size:12px;line-height:1.7; }
.run-kind strong,.run-main strong { font-weight:400; }
.run-kind small { display:block;margin-top:4px;color:var(--soft);font-size:12px; }
.run-main strong { display:none; }
.run-main p { margin-top:4px;color:var(--soft);font-size:12px;line-height:1.7;overflow-wrap:anywhere; }
.run-meta { color:var(--soft);font-size:11.5px;line-height:1.7;text-align:right; }
.run-meta>div { margin-top:4px; }
.run-status { display:inline-block;padding:3px 8px;border:0;border-radius:12px;background:var(--accent-soft);color:var(--soft);font-size:11.5px;line-height:1.6;white-space:nowrap; }
.run-status.failed,.run-status.interrupted,.run-status.partial { color:var(--danger);background:transparent; }
.run-status.completed,.run-status.success { color:var(--bright); }
.retry-button { display:flex;margin:12px 0 6px auto;border:1px solid var(--danger);background:transparent;color:var(--danger); }
.empty-state { padding:24px 0;text-align:center;color:var(--soft);font-size:12px;line-height:1.75; }
.journal-note { margin:12px 0 20px;color:var(--soft);font-size:12px;line-height:1.7; }
.journal-filter-label { display:block;margin-bottom:8px;color:var(--soft);font-size:12px; }
.session-picker { width:100%;height:38px;margin:0 0 20px;padding:0 10px;border:0;border-radius:12px;background:var(--track);color:var(--text);font:400 13px var(--font-cn); }
.session-picker option { background:var(--bg);color:var(--text); }
.journal-operation { min-width:0;padding:20px 0;border-top:1px solid var(--line); }
.journal-operation:last-child { padding-bottom:0; }
.journal-op-head,.journal-action-head { display:flex;justify-content:space-between;align-items:baseline;gap:12px; }
.journal-op-title { min-width:0;font-size:19px;line-height:1.5;overflow-wrap:anywhere; }
.journal-action-head strong { min-width:0;font-size:13px;font-weight:400;line-height:1.75;overflow-wrap:anywhere; }
.journal-meta,.journal-target { margin:6px 0;color:var(--soft);font-size:12px;line-height:1.7;overflow-wrap:anywhere; }
.journal-action { margin-top:16px;padding-top:16px;border-top:1px solid var(--line); }
.journal-stage,.journal-error { margin-top:8px;color:var(--soft);font-size:12px;line-height:1.7; }
.journal-error { color:var(--danger); }
.journal-stage summary,.journal-error summary { cursor:pointer;width:fit-content;min-height:44px;padding:8px 0; }
.journal-error pre,.journal-stage pre { max-height:240px;overflow:auto;white-space:pre-wrap;overflow-wrap:anywhere;margin:8px 0 0;padding:12px;border:1px solid var(--line);border-radius:10px;background:transparent;color:var(--soft);font:12px/1.7 ui-monospace,monospace;scrollbar-color:var(--selected) transparent; }
.journal-error pre { color:var(--danger); }
.journal-result { display:inline-flex;align-items:center;min-height:44px;max-width:100%;color:var(--bright);font-size:12px;overflow-wrap:anywhere;text-underline-offset:4px; }
.journal-more { display:flex;margin:24px auto 0; }
.auth-layer { position:fixed;z-index:20;inset:0;display:grid;place-items:center;padding:20px;background:rgba(29,24,21,.34);backdrop-filter:blur(18px);overflow:auto; }
.auth-card { width:min(360px,100%);padding:24px;border:0;border-radius:16px;background:var(--panel);box-shadow:var(--shadow); }
.auth-card h2 { margin-bottom:10px; }
.auth-card p { color:var(--soft);font-size:12px;line-height:1.7; }
.auth-card label { display:block;margin:20px 0 7px;color:var(--soft);font-size:12px; }
.auth-card input { width:100%;height:44px;padding:0 12px;border:1px solid var(--bright);border-radius:10px;background:transparent;color:var(--text);font-size:13px; }
.auth-card input::placeholder { color:var(--faint); }
.auth-card .auth-error { min-height:21px;margin:6px 0 10px;color:var(--danger); }
.auth-card button { width:100%;min-height:44px;background:var(--bright);color:var(--bg); }
.toast { position:fixed;z-index:30;left:50%;bottom:max(24px,env(safe-area-inset-bottom));max-width:calc(100% - 40px);transform:translate(-50%,15px);opacity:0;padding:10px 16px;border-radius:12px;background:var(--text);color:var(--bg);font-size:12px;line-height:1.7;transition:opacity .2s,transform .2s;pointer-events:none; }
.toast.show { opacity:1;transform:translate(-50%,0); }
@media(max-width:700px) {
  .activity-shell { padding-top:max(20px,env(safe-area-inset-top)); }
  .activity-panel,.activity-card { padding:20px; }
  .activity-grid { grid-template-columns:minmax(0,1fr);gap:16px; }
  .session-card,.wake-card,.notebook-card,.reminder-card { grid-column:auto; }
  .reminder-card { display:block; }
  .reminder-card .reminder-body { margin-top:12px; }
  .wake-clock { display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 16px; }
  .wake-date { margin:0; }
  .runs-section { margin-top:16px; }
  .session-picker { height:36px;font-size:12.5px;border-radius:10px; }
  .run-row { grid-template-columns:minmax(0,1fr) auto;gap:6px 14px; }
  .run-kind { grid-column:1; }
  .run-main { grid-column:1;grid-row:2; }
  .run-meta { grid-column:2;grid-row:1/3;max-width:110px; }
}
@media(max-width:360px) {
  .activity-panel,.activity-card { padding-inline:16px; }
  .card-top,.section-head { gap:8px; }
  .detail-links { gap:0 12px; }
  .run-row { column-gap:10px; }
  .run-meta { max-width:94px; }
  .refresh-button { padding-inline:9px; }
}
@media(pointer:coarse) { .auth-card input { font-size:16px; } }
@media(prefers-reduced-motion:reduce) { *,*:before { transition:none!important; } }
