/* ---------- Things the Claude runtime used to provide, plus sign-in and print ---------- */
:root { --font-anthropic-sans: "Segoe UI", system-ui, -apple-system, "Helvetica Neue", Arial, sans-serif; }
html, body { margin:0; padding:0; background:#F4F6FB; }
[hidden] { display:none !important; }

.wl select.dash-select { appearance:none; -webkit-appearance:none; padding:7px 30px 7px 10px; cursor:pointer;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235C6582' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 10px center; }
.wl select.dash-select:disabled { opacity:.55; cursor:not-allowed; }
.wl select.dash-select:focus, .wl input.wl-in:focus { outline:2px solid #3BE4FD; border-color:#2251F5; }
.wl-dialog select.dash-select { appearance:none; -webkit-appearance:none; font:inherit; font-size:13.5px; font-weight:400; color:#1D1D1B; border:1px solid #D5DBEC; border-radius:10px; padding:10px 32px 10px 12px; background-color:#FAFBFF;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235C6582' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat:no-repeat; background-position:right 12px center; }

.dash-skeleton { position:relative; min-height:22px; border-radius:10px; overflow:hidden; background:#EEF1F8; }
.dash-skeleton::after { content:""; position:absolute; inset:0; transform:translateX(-100%); background:linear-gradient(90deg,transparent,rgba(255,255,255,.7),transparent); animation:wl-shimmer 1.2s infinite; }
@keyframes wl-shimmer { to { transform:translateX(100%); } }
.wl-hm .dash-skeleton { background:rgba(255,255,255,.18); min-width:70px; }

/* Signed-in user and refresh in the sidebar */
.wl-user { display:flex; flex-wrap:wrap; align-items:center; gap:6px 8px; margin-top:10px; padding-top:10px; border-top:1px solid rgba(255,255,255,.1); }
.wl-user span { flex:1 1 100%; color:#fff; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.wl-side .wl-user button { all:unset; cursor:pointer; font-size:11px; color:#9FB0E6; padding:3px 7px; border-radius:6px; border:1px solid rgba(255,255,255,.18); }
.wl-side .wl-user button:hover { color:#fff; border-color:#3BE4FD; }

/* Sign-in screen */
.signin { min-height:100vh; display:grid; place-items:center; background:radial-gradient(circle at 80% 10%,rgba(59,228,253,.35),transparent 45%),linear-gradient(135deg,#151B47 0%,#2251F5 70%,#18BFE6 120%); font-family:var(--font-anthropic-sans); padding:24px; }
.signin-card { background:#fff; border-radius:22px; padding:34px 36px; width:min(440px,100%); text-align:center; box-shadow:0 30px 80px rgba(0,0,0,.3); }
.signin-card img { width:64px; height:64px; }
.signin-card h1 { color:#151B47; font-size:22px; margin:14px 0 4px; }
.signin-card p { color:#5C6582; font-size:14px; line-height:1.5; margin:0 0 22px; }
.signin-card button { font:inherit; font-size:15px; font-weight:600; border:0; border-radius:12px; padding:12px 22px; cursor:pointer; color:#fff; background:linear-gradient(90deg,#2251F5,#18BFE6); display:inline-flex; align-items:center; gap:10px; }
.signin-card small { display:block; margin-top:18px; color:#8A93AE; font-size:12px; }

/* Print: only the open section (Executive Report), no navigation */
@media print {
  @page { margin:12mm; }
  html, body { background:#fff; }
  .wl { display:block; background:#fff; min-height:0; }
  .wl-side, .wl-top .wl-filters, [data-print], .pr-hint, #definitions, .wl-dialog { display:none !important; }
  .wl-top { position:static; background:#fff; backdrop-filter:none; }
  .wl-main { padding:0; }
  .wl-card, .wl-tile, .wl-hero { break-inside:avoid; -webkit-print-color-adjust:exact; print-color-adjust:exact; box-shadow:none; }
  .wl-tablewrap { max-height:none; overflow:visible; }
  .wl-badge, .wl-pill, .wl-dot, .wl-status, .wl-init { -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}

/* ---------- Phones and narrow tablets ---------- */
@media (max-width: 860px) {
  .wl { display:block; background:#F4F6FB; min-height:100vh; }
  /* Sidebar becomes a sticky top bar: logo row + horizontally scrolling sections */
  .wl-side { position:sticky; top:0; z-index:20; height:auto; overflow:visible; padding:10px 12px 8px; flex-direction:column; gap:6px;
    box-shadow:0 6px 18px rgba(21,27,71,.25); }
  .wl-brand { display:flex; padding:2px 2px 4px; }
  .wl-logo { width:30px; height:30px; }
  .wl-brand b { font-size:14px; } .wl-brand small { font-size:11px; }
  .wl-side h6 { display:none; }
  .wl-sidenav > button { display:inline-flex; flex:none; white-space:nowrap; padding:8px 12px; font-size:13px; }
  .wl-side .wl-mob-user button { padding:5px 10px; font-size:12px; border:1px solid rgba(255,255,255,.22); border-radius:8px; color:#C9D3F5; }
  .wl-sidenav { display:flex; gap:4px; overflow-x:auto; -webkit-overflow-scrolling:touch; scrollbar-width:none; margin:0 -12px; padding:0 12px 2px; }
  .wl-sidenav::-webkit-scrollbar { display:none; }
  .wl-foot { display:none; }
  .wl-mob-user { display:flex !important; margin-left:auto; gap:6px; }

  .wl-main { padding:0 14px 60px; scroll-margin-top:110px; }
  .wl-top { position:static; backdrop-filter:none; background:transparent; padding:14px 0 10px; }
  .wl-top h1 { font-size:17px; flex-wrap:wrap; gap:6px 8px; }
  .wl-filters { width:100%; display:grid; grid-template-columns:1fr 1fr; gap:8px; }
  .wl-filters label:first-child { grid-column:1 / -1; }
  .wl-filters label, .wl-filters select.dash-select { width:100%; min-width:0; }
  .wl-filters .wl-btn { width:100%; align-self:stretch; text-align:center; }
  .wl-filters .wl-btn.primary { grid-column:1 / -1; }

  .wl section[data-view] { gap:14px; padding-top:14px; }
  .wl-hero { padding:20px 18px; border-radius:16px; flex-direction:column; align-items:flex-start; }
  .wl-hero h2 { font-size:22px; }
  .wl-hm { gap:18px; width:100%; justify-content:space-between; }
  .wl-hm b { font-size:22px; min-height:26px; }
  .wl-card { padding:16px; border-radius:14px; }
  .wl-grid, .wl-grid.two, .wl-grid.wide { grid-template-columns:1fr; gap:12px; }
  #kpis, #status-kpis { grid-template-columns:1fr 1fr; }
  .wl-kpi .v { font-size:22px; min-height:26px; }
  .wl-kpi .ic { width:30px; height:30px; right:12px; top:12px; border-radius:9px; }
  .wl-kpi .ic svg { width:15px; height:15px; }
  .wl-kpi small.k { font-size:10px; padding-right:34px; display:block; }
  .wl-hcards { grid-template-columns:1fr; min-height:0; }
  .wl-hhead { flex-wrap:wrap; }
  .wl-alerts, .wl-tiles { grid-template-columns:1fr 1fr; }
  .wl-tile b { font-size:18px; }
  .wl-prow { grid-template-columns:auto 1fr auto; }
  .wl-prow > .wl-nudge { grid-column:1 / -1; justify-self:start; }
  .wl-tools { gap:8px; }
  .wl-tools > label { flex:1 1 100% !important; min-width:0 !important; }
  .wl-tools select.dash-select, .wl-tools input.wl-in, #pl-target, #pl-hours { width:100% !important; min-width:0 !important; }
  .wl-tablewrap { max-height:none; }
  .wl table { font-size:12px; }
  .wl td.wl-task { min-width:180px; }
  .wl-stlist > div { grid-template-columns:100px 1fr 32px; }
  .wl-head { margin-bottom:8px; }
  .wl-chart { min-height:220px; }
  .wl-dialog { padding:18px 16px; border-radius:16px; }
  .nd-people { grid-template-columns:1fr 1fr; }
  .nd-row > label { min-width:0; }
  .nd-actions .wl-btn { flex:1 1 45%; }
  .wl-dialog textarea { min-height:200px; }
}
@media (max-width: 380px) {
  #kpis, #status-kpis, .wl-alerts, .wl-tiles { grid-template-columns:1fr; }
}
@media (min-width: 861px) { .wl-mob-user { display:none !important; } .wl-sidenav { display:contents; } }