/* CEO Dashboard — shared shell styles (navy / gold / cream, Playfair + Manrope).
   Used by the generated pages: home, hubs, library, tasks, courses. Older deep pages
   keep their own inline styles on purpose (their URLs and look are unchanged). */
:root{
  --navy-deep:#1E2530; --navy:#2A3A4A; --navy-light:#303F54;
  --cream:#F5F1ED; --cream-warm:#E8E5E1; --white:#FFFFFF;
  --accent-blue:#5B7BB4; --gold:#C9A97B; --gold-ink:#9A7B45;
  --ink:#242D3D; --muted:#7A7F8C; --on-dark:#F0E5D7; --on-dark-muted:#B2B2BF;
  --line:rgba(42,58,74,.10); --green:#3f8f6b; --red:#b0533f;
  --shadow:0 8px 40px rgba(42,58,74,.08); --shadow-lg:0 20px 60px rgba(42,58,74,.12);
  --head:'Playfair Display',serif; --body:'Manrope',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0}
body{font-family:var(--body);color:var(--ink);background:var(--cream);min-height:100vh}
a{text-decoration:none;color:inherit}
h1,h2,h3{font-family:var(--head);font-weight:600}

/* ---- shell: sidebar (desktop) / top nav (mobile) ---- */
.shell{display:flex;min-height:100vh}
.side{width:212px;flex:0 0 212px;background:linear-gradient(170deg,var(--navy-deep),var(--navy));color:var(--on-dark);
  padding:22px 14px;position:sticky;top:0;height:100vh;display:flex;flex-direction:column;border-right:3px solid var(--gold)}
