:root {
  --ink:#142235; --ink-soft:#33465b; --muted:#66778a; --blue:#1768ac; --blue-dark:#0d477c;
  --blue-soft:#eaf3fb; --navy:#0b243d; --navy-soft:#153550; --teal:#0c7a70; --green:#17734f;
  --amber:#a85d00; --red:#a3362e; --canvas:#f4f7fa; --surface:#fff; --border:#d9e2ea;
  --shadow:0 10px 28px rgba(20,34,53,.07); --sidebar:244px;
}

* { box-sizing:border-box; }
html { min-height:100%; background:var(--canvas); }
body { margin:0; min-height:100vh; font:15px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif; color:var(--ink); background:var(--canvas); }
a { color:var(--blue); text-underline-offset:2px; }
h1,h2,h3 { line-height:1.16; letter-spacing:-.018em; }
h2 { font-size:1.3rem; }
h3 { font-size:1rem; }
p { margin-top:.45rem; }
small { font-size:.82rem; }

.app-shell { min-height:100vh; display:grid; grid-template-columns:var(--sidebar) minmax(0,1fr); }
.app-sidebar { position:sticky; top:0; height:100vh; display:flex; flex-direction:column; padding:1rem .85rem; color:#e7f0f7; background:linear-gradient(180deg,var(--navy),#0a1c2d); border-right:1px solid #102f49; overflow-y:auto; }
.app-brand { min-width:0; display:flex; align-items:center; gap:.7rem; color:#fff; text-decoration:none; padding:.35rem .45rem; }
.app-brand>span:last-child { min-width:0; display:grid; }
.app-brand strong { font-size:1.02rem; }
.app-brand small { color:#9db2c4; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.brand-mark { width:34px; height:34px; display:grid; place-items:center; flex:0 0 auto; border-radius:10px; color:#fff; background:linear-gradient(145deg,#2588d5,#0d5d9f); font-weight:850; box-shadow:0 5px 18px #0003; }
.app-nav { display:grid; gap:.2rem; margin-top:1.5rem; }
.nav-label { margin:1.15rem .65rem .35rem; color:#7891a7; font-size:.68rem; font-weight:800; text-transform:uppercase; letter-spacing:.12em; }
.app-nav a { display:flex; align-items:center; gap:.72rem; min-height:43px; padding:.58rem .68rem; border-radius:9px; color:#c8d7e3; text-decoration:none; font-weight:650; }
.app-nav a:hover { color:#fff; background:#ffffff0d; }
.app-nav a.active { color:#fff; background:#1c4b70; box-shadow:inset 3px 0 #61b5f3; }
.nav-icon { width:25px; height:25px; display:grid; place-items:center; flex:0 0 auto; border:1px solid #66839b; border-radius:7px; font-size:.72rem; font-weight:850; }
.active .nav-icon { border-color:#85c8fa; background:#ffffff12; }
.sidebar-footer { display:grid; gap:.65rem; margin-top:auto; padding:.85rem .45rem 0; border-top:1px solid #ffffff19; }
.sidebar-footer>a { color:#c8d7e3; font-weight:650; }
.user-summary { min-width:0; display:flex; align-items:center; gap:.55rem; padding-top:.35rem; }
.user-summary>span:last-child { min-width:0; display:grid; }
.user-summary strong,.user-summary small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.user-summary strong { color:#fff; font-size:.78rem; }
.user-summary small { color:#8fa6b9; }
.user-avatar,.avatar { width:32px; height:32px; display:grid; place-items:center; flex:0 0 auto; border-radius:50%; background:#dbeefa; color:var(--blue-dark); font-weight:850; }
.text-button { width:auto; min-height:0; padding:0; border:0; color:#b9cbda; background:none; text-decoration:underline; font:inherit; cursor:pointer; }
.text-button:hover { color:#fff; background:none; }
.app-main { min-width:0; }
.mobile-header { display:none; }
.shell { width:min(1380px,calc(100% - 3rem)); margin:0 auto; padding:2rem 0 3.5rem; }

.dashboard-hero,.profile-hero,.page-heading,.panel-heading { display:flex; justify-content:space-between; gap:1rem; align-items:flex-start; }
.dashboard-hero { align-items:flex-end; margin-bottom:1.25rem; }
.dashboard-hero h1,.profile-hero h1,.page-heading h1 { margin:.1rem 0; font-size:clamp(2rem,4vw,3rem); }
.dashboard-hero p:last-child,.profile-hero p { color:var(--muted); }
.eyebrow { margin:0; color:var(--blue); font-size:.72rem; font-weight:850; text-transform:uppercase; letter-spacing:.09em; }
.muted { color:var(--muted); }
.hero-actions,.actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.55rem; }

button,.button { min-height:43px; display:inline-flex; align-items:center; justify-content:center; padding:.65rem .95rem; border:1px solid var(--blue); border-radius:9px; color:#fff; background:var(--blue); font:inherit; font-weight:750; text-decoration:none; cursor:pointer; }
button:hover,.button:hover { background:var(--blue-dark); border-color:var(--blue-dark); }
button:disabled { opacity:.55; cursor:not-allowed; }
.button.secondary { color:var(--blue-dark); background:#fff; border-color:#a9bfd0; }
.button.secondary:hover,.button.quiet:hover { background:var(--blue-soft); }
.button.quiet { color:var(--ink-soft); background:transparent; border-color:var(--border); }
.inline { display:inline-block; margin:.25rem; }

.panel,.card { margin:0 0 1rem; padding:1.15rem; border:1px solid var(--border); border-radius:14px; background:var(--surface); box-shadow:var(--shadow); }
.panel-heading { align-items:center; margin-bottom:.75rem; }
.panel-heading h2,.panel-heading h3 { margin:.08rem 0; }
.panel-heading>a { font-weight:700; text-decoration:none; white-space:nowrap; }
.grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1rem; }
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.75rem; margin:0 0 1rem; }
.metric-card { min-height:120px; display:grid; align-content:center; gap:.18rem; padding:1rem 1.1rem; border:1px solid var(--border); border-left:4px solid #71a5c9; border-radius:12px; color:inherit; background:#fff; text-decoration:none; box-shadow:var(--shadow); }
.metric-card:hover { border-color:#8eb9d7; transform:translateY(-1px); }
.metric-card>span { color:var(--muted); font-weight:700; }
.metric-card>strong { font-size:2rem; line-height:1.1; }
.metric-card>small { color:var(--muted); }
.metric-card.needs-attention { border-left-color:#e29b32; background:#fffdf8; }
.dashboard-layout { display:grid; grid-template-columns:minmax(0,1.75fr) minmax(280px,.8fr); gap:1rem; align-items:start; }
.agenda-item,.work-row,.mini-row,.attention-item,.timeline-row { color:inherit; text-decoration:none; }
.agenda-item { display:grid; grid-template-columns:82px minmax(0,1fr) auto; gap:.9rem; align-items:center; padding:.85rem .2rem; border-top:1px solid var(--border); }
.agenda-item:first-child { border-top:0; }
.agenda-item time { display:grid; color:var(--muted); font-size:.75rem; text-transform:uppercase; font-weight:750; }
.agenda-item time strong { color:var(--ink); font-size:.93rem; }
.agenda-item>span:nth-child(2),.work-row>span:nth-child(2),.mini-row>span:last-child { min-width:0; display:grid; }
.agenda-item small,.work-row small,.mini-row small { color:var(--muted); }
.row-action { color:var(--blue); font-weight:750; }
.work-row { display:grid; grid-template-columns:10px minmax(0,1fr) minmax(120px,.35fr); gap:.85rem; align-items:center; padding:.85rem .2rem; border-top:1px solid var(--border); }
.work-row:first-of-type { border-top:0; }
.work-row:hover strong { color:var(--blue-dark); }
.status-dot { width:9px; height:9px; border-radius:50%; background:#3d8fc8; box-shadow:0 0 0 4px #eaf4fb; }
.status-dot.won { background:var(--green); box-shadow:0 0 0 4px #e7f6ee; }.status-dot.lost { background:#8693a0; box-shadow:0 0 0 4px #eef1f4; }
.work-meta { display:grid; text-align:right; }
.work-meta strong { color:var(--ink-soft); font-size:.86rem; }
.mini-row { display:flex; gap:.7rem; align-items:center; padding:.65rem 0; border-top:1px solid var(--border); }
.mini-row:first-of-type { border-top:0; }
.attention-panel { border-top:4px solid #e09a31; }
.attention-item { display:grid; gap:.12rem; padding:.7rem 0; border-top:1px solid #eadfce; }
.attention-item>span { color:var(--amber); font-size:.72rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }
.attention-item small { color:var(--muted); }
.workspace-settings { margin-bottom:1rem; border:1px solid var(--border); border-radius:12px; background:#fff; }
.workspace-settings summary { padding:.8rem 1rem; color:var(--ink-soft); cursor:pointer; font-weight:750; }
.workspace-settings>div { padding:0 1rem 1rem; color:var(--muted); }

.flash-stack { position:sticky; top:0; z-index:60; width:min(1200px,calc(100% - 2rem)); margin:.75rem auto 0; }
.flash { padding:.8rem 1rem; border:1px solid #a7d9bd; border-radius:10px; color:#14532d; background:#ecf8f1; font-weight:700; box-shadow:var(--shadow); }
.badge,.status-pill,.warning-pill,.primary-pill { display:inline-flex; align-items:center; padding:.3rem .58rem; border-radius:99px; font-size:.72rem; font-weight:800; }
.badge,.primary-pill { color:#14532d; background:#e8f6ee; }.warning-pill { color:#713f12; background:#fff0c7; }.status-pill { color:#37536a; background:#edf3f7; }
.empty-state { padding:1.2rem; border:1px dashed #aebdca; border-radius:12px; color:var(--muted); background:#f9fbfc; }
.empty-state p { margin:.25rem 0 0; }.empty-state.compact { padding:.8rem; }
.narrow { max-width:580px; margin:3rem auto; }
.stack { display:grid; gap:1rem; }.stack div { display:grid; gap:.35rem; }
input,select,textarea { max-width:100%; padding:.68rem; border:1px solid #98a9b8; border-radius:8px; background:#fff; font:inherit; }
.break { overflow-wrap:anywhere; }.table-wrap { overflow-x:auto; } table { width:100%; border-collapse:collapse; } th,td { padding:.75rem; border-bottom:1px solid var(--border); text-align:left; }.errorlist { color:#9b1c1c; }

@media (max-width:1050px) {
  :root { --sidebar:210px; }
  .metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .dashboard-layout { grid-template-columns:1fr; }
  .dashboard-aside { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
}
@media (max-width:760px) {
  .app-shell { display:block; }
  .app-sidebar { display:none; }
  .mobile-header { position:sticky; top:0; z-index:55; min-height:62px; display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:.65rem 1rem; color:#fff; background:var(--navy); box-shadow:0 4px 18px #0b243d33; }
  .mobile-header .app-brand { padding:0; }.mobile-header .app-brand small { display:none; }
  .mobile-menu { position:relative; }
  .mobile-menu summary { min-height:42px; display:flex; align-items:center; padding:.5rem .75rem; border:1px solid #66839b; border-radius:8px; color:#fff; cursor:pointer; font-weight:750; list-style:none; }
  .mobile-menu summary::-webkit-details-marker { display:none; }
  .mobile-menu nav { position:absolute; right:0; top:49px; width:min(280px,calc(100vw - 2rem)); display:grid; padding:.55rem; border:1px solid #2c4f69; border-radius:10px; background:#102e48; box-shadow:0 15px 35px #0005; }
  .mobile-menu nav a,.mobile-menu nav form { padding:.6rem; color:#fff; }
  .shell { width:min(100% - 1.25rem,1380px); padding:1.1rem 0 5rem; }
  .dashboard-hero,.profile-hero,.page-heading { align-items:stretch; flex-direction:column; }
  .hero-actions { justify-content:stretch; }.hero-actions>* { flex:1; }
  .metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .metric-card { min-height:108px; padding:.85rem; }
  .dashboard-aside { display:block; }
  .agenda-item { grid-template-columns:68px minmax(0,1fr); }.agenda-item .row-action { display:none; }
  .work-row { grid-template-columns:9px minmax(0,1fr); }.work-meta { grid-column:2; text-align:left; display:flex; gap:.4rem; }
  .panel,.card { padding:1rem; }
}
@media (max-width:430px) {
  .metric-grid { grid-template-columns:1fr 1fr; gap:.5rem; }
  .metric-card { min-height:98px; }.metric-card>strong { font-size:1.65rem; }.metric-card>small { display:none; }
}
@media print { .app-sidebar,.mobile-header,.hero-actions { display:none!important; }.app-shell { display:block; }.shell { width:100%; } }