@import url("./components.css");
@import url("./home.css");
@import url("./agent.css");
@import url("./proposal.css");
@import url("./product-truth.css");
@import url("./truth-document-native.css");

:root {
  color-scheme: light;
  --rail-width: 64px;
  --sidebar-width: 224px;
  --topbar-height: 58px;
  --canvas: #f2f2ef;
  --surface: #fff;
  --surface-soft: #f7f7f4;
  --surface-selected: #ebebe7;
  --line: #deded8;
  --line-strong: #cdcdc5;
  --text: #1c1c1a;
  --text-soft: #65655f;
  --text-muted: #888880;
  --accent: #20201e;
  --success: #385f45;
  --danger: #815048;
  --radius-control: 8px;
  --radius-card: 12px;
  --radius-panel: 16px;
  --radius-pill: 999px;
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  font-family: var(--font-ui);
}

html, body { background: var(--canvas); color: var(--text); }
body, button, input, textarea, select { font-family: var(--font-ui); }
#app { width: 100%; height: 100%; }
.app-product { width: 100%; height: 100dvh; display: grid; grid-template-columns: var(--rail-width) var(--sidebar-width) minmax(0, 1fr); background: var(--canvas); }
.app-product--without-sidebar { grid-template-columns: var(--rail-width) minmax(0, 1fr); }
.global-rail { grid-column: 1; grid-row: 1; z-index: 3; display: flex; flex-direction: column; align-items: center; padding: 13px 10px 14px; background: #1d1d1b; color: #f5f5f0; }
.argus-mark { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(255,255,255,.2); border-radius: 10px; font: 620 18px/1 var(--font-ui); letter-spacing: -.05em; }
.global-rail__nav { display: grid; gap: 8px; margin-top: 42px; }
.global-rail__nav a, .global-rail__bottom button { width: 40px; height: 40px; display: grid; place-items: center; border-radius: var(--radius-control); background: transparent; color: #a9a9a2; font-size: 19px; }
.global-rail__nav a:hover, .global-rail__nav a.is-current, .global-rail__bottom button:hover { color: white; background: rgba(255,255,255,.1); }
.global-rail__bottom { margin-top: auto; display: grid; gap: 8px; justify-items: center; }
.avatar { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; background: #dfded7; color: #292926; font-size: 12px; font-weight: 620; }
.global-rail .avatar { margin-top: 5px; border: 1px solid rgba(255,255,255,.2); background: #e9ddce; }
.context-sidebar { grid-column: 2; grid-row: 1; min-width: 0; display: flex; flex-direction: column; border-right: 1px solid var(--line); background: #eaeae6; }
.context-sidebar header { height: var(--topbar-height); padding: 11px 18px; border-bottom: 1px solid var(--line); display: grid; align-content: center; }
.context-sidebar header span { color: var(--text-muted); font-size: 10px; letter-spacing: .04em; }
.context-sidebar header strong { font-size: 15px; font-weight: 570; }
.context-sidebar nav { padding: 14px 10px; display: grid; gap: 3px; }
.context-sidebar nav a { height: 38px; padding: 0 10px; display: flex; align-items: center; gap: 10px; border-radius: var(--radius-control); color: #555550; font-size: 13px; }
.context-sidebar nav a i { font-size: 17px; }
.context-sidebar nav a:hover, .context-sidebar nav a.is-current { color: var(--text); background: rgba(255,255,255,.76); }
.context-sidebar nav a.is-current { font-weight: 550; box-shadow: inset 0 0 0 1px rgba(0,0,0,.025); }
.sidebar-foot { margin: auto 13px 15px; padding: 13px; border-top: 1px solid var(--line-strong); color: var(--text-soft); }
.sidebar-foot span { display: flex; align-items: center; gap: 7px; font-size: 11px; font-weight: 570; }
.sidebar-foot p { margin: 7px 0 0; font-size: 11px; line-height: 1.45; }
.application-frame { grid-column: 3; grid-row: 1; min-width: 0; height: 100dvh; display: grid; grid-template-rows: var(--topbar-height) minmax(0, 1fr); }
.app-product--without-sidebar .application-frame { grid-column: 2; }
.topbar { position: relative; z-index: 2; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; border-bottom: 1px solid var(--line); background: rgba(248,248,245,.94); backdrop-filter: blur(14px); }
.command-search { width: min(360px, 40vw); height: 34px; display: flex; align-items: center; gap: 9px; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--radius-control); color: var(--text-muted); background: white; font-size: 12px; text-align: left; }
.command-search span { flex: 1; }.command-search kbd { padding: 2px 5px; border: 1px solid var(--line); border-radius: 4px; background: var(--surface-soft); font: 10px/1.3 var(--font-mono); }
.topbar__actions { display: flex; align-items: center; gap: 10px; }.freshness-summary { color: var(--text-muted); font: 10px/1 var(--font-mono); }
.icon-button { width: 32px; height: 32px; display: grid; place-items: center; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--surface); font-size: 16px; }
.route-main { min-height: 0; overflow: auto; background: var(--canvas); }
.page-heading { max-width: 1180px; margin: 0 auto; }.page-heading h1 { margin: 0; font: 570 clamp(34px, 3vw, 48px)/.98 var(--font-ui); letter-spacing: -.045em; }.page-heading > p:last-child { max-width: 58ch; margin: 13px 0 0; color: var(--text-soft); font-size: 14px; line-height: 1.5; }
.page-heading.compact { width: 100%; height: 84px; max-width: none; margin: 0; padding: 18px 24px; display: flex; align-items: center; justify-content: space-between; border-bottom: 1px solid var(--line); background: var(--surface); }.page-heading.compact h1 { font-size: 27px; }.page-kicker, .meta-label { margin: 0 0 5px; color: var(--text-muted); font: 500 10px/1.2 var(--font-mono); letter-spacing: .055em; text-transform: uppercase; }
.button { min-height: 34px; padding: 0 13px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; border: 1px solid var(--line-strong); border-radius: var(--radius-control); background: var(--surface); color: var(--text); font-size: 12px; font-weight: 540; white-space: nowrap; transition: transform 140ms var(--ease-out), background 140ms ease; }.button:hover { background: var(--surface-soft); }.button:active { transform: translateY(1px); }.button--dark { border-color: #242422; background: #242422; color: #fff; }.button--dark:hover { background: #353532; }.button--material { background: rgba(255,255,255,.7); border-color: rgba(255,255,255,.6); backdrop-filter: blur(14px); }.button--full { width: 100%; }.button:disabled { opacity: .45; cursor: not-allowed; }

.create-proposal-button {
  min-width: 126px;
}

.create-proposal-button.is-loading {
  opacity: .78;
  cursor: wait;
}

.proposal-create-spinner {
  animation: proposal-create-spin 700ms linear infinite;
}

@keyframes proposal-create-spin {
  to { transform: rotate(360deg); }
}

@media (prefers-reduced-motion: reduce) {
  .proposal-create-spinner { animation: none; }
}
.control-button { min-height: 32px; padding: 0 9px; display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--line); border-radius: var(--radius-control); background: var(--surface); color: var(--text-soft); font-size: 11px; white-space: nowrap; }
.privacy-label, .approved-label { display: inline-flex; align-items: center; gap: 6px; font: 500 10px/1.2 var(--font-mono); letter-spacing: .03em; }.approved-label { color: var(--success); }
.status-text { color: var(--text-soft); font: 500 10px/1 var(--font-mono); text-transform: uppercase; letter-spacing: .04em; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0,0,0,0) !important; white-space: nowrap !important; border: 0 !important; }
.skip-link { position: fixed; z-index: 100; top: 10px; left: 76px; transform: translateY(-150%); padding: 8px 12px; border-radius: var(--radius-control); background: var(--text); color: white; }.skip-link:focus { transform: none; }
*:focus { outline: none; }
@media (max-width: 1150px) { :root { --sidebar-width: 196px; }.freshness-summary { display: none; }.page-heading.compact { padding-inline: 18px; } }
@media (max-width: 1060px) { :root { --sidebar-width: 196px; }.command-search { width: 360px; }.topbar__actions .icon-button { display:none; }.context-sidebar nav { padding-inline:8px; }.context-sidebar nav a { padding-inline:8px; }.sidebar-foot { margin-inline:10px;padding-inline:8px; } }
@media (max-width: 1023px) { .app-product { display: none !important; } .viewport-notice { display: grid; } }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; } }
