/* WorkView — calm staffing & capacity workspace.
   Own design tokens, scoped to this app shell only (never touches site.css).
   Fonts match the WorkView system (Playfair page titles / Inter operations / JetBrains Mono metadata);
   palette extends the brand's warm cream base with the product's working
   colors: dark green, muted gold, lavender, blue, restrained red. */
:root{
  --wv-paper:#F6F4F0; --wv-paper2:#EEEAE4; --wv-sidebar:#F0EEE8; --wv-card:#FFFEFC; --wv-ink:#1A1714;
  /* --wv-muted/--wv-dim/--wv-gold are darkened slightly from their original
     values (#8A8680/#C4C0BA/#C68A2E) — a release-audit contrast fix. Each
     originally failed WCAG AA against the cream/card backgrounds it's
     actually used on (muted text ~3.3:1, dim icons ~1.6:1, gold pill text
     ~2.5:1, all need ≥4.5:1 for text or ≥3:1 for meaningful icons like the
     expand chevrons). Same hue family, just deep enough to read reliably. */
  --wv-ink2:#3F3B37; --wv-muted:#66625C; --wv-dim:#827E77; --wv-border:rgba(32,45,36,.06);
  --wv-border2:rgba(32,45,36,.12); --wv-border-strong:rgba(32,45,36,.11);

  --wv-amber:#D89A32; --wv-amber-soft:#F8ECD5;

  --wv-green-deep:#1C3D2E; --wv-green:#4A7256; --wv-green-soft:#E5ECE4;
  --wv-gold:#8A6223; --wv-gold-soft:#F6EBD7;
  --wv-lavender:#7B6BAE; --wv-lavender-soft:#EAE5F5;
  --wv-blue:#3E6E94; --wv-blue-soft:#E5EDF2;
  --wv-red:#A9473A; --wv-red-soft:#F4E5E2;

  --wv-shadow-sm:0 1px 2px rgba(26,23,20,.025), 0 12px 32px -20px rgba(26,23,20,.2);
  --wv-shadow-md:0 3px 8px rgba(26,23,20,.035), 0 24px 52px -28px rgba(26,23,20,.24);
  --wv-radius-sm:8px; --wv-radius-md:12px; --wv-radius-lg:18px; --wv-radius-pill:999px;

  --wv-space-1:.25rem; --wv-space-2:.5rem; --wv-space-3:.75rem; --wv-space-4:1rem;
  --wv-space-5:1.5rem; --wv-space-6:2rem; --wv-space-7:3rem;
  --wv-motion-fast:150ms; --wv-motion-base:220ms; --wv-motion-slow:320ms;

  --serif:'Playfair Display',Georgia,serif;
  --sans:'Inter',system-ui,sans-serif;
  --mono:'JetBrains Mono',ui-monospace,monospace;
  --ease:cubic-bezier(.4,0,.2,1);
}

*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html{background:var(--wv-paper)}
body{
  background:var(--wv-paper); color:var(--wv-ink); font-family:var(--sans); font-weight:400;
  font-size:15px; line-height:1.5; -webkit-font-smoothing:antialiased; min-height:100vh;
}
button{font:inherit;cursor:pointer;background:none;border:none;color:inherit}
input,select,textarea{font:inherit;color:var(--wv-ink)}
a{color:inherit;text-decoration:none}
ul{list-style:none}
svg{display:block}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,[role="button"]:focus-visible{outline:2px solid var(--wv-green);outline-offset:2px}
.mono{font-family:var(--mono)}
.serif{font-family:var(--sans)}
.icon{flex-shrink:0}

/* ── shell ─────────────────────────────────────────────────────── */
.wv-shell{display:flex;min-height:100vh}

.wv-sidebar{
  width:248px;flex-shrink:0;background:var(--wv-sidebar);border-right:1px solid var(--wv-border-strong);
  padding:2rem 1.25rem 1.6rem;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;
}
.wv-wordmark{display:flex;flex-direction:column;gap:.55rem;padding:0 .55rem;margin-bottom:2.25rem}
.wv-wordmark a{font-family:var(--serif);font-weight:600;font-size:1.5rem;letter-spacing:-.015em;color:var(--wv-green-deep);display:flex;align-items:center;gap:.5rem}
.wv-brand-symbol{color:var(--wv-green);display:inline-flex;align-items:center}
.wv-brand-symbol img{width:24px;height:24px;display:block;object-fit:contain}
.wv-wordmark .rule{width:28px;height:2px;background:var(--wv-amber)}

.wv-nav{display:flex;flex-direction:column;gap:.3rem}
.wv-nav-link{
  position:relative;display:flex;align-items:center;gap:.75rem;padding:.72rem .8rem;border-radius:var(--wv-radius-sm);
  color:var(--wv-ink2);font-size:.88rem;font-weight:400;transition:background var(--wv-motion-fast) var(--ease),color var(--wv-motion-fast) var(--ease);
}
.wv-nav-link:hover{background:rgba(28,61,46,.035)}
.wv-nav-link.active{background:rgba(28,61,46,.06);color:var(--wv-green-deep);font-weight:600}
.wv-nav-link.active::before{content:"";position:absolute;left:-1.25rem;top:.5rem;bottom:.5rem;width:3px;border-radius:0 3px 3px 0;background:var(--wv-green)}
.wv-nav-link .icon{color:var(--wv-muted)}
.wv-nav-link.active .icon{color:var(--wv-green-deep)}

.wv-sidebar-foot{margin-top:auto;display:flex;flex-direction:column;gap:.9rem}
.wv-settings-link{display:flex;align-items:center;gap:.7rem;padding:.6rem .7rem;border-radius:var(--wv-radius-sm);color:var(--wv-muted);font-size:.85rem;font-weight:500}
.wv-settings-link:hover{background:var(--wv-paper2);color:var(--wv-ink2)}
.wv-user-card{display:flex;align-items:center;gap:.6rem;padding:.7rem;border-top:1px solid var(--wv-border)}
.wv-user-card .wv-avatar{width:40px;height:40px}
.wv-user-name{font-size:.85rem;font-weight:600;line-height:1.25}
.wv-user-role{font-size:.72rem;color:var(--wv-muted)}

.wv-main{flex:1;min-width:0;display:flex;flex-direction:column}

.wv-topbar{
  display:flex;align-items:center;justify-content:space-between;gap:1.1rem;
  padding:1.35rem 3rem;
}
.wv-mode-toggle-wrap{display:flex;align-items:center;flex-shrink:0}
.wv-topbar-actions{display:flex;align-items:center;gap:1.1rem;flex-shrink:1;min-width:0}
/* The mode toggle added a new element competing for topbar width — between
   this and the existing ≤860px mobile-topbar breakpoint, the search field's
   fixed 230px min-width had nowhere to give, pushing the profile card off
   the edge. Let it shrink here so nothing overflows before that breakpoint. */
