:root{
  --tea-bg:#eef6e8;
  --tea-panel:#fbfdf9;
  --tea-ink:#203126;
  --tea-muted:#607064;
  --tea-line:#d5e1d2;
  --tea-accent:#557c5e;
  --tea-soft:#f2f7ef;
  --tea-danger:#8f4d49;
  --tea-shell-height:52px;
  --tea-radius-sm:8px;
  --tea-radius:14px;
  --tea-radius-lg:20px;
  --tea-page-gutter:clamp(14px,2.2vw,28px);
  --tea-shadow-subtle:0 8px 28px color-mix(in srgb,var(--tea-ink) 7%,transparent);
  --tea-font-sans:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  --tea-font-mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;
  color-scheme:light;
}
:root[data-tea-theme="gitea"]{
  --tea-bg:#f6f8fa;
  --tea-panel:#ffffff;
  --tea-ink:#1f2328;
  --tea-muted:#656d76;
  --tea-line:#d0d7de;
  --tea-accent:#4183c4;
  --tea-soft:#f6f8fa;
  --tea-danger:#cf222e;
  color-scheme:light;
}
:root[data-tea-theme="dark"]{
  --tea-bg:#111812;
  --tea-panel:#182119;
  --tea-ink:#dce8dd;
  --tea-muted:#9caf9e;
  --tea-line:#334238;
  --tea-accent:#9fcf9f;
  --tea-soft:#202b22;
  --tea-danger:#df928a;
  color-scheme:dark;
}
:root{
  --bg:var(--tea-bg);--panel:var(--tea-panel);--ink:var(--tea-ink);--muted:var(--tea-muted);
  --line:var(--tea-line);--matcha:var(--tea-accent);--tea:var(--tea-accent);--soft:var(--tea-soft);--bad:var(--tea-danger);
  --th-page:var(--tea-bg);--th-paper:var(--tea-panel);--th-paper-solid:var(--tea-panel);--th-ink:var(--tea-ink);
  --th-muted:var(--tea-muted);--th-accent:var(--tea-accent);--th-accent-strong:var(--tea-accent);
  --th-wash:var(--tea-soft);--th-wash-soft:var(--tea-soft);--th-line:var(--tea-line);
  --paper:var(--tea-bg);--green:var(--tea-accent);--light:var(--tea-soft);
}
html,body{background-color:var(--tea-bg);color:var(--tea-ink)}
.tea-shell-ready [data-tea-legacy-nav]{display:none!important}
.tea-app-shell{
  min-height:var(--tea-shell-height);display:flex;align-items:center;gap:14px;padding:7px 16px;
  position:sticky;top:0;z-index:1000;background:color-mix(in srgb,var(--tea-panel) 94%,transparent);
  border-bottom:1px solid var(--tea-line);margin-bottom:14px;backdrop-filter:blur(12px);font:13px/1.2 system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:var(--tea-ink);
}
.tea-app-shell *{box-sizing:border-box}.tea-shell-brand{display:inline-flex;align-items:center;gap:7px;font-weight:800;text-decoration:none;white-space:nowrap}
.tea-shell-brand:hover{text-decoration:none}.tea-shell-brand-mark{font-size:18px}.tea-shell-nav{display:flex;align-items:center;gap:3px;overflow-x:auto;scrollbar-width:none}
.tea-shell-nav::-webkit-scrollbar{display:none}.tea-shell-nav a{padding:7px 9px;border-radius:8px;color:var(--tea-muted);text-decoration:none;white-space:nowrap}
.tea-shell-nav-sep{width:1px;height:20px;background:var(--tea-line);margin:0 4px;flex:0 0 auto}
.tea-shell-nav a:hover{background:var(--tea-soft);color:var(--tea-ink);text-decoration:none}.tea-shell-nav a[aria-current="page"]{background:var(--tea-soft);color:var(--tea-ink);font-weight:700}
.tea-shell-spacer{flex:1}.tea-shell-theme{display:flex;align-items:center;gap:6px;color:var(--tea-muted);white-space:nowrap}.tea-shell-theme select{border:1px solid var(--tea-line);border-radius:8px;background:var(--tea-panel);color:var(--tea-ink);padding:5px 24px 5px 8px;font:inherit}
.tea-shell-gitea{color:var(--tea-muted);text-decoration:none;padding:6px 0;white-space:nowrap}.tea-shell-gitea:hover{color:var(--tea-ink)}
:root[data-tea-theme] input,:root[data-tea-theme] select,:root[data-tea-theme] textarea,:root[data-tea-theme] button{color:var(--tea-ink)}
:root[data-tea-theme="dark"] .teahub-body{background:var(--tea-bg)}
:root[data-tea-theme="dark"] .teahub-panel,
:root[data-tea-theme="dark"] .panel,
:root[data-tea-theme="dark"] .post,
:root[data-tea-theme="dark"] .stat,
:root[data-tea-theme="dark"] .summary,
:root[data-tea-theme="dark"] .job{background:var(--tea-panel);border-color:var(--tea-line);box-shadow:none}
:root[data-tea-theme="dark"] input,:root[data-tea-theme="dark"] select,:root[data-tea-theme="dark"] textarea,:root[data-tea-theme="dark"] button{background:var(--tea-panel);border-color:var(--tea-line)}
:root[data-tea-theme="dark"] .post.thought{background:var(--tea-soft)}
@media(max-width:780px){.tea-app-shell{gap:8px;padding-inline:10px}.tea-shell-brand span:last-child{display:none}.tea-shell-theme label{display:none}.tea-shell-gitea{display:none}.tea-shell-nav a{padding:7px 7px}}
body > .tea-app-shell + header.top:not([data-tea-legacy-nav]){top:var(--tea-shell-height)}
:root[data-tea-theme="dark"] .btn,
:root[data-tea-theme="dark"] .btn.primary,
:root[data-tea-theme="dark"] .filters button,
:root[data-tea-theme="dark"] .filters .on,
:root[data-tea-theme="dark"] .new,
:root[data-tea-theme="dark"] .table th,
:root[data-tea-theme="dark"] .drawer,
:root[data-tea-theme="dark"] .lab,
:root[data-tea-theme="dark"] .first{background:var(--tea-panel);color:var(--tea-ink);border-color:var(--tea-line)}
:root[data-tea-theme="dark"] .lead code,
:root[data-tea-theme="dark"] .inputs>div>code{background:var(--tea-soft);color:var(--tea-accent)}