.side .brand{font-family:var(--head);font-size:19px;color:#fff;padding:0 10px 16px;border-bottom:1px solid rgba(255,255,255,.12);margin-bottom:14px}
.side .brand span{color:var(--gold)}
.side nav{display:flex;flex-direction:column;gap:4px}
.side nav a{display:flex;align-items:center;gap:10px;padding:11px 12px;border-radius:9px;font-weight:600;font-size:14px;color:var(--on-dark-muted);transition:.13s}
.side nav a:hover{background:rgba(255,255,255,.08);color:#fff}
.side nav a.on{background:rgba(201,169,123,.16);color:var(--gold)}
.side .foot{margin-top:auto;font-size:11px;color:var(--on-dark-muted);padding:12px 10px 0;line-height:1.5}
.main{flex:1;min-width:0;padding:26px 28px 70px}
.main-inner{max-width:1080px;margin:0 auto}

@media(max-width:900px){
  .shell{display:block}
  .side{width:auto;height:auto;position:sticky;top:0;z-index:50;flex-direction:row;align-items:center;
    padding:10px 12px;border-right:0;border-bottom:3px solid var(--gold);gap:10px}
  .side .brand{padding:0 8px;border:0;margin:0;font-size:16px;white-space:nowrap}
  .side nav{flex-direction:row;overflow-x:auto;gap:2px;scrollbar-width:none}
  .side nav::-webkit-scrollbar{display:none}
  .side nav a{padding:8px 11px;font-size:13px;white-space:nowrap}
  .side .foot{display:none}
  .main{padding:18px 14px 60px}
}

/* ---- page header ---- */
.phead{display:flex;justify-content:space-between;align-items:flex-end;flex-wrap:wrap;gap:10px;margin-bottom:18px}
.phead h1{font-size:clamp(1.5rem,3.4vw,2.1rem);color:var(--ink)}
.phead .sub{color:var(--muted);font-size:13.5px;margin-top:4px}
.phead .clock{text-align:right}
.phead .clock .date{font-family:var(--head);font-size:15px;color:var(--ink)}
.phead .clock .time{font-family:var(--head);font-size:30px;font-weight:600;color:var(--gold-ink);line-height:1.05}
.stamp{font-size:11.5px;color:var(--muted)}

/* ---- cards ---- */
.card{background:var(--white);border-radius:14px;padding:20px 22px;box-shadow:var(--shadow);border:1px solid var(--line);margin-bottom:18px}
.card h2{font-size:1.25rem;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.card h2 .count{font-family:var(--body);font-size:12px;font-weight:800;color:var(--gold-ink);background:rgba(201,169,123,.15);border-radius:20px;padding:3px 10px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
@media(max-width:900px){.grid2{grid-template-columns:1fr}}

/* ---- KPI tiles ---- */
.kpis{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin-bottom:6px}
@media(max-width:1050px){.kpis{grid-template-columns:repeat(3,1fr)}}
@media(max-width:640px){.kpis{grid-template-columns:1fr 1fr}}
.kpi{background:linear-gradient(135deg,var(--navy-deep),var(--navy));color:var(--on-dark);border-radius:14px;padding:15px 14px;border-bottom:3px solid var(--gold);display:block}
.kpi .num{font-family:var(--head);font-weight:700;font-size:1.75rem;color:var(--gold);line-height:1.1}
.kpi .lbl{font-size:10.5px;text-transform:uppercase;letter-spacing:.07em;font-weight:700;color:var(--on-dark-muted);margin-top:5px}
.kpi .sub{font-size:11px;color:var(--on-dark-muted);margin-top:3px}
.kpi .sub b{color:#8fd3ae;font-weight:800}
.kpi .bar{background:rgba(255,255,255,.16);border-radius:8px;height:9px;margin-top:8px;overflow:hidden}
.kpi .bar i{display:block;height:100%;background:linear-gradient(90deg,var(--gold),#e6cfa4);border-radius:8px}
a.kpi{transition:.13s} a.kpi:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}

/* ---- list rows (today / tasks / deadlines) ---- */
.row{display:flex;align-items:flex-start;gap:12px;padding:11px 0;border-bottom:1px solid var(--line)}
.row:last-child{border-bottom:0}
.row .txt{font-weight:700;font-size:14px;line-height:1.35}
.row .txt a{color:var(--accent-blue)}
.row .sub{color:var(--muted);font-size:12.5px;font-weight:500;margin-top:2px}
.chip{flex:0 0 auto;font-size:10px;font-weight:800;padding:4px 10px;border-radius:100px;text-transform:uppercase;letter-spacing:.1em;margin-top:2px;white-space:nowrap}
.chip.gold{background:rgba(201,169,123,.15);color:var(--gold-ink);border:1px solid rgba(201,169,123,.4)}
.chip.blue{background:rgba(91,123,180,.12);color:var(--accent-blue);border:1px solid rgba(91,123,180,.35)}
.chip.red{background:rgba(176,83,63,.1);color:var(--red);border:1px solid rgba(176,83,63,.3)}
.chip.green{background:rgba(63,143,107,.12);color:var(--green);border:1px solid rgba(63,143,107,.3)}

/* ---- handled ---- */
.handled{background:var(--cream-warm);border-left:3px solid var(--gold);border-radius:8px;padding:13px 15px}
.handled li{list-style:none;font-size:13px;padding:2px 0}
.handled li::before{content:"\2713  ";color:var(--gold-ink);font-weight:800}

/* ---- buttons + tile links ---- */
.btns{display:grid;grid-template-columns:repeat(auto-fill,minmax(165px,1fr));gap:11px}
.btn{display:flex;align-items:center;gap:10px;padding:13px 15px;border-radius:10px;font-weight:700;font-size:13.5px;font-family:var(--body);
  border:1px solid var(--line);background:var(--white);cursor:pointer;transition:.15s;color:var(--ink);text-align:left;width:100%}
.btn:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg);border-color:var(--gold)}
.btn .sm{font-size:11px;color:var(--muted);display:block;font-weight:500}
.btn.go{background:var(--navy);color:var(--gold);border:2px solid var(--gold)}
.btn.go:hover{background:var(--gold);color:var(--navy)}
.btn.go .sm{color:rgba(240,229,215,.75)}
.btn.go:hover .sm{color:rgba(42,58,74,.7)}
.linkrow{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid var(--line)}
.linkrow a{font-size:12.5px;font-weight:700;color:var(--gold-ink);background:rgba(201,169,123,.1);border:1px solid rgba(201,169,123,.35);border-radius:100px;padding:6px 13px;transition:.13s}
.linkrow a:hover{background:var(--gold);color:var(--navy)}

/* ---- library / hub item grids ---- */
.items{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:10px}
.item{display:block;background:var(--cream-warm);border:1px solid var(--line);border-radius:10px;padding:12px 14px;transition:.13s}
.item:hover{background:var(--white);box-shadow:var(--shadow);transform:translateY(-1px);border-color:var(--gold)}
.item .t{font-weight:700;font-size:13.5px}
.item .d{font-size:11.5px;color:var(--muted);margin-top:3px}

/* ---- toast (copy-prompt feedback) ---- */
#toast{position:fixed;bottom:24px;left:50%;transform:translateX(-50%) translateY(120px);background:var(--navy-deep);
  color:var(--on-dark);padding:13px 22px;border-radius:8px;font-weight:600;font-size:13px;visibility:hidden;
  border:1px solid rgba(201,169,123,.3);box-shadow:0 0 24px rgba(201,169,123,.18);transition:.3s;z-index:99;max-width:90vw}
#toast.show{transform:translateX(-50%) translateY(0);visibility:visible}
#toast b{color:var(--gold)}
.note{font-size:12px;color:var(--muted);margin-top:16px;text-align:center}