/* CW / editorial workspace — Schibsted Grotesk + Martian Mono.
   Local fonts, square geometry, warm paper and a restrained ink palette. */
@font-face {
  font-family: 'Schibsted Grotesk';
  src: url('/fonts/schibstedgrotesk.ttf') format('truetype');
  font-weight: 400 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Martian Mono';
  src: url('/fonts/martianmono.ttf') format('truetype');
  font-weight: 100 800;
  font-style: normal;
  font-display: swap;
}
:root {
  --ink: #272b25;
  --paper: #f6f5f0;
  --surface: #fffefa;
  --line: #dcded4;
  --secondary: #6c7166;
  --accent: #e9edcf;
  --purple: var(--ink);
  --border: var(--line);
  --muted: var(--secondary);
  --green: #386852;
  --mono: 'Martian Mono', monospace;
  font-family: 'Schibsted Grotesk', sans-serif;
  color: var(--ink);
  background: var(--paper);
  font-size: 14px;
  -webkit-font-smoothing: antialiased;
}
/* Controls and containers share one geometry, including native selects. */
button, input, select, textarea, .button, .panel, .stat, .workspace,
.workspace-icon, .nav, .count, .small-count, .sidebar-note, .icon-button,
.focus-banner, .focus-icon, .badge, .client-mark, .view-switch,
.board-column, .board-card, .week-day, .pipeline-stage, .stage-number,
.job, .budget, .action-box, .comment, .modal, .plan-row, .invoice-row,
.section-note, .demo-pill, .step, #toast {
  border-radius: 0;
}
button:focus-visible, a:focus-visible {
  outline: 2px solid #566c39;
  outline-offset: 4px;
}
a { color: #3d5832; text-underline-offset: 3px; }
.sidebar { background: #efefe8; border-color: #d9dccf; }
.brand { font-size: 25px; font-weight: 650; letter-spacing: -1.2px; gap: 10px; }
.brand-mark {
  background: var(--ink); transform: none; padding: 0; letter-spacing: 0;
  border-radius: 0; width: 29px; height: 29px; font-weight: 500;
  font-family: var(--mono); font-size: 17px; line-height: 1;
}
.brand span:last-child { font-size: 12px; letter-spacing: -.2px; color: #707669; margin-top: 4px; }
.workspace { background: #f9f9f2; border-color: #d6d9cd; margin-top: 29px; }
.workspace-icon { background: #e5e8d8; color: #616a52; }
.workspace b { font-size: 12px; font-weight: 600; }
.workspace small, .profile small { font-size: 11px; color: var(--secondary); }
.nav-label, .eyebrow {
  font-family: var(--mono); font-size: 9px; line-height: 1.6;
  letter-spacing: 1px; font-weight: 400; color: #747b6a;
}
.nav { color: #62695c; font-size: 13px; font-weight: 450; border-left: 2px solid transparent; padding-left: 10px; }
.nav:hover { background: #e6e9dc; }
.nav.active { background: #e1e6d2; color: #303c25; border-left-color: #3b4d29; font-weight: 600; }
.nav .count, .small-count { background: #e6e9dc; color: #576346; font-family: var(--mono); font-size: 9px; font-weight: 400; }
.sidebar-note { background: none; border-top: 1px solid #d1d6c6; margin: 23px 9px 15px; padding: 15px 0 0; font-size: 11px; color: #7c8372; }
.sidebar-note b { color: #4d5644; font-weight: 550; }
.profile { border-top-color: #d1d6c6; }
.profile b { font-size: 11px; font-weight: 550; }
.avatar { background: #e4e7d8; color: #58644d; font-family: var(--mono); font-size: 9px; font-weight: 400; }
.topbar { height: 66px; background: var(--paper); color: #838879; border-bottom-color: #dcded4; }
.breadcrumb { font-size: 11px; }
.breadcrumb strong { color: #454d3b; font-weight: 500; }
.role-select { background: #eeefe7; color: #57604d; border: 1px solid #d8ddcf; }
.demo-pill { background: transparent; border-color: #cccfbf; color: #6b735d; font-family: var(--mono); font-size: 8px; letter-spacing: .4px; padding: 6px 8px; }
.icon-button, .chevron { color: #79816d; }
.icon-button:hover { color: #2d3c24; background: #e6eadc; }
.content { padding-top: 35px; }
.page-heading { margin-bottom: 28px; }
.eyebrow { margin-bottom: 10px; }
.page-heading h1 { font-size: 34px; line-height: 1.15; letter-spacing: -1.35px; font-weight: 500; margin-bottom: 11px; }
.page-heading p { color: #72796a; font-size: 12px; }
.button { background: var(--surface); border-color: #c9cfc0; padding: 10px 15px; color: #46513b; font-size: 12px; font-weight: 500; min-height: 37px; text-decoration: none; }
.button:hover { background: #e9eddc; border-color: #9da98d; }
.button.primary { background: #2d3627; border-color: #2d3627; color: #fffef7; box-shadow: none; }
.button.primary:hover { background: #47573a; border-color: #47573a; }
.button.danger { border-color: #d7bfb1; color: #97513b; }
.button-group { gap: 8px; }
.stats { gap: 0; border: 1px solid #d4d9ca; margin-bottom: 25px; background: var(--surface); }
.stat { border: 0; border-right: 1px solid #d4d9ca; background: transparent; padding: 20px 22px; min-height: 115px; }
.stat:last-child { border-right: 0; }
.stat-name { font-size: 11px; color: #6e7863; margin-bottom: 13px; }
.stat-name svg { color: #82906f; }
.stat-value { font-size: 33px; line-height: 1.15; font-weight: 450; letter-spacing: -1px; font-variant-numeric: tabular-nums; }
.stat-bottom { display: block; margin: 8px 0 0; font-family: var(--mono); font-size: 8px; color: #77816b; letter-spacing: -.15px; }
.focus-banner { background: #ebeedb; border-color: #d7ddc2; padding: 16px 20px; margin-bottom: 25px; }
.focus-icon { background: transparent; color: #596b3a; border-right: 1px solid #cbd4b3; width: 37px; }
.focus-banner b { font-size: 12px; font-weight: 550; color: #3c4b2d; }
.focus-banner p { font-size: 11px; color: #778363; }
.focus-banner button { color: #3c4b2d; font-size: 11px; font-weight: 500; }
.panel { border-color: #d8ddce; background: var(--surface); }
.panel-head { padding: 19px 21px; }
.panel-head h2 { font-size: 13px; font-weight: 550; letter-spacing: -.2px; }
.panel-head p { color: #78836d; font-size: 11px; }
.panel-head svg { color: #78866b; }
.text-button { color: #6a785a; font-size: 10px; }
.tabs { gap: 23px; border-bottom-color: #dce1d2; }
.tab { font-size: 11px; color: #838c77; }
.tab.active { color: #343f29; border-bottom-color: #4a5c34; font-weight: 600; }
.tab span { background: #edf0e3; color: #586948; }
.toolbar { border-bottom-color: #e0e5d7; }
.search input { border-color: #d7decd; background: #f8f9f2; height: 34px; color: #3e4d30; font-size: 11px; }
.search svg { color: #8a967c; top: 10px; }
input::placeholder, textarea::placeholder { color: #909985; }
.filter { color: #6d7b5d; border-color: #d7decd; background: var(--surface); font-size: 10px; }
.view-switch { border-color: #d7decd; }
.view-switch button { color: #8a967c; }
.view-switch button.active { background: #e6ecd9; color: #465b2f; }
.task-table th { background: #f1f4e9; color: #6c795c; font-family: var(--mono); font-size: 8px; letter-spacing: .1px; border-bottom-color: #dce2d2; padding-top: 12px; padding-bottom: 12px; }
.task-table td { border-bottom-color: #e8ecdf; font-size: 11px; }
.task-table tbody tr:hover { background: #f1f5e7; }
.ticket-id { font-family: var(--mono); font-size: 8px; line-height: 1.7; letter-spacing: .1px; color: #7c8a6b; }
.ticket-title { font-size: 12px; font-weight: 450; line-height: 1.5; margin-top: 5px; color: #35442a; }
.client-inline { color: #718260; font-size: 10px; }
.client-mark { background: #edf1e2; color: #72845d; font-family: var(--mono); font-weight: 400; font-size: 8px; }
.badge { color: #718165; background: #eef2e6; padding: 5px 7px; font-size: 9px; line-height: 1.4; }
.badge.working { color: #506f75; background: #e6f0ee; }
.badge.planning { color: #647258; background: #ebefdf; }
.badge.plan_review, .badge.result_review { color: #8b6e30; background: #f4ecd3; }
.badge.ready { color: #5b6d8b; background: #eaf0f3; }
.badge.accepted, .badge.invoiced { color: #46714d; background: #e7efdd; }
.badge.cancelled { color: #96604e; background: #f4e7dd; }
.priority { color: #869279; font-size: 10px; }
.priority.high { color: #a67148; }
.subtle, .table-footer { color: #7d8a6d; font-size: 10px; }
.table-footer { border-top-color: #e2e7d8; font-family: var(--mono); font-size: 8px; }
.review-item+.review-item { border-top-color: #e4e9da; }
.review-item small { color: #88967a; font-family: var(--mono); font-size: 8px; }
.review-item h3 { font-size: 12px; font-weight: 450; line-height: 1.6; color: #3c4b31; }
.review-meta { color: #859474; font-size: 10px; }
.review-meta b { color: #526b3f; font-weight: 450; font-size: 12px; font-variant-numeric: tabular-nums; }
.billing-card { background: #e9efda; border-color: #d5dfbf; }
.billing-amount { color: #364a27; font-size: 33px; font-weight: 450; letter-spacing: -1px; }
.billing-body p, .billing-line { color: #7b8c62; font-size: 11px; }
.billing-line b { color: #516a3a; font-family: var(--mono); font-size: 9px; }
.billing-body .button { color: #496232; background: #f8faef; border-color: #c6d2b2; }
.activity .avatar { background: #edf1e2; }
.activity p { color: #7e8c6f; font-size: 11px; }
.activity b { color: #4b603c; font-weight: 500; }
.activity small { color: #94a181; font-family: var(--mono); font-size: 8px; }
.bottom-line { color: #95a087; font-family: var(--mono); font-size: 8px; }
.board-column { background: #f0f4e7; }
.board-column h3 { color: #6b7d59; font-size: 11px; }
.board-card { border-color: #dbe3ce; background: #fffefa; }
.board-card:hover { border-color: #9bb480; }
.board-card h4 { color: #415932; font-size: 12px; font-weight: 450; }
.client-card h2 { font-weight: 450; font-size: 22px; letter-spacing: -.6px; }
.client-card p, .client-card footer { color: #7e926b; font-size: 11px; }
.week-day { background: var(--surface); border-color: #d8e1cc; }
.week-day h3 { color: #70875c; font-family: var(--mono); font-size: 9px; }
.week-day .board-card { background: #f2f6e9; }
.stage-number { background: #e8efda; color: #6d8756; font-family: var(--mono); font-size: 10px; }
.pipeline-stage h3 { font-size: 15px; font-weight: 450; letter-spacing: -.3px; }
.pipeline-stage p { color: #7c9268; font-size: 12px; }
.section-note { background: #f9fbf2; border-color: #d7e1c9; color: #72895d; font-size: 12px; }
.drawer, .drawer-header, .modal { background: var(--surface); }
.drawer-header { border-bottom-color: #dce4d1; }
.drawer-header span { color: #7e946c; }
.drawer-body h2 { font-size: 28px; letter-spacing: -1px; font-weight: 450; color: #334b25; }
.description { color: #748c60; font-size: 13px; }
.step { background: #e6eedb; }
.step.complete { background: #8da971; }
.detail-section { border-top-color: #dfe8d3; }
.detail-section h3 { font-size: 13px; font-weight: 550; color: #4c663a; }
.detail-section h3 small { color: #8ca278; font-size: 10px; }
.job { border-color: #dbe5ce; }
.job-head h4 { color: #4d6939; font-size: 13px; font-weight: 500; }
.job p { color: #7e9968; font-size: 11px; }
.budget { background: #eef4e2; color: #7a9663; }
.budget strong { color: #527139; }
.action-box { background: #eef3df; border-color: #d3dfbb; }
.action-box h3 { color: #4b6533; font-size: 14px; font-weight: 500; }
.action-box p { color: #7b9660; font-size: 12px; }
.history { color: #7e9a66; font-size: 11px; }
.history-dot { background: #bccfa4; }
.history b { color: #5d7e42; }
.history small { color: #98b080; font-family: var(--mono); font-size: 8px; }
.comment { background: #f0f5e6; font-size: 12px; }
.comment b { color: #87a16f; }
.modal h2 { font-size: 25px; font-weight: 450; letter-spacing: -.7px; }
.modal-intro { color: #819c69; font-size: 12px; }
label { color: #6e8a55; font-size: 12px; font-weight: 500; }
input, textarea, select { background: #fffefa; color: #4c6938; border-color: #d4e0c4; font-size: 13px; }
input:focus, textarea:focus, select:focus { border-color: #91ad73; box-shadow: 0 0 0 2px #d6e5c4; }
.plan-row { border-color: #d7e3c8; }
.invoice-row { border-color: #d7e3c8; font-size: 12px; }
.invoice-row small { color: #8faa77; font-size: 10px; }
.invoice-row strong, .invoice-total { color: #5d7f40; }
.invoice-total { font-size: 30px; font-weight: 450; letter-spacing: -1px; }
.invoice-detail th, .invoice-detail td { font-size: 11px; }
.settings-row { border-bottom-color: #e0e9d3; }
.settings-row p { color: #87a06e; font-size: 11px; }
.settings-row strong { color: #648846; }
.empty { color: #8ba373; font-size: 12px; }
.empty svg { color: #a5bc8b; }
.error { color: #9e5b3d; }
#toast { background: #34482a; box-shadow: 0 4px 20px #24301d20; }
#toast.failure { background: #985c3c; }
.overlay { background: #1e28183d; backdrop-filter: blur(2px); }
@media (min-width: 1450px) {
  .content { padding-top: 36px; }
  .task-table td { padding-top: 17px; padding-bottom: 17px; }
}
@media (max-width: 1180px) {
  .brand span:last-child { font-size: 10px; }
  .stat { padding: 18px; }
  .stat-value { font-size: 29px; }
}
@media (max-width: 760px) {
  .topbar { height: 61px; }
  .content { padding-top: 25px; }
  .page-heading h1 { font-size: 27px; }
  .page-heading p { font-size: 11px; max-width: 215px; }
  .page-heading .button { min-height: 36px; padding: 9px; font-size: 10px; }
  .stat { padding: 16px; min-height: 112px; }
  .stat:nth-child(2) { border-right: 0; }
  .stat:nth-child(-n+2) { border-bottom: 1px solid var(--line); }
  .stat-value { font-size: 28px; }
  .stat-bottom { display: block; margin: 7px 0 0; font-size: 7px; }
  .focus-banner { padding: 14px; }
  .focus-banner button { font-size: 0; }
  .drawer-body h2 { font-size: 25px; }
  .demo-pill { font-size: 7px; }
}

/* Neutral reading text; color is reserved for states and actions. */
.page-heading p, .description, .modal-intro, .action-box p, .job p,
.history, .history small, .comment b, .pipeline-stage p, .section-note,
.settings-row p, .settings-row strong, .client-card p, .client-card footer,
.billing-body p, .billing-line, .review-meta, .activity p, .activity small,
.detail-section h3 small, .invoice-row small, .empty, .bottom-line { color: #73786b; }
.drawer-body h2, .job-head h4, .detail-section h3, .action-box h3,
.ticket-title, .board-card h4, .review-item h3, .activity b,
.history b, .invoice-total, .invoice-row strong { color: #303a28; }
label { color: #555f4b; }
input, textarea, select { color: #394331; }
/* Override the more specific component selectors in the original skin. */
#app button, #app input, #app select, #app textarea,
#overlay button, #overlay input, #overlay select, #overlay textarea,
#app .nav .count, #app .tab span, #app .view-switch button { border-radius: 0; }
#app select, #overlay select {
  appearance: none;
  padding-right: 26px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23707865' stroke-width='1.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right 8px center;
}
/* Date-led client work archive. */
.history-notice { margin-bottom:18px; line-height:1.9; }
.history-filters { margin-bottom:22px; }
.history-filters .toolbar { border-bottom:0; align-items:center; flex-wrap:wrap; gap:12px; }
.history-filters .search { min-width:180px; max-width:320px; }
.history-filters .search input { padding-left:12px; }
.history-date-fields { display:flex; gap:12px; }
.history-date-fields label { display:flex; align-items:center; gap:7px; margin:0; color:#73786b; font-size:11px; }
.history-date-fields input { width:140px; padding:7px; font-size:11px; height:34px; }
.history-stats .stat-value.history-duration { font-size:22px; letter-spacing:-.6px; line-height:1.75; }
.history-day { margin:18px 0; }
.history-day .panel-head { border-bottom:1px solid var(--line); }
.history-day .panel-head h2 { font-size:15px; font-weight:500; }
.history-table td:first-child { min-width:280px; width:56%; padding-top:17px; padding-bottom:17px; }
.history-table .ticket-title { margin:0 0 5px; }
.history-time { font-variant-numeric:tabular-nums; white-space:nowrap; }
.history-evidence { white-space:pre-wrap; overflow-wrap:anywhere; font-size:12px; line-height:1.9; color:#606c55; }
.history-source-id { font-family:var(--mono); font-size:9px; line-height:1.9; color:#7d8a6d; overflow-wrap:anywhere; }
@media(max-width:760px) {
 .history-filters .toolbar { gap:10px; }
 .history-filters .search { max-width:none; width:100%; flex-basis:100%; }
 .history-date-fields { flex-wrap:wrap; }
 .history-date-fields input { width:130px; }
 .history-day .panel-head { align-items:flex-start; gap:10px; flex-direction:column; }
 .history-stats .stat-value.history-duration { font-size:17px; line-height:1.9; }
 .history-table td:first-child { min-width:240px; }
}

.history-amount-summary { display:flex; flex-wrap:wrap; gap:10px 24px; margin-top:10px; font-size:12px; line-height:1.8; letter-spacing:0; font-weight:400; }
.history-amount-summary span { display:flex; gap:8px; align-items:baseline; }
.history-amount-summary strong { white-space:nowrap; font-variant-numeric:tabular-nums; }
.history-table td:first-child { width:40%; }
.login-page { min-height:100vh; display:grid; place-items:center; padding:24px; }
.login-card { width:100%; max-width:460px; padding:40px; background:#fffefa; border:1px solid var(--line); }
.login-card h1 { font-size:34px; margin:14px 0; letter-spacing:-1px; }
.login-card p { line-height:1.8; color:#73786b; }
.login-options { display:grid; gap:12px; margin:28px 0; }
.login-options .button { justify-content:space-between; padding:16px; border-radius:0; }
.login-options span { font-size:11px; }
@media(max-width:480px){.login-card{padding:24px}.login-card h1{font-size:28px}}