@media (max-width:1100px){
  .wv-topbar-actions .wv-search{min-width:0;flex:1 1 140px}
}
.wv-search{
  display:flex;align-items:center;gap:.55rem;background:var(--wv-card);border:1px solid var(--wv-border2);
  border-radius:var(--wv-radius-pill);padding:.55rem 1rem;min-width:230px;color:var(--wv-muted);font-size:.85rem;
}
.wv-search input{background:none;border:none;flex:1;color:var(--wv-ink);font-size:.85rem}
.wv-search input::placeholder{color:var(--wv-muted)}
.wv-icon-btn{position:relative;width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:var(--wv-radius-pill);color:var(--wv-ink2);transition:background .15s}
.wv-icon-btn:hover{background:var(--wv-paper2)}
.wv-badge{position:absolute;top:2px;right:2px;background:var(--wv-amber);color:#fff;font-size:.62rem;font-weight:700;min-width:16px;height:16px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--sans)}
.wv-profile{display:flex;align-items:center;gap:.6rem;padding:.3rem .5rem .3rem .3rem;border-radius:var(--wv-radius-pill);transition:background .15s}
.wv-profile:hover{background:var(--wv-paper2)}
.wv-avatar{width:38px;height:38px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-family:var(--sans);font-weight:700;font-size:.78rem;color:#fff;flex-shrink:0}
.wv-avatar--photo{object-fit:cover;object-position:center 24%;border:1px solid rgba(28,61,46,.16);background:var(--wv-green-soft)}
.wv-avatar.sm{width:28px;height:28px;font-size:.65rem}
.wv-avatar.lg{width:46px;height:46px;font-size:.85rem}
.icon.rotate-180{transform:rotate(180deg)}
.wv-avatar.hue-green{background:var(--wv-green)} .wv-avatar.hue-blue{background:var(--wv-blue)}
.wv-avatar.hue-lavender{background:var(--wv-lavender)} .wv-avatar.hue-gold{background:var(--wv-gold)}
.wv-avatar.hue-red{background:var(--wv-red)}
.wv-avatar--portrait{position:relative;overflow:hidden}
.wv-avatar--portrait .wv-avatar-initials{position:relative;z-index:0}
.wv-avatar--portrait img{position:absolute;inset:0;z-index:1;width:100%;height:100%;display:block;object-fit:cover;object-position:center}
.wv-profile .wv-avatar--photo{width:44px;height:44px;object-position:center 44%;box-shadow:0 2px 8px rgba(26,23,20,.12)}
.wv-user-card .wv-avatar--photo{object-position:center 46%;box-shadow:0 2px 8px rgba(26,23,20,.12)}
.wv-profile-text{text-align:left;line-height:1.25}
.wv-profile-name{font-size:.85rem;font-weight:600}
.wv-profile-role{font-size:.72rem;color:var(--wv-muted)}

.wv-content{flex:1;padding:0 3rem 4rem;max-width:1480px;width:100%}
.wv-ecosystem-footer{display:flex;justify-content:flex-end;align-items:center;padding:0 3rem 1.5rem;margin-top:auto}
.wv-ecosystem-footer a{display:inline-flex;align-items:center;gap:.5rem;color:var(--wv-muted);font-family:var(--sans);font-size:.75rem;font-weight:500;letter-spacing:.01em;transition:color var(--wv-motion-fast) var(--ease)}
.wv-ecosystem-footer a:hover{color:var(--wv-green-deep)}
.wv-ecosystem-footer img{width:17px;height:20px;object-fit:contain;opacity:.8}

/* ── planning banner ───────────────────────────────────────────── */
/* Reuses .wv-tip's icon+text+actions row language (gold/amber-tinted,
   see wv-tip above) rather than inventing a new visual pattern — this
   banner is the persistent, app-wide equivalent of that per-screen tip. */
.wv-planning-banner{padding:0 3rem;margin-bottom:1.6rem}
.wv-planning-banner-inner{
  display:flex;align-items:center;gap:1.1rem;background:#F5EFE3;border:1px solid rgba(138,98,35,.1);
  border-radius:var(--wv-radius-md);padding:1rem 1.25rem;box-shadow:0 8px 28px -24px rgba(28,61,46,.16);
}
.wv-planning-banner-icon{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.64);color:var(--wv-green-deep);display:flex;align-items:center;justify-content:center;flex-shrink:0;box-shadow:inset 0 0 0 1px rgba(28,61,46,.06)}
.wv-planning-banner-inner .text{flex:1;min-width:0}
.wv-planning-banner-inner .text strong{font-size:.86rem;display:block;margin-bottom:.1rem;color:var(--wv-ink)}
.wv-planning-banner-inner .text span{font-size:.82rem;color:var(--wv-ink2)}
.wv-planning-banner-inner .actions{display:flex;gap:.6rem;flex-shrink:0}
.wv-planning-banner-inner .actions button:disabled{opacity:.45;cursor:default}
.wv-planning-banner-inner .actions button:disabled:hover{transform:none;box-shadow:none;border-color:var(--wv-border2)}

/* ── page header ───────────────────────────────────────────────── */
.wv-page-head{margin-bottom:2.25rem;display:flex;justify-content:space-between;align-items:flex-start;gap:2rem;flex-wrap:wrap}
.wv-page-head h1{font-family:var(--serif);font-weight:600;font-size:clamp(2.6rem,4vw,3.4rem);letter-spacing:-.025em;line-height:1.04}
.wv-page-head p{color:var(--wv-muted);font-size:.92rem;margin-top:.4rem}
.wv-btn{
  display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 1.15rem;border-radius:var(--wv-radius-sm);
  font-size:.85rem;font-weight:600;transition:background .15s var(--ease),transform .15s var(--ease),box-shadow .2s;
  white-space:nowrap;
}
.wv-btn-primary{background:var(--wv-green-deep);color:#fff}
.wv-btn-primary:hover{background:var(--wv-green);transform:translateY(-1px);box-shadow:0 8px 20px -8px rgba(31,61,44,.4)}
.wv-btn-ghost{background:var(--wv-card);border:1px solid var(--wv-border2);color:var(--wv-ink2)}
.wv-btn-ghost:hover{border-color:var(--wv-ink2)}
.wv-btn-ai{background:var(--wv-card);border:1px solid var(--wv-amber);color:var(--wv-ink);box-shadow:var(--wv-shadow-sm)}
.wv-btn-ai:hover{background:var(--wv-amber-soft)}
.wv-btn-ai .icon{color:var(--wv-amber)}
.wv-btn-sm{padding:.5rem .85rem;font-size:.78rem}

/* ── generic card ──────────────────────────────────────────────── */
.wv-card{background:var(--wv-card);border:1px solid var(--wv-border);border-radius:var(--wv-radius-md);box-shadow:var(--wv-shadow-sm)}
.wv-card-head{display:flex;align-items:center;justify-content:space-between;padding:1.25rem 1.4rem;border-bottom:1px solid var(--wv-border)}
.wv-card-head h2{font-family:var(--sans);font-weight:600;font-size:1.08rem;letter-spacing:-.015em}
.wv-link{font-size:.8rem;color:var(--wv-green-deep);font-weight:600;display:inline-flex;align-items:center;gap:.3rem;transition:gap .15s}
.wv-link:hover{gap:.5rem}

/* ── settings screen ───────────────────────────────────────────── */
.wv-settings-body{padding:1.3rem}
.wv-settings-desc{color:var(--wv-muted);font-size:.86rem;line-height:1.55;max-width:640px}
.wv-settings-row{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 0;border-top:1px solid var(--wv-border)}
.wv-settings-row-title{font-weight:600;font-size:.9rem}
.wv-settings-row-sub{color:var(--wv-muted);font-size:.8rem;margin-top:.2rem}

/* ── section label ─────────────────────────────────────────────── */
.wv-section-label{display:flex;align-items:center;gap:.65rem;margin-bottom:1.15rem}
.wv-section-label h2{font-family:var(--sans);font-weight:600;font-size:1.25rem;letter-spacing:-.015em}
.wv-count-pill{background:var(--wv-amber-soft);color:var(--wv-gold);font-family:var(--mono);font-size:.72rem;font-weight:600;padding:.15rem .55rem;border-radius:var(--wv-radius-pill)}

/* ── metric cards row (used on Home + placeholders) ───────────── */
.wv-metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:1rem;margin-bottom:1.8rem}
.wv-metric{background:var(--wv-card);border:1px solid var(--wv-border);border-radius:var(--wv-radius-lg);padding:1.2rem;display:flex;gap:.9rem;box-shadow:var(--wv-shadow-sm)}
.wv-metric-action{width:100%;text-align:left;color:inherit;cursor:pointer;transition:border-color .18s ease,box-shadow .18s ease,transform .18s ease}
.wv-metric-action:hover{border-color:color-mix(in srgb,var(--wv-green) 48%,var(--wv-border));box-shadow:var(--wv-shadow-md);transform:translateY(-1px)}
.wv-metric-action:focus-visible{outline:3px solid color-mix(in srgb,var(--wv-gold) 55%,transparent);outline-offset:2px}
.wv-metric-action.active{border-color:var(--wv-green);box-shadow:0 0 0 1px var(--wv-green),var(--wv-shadow-sm)}
.wv-metric-icon{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.wv-metric-icon.green{background:var(--wv-green-soft);color:var(--wv-green-deep)}
.wv-metric-icon.gold{background:var(--wv-gold-soft);color:var(--wv-gold)}
.wv-metric-icon.red{background:var(--wv-red-soft);color:var(--wv-red)}
.wv-metric-icon.blue{background:var(--wv-blue-soft);color:var(--wv-blue)}
.wv-metric-icon.lavender{background:var(--wv-lavender-soft);color:var(--wv-lavender)}
.wv-metric-body .label{font-size:.82rem;color:var(--wv-ink2);font-weight:500;margin-bottom:.2rem}
.wv-metric-body .value{font-family:var(--sans);font-size:1.5rem;font-weight:600;line-height:1.1;letter-spacing:-.025em}
.wv-metric-body .value .unit{font-family:var(--sans);font-size:.78rem;font-weight:500;color:var(--wv-muted);margin-left:.3rem}
.wv-metric-body .sub{font-size:.72rem;color:var(--wv-muted);margin-top:.3rem}

/* ── decisions row ─────────────────────────────────────────────── */
.wv-decisions-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1.25rem;margin-bottom:2.5rem;align-items:stretch}
.wv-decision{border-radius:var(--wv-radius-md);padding:1.5rem;display:flex;flex-direction:column;gap:1.15rem;border:1px solid rgba(26,23,20,.055);box-shadow:var(--wv-shadow-sm);transition:transform var(--wv-motion-base) var(--ease),box-shadow var(--wv-motion-base) var(--ease),border-color var(--wv-motion-base) var(--ease)}
.wv-decision:hover{transform:translateY(-1px);box-shadow:var(--wv-shadow-md)}
.wv-decision.assign{background:var(--wv-gold-soft);border-color:rgba(198,138,46,.25)}
.wv-decision.conflict{background:var(--wv-red-soft);border-color:rgba(177,74,60,.2)}
.wv-decision.approve{background:var(--wv-green-soft);border-color:rgba(31,61,44,.15)}
.wv-decision-top{display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem}
.wv-decision-icon{width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:rgba(255,255,255,.68);flex-shrink:0;box-shadow:inset 0 0 0 1px rgba(26,23,20,.035)}
.wv-decision h3{font-size:.95rem;font-weight:600;margin-bottom:.25rem}
.wv-decision .subject{font-size:.85rem;color:var(--wv-ink2)}
.wv-decision .meta{font-size:.76rem;color:var(--wv-muted);display:flex;align-items:center;gap:.35rem}
.wv-decision .wv-btn{margin-top:auto;align-self:flex-start}

.wv-ai-insight{background:var(--wv-card);border:1px solid rgba(216,154,50,.18);border-radius:var(--wv-radius-md);padding:1.5rem;display:flex;flex-direction:column;gap:1rem;position:relative;overflow:hidden;box-shadow:var(--wv-shadow-sm);transition:transform var(--wv-motion-base) var(--ease),box-shadow var(--wv-motion-base) var(--ease),border-color var(--wv-motion-base) var(--ease)}
.wv-ai-insight:hover{transform:translateY(-1px);border-color:rgba(216,154,50,.48);box-shadow:var(--wv-shadow-md)}
.wv-ai-insight h3{display:flex;align-items:center;gap:.45rem;font-size:.88rem;font-weight:700}
.wv-ai-insight h3 .icon{color:var(--wv-amber)}
.wv-ai-insight p{font-size:.84rem;color:var(--wv-ink2);line-height:1.55}
.wv-ai-insight .wv-btn{margin-top:auto;position:relative;z-index:1}

/* ── three-up dashboard row ───────────────────────────────────── */
.wv-row-3{display:grid;grid-template-columns:1.3fr 1fr 1fr;gap:1.25rem;align-items:stretch;margin-bottom:1.35rem}
.wv-row-3 > .wv-card{height:100%;display:flex;flex-direction:column}
.wv-row-3 > .wv-card > :last-child{margin-top:auto}

.wv-list-row{display:flex;align-items:center;gap:.95rem;padding:1rem 1.4rem;border-bottom:1px solid var(--wv-border);transition:background var(--wv-motion-fast) var(--ease)}
.wv-list-row:hover{background:rgba(239,236,229,.48)}
.wv-list-row:last-child{border-bottom:none}
.wv-list-icon{width:36px;height:36px;border-radius:var(--wv-radius-sm);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.wv-list-row .title{font-weight:600;font-size:.88rem}
.wv-list-row .sub{font-size:.75rem;color:var(--wv-muted);display:flex;align-items:center;gap:.3rem;margin-top:.15rem}
.wv-list-row-end{margin-left:auto;flex-shrink:0}

.wv-pill{display:inline-flex;align-items:center;font-size:.72rem;font-weight:600;padding:.3rem .7rem;border-radius:var(--wv-radius-pill);white-space:nowrap}
.wv-pill.gold{background:var(--wv-gold-soft);color:var(--wv-gold)}
.wv-pill.blue{background:var(--wv-blue-soft);color:var(--wv-blue)}
.wv-pill.green{background:var(--wv-green-soft);color:var(--wv-green-deep)}
.wv-pill.red{background:var(--wv-red-soft);color:var(--wv-red)}
.wv-pill.neutral{background:var(--wv-paper2);color:var(--wv-ink2)}
.wv-pill-btn{border:none;cursor:pointer;font:inherit;transition:filter .15s}
.wv-pill-btn:hover{filter:brightness(0.95)}

.wv-new-row{min-height:52px;padding:.9rem 1.4rem;display:flex;align-items:center;gap:.45rem;border-top:1px solid var(--wv-border);font-size:.85rem;font-weight:600;color:var(--wv-green-deep)}
.wv-new-row .icon{width:15px;height:15px}
.wv-new-row:hover{background:var(--wv-paper2)}

.wv-snapshot-row{padding:1.1rem 1.4rem;border-bottom:1px solid var(--wv-border)}
.wv-snapshot-row:last-child{border-bottom:none}
.wv-snapshot-top{display:flex;align-items:center;gap:.7rem;margin-bottom:.5rem}
.wv-snapshot-icon{width:32px;height:32px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.wv-snapshot-label{font-size:.85rem;font-weight:600;flex:1}
.wv-snapshot-count{font-size:.85rem;color:var(--wv-ink2)}
.wv-bar-track{height:5px;border-radius:var(--wv-radius-pill);background:var(--wv-paper2);overflow:hidden;margin-bottom:.35rem}
.wv-bar-fill{height:100%;border-radius:var(--wv-radius-pill)}
.wv-bar-fill.green{background:var(--wv-green)} .wv-bar-fill.gold{background:var(--wv-gold)} .wv-bar-fill.red{background:var(--wv-red)}
.wv-snapshot-pct{font-size:.72rem;color:var(--wv-muted);text-align:right}

.wv-week-days{display:flex;justify-content:space-between;padding:1rem 1.3rem;border-bottom:1px solid var(--wv-border)}
.wv-day{text-align:center;font-family:var(--mono);font-size:.68rem;color:var(--wv-muted);letter-spacing:.05em}
.wv-day .num{display:block;margin-top:.3rem;font-family:var(--sans);font-size:.9rem;font-weight:700;color:var(--wv-ink);width:26px;height:26px;line-height:26px;border-radius:50%;margin-left:auto;margin-right:auto}
.wv-day.today .num{background:var(--wv-green-deep);color:#fff}
.wv-day.today{color:var(--wv-green-deep)}
.wv-glance-row{display:flex;align-items:center;gap:.6rem;padding:.7rem 1.3rem;font-size:.85rem}
.wv-glance-row .icon{color:var(--wv-muted)}
.wv-glance-row .glance-label{flex:1;color:var(--wv-ink2)}
.wv-glance-row .glance-value{font-weight:700}

.wv-tip{
  display:flex;align-items:center;gap:1rem;background:var(--wv-paper2);border:1px solid var(--wv-border);
  border-radius:var(--wv-radius-lg);padding:1.1rem 1.3rem;position:relative;overflow:hidden;margin-top:.5rem;
}
.wv-tip-icon{width:40px;height:40px;border-radius:50%;background:var(--wv-amber-soft);color:var(--wv-gold);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.wv-tip strong{font-size:.88rem;display:block;margin-bottom:.15rem}
.wv-tip p{font-size:.84rem;color:var(--wv-ink2)}
.wv-tip-close{margin-left:auto;color:var(--wv-muted);width:28px;height:28px;display:flex;align-items:center;justify-content:center;border-radius:50%;flex-shrink:0;position:relative;z-index:1}
.wv-tip-close:hover{background:rgba(26,23,20,.06)}

/* ── advisor drawer ───────────────────────────────────────────── */
.wv-drawer-overlay{position:fixed;inset:0;background:rgba(26,23,20,.28);z-index:40;opacity:0;pointer-events:none;transition:opacity .25s var(--ease)}
.wv-drawer-overlay.open{opacity:1;pointer-events:auto}
.wv-drawer{
  position:fixed;top:0;right:0;bottom:0;width:min(420px,92vw);background:var(--wv-card);z-index:41;
  box-shadow:-24px 0 60px -30px rgba(26,23,20,.4);transform:translateX(100%);transition:transform .3s var(--ease);
  display:flex;flex-direction:column;
}
.wv-drawer.open{transform:translateX(0)}
.wv-drawer-head{display:flex;align-items:center;justify-content:space-between;padding:1.3rem 1.5rem;border-bottom:1px solid var(--wv-border)}
.wv-drawer-head h2{font-family:var(--sans);font-weight:600;font-size:1.15rem;display:flex;align-items:center;gap:.5rem}
.wv-drawer-head h2 .icon{color:var(--wv-amber)}
.wv-drawer-body{flex:1;overflow-y:auto;padding:1.5rem}
.wv-drawer-body p{font-size:.88rem;color:var(--wv-ink2);line-height:1.6;margin-bottom:1.2rem}
.wv-prompt-chip{display:block;width:100%;text-align:left;background:var(--wv-paper2);border:1px solid var(--wv-border);border-radius:var(--wv-radius-md);padding:.75rem 1rem;font-size:.82rem;font-weight:500;margin-bottom:.6rem;transition:border-color .15s}
.wv-prompt-chip:hover{border-color:var(--wv-green)}
.wv-advisor-answer{background:var(--wv-green-soft);border-radius:var(--wv-radius-md);padding:1rem;font-size:.85rem;color:var(--wv-ink2);line-height:1.6;margin-bottom:1rem}
.wv-drawer-foot{padding:1rem 1.5rem;border-top:1px solid var(--wv-border);display:flex;gap:.6rem}
.wv-drawer-foot input{flex:1;border:1px solid var(--wv-border2);border-radius:var(--wv-radius-pill);padding:.65rem 1rem;font-size:.85rem;background:var(--wv-paper)}

/* ── People screen ─────────────────────────────────────────────── */
/* Explicit stacking context, ranked above the results grid below it — a
   `.wv-fade-in` sibling's entrance animation (fill-mode:both) keeps an
   implicit stacking context of its own for as long as the fill holds, which
   would otherwise paint over this toolbar's z-indexed filters popover
   regardless of DOM order. */
.wv-toolbar{display:flex;align-items:center;justify-content:space-between;gap:1rem;flex-wrap:wrap;margin-bottom:1.5rem;position:relative;z-index:5}
.wv-toolbar-right{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}

/* max-width + overflow-x let a segmented control with many tabs (e.g.
   Insights' 5) scroll internally on narrow viewports instead of forcing the
   whole page wider — the same "contain the overflow" approach already used
   for Timeline's wide table. */
.wv-segmented{display:inline-flex;max-width:100%;overflow-x:auto;background:var(--wv-paper2);border-radius:var(--wv-radius-pill);padding:3px;gap:2px}
.wv-segmented button{padding:.5rem 1.1rem;border-radius:var(--wv-radius-pill);font-size:.82rem;font-weight:600;color:var(--wv-muted);transition:background .15s,color .15s;white-space:nowrap;flex-shrink:0}
.wv-segmented button.active{background:var(--wv-green-deep);color:#fff}

.wv-select{
  background:var(--wv-card);border:1px solid var(--wv-border2);border-radius:var(--wv-radius-sm);
  padding:.55rem .9rem;font-size:.82rem;font-weight:500;color:var(--wv-ink2);appearance:none;
  background-image:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 20 20' fill='none' stroke='%238A8680' stroke-width='1.5'><path d='m5 7.5 5 5 5-5'/></svg>");
  background-repeat:no-repeat;background-position:right .6rem center;padding-right:1.9rem;
}
.wv-icon-toolbtn{display:inline-flex;align-items:center;gap:.4rem;background:var(--wv-card);border:1px solid var(--wv-border2);border-radius:var(--wv-radius-sm);padding:.55rem .9rem;font-size:.82rem;font-weight:600;color:var(--wv-ink2)}
.wv-icon-toolbtn:hover{border-color:var(--wv-ink2)}
.wv-week-nav{display:flex;align-items:center;gap:.3rem}
.wv-week-nav .wv-icon-toolbtn.arrow{padding:.55rem;width:36px;justify-content:center}

.wv-search-sm{display:flex;align-items:center;gap:.5rem;background:var(--wv-card);border:1px solid var(--wv-border2);border-radius:var(--wv-radius-pill);padding:.5rem .9rem;min-width:200px}
.wv-search-sm input{border:none;background:none;font-size:.82rem;color:var(--wv-ink);flex:1}
.wv-search-sm input::placeholder{color:var(--wv-muted)}
.wv-search-sm .icon{color:var(--wv-muted)}

.wv-filter-wrap{position:relative}
.wv-filters-pop{
  position:absolute;top:calc(100% + .5rem);right:0;width:280px;background:var(--wv-card);border:1px solid var(--wv-border);
  border-radius:var(--wv-radius-md);box-shadow:var(--wv-shadow-md);padding:1.1rem;z-index:20;
  opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity .15s var(--ease),transform .15s var(--ease);
}
.wv-filters-pop.open{opacity:1;transform:translateY(0);pointer-events:auto}
.wv-filters-pop .field{margin-bottom:.9rem}
.wv-filters-pop .field:last-of-type{margin-bottom:0}
.wv-filters-pop label{display:block;font-size:.72rem;font-weight:600;color:var(--wv-muted);margin-bottom:.35rem;text-transform:uppercase;letter-spacing:.05em}

/* ── global quick-add (topbar) ─────────────────────────────────── */
.wv-quick-add-wrap{position:relative}
.wv-quick-add-menu{
  position:absolute;top:calc(100% + .5rem);left:0;width:200px;background:var(--wv-card);border:1px solid var(--wv-border);
  border-radius:var(--wv-radius-md);box-shadow:var(--wv-shadow-md);padding:.4rem;z-index:20;
  opacity:0;transform:translateY(-6px);pointer-events:none;transition:opacity .15s var(--ease),transform .15s var(--ease);
}
.wv-quick-add-menu.open{opacity:1;transform:translateY(0);pointer-events:auto}
.wv-quick-add-menu a{display:flex;align-items:center;gap:.6rem;padding:.55rem .7rem;border-radius:var(--wv-radius-sm);font-size:.84rem;color:var(--wv-ink2)}
.wv-quick-add-menu a:hover{background:var(--wv-paper2);color:var(--wv-ink)}
.wv-quick-add-menu .icon{color:var(--wv-muted);flex-shrink:0}
.wv-filters-pop select{width:100%}
.wv-filters-pop-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:.9rem}
.wv-filters-pop-head span{font-weight:700;font-size:.85rem}
.wv-filters-pop-head button{font-size:.76rem;color:var(--wv-green-deep);font-weight:600}

.wv-people-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:1.1rem}
.wv-empty-state{grid-column:1/-1;text-align:center;padding:3rem 1rem;color:var(--wv-muted);font-size:.88rem}

.wv-person-card{
  background:var(--wv-card);border:1px solid rgba(32,45,36,.045);border-radius:var(--wv-radius-lg);
  padding:1.4rem 1.4rem 0;display:flex;flex-direction:column;box-shadow:0 2px 5px rgba(26,23,20,.025),0 18px 44px -28px rgba(26,23,20,.26);
  transition:box-shadow .2s var(--ease),transform .2s var(--ease);overflow:hidden;
}
.wv-person-card:hover{transform:translateY(-1px);box-shadow:var(--wv-shadow-md)}
.wv-person-card.expanded{grid-column:1/-1}

.wv-person-head{display:flex;align-items:flex-start;gap:.8rem;margin-bottom:1.3rem}
.wv-person-head .wv-person-info{flex:1;min-width:0}
.wv-person-name{font-weight:600;font-size:1rem;color:var(--wv-ink);letter-spacing:-.01em}
.wv-person-role{font-size:.8rem;color:var(--wv-muted);margin-top:.15rem;line-height:1.35}
.wv-person-kebab{color:var(--wv-dim);padding:.2rem;flex-shrink:0}
.wv-person-kebab:hover{color:var(--wv-ink2)}

.wv-person-capacity{margin:0 0 1.25rem;padding-top:1rem;border-top:1px solid rgba(32,45,36,.055)}
.wv-person-util-row{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem;margin-bottom:.55rem}
.wv-person-util-num{font-family:var(--sans);font-size:.82rem;font-weight:500;line-height:1.2;color:var(--wv-ink2)}
.wv-person-util-lbl{font-size:.78rem;color:var(--wv-muted);font-weight:600}
.wv-person-capacity .wv-bar-track{height:4px;margin-bottom:0}

.wv-person-week-label{font-family:var(--sans);font-size:.78rem;color:var(--wv-muted);font-weight:600;letter-spacing:0;margin:0 0 .65rem}

.wv-alloc-list{display:flex;flex-direction:column;gap:.55rem;margin-bottom:1.1rem}
.wv-alloc-row{display:flex;align-items:center;gap:.6rem;font-size:.84rem}
.wv-alloc-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.wv-alloc-row .alloc-name{flex:1;color:var(--wv-ink2);font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wv-alloc-row .alloc-hrs{color:var(--wv-muted);font-size:.8rem;font-weight:500;flex-shrink:0}

.wv-person-footer{
  margin:auto -1.4rem 0;padding:.9rem 1.4rem;display:flex;align-items:center;justify-content:space-between;gap:.6rem;
  font-size:.82rem;font-weight:600;background:rgba(246,235,215,.7);color:var(--wv-ink);
}
.wv-person-footer.over{background:var(--wv-red-soft);color:var(--wv-red)}
/* The label+chevron area is its own clickable region (the expand toggle) —
   kept separate from the "Assign to Project" button beside it so the two
   are siblings, never one interactive element nested inside another. */
.wv-person-footer-status{display:flex;align-items:center;gap:.6rem;cursor:pointer;transition:filter .15s;flex:1;min-width:0}
.wv-person-footer-status:hover{filter:brightness(0.97)}
.wv-person-footer .over-label{display:flex;align-items:center;gap:.4rem}
.wv-person-footer .chev{color:var(--wv-muted);transition:transform .2s var(--ease)}
.wv-person-footer.over .chev{color:var(--wv-red)}
.wv-person-card.expanded .wv-person-footer .chev{transform:rotate(90deg)}
.wv-quick-assign-btn{flex-shrink:0}

.wv-person-expand{padding:1.3rem 0 1.4rem;border-top:1px solid var(--wv-border);margin-top:1rem;animation:wvFadeUp .3s var(--ease) both}
.wv-expand-grid{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem}
.wv-project-row .wv-person-expand{padding:1.3rem 1.3rem 1.4rem}
.wv-timeline-row .wv-person-expand{padding:1.3rem 1.3rem 1.4rem}
.wv-project-row .wv-expand-grid{grid-template-columns:minmax(0,1.3fr) minmax(260px,.7fr);gap:2rem}
.wv-project-row .wv-assignment-row{gap:.5rem}
.wv-project-row .wv-assignment-row .proj-info{padding-right:.35rem}
.wv-project-row .wv-assignment-row .role{line-height:1.35}
.wv-project-row .wv-row-actions{gap:.15rem}
.wv-project-row .wv-row-action,
.wv-project-row .wv-row-remove{width:22px;height:22px}
.wv-expand-section h4{font-family:var(--mono);font-size:.68rem;text-transform:uppercase;letter-spacing:.07em;color:var(--wv-muted);margin-bottom:.7rem}
.wv-expand-section + .wv-expand-section{margin-top:1.3rem}
.wv-assignment-row{display:flex;align-items:center;gap:.6rem;padding:.5rem 0;border-bottom:1px solid var(--wv-border);font-size:.85rem}
.wv-assignment-row:last-child{border-bottom:none}
.wv-assignment-row .dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.wv-assignment-row .proj{font-weight:600;color:var(--wv-ink)}
.wv-assignment-row .role{color:var(--wv-muted);font-size:.78rem}
.wv-assignment-row .hrs{color:var(--wv-muted);font-size:.78rem}
.wv-assignment-row .proj-info{flex:1;min-width:0;display:flex;flex-direction:column}
.wv-empty-line{color:var(--wv-muted);font-size:.84rem}

/* ── inline assignment editing (People + Projects) ────────────── */
.wv-assignment-row .hrs-wrap{display:flex;align-items:baseline;gap:.35rem;flex-shrink:0}
.wv-assignment-row .hrs-value{font-size:.85rem;font-weight:700;color:var(--wv-ink)}
.wv-assignment-row .hrs-wrap .unit{color:var(--wv-muted);font-size:.74rem;flex-shrink:0}
.wv-row-actions{display:flex;align-items:center;gap:.3rem;flex-shrink:0}
.wv-row-action{color:var(--wv-dim);width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s,color .15s}
.wv-row-action:hover{background:var(--wv-paper2);color:var(--wv-ink2)}
.wv-row-remove{color:var(--wv-dim);width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:background .15s,color .15s}
.wv-row-remove:hover{background:var(--wv-red-soft);color:var(--wv-red)}
.wv-assignment-row.editing{background:var(--wv-paper2);margin:0 -.6rem;padding:.5rem .6rem;border-radius:var(--wv-radius-sm)}
/* Combined before/after summary under a "Changed in Plan" badge — one
   restrained row per changed field (person/hours/dates), never a separate
   badge or line per field. */
.wv-diff-summary{margin-top:.3rem;display:flex;flex-direction:column;gap:.1rem}
.wv-diff-row{display:flex;gap:.4rem;font-size:.76rem;color:var(--wv-gold)}
.wv-diff-row .k{font-weight:600;flex-shrink:0}
.wv-diff-row .v{font-style:italic}
/* A pending-removed assignment stays visible so its removal is never a
   silent disappearance — dimmed rather than hidden, with its own Undo. */
.wv-assignment-row--removed{opacity:.55}
.wv-assignment-row--removed:hover{opacity:.8}
.wv-assignment-row--removed .proj{font-weight:600}

.wv-add-row-btn{display:flex;align-items:center;gap:.4rem;font-size:.82rem;font-weight:600;color:var(--wv-green-deep);padding:.6rem 0 0;transition:gap .15s}
.wv-add-row-btn:hover{gap:.6rem}

.wv-inline-form{background:var(--wv-paper2);border-radius:var(--wv-radius-md);padding:1.1rem;margin-top:.8rem;animation:wvFadeUp .25s var(--ease) both}
.wv-inline-form-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:.9rem}
.wv-inline-form .field label{display:block;font-size:.68rem;font-weight:600;color:var(--wv-muted);margin-bottom:.35rem;text-transform:uppercase;letter-spacing:.05em}
.wv-form-input{width:100%;background:var(--wv-card);border:1px solid var(--wv-border2);border-radius:var(--wv-radius-sm);padding:.55rem .7rem;font-size:.82rem;color:var(--wv-ink)}
.wv-inline-form-actions{display:flex;justify-content:flex-end;gap:.6rem;margin-top:1.1rem}

/* ── hours-edit-in-place ──────────────────────────────────────── */
.wv-hours-editor{flex:1;min-width:0}
.wv-hours-editor-row{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap}
.wv-hours-editor-input{width:70px;flex:0 0 auto;text-align:right;font-weight:700}
.wv-hours-editor .unit{color:var(--wv-muted);font-size:.78rem}
.wv-inline-error{color:var(--wv-red);font-size:.78rem;margin-top:.4rem}
.wv-dates-editor-row input[type="date"]{width:150px;flex:0 0 auto}
.wv-dates-editor-sep{color:var(--wv-muted)}

/* ── reassign panel (People + Projects) ──────────────────────────
   Reuses .wv-inline-form's visual language (same card, same field
   rhythm) rather than a new panel style — a candidate list and an
   add-assignment form are both "an inline expandable form", just with
   different contents. */
.wv-reassign-panel{background:var(--wv-paper2);border-radius:var(--wv-radius-md);padding:1.1rem;margin:.6rem 0 1rem;animation:wvFadeUp .25s var(--ease) both}
.wv-reassign-head{display:flex;align-items:center;justify-content:space-between;gap:.6rem;margin-bottom:.8rem;font-size:.88rem}
.wv-reassign-confirm-copy{font-size:.88rem;color:var(--wv-ink2);line-height:1.5;margin-bottom:.9rem}
.wv-reassign-list{display:flex;flex-direction:column;gap:.5rem;max-height:360px;overflow-y:auto}
.wv-candidate-row{display:flex;align-items:center;gap:.7rem;background:var(--wv-card);border:1px solid var(--wv-border);border-radius:var(--wv-radius-sm);padding:.6rem .8rem;flex-wrap:wrap}
.wv-candidate-row .who{min-width:120px}
.wv-candidate-row .who .name{font-size:.84rem;font-weight:700}
.wv-candidate-row .who .role{font-size:.74rem;color:var(--wv-muted)}
.wv-candidate-stats{display:flex;gap:.9rem;flex:1;min-width:180px}
.wv-candidate-stats .stat{display:flex;flex-direction:column;font-size:.72rem}
.wv-candidate-stats .stat .k{color:var(--wv-muted);text-transform:uppercase;letter-spacing:.04em;font-size:.62rem}
.wv-candidate-stats .stat .v{font-weight:700;font-size:.82rem;color:var(--wv-ink)}
.wv-inline-warning{display:flex;align-items:center;gap:.5rem;background:var(--wv-red-soft);color:var(--wv-red);border-radius:var(--wv-radius-sm);padding:.6rem .8rem;font-size:.82rem;margin-bottom:.9rem}
/* Informational (not a warning) note — resolved conflicts, upcoming needs,
   "this fills an open role" — same shape as .wv-inline-warning, calmer
   green-tinted color so it doesn't read as a caution. */
.wv-inline-note{display:flex;align-items:center;gap:.5rem;background:var(--wv-green-soft);color:var(--wv-green-deep);border-radius:var(--wv-radius-sm);padding:.6rem .8rem;font-size:.82rem;margin-bottom:.9rem}
/* Stronger styling for a remove-confirmation that actually reopens a
   required role or leaves a project unstaffed — a routine "extra help"
   removal doesn't get this treatment. */
.wv-reassign-panel--danger{background:var(--wv-red-soft);box-shadow:inset 0 0 0 1px rgba(177,74,60,.25)}
.wv-btn-danger{background:var(--wv-red);color:#fff}
.wv-btn-danger:hover{background:#9a3f33}

.wv-discard-confirm-text{font-size:.82rem;font-weight:600;color:var(--wv-ink);margin-right:.3rem}

.wv-stackbar{display:flex;height:10px;border-radius:var(--wv-radius-pill);overflow:hidden;background:var(--wv-paper2);margin-bottom:.4rem}
.wv-stackbar-seg{height:100%}
.wv-availability-line{display:flex;justify-content:space-between;font-size:.84rem;padding:.35rem 0;border-bottom:1px solid var(--wv-border)}
.wv-availability-line:last-child{border-bottom:none}
.wv-availability-line .k{color:var(--wv-muted)}
.wv-availability-line .v{font-weight:700}

.wv-expand-ai{background:var(--wv-green-soft);border-radius:var(--wv-radius-md);padding:1rem;margin-top:1rem}
.wv-expand-ai .head{display:flex;align-items:center;gap:.4rem;font-size:.8rem;font-weight:700;color:var(--wv-green-deep);margin-bottom:.4rem}
.wv-expand-ai p{font-size:.83rem;color:var(--wv-ink2);line-height:1.5;margin-bottom:.7rem}

/* list view */
.wv-person-list-row{display:flex;align-items:center;gap:1rem;padding:.9rem 1.3rem;border-bottom:1px solid var(--wv-border);cursor:pointer}
.wv-person-list-row:last-child{border-bottom:none}
.wv-person-list-row:hover{background:var(--wv-paper2)}
.wv-person-list-row .who{display:flex;align-items:center;gap:.7rem;width:230px;flex-shrink:0}
.wv-person-list-row .who .name{font-weight:700;font-size:.86rem}
.wv-person-list-row .who .role{font-size:.76rem;color:var(--wv-muted)}
.wv-person-list-bar{flex:1;max-width:220px}
.wv-person-list-row .pct{width:48px;font-weight:700;font-size:.85rem;text-align:right;flex-shrink:0}
.wv-person-list-row .avail{width:110px;text-align:right;font-size:.8rem;color:var(--wv-muted);flex-shrink:0}
.wv-person-list-row .avail.over{color:var(--wv-red);font-weight:700}
.wv-person-list-row .chev{color:var(--wv-dim);flex-shrink:0;transition:transform .2s var(--ease)}
.wv-person-list-row.expanded .chev{transform:rotate(90deg)}
.wv-person-list-expand-wrap{padding:0 1.3rem 1.3rem;border-bottom:1px solid var(--wv-border)}

.wv-ai-pill{background:var(--wv-amber-soft);color:var(--wv-gold);font-size:.62rem;font-weight:700;letter-spacing:.04em;padding:.1rem .45rem;border-radius:var(--wv-radius-pill)}
.wv-insight-bar{
  display:flex;align-items:center;gap:1.1rem;background:var(--wv-card);border:1px solid rgba(239,159,39,.28);
  border-radius:var(--wv-radius-lg);padding:1.1rem 1.3rem;margin-top:1.6rem;
}
.wv-insight-bar .icon-wrap{width:40px;height:40px;border-radius:50%;background:var(--wv-amber-soft);color:var(--wv-gold);display:flex;align-items:center;justify-content:center;flex-shrink:0}
.wv-insight-bar .body{flex:1;min-width:0}
.wv-insight-bar .title-row{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:.9rem;margin-bottom:.2rem}
.wv-insight-bar p{font-size:.85rem;color:var(--wv-ink2)}
.wv-insight-bar .wv-btn{flex-shrink:0}

@media (max-width:960px){
  .wv-expand-grid,.wv-project-row .wv-expand-grid{grid-template-columns:1fr}
  .wv-expand-section + .wv-expand-section{margin-top:1.1rem}
}
@media (max-width:640px){
  .wv-people-grid{grid-template-columns:1fr}
  .wv-toolbar{flex-direction:column;align-items:stretch}
  .wv-toolbar-right{justify-content:space-between}
  .wv-insight-bar{flex-wrap:wrap}
  .wv-person-list-row{flex-wrap:wrap;gap:.5rem .8rem}
  .wv-person-list-row .who{width:auto;flex:1 1 auto}
  .wv-person-list-bar{order:4;flex:1 1 100%;max-width:none}
  .wv-person-list-row .pct{order:2}
  .wv-person-list-row .avail{order:3;width:auto}
  .wv-candidate-row{flex-direction:column;align-items:stretch}
  .wv-candidate-stats{gap:.6rem;justify-content:space-between}
  .wv-hours-editor-row{gap:.4rem}
  .wv-dates-editor-row input[type="date"]{width:auto;flex:1 1 130px}
}

/* ── Projects screen ───────────────────────────────────────────── */
.wv-projects-layout{display:grid;grid-template-columns:1fr 300px;gap:1.5rem;align-items:start}
.wv-projects-main{min-width:0}
.wv-projects-sidebar{display:flex;flex-direction:column;gap:1.1rem;position:sticky;top:1.5rem}
.wv-panel-body{padding:1.1rem 1.3rem}
.wv-panel-body .field{margin-bottom:.9rem}
.wv-panel-body .field:last-of-type{margin-bottom:0}
.wv-panel-body label{display:block;font-size:.72rem;font-weight:600;color:var(--wv-muted);margin-bottom:.35rem;text-transform:uppercase;letter-spacing:.05em}
.wv-checkbox-row{display:flex;align-items:flex-start;gap:.55rem;font-size:.82rem;color:var(--wv-ink2);margin-top:1rem;line-height:1.4}
.wv-checkbox-row input{accent-color:var(--wv-green-deep);margin-top:.15rem;flex-shrink:0}

.wv-donut{width:88px;height:88px;border-radius:50%;position:relative;flex-shrink:0}
.wv-donut-hole{position:absolute;inset:17px;background:var(--wv-card);border-radius:50%}
.wv-summary-body{display:flex;align-items:center;gap:1.2rem}
.wv-summary-legend{display:flex;flex-direction:column;gap:.55rem;flex:1;min-width:0}
.wv-summary-legend .row{display:flex;align-items:center;gap:.5rem;font-size:.8rem;color:var(--wv-ink2)}
.wv-summary-legend .row .dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.wv-summary-legend .row strong{margin-left:auto;color:var(--wv-ink);font-weight:700;flex-shrink:0}

.wv-info-row{display:flex;align-items:center;gap:.6rem;color:var(--wv-muted);font-size:.82rem;padding:1rem 1.3rem;margin-top:.3rem}
.wv-info-row .icon{flex-shrink:0}

.wv-project-group{margin-bottom:1.3rem}
.wv-group-title{font-family:var(--sans);font-weight:600;font-size:1rem;margin-bottom:.7rem;display:flex;align-items:center;gap:.5rem}
.wv-group-title .count{font-family:var(--mono);font-size:.68rem;color:var(--wv-muted);background:var(--wv-paper2);padding:.1rem .5rem;border-radius:var(--wv-radius-pill);font-weight:400}

.wv-project-row{border-bottom:1px solid var(--wv-border)}
.wv-project-row:last-child{border-bottom:none}
.wv-project-row-main{
  display:grid;grid-template-columns:2.3fr 1.6fr 1.7fr 1.2fr;gap:1.2rem;align-items:start;
  padding:1.15rem 1.3rem;cursor:pointer;transition:background .15s;
}
.wv-project-row-main:hover{background:var(--wv-paper2)}
.wv-project-row.expanded .wv-project-row-main{background:var(--wv-paper2)}
.col-project{display:flex;align-items:flex-start;gap:.7rem}
.col-project .chev{color:var(--wv-dim);margin-top:.6rem;transition:transform .2s var(--ease);flex-shrink:0}
.wv-project-row.expanded .col-project .chev{transform:rotate(90deg)}
.wv-project-name{font-weight:700;font-size:.92rem}
.wv-project-program{font-size:.78rem;color:var(--wv-muted);margin-top:.1rem}
.col-dates .line{display:flex;align-items:center;gap:.4rem;font-size:.83rem;color:var(--wv-ink2);font-weight:600}
.col-dates .sub{font-size:.78rem;color:var(--wv-muted);margin-top:.3rem}
.col-roles .line{font-size:.83rem;color:var(--wv-ink2)}
.col-roles .sub{font-size:.76rem;color:var(--wv-muted);margin-top:.35rem}
.col-roles .sub.warn{color:var(--wv-gold);font-weight:600}
.wv-bar-track.sm{height:5px;margin:.55rem 0 0}
.col-status{display:flex;flex-direction:column;align-items:flex-start;gap:.6rem}

.wv-avatar-stack{display:flex;margin:.55rem 0}
.wv-avatar.stacked{width:28px;height:28px;font-size:.6rem;margin-left:-8px;border:2px solid var(--wv-card);box-sizing:content-box}
.wv-avatar.stacked:first-child{margin-left:0}
.wv-avatar.empty{background:var(--wv-card);border:2px dashed var(--wv-border2);color:transparent}

.wv-assignment-row.open .proj{color:var(--wv-muted);font-style:italic;font-weight:400}
.wv-assignment-row .hrs.warn{color:var(--wv-gold);font-weight:700}

@media (max-width:1180px){
  .wv-projects-layout{grid-template-columns:1fr}
  .wv-projects-sidebar{position:static;flex-direction:row;flex-wrap:wrap}
  .wv-projects-sidebar > *{flex:1 1 260px}
}
@media (max-width:860px){
  .wv-project-row-main{grid-template-columns:1fr;gap:.7rem}
  .col-status{flex-direction:row;align-items:center;justify-content:space-between;width:100%}
}
@media (max-width:640px){
  .wv-projects-sidebar{flex-direction:column}
  .wv-summary-body{flex-direction:column;align-items:flex-start}
}

/* ── Timeline screen ───────────────────────────────────────────── */
.wv-week-nav-group{display:flex;align-items:center;gap:.5rem}
.wv-date-range{display:flex;align-items:center;gap:.5rem;font-weight:600;font-size:.88rem;padding:.55rem .9rem}

.wv-timeline-scroll{overflow-x:auto}
.wv-timeline-grid-cols{display:grid;grid-template-columns:200px repeat(5,1fr) 112px;gap:0;min-width:920px}

.wv-timeline-head-row{padding:.9rem 1.3rem;border-bottom:1px solid var(--wv-border)}
.wv-timeline-head-row .col-people-label{font-family:var(--mono);font-size:.68rem;color:var(--wv-muted);text-transform:uppercase;letter-spacing:.06em;align-self:end}
.wv-timeline-day-head{padding:0 .6rem}
.wv-timeline-day-head .d-label{font-weight:700;font-size:.85rem}
.wv-timeline-day-head .d-sub{font-size:.72rem;color:var(--wv-muted);margin-top:.15rem;display:flex;align-items:center;gap:.3rem}
.wv-timeline-day-head .d-sub.conflict{color:var(--wv-red);font-weight:600}
.wv-timeline-head-row .col-total-label{font-family:var(--mono);font-size:.68rem;color:var(--wv-muted);text-transform:uppercase;letter-spacing:.06em;text-align:right;align-self:end}

.wv-timeline-row{border-bottom:1px solid var(--wv-border)}
.wv-timeline-row:last-child{border-bottom:none}
.wv-timeline-row-main{padding:1rem 1.3rem;align-items:center;cursor:pointer;transition:background .15s}
.wv-timeline-row-main:hover{background:var(--wv-paper2)}
.wv-timeline-row.expanded .wv-timeline-row-main{background:var(--wv-paper2)}
.wv-timeline-who{display:flex;align-items:center;gap:.65rem;min-width:0}
.wv-timeline-who .name{font-weight:700;font-size:.86rem}
.wv-timeline-who .role{font-size:.75rem;color:var(--wv-muted)}

.wv-day-cell{padding:0 .6rem;border-radius:var(--wv-radius-sm)}
.wv-day-cell.conflict{background:var(--wv-red-soft);box-shadow:inset 0 0 0 1px rgba(177,74,60,.25);padding-top:.4rem;padding-bottom:.4rem}
.wv-day-total{font-size:.72rem;color:var(--wv-muted);margin-bottom:.4rem}
.wv-day-chip{border-radius:8px;padding:.45rem .55rem;font-size:.72rem;font-weight:600;display:flex;flex-direction:column;gap:.15rem}
.wv-day-chip.travel{background:var(--wv-gold-soft);color:var(--wv-ink)}
.wv-day-chip.out_of_office{background:var(--wv-blue-soft);color:var(--wv-ink)}
.wv-day-chip .chip-label{display:flex;align-items:center;gap:.3rem}
.wv-day-chip .chip-hrs{font-weight:400;color:var(--wv-muted);font-size:.7rem}

.wv-timeline-total{display:flex;flex-direction:column;align-items:flex-end;gap:.3rem;padding-right:.2rem}
.wv-timeline-total .hrs{font-family:var(--sans);font-weight:600;font-size:1rem}
.wv-timeline-total .pct-row{display:flex;align-items:center;gap:.35rem;font-size:.76rem;color:var(--wv-muted)}
.wv-timeline-total .pct-row .dot{width:7px;height:7px;border-radius:50%}
.wv-timeline-total .chev{color:var(--wv-dim);margin-top:.1rem;transition:transform .2s var(--ease)}
.wv-timeline-row.expanded .wv-timeline-total .chev{transform:rotate(90deg)}

.wv-timeline-day-detail{display:grid;grid-template-columns:repeat(5,1fr);gap:1.1rem;min-width:900px}
.wv-timeline-day-detail h5{font-family:var(--mono);font-size:.66rem;text-transform:uppercase;letter-spacing:.06em;color:var(--wv-muted);margin-bottom:.55rem}
.wv-timeline-day-detail .wv-alloc-list{margin-bottom:0}
.wv-timeline-day-detail .day-cap{font-size:.72rem;color:var(--wv-muted);margin-top:.5rem;padding-top:.5rem;border-top:1px solid var(--wv-border)}
.wv-timeline-day-detail .day-cap.conflict{color:var(--wv-red);font-weight:600}

.wv-timeline-legend{display:flex;flex-wrap:wrap;gap:.4rem 1.3rem;padding:1rem 1.3rem;color:var(--wv-muted);font-size:.78rem}
.wv-timeline-legend .item{display:flex;align-items:center;gap:.4rem}
.wv-timeline-legend .dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}

.wv-insights-stack{display:flex;flex-direction:column;gap:.9rem}
.wv-insights-stack .wv-decision{gap:.6rem}
.wv-insights-stack .wv-decision .wv-link{font-size:.78rem}

@media (max-width:960px){
  .wv-timeline-day-detail{grid-template-columns:repeat(5,minmax(150px,1fr))}
}
@media (max-width:640px){
  .wv-week-nav-group{flex-wrap:wrap}
}

/* ── Queue screen ──────────────────────────────────────────────── */
/* Row layout mirrors .wv-project-row-main exactly (same grid mechanics,
   .col-dates/.col-status reused verbatim) — only the column count/ratio and
   two new column types (hours, requester) are Queue-specific. */
.wv-request-row{border-bottom:1px solid var(--wv-border)}
.wv-request-row:last-child{border-bottom:none}
.wv-request-row-main{
  display:grid;grid-template-columns:2.2fr 1.4fr 1.3fr 1.6fr;gap:1.2rem;align-items:start;
  padding:1.15rem 1.3rem;cursor:pointer;transition:background .15s;
}
.wv-request-row-main:hover{background:var(--wv-paper2)}
.wv-request-row.expanded .wv-request-row-main{background:var(--wv-paper2)}
.col-request{display:flex;align-items:flex-start;gap:.7rem}
.col-request .chev{color:var(--wv-dim);margin-top:.6rem;transition:transform .2s var(--ease);flex-shrink:0}
.wv-request-row.expanded .col-request .chev{transform:rotate(90deg)}
.wv-ai-flag{display:flex;align-items:center;gap:.35rem;font-size:.74rem;color:var(--wv-gold);font-weight:600;margin-top:.45rem}
.col-hours .line{font-size:.83rem;color:var(--wv-ink2)}
.col-hours .wv-pill{margin:.5rem 0}
.col-requester{display:flex;align-items:center;gap:.6rem}
.col-requester .name{font-size:.85rem;font-weight:700}
.col-requester .role{font-size:.76rem;color:var(--wv-muted)}

.wv-request-tabs{margin-bottom:1.1rem}
.wv-request-row .wv-person-expand{margin-top:0;padding:1.3rem}
.wv-request-row .wv-person-expand > .wv-segmented{width:100%}
.wv-request-row .wv-expand-section,.wv-request-row .wv-expand-grid{min-width:0}
.wv-request-row .wv-expand-section p,.wv-request-row .wv-availability-line .v,.wv-request-row .wv-assignment-row span{overflow-wrap:anywhere;word-break:normal}
.wv-request-row .wv-availability-line{gap:1rem;align-items:flex-start}
.wv-request-row .wv-availability-line .k{flex-shrink:0}
.wv-request-row .wv-availability-line .v{min-width:0;text-align:right}
.wv-chip-list{display:flex;flex-wrap:wrap;gap:.5rem}
.wv-chip{background:var(--wv-paper2);border-radius:var(--wv-radius-pill);padding:.3rem .75rem;font-size:.78rem;color:var(--wv-ink2)}
.wv-chip-removable{display:inline-flex;align-items:center;gap:.4rem}
.wv-chip-removable button{color:var(--wv-muted);font-size:.9rem;line-height:1;padding:0}
.wv-chip-removable button:hover{color:var(--wv-red)}
.wv-char-count{text-align:right;font-size:.72rem;color:var(--wv-muted);margin-top:.3rem}
.wv-quick-actions{display:flex;gap:.6rem;flex-wrap:wrap;margin-top:1.1rem}

@media (max-width:860px){
  .wv-request-row-main{grid-template-columns:1fr;gap:.7rem}
  .col-requester{width:100%}
}

/* ── Insights screen ───────────────────────────────────────────── */
.wv-donut.sm{width:56px;height:56px;flex-shrink:0}
.wv-donut.sm .wv-donut-hole{inset:10px}
.wv-metric.ring{align-items:center}

.wv-rankbar-row{display:flex;align-items:center;gap:.9rem;padding:.85rem 1.3rem;border-bottom:1px solid var(--wv-border)}
.wv-rankbar-row:last-child{border-bottom:none}
.wv-rankbar-row .wv-list-icon{flex-shrink:0}
.wv-rankbar-row .info{flex:1;min-width:0}
.wv-rankbar-row .info .title{font-size:.85rem;font-weight:600}
.wv-rankbar-row .wv-bar-track{margin-top:.4rem}
.wv-rankbar-row .value{width:76px;text-align:right;flex-shrink:0;font-size:.82rem;color:var(--wv-muted)}

.wv-insight-list-row{display:flex;align-items:flex-start;gap:.75rem;padding:.9rem 0;border-bottom:1px solid var(--wv-border)}
.wv-insight-list-row:last-child{border-bottom:none}
.wv-insight-list-row .wv-metric-icon{width:36px;height:36px}
.wv-insight-list-row > div:last-child{min-width:0}
.wv-insight-list-row .title{font-size:.85rem;font-weight:700}
.wv-insight-list-row .title,.wv-insight-list-row .text{overflow-wrap:anywhere}
.wv-insight-list-row .text{font-size:.8rem;color:var(--wv-muted);margin-top:.2rem;line-height:1.45}

.wv-needs-row{display:flex;align-items:center;gap:.9rem;padding:.85rem 1.3rem;border-bottom:1px solid var(--wv-border)}
.wv-needs-row:last-child{border-bottom:none}
.wv-needs-row .info{flex:1;min-width:0}
.wv-needs-row .info .title{font-size:.85rem;font-weight:600}
.wv-needs-row .info .sub{font-size:.76rem;color:var(--wv-muted);margin-top:.15rem}
.wv-needs-row .when{font-size:.78rem;color:var(--wv-muted);flex-shrink:0;text-align:right;width:90px}

.wv-mini-line-chart{display:flex;align-items:flex-end;gap:.8rem;height:110px;padding:0 .3rem}
.wv-mini-line-chart .bar-col{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:flex-end;height:100%;gap:.5rem}
.wv-mini-line-chart .bar{width:100%;max-width:34px;border-radius:6px 6px 0 0;background:var(--wv-green)}
.wv-mini-line-chart .lbl{font-size:.7rem;color:var(--wv-muted);font-family:var(--mono)}

/* Two-up row for Insights (chart+donut, donut+list) — a dedicated class
   instead of an inline grid-template-columns override, so the responsive
   collapse below actually takes effect (inline styles beat media-queried
   class rules regardless of breakpoint, which silently broke this on
   mobile when it was set as a style="" override on .wv-row-3). */
.wv-row-2{display:grid;gap:1.1rem;margin-bottom:1.1rem}
.wv-row-2.a{grid-template-columns:1.4fr 1fr}
.wv-row-2.b{grid-template-columns:1fr 1.4fr}
/* Insights has its own sidebar inside an already narrowed application shell.
   Collapse that sidebar before the global tablet breakpoint so charts and
   cards never have to squeeze text into unusably narrow columns. */
@media (max-width:1439px){
  .wv-insights-layout{grid-template-columns:1fr}
  .wv-insights-layout .wv-projects-sidebar{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
  .wv-insights-layout .wv-row-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wv-insights-layout .wv-row-3 > :nth-child(3){grid-column:1/-1}
}
@media (max-width:960px){
  .wv-row-2.a, .wv-row-2.b{grid-template-columns:1fr}
}

@media (max-width:640px){
  .wv-rankbar-row .value{width:auto}
}

/* ── placeholder screens ─────────────────────────────────────── */
.wv-placeholder{background:var(--wv-card);border:1px dashed var(--wv-border2);border-radius:var(--wv-radius-lg);padding:2.6rem;text-align:center;max-width:560px;margin:1.5rem auto 0}
.wv-placeholder .icon-wrap{width:52px;height:52px;border-radius:50%;background:var(--wv-green-soft);color:var(--wv-green-deep);display:flex;align-items:center;justify-content:center;margin:0 auto 1.1rem}
.wv-placeholder h2{font-family:var(--sans);font-weight:600;font-size:1.3rem;margin-bottom:.6rem}
.wv-placeholder p{color:var(--wv-muted);font-size:.9rem;line-height:1.6}

/* ── mobile nav toggle ────────────────────────────────────────── */
.wv-mobile-topbar{display:none}
.wv-nav-toggle{width:38px;height:38px;display:flex;align-items:center;justify-content:center;border-radius:var(--wv-radius-sm)}
.wv-sidebar-scrim{display:none}

/* ── responsive ───────────────────────────────────────────────── */
@media (max-width:1180px){
  .wv-decisions-row{grid-template-columns:repeat(auto-fit,minmax(210px,1fr));}
  .wv-ai-insight{grid-column:auto;min-height:0}
  .wv-row-3{grid-template-columns:1fr 1fr}
  .wv-row-3 > :nth-child(3){grid-column:1/-1}
}
@media (max-width:860px){
  .wv-decisions-row{grid-template-columns:1fr 1fr}
  .wv-ai-insight{grid-column:auto}
  .wv-row-3{grid-template-columns:1fr}
  .wv-content{padding:0 1.4rem 3rem}
  .wv-ecosystem-footer{padding:0 1.4rem 1.25rem}
  .wv-topbar{padding:1rem 1.4rem}
  .wv-search{min-width:0;flex:1}

  .wv-sidebar{
    position:fixed;left:0;top:0;bottom:0;z-index:31;transform:translateX(-100%);
    transition:transform .25s var(--ease);box-shadow:24px 0 60px -30px rgba(26,23,20,.3);width:250px;
  }
  .wv-sidebar.open{transform:translateX(0)}
  .wv-sidebar-scrim{display:block;position:fixed;inset:0;background:rgba(26,23,20,.28);z-index:30;opacity:0;pointer-events:none;transition:opacity .2s}
  .wv-sidebar-scrim.open{opacity:1;pointer-events:auto}
  .wv-mobile-topbar{display:flex;align-items:center;gap:.8rem;padding:1rem 1.4rem 0}
  .wv-mobile-topbar .wv-wordmark{margin:0;padding:0}
}
@media (max-width:600px){
  .wv-decisions-row{grid-template-columns:1fr}
  .wv-metrics{grid-template-columns:1fr 1fr}
  .wv-topbar{flex-wrap:wrap;gap:.7rem}
  .wv-topbar-actions{flex-wrap:wrap;width:100%}
  .wv-search{order:3;flex:1 1 100%}
  .wv-week-days{overflow-x:auto}
  .wv-drawer{width:100vw}
  .wv-planning-banner{padding:0 1.4rem}
  .wv-planning-banner-inner{flex-wrap:wrap}
  .wv-planning-banner-inner .actions{flex:1 1 100%}
  .wv-page-head .wv-btn-ai{width:100%;justify-content:center}
  .wv-decision,.wv-ai-insight{padding:1.1rem}
}

/* ── responsive system pass ─────────────────────────────────────
   Four intentional layout modes: large desktop (1440+), desktop
   (1024–1439), tablet (768–1023), and mobile (<768). Component-level
   rules above remain as local safeguards; these rules coordinate the
   shell, grids, forms, overflow, and touch behavior across every route. */
@media (max-width:1439px) and (min-width:1024px){
  .wv-sidebar{width:224px;padding-left:1rem;padding-right:1rem}
  .wv-content{padding:0 2rem 3.5rem}
  .wv-topbar{padding:1.2rem 2rem}
  .wv-planning-banner{padding:0 2rem}
  .wv-page-head h1{font-size:clamp(2.45rem,3.5vw,3rem)}
  .wv-metrics{grid-template-columns:repeat(auto-fit,minmax(168px,1fr))}
}

@media (max-width:1023px){
  .wv-main{width:100%;min-width:0}
  .wv-content{padding:0 1.5rem 3rem;max-width:none}
  .wv-topbar{padding:1rem 1.5rem}
  .wv-planning-banner{padding:0 1.5rem}
  .wv-mobile-topbar{display:flex;align-items:center;gap:.8rem;padding:1rem 1.5rem 0}
  .wv-mobile-topbar .wv-wordmark{margin:0;padding:0}
  .wv-sidebar{
    position:fixed;left:0;top:0;bottom:0;z-index:31;width:250px;
    transform:translateX(-100%);transition:transform .25s var(--ease);
    box-shadow:24px 0 60px -30px rgba(26,23,20,.3)
  }
  .wv-sidebar.open{transform:translateX(0)}
  .wv-sidebar-scrim{display:block;position:fixed;inset:0;background:rgba(26,23,20,.28);z-index:30;opacity:0;pointer-events:none;transition:opacity .2s}
  .wv-sidebar-scrim.open{opacity:1;pointer-events:auto}
  .wv-page-head{margin-bottom:1.75rem}
  .wv-page-head h1{font-size:clamp(2.25rem,5vw,2.75rem)}
  .wv-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wv-decisions-row,.wv-people-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wv-row-3{grid-template-columns:repeat(2,minmax(0,1fr))}
  .wv-row-3 > :nth-child(3){grid-column:1/-1}
  .wv-projects-layout{grid-template-columns:1fr}
  .wv-projects-sidebar{position:static;flex-direction:row;flex-wrap:wrap}
  .wv-projects-sidebar > *{flex:1 1 280px}
  .wv-project-row-main{grid-template-columns:minmax(0,1.35fr) minmax(180px,.75fr);gap:.85rem 1.25rem}
  .wv-project-row-main .col-project,.wv-project-row-main .col-roles{grid-column:1}
  .wv-project-row-main .col-dates,.wv-project-row-main .col-status{grid-column:2}
  .wv-request-row-main{grid-template-columns:minmax(0,1.2fr) minmax(180px,.8fr);gap:.85rem 1.25rem}
  .wv-request-row-main .col-request,.wv-request-row-main .col-hours{grid-column:1}
  .wv-request-row-main .col-dates,.wv-request-row-main .col-requester{grid-column:2}
  .wv-timeline-scroll{overflow-x:auto;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch}
  .wv-timeline-grid-cols{min-width:900px}
  .wv-timeline-day-detail{min-width:820px}
  .wv-timeline-who,.wv-timeline-head-row .col-people-label{position:sticky;left:0;z-index:2;background:var(--wv-card)}
  .wv-timeline-row.expanded .wv-timeline-who{background:var(--wv-paper2)}
  .wv-inline-form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}

@media (max-width:767px){
  body{font-size:15px;overflow-x:hidden}
  .wv-content{padding:0 1rem 2.5rem}
  .wv-ecosystem-footer{padding:0 1rem 1rem}
  .wv-mobile-topbar{padding:1rem 1rem 0}
  .wv-topbar{padding:.85rem 1rem 1rem;flex-direction:column;align-items:stretch;gap:.8rem}
  .wv-mode-toggle-wrap{width:100%}
  .wv-mode-toggle-wrap .wv-segmented{width:100%}
  .wv-mode-toggle-wrap .wv-segmented button{flex:1;min-height:40px}
  .wv-topbar-actions{display:flex;flex-wrap:wrap;width:100%;gap:.55rem}
  .wv-search{order:5;flex:1 1 100%;min-height:44px}
  .wv-quick-add-wrap{order:1}
  #wv-bell{order:2}
  .wv-profile{order:3;margin-left:auto;min-height:44px}
  .wv-icon-btn,.wv-nav-toggle{width:44px;height:44px}
  .wv-quick-add-menu{left:0;max-width:calc(100vw - 2rem)}
  .wv-planning-banner{padding:0 1rem;margin-bottom:1.25rem}
  .wv-planning-banner-inner{align-items:flex-start;flex-wrap:wrap;padding:1rem;gap:.85rem}
  .wv-planning-banner-inner .text{flex:1 1 calc(100% - 56px)}
  .wv-planning-banner-inner .actions{flex:1 1 100%;display:grid;grid-template-columns:1fr 1fr}
  .wv-planning-banner-inner .actions .wv-btn{min-height:44px;justify-content:center;white-space:normal;text-align:center}
  .wv-page-head{display:grid;grid-template-columns:1fr;margin-bottom:1.5rem;gap:1rem}
  .wv-page-head h1{font-size:2.25rem;line-height:1.08}
  .wv-page-head p{font-size:.88rem;max-width:38rem}
  .wv-page-head > .wv-btn,.wv-page-head > a.wv-btn{justify-self:start;min-height:44px}
  .wv-section-label{align-items:flex-start}
  .wv-section-label h2{font-size:1.12rem;overflow-wrap:anywhere}
  .wv-metrics,.wv-decisions-row,.wv-row-3,.wv-row-2.a,.wv-row-2.b,.wv-people-grid{grid-template-columns:1fr}
  .wv-row-3 > :nth-child(3){grid-column:auto}
  .wv-metric{min-width:0;padding:1rem}
  .wv-card-head{padding:1rem}
  .wv-card-head h2,.wv-list-row .title,.wv-person-name,.wv-project-name{overflow-wrap:anywhere}
  .wv-list-row{padding:.9rem 1rem;align-items:flex-start;flex-wrap:wrap}
  .wv-list-row-end{margin-left:45px}
  .wv-toolbar{align-items:stretch;gap:.75rem;margin-bottom:1.1rem}
  .wv-toolbar > .wv-segmented{width:100%}
  .wv-toolbar-right{width:100%;justify-content:flex-start}
  .wv-search-sm{flex:1 1 100%;width:100%;min-width:0;min-height:44px}
  .wv-select,.wv-icon-toolbtn{min-height:44px}
  .wv-filters-pop{position:fixed;left:1rem;right:1rem;top:auto;bottom:1rem;width:auto;max-height:calc(100vh - 2rem);overflow-y:auto}
  .wv-person-card{padding:1.2rem 1.2rem 0}
  .wv-person-footer{margin-left:-1.2rem;margin-right:-1.2rem;padding:1rem 1.2rem;flex-wrap:wrap}
  .wv-person-footer-status{min-height:44px}
  .wv-quick-assign-btn{min-height:44px;margin-left:auto}
  .wv-alloc-row .alloc-name{white-space:normal;overflow:visible;text-overflow:clip;line-height:1.35}
  .wv-projects-sidebar{flex-direction:column}
  .wv-projects-sidebar > *{flex-basis:auto;width:100%}
  .wv-project-row-main,.wv-request-row-main{grid-template-columns:1fr;padding:1rem;gap:.8rem}
  .wv-project-row-main .col-project,.wv-project-row-main .col-dates,.wv-project-row-main .col-roles,.wv-project-row-main .col-status,
  .wv-request-row-main .col-request,.wv-request-row-main .col-dates,.wv-request-row-main .col-hours,.wv-request-row-main .col-requester{grid-column:1}
  .col-status{flex-direction:row;align-items:center;justify-content:space-between;width:100%;flex-wrap:wrap}
  .col-requester{width:100%}
  .wv-project-row .wv-person-expand,.wv-timeline-row .wv-person-expand{padding:1rem}
  .wv-request-row .wv-person-expand{padding:1rem}
  .wv-request-row .wv-expand-grid{gap:1rem}
  .wv-request-row .wv-quick-actions{display:grid;grid-template-columns:1fr 1fr}
  .wv-request-row .wv-quick-actions .wv-btn{width:100%;min-width:0;min-height:44px;justify-content:center;white-space:normal;text-align:center}
  .wv-insights-layout .wv-projects-sidebar{grid-template-columns:1fr}
  .wv-rankbar-row,.wv-needs-row{padding:.85rem 1rem;align-items:flex-start;flex-wrap:wrap}
  .wv-rankbar-row .value,.wv-needs-row .when{width:auto;margin-left:45px;text-align:left}
  .wv-expand-grid{grid-template-columns:1fr;gap:1.25rem}
  .wv-assignment-row{flex-wrap:wrap;align-items:flex-start}
  .wv-assignment-row .proj-info{flex:1 1 calc(100% - 42px)}
  .wv-assignment-row .hrs-wrap{margin-left:36px}
  .wv-assignment-row .wv-row-actions{margin-left:auto}
  .wv-project-row .wv-row-action,.wv-project-row .wv-row-remove,.wv-row-action,.wv-row-remove{width:40px;height:40px}
  .wv-inline-form{padding:1rem}
  .wv-inline-form-grid{grid-template-columns:1fr}
  .wv-inline-form-actions{flex-direction:column-reverse}
  .wv-inline-form-actions .wv-btn{width:100%;min-height:44px;justify-content:center}
  .wv-form-input{min-height:44px;font-size:16px}
  textarea.wv-form-input{min-height:120px}
  .wv-dates-editor-row{display:grid;grid-template-columns:1fr}
  .wv-dates-editor-row input[type="date"]{width:100%}
  .wv-dates-editor-sep{display:none}
  .wv-hours-editor-row .wv-btn{min-height:40px}
  .wv-timeline-grid-cols{min-width:820px;grid-template-columns:176px repeat(5,128px) 92px}
  .wv-timeline-day-detail{min-width:760px;grid-template-columns:repeat(5,136px)}
  .wv-timeline-who,.wv-timeline-head-row .col-people-label{box-shadow:8px 0 14px -14px rgba(26,23,20,.55)}
  .wv-timeline-legend{padding:1rem 0}
  .wv-week-nav-group{display:grid;grid-template-columns:44px 1fr 44px;width:100%}
  .wv-week-nav-group .wv-icon-toolbtn{width:44px;justify-content:center}
  .wv-date-range{justify-content:center;text-align:center;min-width:0;padding:.5rem}
  .wv-summary-body{align-items:flex-start}
  .wv-tip,.wv-insight-bar{align-items:flex-start;flex-wrap:wrap;padding:1rem}
  .wv-insight-bar .wv-btn{width:100%;justify-content:center;min-height:44px}
  .wv-settings-row{align-items:flex-start;flex-direction:column}
  .wv-settings-row .wv-btn{min-height:44px}
  .wv-drawer{width:100vw}
  .wv-drawer-head,.wv-drawer-body,.wv-drawer-foot{padding-left:1rem;padding-right:1rem}
  .wv-drawer-foot{flex-wrap:wrap}
  .wv-drawer-foot input{min-width:0;min-height:44px}
  .wv-drawer-foot .wv-btn{min-height:44px}
  .wv-segmented{-webkit-overflow-scrolling:touch;scrollbar-width:none}
  .wv-segmented::-webkit-scrollbar{display:none}
}

@media (max-width:420px){
  .wv-metrics{grid-template-columns:1fr}
  .wv-profile-text,#wv-profile-btn > .icon{display:none}
  .wv-profile{padding:.15rem}
  .wv-planning-banner-inner .actions{grid-template-columns:1fr}
  .wv-page-head h1{font-size:2.05rem}
  .wv-person-footer{align-items:stretch}
  .wv-quick-assign-btn{width:100%;justify-content:center;margin-left:0}
  .wv-inline-form-actions{gap:.5rem}
  .wv-candidate-stats{min-width:0;flex-wrap:wrap}
  .wv-request-row .wv-quick-actions{grid-template-columns:1fr}
}

@media (prefers-reduced-motion:reduce){
  *,*::before,*::after{scroll-behavior:auto!important;animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
}

/* ── client portal shell (used by /workview/request) ──────────── */
.wv-client-portal{font-size:.68rem;text-transform:uppercase;letter-spacing:.1em;color:var(--wv-muted);margin-bottom:.2rem}
.wv-client-name{font-weight:700;font-size:.95rem;color:var(--wv-ink)}
.wv-sidebar--simple .wv-nav-link.signout{margin-top:.4rem;color:var(--wv-red)}
.wv-shell--stack{display:flex}
@media (max-width:860px){
  .wv-shell--stack{flex-direction:column}
  .wv-sidebar--simple{
    position:static;height:auto;width:100%;flex-direction:row;flex-wrap:wrap;align-items:center;
    border-right:none;border-bottom:1px solid var(--wv-border);gap:.5rem 1.2rem;padding:1.1rem 1.4rem;
    transform:none;box-shadow:none;
  }
  .wv-sidebar--simple .wv-wordmark{margin-bottom:0}
  .wv-sidebar--simple .wv-nav{flex-direction:row;flex-wrap:wrap;gap:.2rem}
  .wv-sidebar--simple .wv-sidebar-foot{margin-top:0;flex-direction:row;margin-left:auto}
  .wv-sidebar--simple .wv-user-card{border-top:none}
}

/* ── step indicator (staffing request form) ───────────────────── */
.wv-steps{display:flex;align-items:center;gap:.5rem;margin:1.6rem 0 2.2rem;flex-wrap:wrap}
.wv-step{display:flex;align-items:center;gap:.55rem;font-size:.82rem;color:var(--wv-muted);font-weight:600}
.wv-step-circle{width:24px;height:24px;border-radius:50%;background:var(--wv-paper2);color:var(--wv-muted);display:flex;align-items:center;justify-content:center;font-size:.72rem;flex-shrink:0}
.wv-step.active .wv-step-circle{background:var(--wv-green-deep);color:#fff}
.wv-step.active{color:var(--wv-ink)}
.wv-step.done .wv-step-circle{background:var(--wv-green);color:#fff}
.wv-step.done{color:var(--wv-ink2)}
.wv-step-line{width:34px;height:1px;background:var(--wv-border2)}
@media (max-width:640px){.wv-step span.label{display:none} .wv-step-line{width:16px}}

/* ── entrance motion (subtle, once) ──────────────────────────── */
.wv-fade-in{animation:wvFadeUp .5s var(--ease) both}
.wv-fade-in.d1{animation-delay:.05s} .wv-fade-in.d2{animation-delay:.1s} .wv-fade-in.d3{animation-delay:.15s}
/* Ends on transform:none (not translateY(0)) — a non-"none" transform value
   permanently creates a new stacking context per spec, which broke z-index
   layering between this element and later absolutely-positioned siblings
   (e.g. the People screen's filters popover). */
@keyframes wvFadeUp{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
