/* Neutral typography shared by the workspace and client review. */
:root {
  --font-ui: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Arial, sans-serif;
}
body, button, input, select, textarea {
  font-family: var(--font-ui);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
body { font-size:14px; line-height:1.5; }
.logo, .sidebar .logo, .login-card .logo {
  font-weight:600;
  letter-spacing:-.025em;
}
.logo-mark, .brand-mark { font-weight:600; letter-spacing:-.03em; }
.brand { font-size:14px; font-weight:500; letter-spacing:0; }
.welcome h1, .hero h1 {
  font-weight:500;
  letter-spacing:-.035em;
  line-height:1.18;
}
.welcome h1 { font-size:30px; }
.hero h1 { font-size:38px; }
.welcome p, .hero-sub, .login-sub {
  font-weight:400;
  line-height:1.65;
  letter-spacing:0;
}
.welcome p { font-size:14px; }
.hero-sub { font-size:16px; }
.eyebrow, .caption-label {
  font-size:11px;
  letter-spacing:.07em;
  font-weight:500;
}
.topbar-title, .card-title, .modal h3, .post-history h3 { font-weight:500; }
.card-title { font-size:15px; }
.stat .v { font-weight:500; font-size:30px; letter-spacing:-.035em; font-variant-numeric:tabular-nums; }
.stat .l { font-size:12px; font-weight:400; }
.sidebar nav a, .sidebar nav a.active { font-weight:500; }
.btn, .btn-approve, .btn-changes, .btn-ghost, .btn-reject, .chip, .card-link { font-weight:500; letter-spacing:0; }
.post-summary h2, .client-card .name { font-weight:500; font-size:15px; }
.post-card .cap { font-weight:400; font-size:14px; }
.post-date { text-transform:none; letter-spacing:0; font-size:12px; }
.status, .post-status, .modal-status { font-weight:500; letter-spacing:0; font-size:11px; }
.modal-caption { font-size:15px; line-height:1.7; }
.modal-caption .hash { font-weight:400; }
.field label, .table th { font-weight:500; }
.post-history strong { font-weight:500; }
.history-meta, .history-transition { font-size:12px; }
@media(max-width:640px) {
  .welcome h1 { font-size:26px; }
  .hero h1 { font-size:30px; }
  .hero-sub { font-size:15px; }
}
/* IW2 monochrome identity. Black, white and neutral grays. */
:root {
 --brand-accent:#111;
 --bg:#fff; --border:#e5e5e5; --text:#111; --ink:#111; --muted:#656565;
 --primary:var(--brand-accent); --primary-dark:#333; --accent:var(--brand-accent);
}
body,.sidebar,.card,.stat,.post-card,.client-card,.login-card { background:#fff; color:#111; }
.sidebar nav a.active { background:#f2f2f2; color:var(--brand-accent); }
.sidebar nav a:hover { background:#f5f5f5; }
.logo-mark,.brand-mark { background:#111; color:#fff; }
.welcome { position:relative; background:#111; color:#fff; padding:34px; border-radius:16px; overflow:hidden; margin-bottom:26px; }
.welcome::after { content:none; position:absolute; right:30px; top:22px; font-size:72px; color:var(--brand-accent); line-height:1; }
.welcome h1,.hero h1 { font-family:var(--font-ui); font-weight:500; letter-spacing:-.035em; line-height:1.2; }
.welcome h1 { font-size:clamp(28px,3vw,36px); max-width:85%; margin:20px 0; }
.welcome h1 em,.hero h1 em { font-style:normal; font-weight:inherit; }
.welcome h1 em { color:#fff; text-decoration:underline; text-decoration-color:var(--brand-accent); text-underline-offset:8px; text-decoration-thickness:3px; }
.welcome p { color:#c8c8c8; max-width:560px; }
.eyebrow { color:#bbb; letter-spacing:.12em; font-size:10px; }
.hero h1 { font-size:clamp(28px,3.5vw,40px); margin-top:14px; }
.hero h1 em { color:var(--brand-accent); }
.hero-sub { max-width:620px; color:#656565; }
.client-kicker {
 margin-top:36px;
 font-size:clamp(26px,4vw,46px);
 font-weight:600;
 line-height:1.15;
 text-transform:none;
 letter-spacing:-.035em;
 color:#111;
 overflow-wrap:anywhere;
 text-shadow:0 3px 8px rgba(0,0,0,.14);
 transform-origin:left center;
 animation:client-name-reveal 1s cubic-bezier(.22,1,.36,1) both;
}
@keyframes client-name-reveal {
 from { opacity:0; filter:blur(5px); transform:scale(.97); }
 to { opacity:1; filter:blur(0); transform:scale(1); }
}
@media(prefers-reduced-motion:reduce) {
 .client-kicker { animation:none; }
}
.brand { color:#111; }
.card-title { font-family:var(--font-ui); font-size:15px; font-weight:600; }
.stat .v { font-family:var(--font-ui); color:#111; }
.stat.green .v,.stat.orange .v,.stat.blue .v,.stat.accent .v { color:#111; }
.btn-primary,.btn-approve { background:var(--brand-accent); border-color:var(--brand-accent); color:#fff; }
.btn-primary:hover,.btn-approve:hover { background:#333; }
.btn-changes,.btn-ghost { color:#111; background:#fff; border-color:#ddd; }
.btn-changes:hover,.btn-ghost:hover { background:#f5f5f5; }
.btn-red,.btn-reject { color:#555; border-color:#ddd; }
.post-actions .btn:nth-child(2),.chip.selected span { background:#f2f2f2; color:#222; border-color:#f2f2f2; }
.chip.selected { background:#111; color:#fff; border-color:#111; }
.chip.selected span { background:#333; color:#fff; }
.chip:hover { background:#f2f2f2; color:#111; }
.card-link,.client-card .ig,.modal-caption .hash { color:#222; }
.client-avatar { background:#f2f2f2; color:#222; }
.login-wrap { background:#f4f4f4; }
.status.pending,.post-status.pending,.modal-status.pending { background:#f2f2f2; color:#222; }
.status.approved,.post-status.approved,.modal-status.approved { background:#111; color:#fff; }
.status.changes_requested,.post-status.changes_requested,.modal-status.changes_requested { background:#eee; color:#333; }
.status.rejected,.post-status.rejected,.modal-status.rejected { background:#fff; color:#555; border:1px solid #ddd; }
.result-ok { background:#f2f2f2; color:#222; }
.result-wait,.modal-feedback { background:#f4f4f4; color:#333; border-color:#ddd; }
.feedback-box { background:#fafafa; }
.post-history li::before { background:var(--brand-accent); }
.notif-item.unread { background:#f2f2f2; }
.badge { background:var(--brand-accent); }
:focus-visible { outline-color:var(--brand-accent); }
@media(max-width:640px) {
 .welcome { padding:26px 22px; } .welcome h1 { font-size:32px; max-width:90%; }
 .welcome::after { font-size:40px; right:15px; top:18px; }
 .hero h1 { font-size:28px; }
}

.logo-mark,.brand-mark { width:48px; height:40px; border-radius:9px; display:inline-flex; align-items:center; justify-content:center; padding:7px; }
.logo-mark img,.brand-mark img { width:100%; height:100%; object-fit:contain; display:block; }
.welcome::after { color:#fff; }
.welcome h1 em { text-decoration-color:#888; }
a { color:inherit; }
#modalFeedback { color:#444; }

/* One horizontal signature using the original iW2 lettering. */
.logo,.sidebar .logo,.login-card .logo,.brand { display:flex; align-items:center; gap:9px; }
.flow-wordmark { display:block; width:54px; height:31px; object-fit:contain; flex-shrink:0; }
.flow-name { font-family:var(--font-ui); font-size:28px; font-weight:300; line-height:1; letter-spacing:-1px; color:#111; }
.login-card .flow-wordmark { width:63px; height:36px; }
.login-card .flow-name { font-size:33px; }
/* Match the visible letter height, rather than the font's line box. */
.logo .flow-wordmark,.brand .flow-wordmark { width:46px; height:26px; }
.logo .flow-name,.brand .flow-name { font-size:35px; line-height:1; font-weight:300; letter-spacing:-1.2px; }
.logo,.sidebar .logo,.login-card .logo,.brand { gap:8px; }
.login-card .flow-wordmark { width:53px; height:30px; }
.login-card .flow-name { font-size:40px; }