/* Quiet workspace direction: paper-like hierarchy, restrained surfaces. */
body { background: #fff; letter-spacing: 0; }
.sidebar { background: #f7f7f5; color: var(--muted); border-right: 1px solid var(--line); }
.sidebar::before { display: none; }
.brand { height: 72px; color: var(--ink); padding: 0 20px; }
.brand-name { font-family: var(--body); font-size: 17px; font-weight: 650; letter-spacing: .04em; }
.brand-sub { color: var(--subtle); letter-spacing: .08em; }
.side-nav { padding: 0 9px; }
.nav-label { color: #9a9a96; font-weight: 600; letter-spacing: .08em; }
.nav-link { min-height: 40px; color: #626260; border-radius: 7px; }
.nav-link:hover { color: var(--ink); background: #eeeeeb; }
.nav-link.active { color: var(--ink); background: #e9e9e6; box-shadow: none; font-weight: 600; }
.nav-link.active .icon { color: var(--ink); }
.nav-badge { background: #787875; }
.topbar { background: #fff; backdrop-filter: none; padding: 0 30px; }
.avatar, .mini-avatar { background: #ecece9; color: #3f403f; border-radius: 8px; }
.dropdown-item.active { background: #efefec; color: var(--ink); }
.page { max-width: 1440px; padding: 34px 42px 64px; }
.page-head { margin-bottom: 28px; }
.eyebrow { color: var(--subtle); font-weight: 600; letter-spacing: .09em; }
h1 { font-family: var(--body); font-size: 27px; font-weight: 630; letter-spacing: -.02em; }
h2, h3, h4 { letter-spacing: -.01em; }
.page-subtitle { max-width: 720px; }
.btn { border-color: var(--line); border-radius: 7px; font-weight: 550; }
.btn:hover { transform: none; box-shadow: none; background: #f7f7f5; }
.btn.primary, .btn.dark, .btn.copper { color: #fff; background: #202123; border-color: #202123; }
.btn.primary:hover, .btn.dark:hover, .btn.copper:hover { background: #343537; border-color: #343537; }
.btn.danger { color: #8c4d50; background: #fff; border-color: #ddc9ca; }
.grid { gap: 24px; }
.grid.sidebar-layout { grid-template-columns: minmax(0, 1fr) 300px; gap: 38px; }
.card { background: transparent; border: 0; border-radius: 0; box-shadow: none; }
.card.padded { padding: 22px 0; border-top: 1px solid var(--line); }
.card-head { padding: 0 0 13px; min-height: auto; border-color: var(--line); }
.card-body { padding: 18px 0 0; }
.grid.four { gap: 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.grid.four > .metric { border-right: 1px solid var(--line); }
.grid.four > .metric:last-child { border-right: 0; }
.metric { padding: 20px 22px; }
.metric::after { display: none; }
.metric-label .icon { display: none; }
.metric-value { font-family: var(--body); font-size: 25px; font-weight: 590; }
.metric-note, .metric-note.warn { color: var(--muted); }
.hero-panel { min-height: 180px; color: var(--ink); background: #f9f9f8; border: 1px solid var(--line); border-radius: 12px; padding: 26px 28px; }
.hero-panel::after { display: none; }
.hero-copy .eyebrow { color: var(--subtle); }
.hero-copy h2 { font-family: var(--body); font-size: 23px; font-weight: 620; }
.hero-copy p { color: var(--muted); }
.flow-rail::before { background: #d9d9d5; }
.flow-step { color: #868682; }
.flow-dot { width: 32px; height: 32px; background: #fff; border-color: #d4d4d0; color: #777773; }
.flow-step.done .flow-dot { background: #e8efeb; border-color: #cfded5; color: #3f6254; }
.flow-step.current .flow-dot { background: #202123; border-color: #202123; color: #fff; box-shadow: none; }
.flow-step.current { color: var(--ink); }
.status { border-radius: 5px; font-weight: 550; }
.status.blue { background: #f0f3f1; color: #4f655b; }
.status.green { background: #f2f7f4; color: #496457; }
.status.red { background: #faf1f1; color: #8f5659; }
.status.yellow { background: #f8f5eb; color: #756b4d; }
.status.purple { background: #f4f2f6; color: #686270; }
.status.copper { background: #f5f2ef; color: #71665e; }
.assumption { background: #f8f5eb; border-color: #e6dfc9; color: #71684e; font-weight: 550; }
.toolbar { border-width: 0 0 1px; border-radius: 0; padding: 10px 0 14px; }
.search-box input, .filter-select { background: #f8f8f6; }
.table-wrap { border-width: 0; border-radius: 0; }
th { background: #fafaf9; border-color: var(--line); }
td { border-color: #eeeeeb; }
tbody tr:hover { background: #fafaf9; }
.link { color: var(--ink); text-decoration: underline; text-decoration-color: #c8c8c4; text-underline-offset: 3px; }
.tabs { padding: 0; background: transparent; }
.tab { padding: 0 16px; }
.tab:first-child { padding-left: 2px; }
.tab.active { color: var(--ink); border-color: var(--ink); }
.task { padding: 14px 0; }
.task-icon { background: #f1f1ef; color: #5d5d5a; }
.ai-banner { border-color: #dfe9e3; background: #f2f7f4; }
.analysis-block { background: #fafaf9; border-left-width: 2px; }
.document { max-width: 860px; padding: 14px 4px 36px; }
.doc-cover { padding: 16px 0 24px; }
.doc-cover h2 { font-family: var(--body); font-weight: 620; }
.doc-number { background: #eeeeeb; color: #5e5e5a; }
.editable:hover { background: #fafaf9; }
.choice.selected { border-color: #7c7c77; background: #f4f4f1; box-shadow: none; }
.switch.on { background: #4f665b; }
.stepper { border-width: 1px 0; border-radius: 0; padding-left: 0; padding-right: 0; }
.stepper-item.active { color: var(--ink); }
.stepper-item.active .step-index { background: var(--ink); box-shadow: none; }
.compare { border-radius: 8px; }
.modal { box-shadow: 0 16px 42px rgba(32,33,35,.12); }
.drawer { box-shadow: -12px 0 32px rgba(32,33,35,.08); }
.toast { background: #202123; box-shadow: 0 8px 22px rgba(32,33,35,.12); }
.login-page { background: #fff; }
.login-story { background: #f7f7f5; color: var(--ink); border-right: 1px solid var(--line); }
.login-story::before { display: none; }
.login-thesis .eyebrow { color: var(--subtle); }
.login-thesis h1 em { color: #496457; }
.login-thesis p, .login-chain span { color: var(--muted); }
.login-chain i { background: #cfcfca; }
.login-foot { color: var(--subtle); }
.chart-bars { border-bottom: 1px solid var(--line); }
.donut { background: #fff; border-color: #dfe8e3; }

@keyframes shimmer { 100% { transform: translateX(100%); } }
@keyframes fade { from { opacity: 0; } }
@keyframes modalIn { from { opacity: 0; transform: translateY(8px) scale(.98); } }
@keyframes toastIn { from { opacity: 0; transform: translateY(10px); } }
@keyframes slide { from { transform: translateX(20px); opacity: 0; } }

@media (max-width: 1180px) {
  :root { --sidebar: 218px; }
  .page { padding: 22px 22px 45px; }
  .grid.four { grid-template-columns: repeat(2, minmax(0,1fr)); }
  .hero-panel { grid-template-columns: 1fr; }
  .choice-grid { grid-template-columns: repeat(2, minmax(0,1fr)); }
}
@media (max-width: 900px) {
  .sidebar { transform: translateX(-100%); transition: transform .2s ease; box-shadow: 8px 0 24px rgba(32,33,35,.08); }
  .sidebar.open { transform: translateX(0); }
  .main-shell { margin-left: 0; }
  .mobile-toggle { display: grid; }
  .grid.sidebar-layout, .grid.three { grid-template-columns: 1fr; }
  .span-2 { grid-column: auto; }
  .login-page { grid-template-columns: 1fr; }
  .login-story { min-height: 380px; padding: 38px; }
  .login-foot { display: none; }
  .insight-row { grid-template-columns: 1fr; }
  .insight-row-actions { align-items: center; }
}
@media (max-width: 650px) {
  .topbar { padding: 0 12px; }
  .user-meta { display: none; }
  .page { padding: 18px 13px 38px; }
  .page-head { flex-direction: column; }
  .page-actions { width: 100%; justify-content: flex-start; }
  h1 { font-size: 24px; }
  .grid.two, .grid.four, .form-grid, .info-list { grid-template-columns: 1fr; }
  .flow-rail { grid-template-columns: repeat(3, 1fr); row-gap: 15px; }
  .flow-rail::before { display: none; }
  .hero-panel { padding: 21px; }
  .toolbar { align-items: stretch; flex-direction: column; }
  .search-box { min-width: 0; }
  .filter-select { width: 100%; }
  .compare { grid-template-columns: 1fr; }
  .compare-pane + .compare-pane { border-left: 0; border-top: 1px solid var(--line); }
  .transcript-line { grid-template-columns: 44px 1fr; }
  .transcript-text { grid-column: 2; }
  .choice-grid { grid-template-columns: 1fr; }
  .insight-fields { grid-template-columns: 1fr; gap: 14px; }
  .insight-row { padding: 17px 15px; }
  .insight-row-actions { flex-wrap: wrap; }
  .login-story { min-height: 330px; padding: 28px 24px; }
  .login-form-wrap { padding: 34px 20px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}