/* Shared application primitives. Layout stays page-specific; chrome and controls converge here. */
:root[data-tea-view="home"] body,
:root[data-tea-view="supervisor"] body,
:root[data-tea-view="chatter"] body,
:root[data-tea-view="logs"] body,
:root[data-tea-view="system"] body{font-family:var(--tea-font-sans)}
:root[data-tea-view] :focus-visible{outline:2px solid var(--tea-accent);outline-offset:2px}
:root[data-tea-view="supervisor"] main h1,
:root[data-tea-view="chatter"] main h1,
:root[data-tea-view="logs"] main h1,
:root[data-tea-view="system"] main h1{letter-spacing:-.035em;font-weight:750}

:root[data-tea-view="home"] .teahub-panel,
:root[data-tea-view="system"] .teahub-panel,
:root[data-tea-view="supervisor"] .summary,
:root[data-tea-view="supervisor"] .job,
:root[data-tea-view="chatter"] .post,
:root[data-tea-view="logs"] .stat,
:root[data-tea-view="logs"] .panel,
:root[data-tea-view="logs"] .drawer{
  background:var(--tea-panel);border-color:var(--tea-line);border-radius:var(--tea-radius);
  box-shadow:var(--tea-shadow-subtle)
}
:root[data-tea-view="chatter"] .post.thought{background:var(--tea-soft)}
:root[data-tea-view="supervisor"] .btn,
:root[data-tea-view="chatter"] input,
:root[data-tea-view="chatter"] button,
:root[data-tea-view="logs"] input,
:root[data-tea-view="logs"] select,
:root[data-tea-view="logs"] button,
:root[data-tea-view="system"] button,
:root[data-tea-view="system"] input,
:root[data-tea-view="system"] select{
  background:var(--tea-panel);color:var(--tea-ink);border-color:var(--tea-line);border-radius:var(--tea-radius-sm)
}
:root[data-tea-view="supervisor"] .meta,
:root[data-tea-view="logs"] .kicker,
:root[data-tea-view="system"] .teahub-kicker{font-family:var(--tea-font-mono)}

/* Chatter's filter strip is contextual toolbar chrome, attached to the app shell. */
:root[data-tea-view="chatter"] body>.tea-app-shell{margin-bottom:0}
:root[data-tea-view="chatter"] header.top{
  height:48px;background:var(--tea-panel);border-color:var(--tea-line);box-shadow:none
}
:root[data-tea-view="chatter"] .filters .on{background:var(--tea-soft);border-color:var(--tea-line)}
:root[data-tea-view="chatter"] .new{background:var(--tea-panel);border-color:var(--tea-line);box-shadow:var(--tea-shadow-subtle)}

/* Oracle keeps its editorial layout; only the duplicated site chrome becomes a compact local toolbar. */
:root[data-tea-view="oracle"] body>.tea-app-shell{margin-bottom:0}
:root[data-tea-view="oracle"] header.top{
  min-height:44px;height:44px;justify-content:flex-end;border-color:var(--tea-line);font-family:var(--tea-font-sans)
}
:root[data-tea-view="oracle"] header.top nav{gap:18px;font-size:12px}

/* Merman is now a first-class app view; its old global nav is hidden by the shared shell. */
:root[data-tea-view="merman"] main{padding-top:2px}
