/* Sengi application theme. Adapted with owner authorization from onCall's
 * src/app/globals.css, (dashboard)/layout.tsx and ui primitives.
 * See docs/implementation/app-design.md for provenance. Deliberately loaded only by layouts/app. */
@font-face { font-family: Geist; src: url('/sengi/GeistVF.woff') format('woff'); font-weight: 100 900; font-display: swap; }
@font-face { font-family: 'Geist Mono'; src: url('/sengi/GeistMonoVF.woff') format('woff'); font-weight: 100 900; font-display: swap; }
.sengi {
  color-scheme: light;
  --background: 42 40% 97%; --foreground: 222 28% 12%;
  --muted-foreground: 220 10% 42%; --surface: 0 0% 100%;
  --surface-elevated: 42 45% 99%; --surface-muted: 43 22% 95%;
  --border: 220 14% 86%; --primary: 222 47% 18%; --primary-hover: 222 47% 14%;
  --ring: 210 85% 48%; --danger: 0 69% 44%;
  --color-canvas: hsl(var(--background)); --color-surface: hsl(var(--surface));
  --color-panel: hsl(var(--surface-elevated)); --color-border: hsl(var(--border));
  --color-text: hsl(var(--foreground)); --color-text-muted: hsl(var(--muted-foreground));
  --color-text-subtle: hsl(220 10% 46%); --color-sidebar: hsl(42 32% 96%);
  --color-accent: hsl(201 42% 30%); --color-accent-strong: hsl(var(--primary));
  --radius-control: 8px; --radius-card: 12px; --radius-panel: 16px;
  --motion-base: 200ms;
  background: var(--color-canvas); color: var(--color-text);
  font-family: Geist, 'Segoe UI', sans-serif; -webkit-font-smoothing: antialiased;
}
.sengi body { font-family: inherit; background: var(--color-canvas); }
.sengi :is(button,input,select,textarea) { font-family: inherit; }
.sengi :is(code,pre,.font-mono) { font-family: 'Geist Mono', monospace; }
.sengi :is(h1,h2,h3) { letter-spacing: -.025em; }
.sengi :is(.text-gray-900,.text-slate-900,.text-slate-950) { color: var(--color-text); }
.sengi :is(.text-gray-500,.text-gray-600,.text-slate-500,.text-slate-600) { color: var(--color-text-muted); }
.sengi :is(.text-orange-500,.text-orange-600,.text-orange-700,.text-blue-600,.text-blue-700) { color: var(--color-accent); }
.sengi :is(.bg-gray-50,.bg-slate-50,.bg-blue-50,.bg-orange-50) { background-color: hsl(var(--surface-muted)); }
.sengi :is(.border-gray-200,.border-slate-200,.border-blue-100) { border-color: var(--color-border); }
.sengi :is(.bg-blue-600,.bg-orange-600) { background-color: hsl(var(--primary)); }
.sengi :is(.hover\:bg-blue-700,.hover\:bg-orange-700):hover { background-color: hsl(var(--primary-hover)); }
.sengi :is(a,button,input,select,textarea):focus-visible { outline: 2px solid hsl(var(--ring)); outline-offset: 3px; }
.sengi .sengi-skip-link:focus { position: fixed; top: 12px; left: 12px; z-index: 100; padding: 12px 18px; background: white; border-radius: 8px; }
.sengi .sengi-sidebar { background: var(--color-sidebar); border-right: 1px solid var(--color-border); padding: 0 20px 16px; gap: 24px; }
.sengi .sengi-brand { margin: 0 -20px; padding: 20px 24px; flex-direction: column; align-items: flex-start; gap: 6px; border-bottom: 1px solid var(--color-border); }
.sengi .sengi-brand-link { display: block; }
.sengi .sengi-brand img { width: 102px; height: 68px; object-fit: contain; mix-blend-mode: multiply; }
.sengi .sengi-eyebrow { font-size: 10px; line-height: 16px; font-weight: 600; letter-spacing: .2em; text-transform: uppercase; color: var(--color-text-subtle); }
.sengi .sengi-nav-heading { color: var(--color-text-subtle); font-size: 10px; letter-spacing: .2em; padding: 0 8px; margin-bottom: 10px; }
.sengi .sengi-nav-link { align-items: center; min-height: 40px; padding: 9px 12px; border-radius: var(--radius-control); color: var(--color-text-muted); font-weight: 500; line-height: 20px; transition: background-color var(--motion-base); }
.sengi .sengi-nav-link:hover { background: var(--color-panel); color: var(--color-text); }
.sengi .sengi-nav-active,.sengi .sengi-nav-active:hover { background: var(--color-accent); color: white; }
.sengi .sengi-sidebar nav > ul { gap: 26px; }
.sengi .sengi-sidebar nav > ul > li:last-child { margin-left: -4px; margin-right: -4px; padding-top: 24px; }
.sengi .sengi-project-switcher { position: relative; }
.sengi .sengi-project-switcher #menu-button { gap: 10px; padding: 12px; border: 1px solid var(--color-border); border-radius: var(--radius-card); background: var(--color-panel); color: var(--color-text); font-size: 13px; }
.sengi .sengi-project-switcher #menu-button span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sengi .sengi-project-switcher #menu-button svg { width: 20px; height: 20px; flex-shrink: 0; }
.sengi .sengi-project-switcher [role=menu] { bottom: calc(100% + 8px); left: 0; width: 100%; border-radius: var(--radius-card); }
.sengi .sengi-topbar { height: 76px; box-shadow: none; background: rgba(255,252,246,.82); border-color: var(--color-border); backdrop-filter: blur(12px); }
.sengi .sengi-workspace-context { flex-shrink: 1; }
.sengi .sengi-profile-trigger { border-radius: var(--radius-control); padding: 6px 8px; font-weight: 500; }
.sengi .sengi-profile-trigger:hover { background: hsl(var(--surface-muted)); }
.sengi .sengi-profile-trigger svg { color: var(--color-text-subtle); background: transparent; }
.sengi .sengi-topbar [role=menu] { width: 240px; border-radius: var(--radius-card); }
.sengi [role=menuitem] { min-height: 36px; padding-top: 7px; padding-bottom: 7px; }
.sengi .sengi-main { padding: 28px; }
.sengi .sengi-content-wrap { padding: 0; }
.sengi .sengi-surface { min-height: calc(100dvh - 132px); padding: 28px; background: var(--color-surface); border: 1px solid var(--color-border); border-radius: var(--radius-panel); }
.sengi .sengi-surface > :is(.max-w-3xl,.max-w-5xl,.max-w-6xl) { max-width: none; }
.sengi .sengi-surface :is(h1,.sengi-page-header h2) { font-size: 24px; line-height: 32px; font-weight: 600; }
.sengi .sengi-surface :is(h2.text-xl,h3.text-2xl) { font-size: 18px; line-height: 26px; font-weight: 600; }
.sengi .sengi-surface > div > div:first-child > p:first-child.text-blue-700 { color: var(--color-text-subtle); font-size: 10px; text-transform: uppercase; letter-spacing: .2em; }
.sengi .sengi-surface :is(section.rounded-2xl,div.rounded-2xl) { border-radius: var(--radius-card); }
.sengi .sengi-surface :is(.shadow,.shadow-sm):not(input,button,a),.sengi .sengi-auth-card { box-shadow: none; border: 1px solid var(--color-border); border-radius: var(--radius-card); }
.sengi .sengi-surface .ring-black { --tw-ring-color: transparent; }
.sengi .sengi-page-header { position: static; margin: 0 0 12px; padding: 0; background: transparent; }
.sengi .sengi-page-header nav { margin-bottom: 12px; }
.sengi .sengi-page-header nav svg { width: 14px; height: 14px; }
.sengi .sengi-page-header nav a { font-size: 12px; }
.sengi :is(.sengi-button,button[type=submit],a.bg-blue-600) { min-height: 36px; border-radius: var(--radius-control); font-weight: 500; box-shadow: none; letter-spacing: -.01em; }
.sengi .sengi-button { border: 1px solid transparent; gap: 6px; }
.sengi .sengi-button.bg-white { border-color: var(--color-border); }
.sengi :is(input:not([type=checkbox],[type=radio],[type=hidden]),select,textarea) { border-radius: var(--radius-control); border: 1px solid var(--color-border); box-shadow: none; color: var(--color-text); font-size: 14px; min-height: 36px; }
.sengi :is(input,select,textarea):disabled { background: hsl(var(--surface-muted)); opacity: .6; }
.sengi :is(input,select,textarea).ring-red-300 { border-color: hsl(var(--danger)); }
.sengi input + button[type=submit] { margin-left: 8px; }
.sengi .sengi-surface table thead { background: var(--color-panel); }
.sengi .sengi-surface table th { color: var(--color-text-subtle); font-size: 10px; font-weight: 500; text-transform: uppercase; letter-spacing: .075em; padding-top: 10px; padding-bottom: 10px; }
.sengi .sengi-surface table td { font-size: 13px; }
.sengi .sengi-surface table tbody tr:hover { background-color: var(--color-panel); }
.sengi .sengi-table-card > .overflow-hidden { border: 1px solid var(--color-border); border-radius: var(--radius-card); box-shadow: none; }
.sengi .empty-state { padding: 32px 12px; }
.sengi .empty-state > svg { width: 32px; height: 32px; color: var(--color-text-subtle); }
.sengi .empty-state h3 { margin-top: 12px; font-size: 18px; line-height: 26px; }
.sengi .sengi-account-nav { padding: 16px 12px; background: var(--color-panel); }
.sengi .sengi-account-nav a { border: 0; border-radius: var(--radius-control); padding: 10px 12px; }
.sengi .sengi-account-nav a[aria-current=page] { background: hsl(var(--surface-muted)); color: var(--color-accent); }
.sengi .sengi-account-nav svg { width: 18px; height: 18px; }
.sengi .sengi-kv-card dd { overflow-wrap: anywhere; }
.sengi .sengi-auth { background-image: radial-gradient(circle at top left,hsl(210 55% 92% / .55),transparent 32%),radial-gradient(circle at top right,hsl(36 48% 92% / .75),transparent 28%); }
.sengi .sengi-auth img { width: 140px; mix-blend-mode: multiply; }
.sengi .sengi-auth h2 { font-size: 24px; font-weight: 600; }
.sengi .sengi-auth-card { border-radius: var(--radius-panel); }
@media (min-width:1024px) {
  .sengi #desktop-menu { width: 256px; }
  .sengi .sengi-workspace { padding-left: 256px; }
}
@media (max-width:1023px) {
  .sengi .sengi-topbar { height: 68px; }
  .sengi .sengi-topbar > a,.sengi .sengi-mobile-separator { display: none; }
  .sengi .sengi-main { padding: 20px; }
  .sengi .sengi-surface { min-height: calc(100dvh - 108px); padding: 24px; }
  .sengi #mobile-menu > div:first-child { background: rgba(22,32,39,.42); backdrop-filter: blur(4px); }
}
@media (max-width:639px) {
  .sengi .sengi-main { padding: 0; }
  .sengi .sengi-surface { min-height: calc(100dvh - 68px); border: 0; border-radius: 0; padding: 24px 16px; }
  .sengi .sengi-workspace-context .sengi-eyebrow { font-size: 9px; letter-spacing: .12em; }
  .sengi .sengi-surface :is(h1,.sengi-page-header h2) { font-size: 22px; line-height: 28px; }
  .sengi .sengi-surface section:is(.p-6,.p-8) { padding: 20px; }
  .sengi :is(.sengi-button,button[type=submit],a.bg-blue-600,.sengi-nav-link,[role=menuitem],input:not([type=checkbox],[type=radio],[type=hidden]),select) { min-height: 44px; }
  .sengi :is(input:not([type=checkbox],[type=radio],[type=hidden]),select,textarea) { font-size: 16px; min-width: 0; }
  .sengi .sengi-auth { padding-left: 16px; padding-right: 16px; }
  .sengi .sengi-table-card table td:has(.empty-state) { padding: 12px; }
}
@media (prefers-reduced-motion:reduce) { .sengi { --motion-base: 0ms; } }
.sengi .sengi-auth-primary { display: flex; width: 100%; justify-content: center; align-items: center; gap: 10px; min-height: 44px; padding: 10px 16px; background: hsl(var(--primary)); color: white; border: 1px solid hsl(var(--primary)); border-radius: var(--radius-control); font-weight: 500; box-shadow: none; }
.sengi .sengi-auth-primary:hover { background: hsl(var(--primary-hover)); }
.sengi .sengi-auth-secondary { border-top: 1px solid var(--color-border); padding-top: 20px; color: var(--color-text-muted); font-size: 13px; }
.sengi .sengi-auth-secondary summary { cursor: pointer; border-radius: var(--radius-control); }
.sengi .sengi-auth-secondary summary:focus-visible { outline: 2px solid hsl(var(--ring)); outline-offset: 4px; }
.sengi :is(.sengi-button,button[type=submit]) { flex-shrink: 0; white-space: nowrap; }
@media (max-width:639px) {
  .sengi .sengi-table-card table,.sengi .sengi-table-card tbody { display: block; min-width: 0; }
  .sengi .sengi-table-card thead { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
  .sengi .sengi-table-card tbody tr { display: grid; gap: 12px; padding: 16px; }
  .sengi .sengi-table-card tbody td { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 0; white-space: normal; overflow-wrap: anywhere; }
  .sengi .sengi-table-card td[data-label]:before { content: attr(data-label); color: var(--color-text-subtle); font-size: 11px; flex: 1; }
  .sengi .sengi-table-card td:has(.empty-state) { display: block; }
}

.sengi .sengi-button.bg-rose-600 { background-color: hsl(var(--danger)); }
.sengi .sengi-button.bg-rose-600:hover { filter: brightness(.95); }

.sengi .sengi-project-context { text-align: left; }
.sengi .sengi-project-context .sengi-eyebrow { font-size: 9px; letter-spacing: .12em; margin-bottom: 2px; }
.sengi .sengi-account-return { margin-bottom: 20px; }
.sengi .sengi-account-return a { display: inline-flex; align-items: center; gap: 8px; color: var(--color-accent); font-size: 13px; font-weight: 500; }
.sengi .sengi-account-return a:hover { text-decoration: underline; text-underline-offset: 3px; }
.sengi .sengi-surface table a { text-decoration: underline; text-underline-offset: 3px; }
@media (max-width:639px) { .sengi .sengi-account-return a { min-height: 44px; } }
