/* Steward hubs — the function-first shell (static/hub.js).
   One destination per job: Home, Money, News, Health, Day, Build, Network, Play, Control.
   Uses the dashboard's existing design tokens; nothing here redefines them. */

/* ── Shell: rail, header sections, mobile bar ─────────────────────────── */
body.hub-shell #side-nav .hub-nav-badge{
  margin-left:auto; min-width:18px; padding:1px 6px; border-radius:999px;
  background:var(--red); color:#1e1e2e; font:800 10.5px/1.5 var(--font); text-align:center;
}
body.hub-shell:not(.cc-nav-expanded) #side-nav .hub-nav-badge{
  position:absolute; top:3px; right:5px; margin:0; min-width:8px; width:8px; height:8px; padding:0; font-size:0;
}
body.hub-shell #side-nav .cc-nav-item{ position:relative; }
body.hub-shell .brand{ display:none; }

#hub-sections{
  display:none; align-items:center; gap:4px; flex:1 1 auto; min-width:0;
  overflow-x:auto; scrollbar-width:none; padding:2px 0;
}
/* Desktop has no top header (the rail replaces it), so the sections ride a slim bar beside the rail. */
@media (min-width:701px){
  #hub-sections{
    position:fixed; top:0; left:var(--cc-rail-w); right:0; height:44px; z-index:850; padding:0 16px;
    background:linear-gradient(180deg,rgba(24,24,37,.98),rgba(20,20,32,.96)); border-bottom:1px solid rgba(137,180,250,.14);
    transition:left .16s ease;
  }
  body.hub-shell.hub-has-sections{ --hh:44px; }
  body.hub-shell.hub-has-sections .page{ margin-top:44px; height:calc(100dvh - 44px); }
}
#hub-sections::-webkit-scrollbar{ display:none; }
body.hub-shell #hub-sections.has-items{ display:flex; }
.hub-title{
  flex:0 0 auto; font:800 15px/1 var(--font); color:var(--text); letter-spacing:.2px;
  margin-right:6px; white-space:nowrap;
}
.hub-chip{
  flex:0 0 auto; min-height:34px; padding:6px 13px; border-radius:999px; cursor:pointer;
  border:1px solid transparent; background:none; color:var(--dim);
  font:700 12.5px/1 var(--font); white-space:nowrap; transition:color .14s, background .14s;
}
.hub-chip:hover{ color:var(--text); background:rgba(137,180,250,.1); }
.hub-chip[aria-current="page"]{
  color:var(--blue); background:rgba(137,180,250,.16); border-color:rgba(137,180,250,.3);
}

/* ── Hub pages ────────────────────────────────────────────────────────── */
.page.hub-page{ flex-direction:column; }
.page.hub-page.active{ display:flex; }
.hub-scroll{ flex:1 1 auto; min-height:0; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch; }
.hub-wrap{ max-width:1320px; margin:0 auto; padding:18px 20px 40px; display:flex; flex-direction:column; gap:16px; }

.hub-hero{ display:flex; flex-wrap:wrap; align-items:flex-end; gap:12px 20px; }
.hub-hero-copy{ flex:1 1 280px; min-width:0; }
.hub-hero h1{ font:800 26px/1.15 var(--font); letter-spacing:-.01em; }
.hub-hero p{ color:var(--dim); font-size:13.5px; margin-top:4px; }
.hub-hero-actions{ display:flex; flex-wrap:wrap; gap:8px; }

.hub-ask{
  display:flex; gap:8px; width:100%; background:var(--bg2); border:1px solid var(--border);
  border-radius:14px; padding:6px 6px 6px 14px; align-items:center;
}
.hub-ask:focus-within{ border-color:var(--blue); box-shadow:0 0 0 3px rgba(137,180,250,.14); }
.hub-ask input{
  flex:1; min-width:0; background:none; border:none; outline:none; color:var(--text);
  font:500 15px var(--font); padding:8px 0;
}
.hub-ask input::placeholder{ color:var(--dim); }

.hub-btn{
  display:inline-flex; align-items:center; justify-content:center; gap:6px; min-height:40px;
  padding:8px 16px; border-radius:10px; cursor:pointer; white-space:nowrap;
  border:1px solid var(--border); background:var(--bg3); color:var(--text); font:700 13px/1 var(--font);
  transition:border-color .14s, background .14s, transform .06s;
}
.hub-btn:hover{ border-color:rgba(137,180,250,.55); background:rgba(137,180,250,.12); }
.hub-btn:active{ transform:scale(.98); }
.hub-btn.primary{ background:var(--blue); color:#11111b; border-color:var(--blue); }
.hub-btn.primary:hover{ filter:brightness(1.08); background:var(--blue); }
.hub-btn.sm{ min-height:34px; padding:6px 12px; font-size:12px; border-radius:8px; }
.hub-btn.danger{ color:var(--red); border-color:rgba(243,139,168,.45); }
.hub-btn:disabled{ opacity:.55; cursor:progress; }

.hub-split{ display:grid; grid-template-columns:minmax(0,2fr) minmax(0,1fr); gap:14px; align-items:start; }
.hub-col{ display:flex; flex-direction:column; gap:14px; min-width:0; }
.hub-pair{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; align-items:start; }
@media (max-width:1100px){
  .hub-split{ display:flex; flex-direction:column; align-items:stretch; }
  .hub-col, .hub-pair{ display:contents; }
  .hub-card{ order:var(--o,0); }
}

.hub-card{
  background:var(--bg2); border:1px solid var(--border); border-radius:14px;
  display:flex; flex-direction:column; min-width:0; overflow:hidden;
}
.hub-card-head{ display:flex; align-items:center; gap:8px; padding:12px 14px 6px; }
.hub-card-title{ font:800 14px/1.2 var(--font); display:flex; align-items:center; gap:8px; min-width:0; margin-right:auto; }
.hub-card-ico{ font-size:16px; }
.hub-card-open{
  background:none; border:none; color:var(--blue); cursor:pointer; font:700 12px var(--font);
  padding:6px 4px; min-height:32px; white-space:nowrap;
}
.hub-card-open:hover{ text-decoration:underline; }
.hub-card-body{ padding:2px 6px 10px; display:flex; flex-direction:column; min-height:60px; }
.hub-card-foot{ display:flex; flex-wrap:wrap; gap:8px; padding:4px 12px 12px; }

.hub-row{
  display:flex; align-items:center; gap:10px; min-height:46px; padding:7px 8px; border-radius:10px;
  color:var(--text); text-align:left; background:none; border:none; width:100%; cursor:pointer;
  font:inherit; min-width:0;
}
.hub-row:hover{ background:rgba(137,180,250,.08); }
.hub-row.static{ cursor:default; } .hub-row.static:hover{ background:none; }
.hub-row-main{ flex:1; min-width:0; display:flex; flex-direction:column; gap:2px; }
.hub-row-title{ font:650 13.5px/1.3 var(--font); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hub-row-title.wrap{ white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.hub-row-sub{ font-size:11.5px; color:var(--dim); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hub-row-end{ flex:0 0 auto; display:flex; align-items:center; gap:6px; font:700 12.5px var(--font); color:var(--dim); }
.hub-dot{ width:9px; height:9px; border-radius:50%; flex:0 0 auto; background:var(--dim); }
.hub-dot.ok{ background:var(--green); } .hub-dot.warn{ background:var(--amber); } .hub-dot.bad{ background:var(--red); }
.hub-time{ flex:0 0 58px; font:700 12px var(--mono); color:var(--dim); }
.hub-day{ padding:10px 8px 2px; font:800 11px var(--font); letter-spacing:.07em; text-transform:uppercase; color:var(--dim); }

.hub-pill{
  display:inline-flex; align-items:center; gap:4px; padding:2px 8px; border-radius:999px; font:700 11px/1.5 var(--font);
  border:1px solid var(--border); background:var(--bg3); color:var(--dim); white-space:nowrap;
}
.hub-pill.ok{ color:var(--green); border-color:rgba(166,227,161,.4); background:rgba(166,227,161,.1); }
.hub-pill.warn{ color:var(--amber); border-color:rgba(249,226,175,.4); background:rgba(249,226,175,.1); }
.hub-pill.bad{ color:var(--red); border-color:rgba(243,139,168,.4); background:rgba(243,139,168,.1); }
.hub-pill.info{ color:var(--blue); border-color:rgba(137,180,250,.4); background:rgba(137,180,250,.1); }
.pos{ color:var(--green); } .neg{ color:var(--red); }

.hub-stats{ display:grid; grid-template-columns:repeat(auto-fit,minmax(110px,1fr)); gap:8px; padding:4px 8px 8px; }
.hub-stat{ background:var(--bg); border:1px solid var(--border); border-radius:10px; padding:9px 11px; min-width:0; }
.hub-stat label{ display:block; font:700 10px var(--font); letter-spacing:.06em; text-transform:uppercase; color:var(--dim); }
.hub-stat strong{ display:block; font:800 20px/1.2 var(--font); margin-top:2px; overflow:hidden; text-overflow:ellipsis; }
.hub-stat span{ font-size:11px; color:var(--dim); }
.hub-stat.big strong{ font-size:30px; }

.hub-note{ padding:8px 10px; margin:2px 6px; font-size:12px; color:var(--dim); line-height:1.45; }
.hub-empty{ padding:18px 12px; text-align:center; color:var(--dim); font-size:13px; }
.hub-err{ padding:14px 12px; display:flex; flex-direction:column; align-items:flex-start; gap:8px; color:var(--dim); font-size:12.5px; }
.hub-skel{ display:flex; flex-direction:column; gap:9px; padding:10px 10px; }
.hub-skel i{ display:block; height:14px; border-radius:6px; background:linear-gradient(90deg,var(--bg3),rgba(137,180,250,.14),var(--bg3)); background-size:200% 100%; animation:hubShimmer 1.3s linear infinite; }
.hub-skel-label{ font-size:11px; color:var(--dim); }
.hub-skel i:nth-child(2){ width:82%; } .hub-skel i:nth-child(3){ width:64%; }
@keyframes hubShimmer{ to{ background-position:-200% 0; } }
@media (prefers-reduced-motion:reduce){ .hub-skel i{ animation:none; } }

/* Attention strip (Home, Control) */
.hub-attn{ border-color:rgba(249,226,175,.4); }
.hub-attn.clear{ border-color:rgba(166,227,161,.35); }
.hub-attn-row{ display:flex; align-items:center; gap:10px; padding:8px; border-radius:10px; min-height:48px; }
.hub-attn-row + .hub-attn-row{ border-top:1px solid rgba(69,71,90,.5); }

/* Node + app tiles */
.hub-tiles{ display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr)); gap:10px; padding:6px 8px 10px; }
.hub-tile{
  display:flex; flex-direction:column; gap:6px; padding:11px; border-radius:12px; text-align:left;
  background:var(--bg); border:1px solid var(--border); color:var(--text); cursor:pointer; font:inherit; min-width:0;
}
.hub-tile:hover{ border-color:rgba(137,180,250,.55); }
.hub-tile strong{ font:750 13px/1.25 var(--font); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hub-tile small{ color:var(--dim); font-size:11.5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.hub-tile img{ width:100%; aspect-ratio:16/9; object-fit:cover; border-radius:8px; background:var(--bg3); }
.hub-bar{ height:6px; border-radius:99px; background:var(--bg3); overflow:hidden; }
.hub-bar i{ display:block; height:100%; background:var(--blue); border-radius:99px; }
.hub-bar.hot i{ background:var(--amber); }

.hub-switch{ display:inline-flex; border:1px solid var(--border); border-radius:10px; overflow:hidden; }
.hub-switch button{ min-height:40px; padding:8px 18px; background:none; border:none; color:var(--dim); cursor:pointer; font:800 13px var(--font); }
.hub-switch button[aria-pressed="true"]{ background:var(--blue); color:#11111b; }
.hub-switch button[data-mode="dev"][aria-pressed="true"]{ background:var(--amber); }

/* ── Mobile: single column, big targets, hub chips scroll in the header ── */
@media (max-width:700px){
  body.hub-shell .brand{ display:block; font-size:13px; letter-spacing:.6px; }
  body.hub-shell.hub-has-sections .brand{ display:none; }
  body.hub-shell #header-chat-btn{ display:none; }
  body.hub-shell #hub-sections .hub-title{ display:none; }
  .hub-wrap{ padding:12px 12px 24px; gap:12px; }
  .hub-hero h1{ font-size:21px; }
  .hub-btn{ min-height:44px; }
  .hub-btn.sm{ min-height:40px; }
  .hub-chip{ min-height:38px; }
  .hub-row{ min-height:52px; }
  .hub-hero-actions{ width:100%; }
  .hub-hero-actions .hub-btn{ flex:1; }
  .hub-stat strong{ font-size:18px; } .hub-stat.big strong{ font-size:26px; }
}

/* Mobile more-sheet: hubs as a clear grid with live badges */
.mobile-more-btn .hub-more-badge{ float:right; background:var(--red); color:#1e1e2e; border-radius:999px; padding:0 7px; font:800 11px/1.6 var(--font); }

/* Node tiles: the pause control is deliberately quiet so a stray tap is unlikely */
.hub-tile .hub-btn{ min-height:30px; padding:4px 10px; font-size:11px; background:none; align-self:flex-start; color:var(--dim); }
.hub-tile .hub-btn:hover{ color:var(--text); }

/* Needs-you rows: plain headline, one-line detail, the buttons that resolve it */
.hub-attn-row{ align-items:flex-start; flex-wrap:wrap; }
.hub-attn-row .hub-dot{ margin-top:7px; }
.hub-attn-text{ background:none; border:none; color:inherit; font:inherit; text-align:left; cursor:pointer; padding:0; min-width:0; flex:1 1 220px; }
.hub-attn-text:hover .hub-row-title{ text-decoration:underline; }
.hub-row-sub.wrap{ white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.hub-attn-btns{ display:flex; flex-wrap:wrap; gap:6px; margin-left:auto; }
@media (max-width:700px){ .hub-attn-btns{ width:100%; margin-left:19px; } .hub-attn-btns .hub-btn{ flex:1; } }
/* paired cards share a height so rows line up */
.hub-pair{ align-items:stretch; }
.hub-pair .hub-card{ height:100%; }

/* Money: equity chart, verdict, range toggle */
.hub-chart{width:100%;height:190px;display:block;margin:6px 0 2px}
.hub-chart .ch-line{fill:none;stroke-width:2.2;vector-effect:non-scaling-stroke}
.hub-chart .ch-line.up{stroke:var(--green,#a6e3a1)}.hub-chart .ch-line.down{stroke:var(--red,#f38ba8)}
.hub-chart .ch-spy{fill:none;stroke:var(--dim,#a6adc8);stroke-width:1.4;stroke-dasharray:4 3;vector-effect:non-scaling-stroke;opacity:.85}
.hub-chart .ch-base{stroke:var(--line,#45475a);stroke-width:1;stroke-dasharray:2 4;vector-effect:non-scaling-stroke}
.hub-chart .ch-area.up{fill:var(--green,#a6e3a1);opacity:.12}.hub-chart .ch-area.down{fill:var(--red,#f38ba8);opacity:.12}
.hub-chart-legend{display:flex;flex-wrap:wrap;gap:6px 16px;font-size:12px;color:var(--dim,#a6adc8);margin-bottom:10px}
.hub-chart-legend .lg{display:inline-block;width:14px;height:0;border-top:2px solid;margin-right:6px;vertical-align:middle}
.hub-chart-legend .lg.up{border-color:var(--green,#a6e3a1)}.hub-chart-legend .lg.down{border-color:var(--red,#f38ba8)}
.hub-chart-legend .lg.spy{border-top-style:dashed;border-color:var(--dim,#a6adc8)}
.hub-chart-legend .dim{margin-left:auto}
.hub-verdict{font-size:15px;font-weight:700;line-height:1.35;margin-bottom:8px}
.hub-verdict.good{color:var(--green,#a6e3a1)}.hub-verdict.bad{color:var(--red,#f38ba8)}
.hub-seg{display:inline-flex;border:1px solid var(--line,#45475a);border-radius:8px;overflow:hidden;margin:2px 0 4px}
.hub-segbtn{background:transparent;border:0;color:var(--dim,#a6adc8);padding:6px 14px;font-size:12px;font-weight:600;cursor:pointer;min-height:32px}
.hub-segbtn.on{background:var(--accent,#89b4fa);color:var(--bg,#1e1e2e)}
.hub-sub{font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--dim,#a6adc8);margin:12px 0 4px;font-weight:700}

/* Trading desk tabs */
.hub-desk-tabs{grid-column:1/-1;display:flex;gap:0;position:sticky;top:0;z-index:5;padding:2px 0 4px;overflow-x:auto}
.hub-desk-tabs .hub-segbtn{border:1px solid var(--line,#45475a);border-right-width:0;white-space:nowrap;flex:1 0 auto;background:var(--panel,#1e1e2e)}
.hub-desk-tabs .hub-segbtn:first-child{border-radius:8px 0 0 8px}.hub-desk-tabs .hub-segbtn:last-child{border-right-width:1px;border-radius:0 8px 8px 0}
.hub-desk-hide{display:none !important}

/* News: stories */
.hub-digest{font-size:15px;line-height:1.5;margin:2px 0 10px}
.hub-story{border-top:1px solid var(--line,#45475a);padding:2px 0}
.hub-story:first-of-type{border-top:0}
.hub-story>summary{cursor:pointer;list-style:none;padding:10px 0;display:flex;flex-direction:column;gap:2px}
.hub-story>summary::-webkit-details-marker{display:none}
.hub-story-h{font-weight:700;font-size:14px;line-height:1.3}
.hub-story-m{font-size:11px;color:var(--dim,#a6adc8)}
.hub-story-b{padding:0 0 12px}
.hub-story-b p{margin:6px 0;font-size:13.5px;line-height:1.5}
.hub-story-img{width:100%;max-height:200px;object-fit:cover;border-radius:8px;margin-bottom:6px}
.hub-story-act{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}
.hub-dimline{font-size:12px;color:var(--dim,#a6adc8);margin-top:6px}

/* Health: people, situations, logging */
.hub-people{display:flex;gap:6px;flex-wrap:wrap;margin-top:10px}
.hub-chip{background:var(--bg3,#313244);border:1px solid var(--line,#45475a);color:var(--text,#cdd6f4);border-radius:999px;padding:6px 12px;font-size:12.5px;cursor:pointer;min-height:34px}
.hub-chip.on{background:var(--accent,#89b4fa);color:var(--bg,#1e1e2e);border-color:transparent;font-weight:700}
.hub-chip b{margin-left:4px;opacity:.85}
.hub-sit{border:1px solid var(--line,#45475a);border-radius:12px;padding:12px;margin-bottom:12px;display:flex;flex-direction:column;gap:8px}
.hub-sit-head{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.hub-sit-head strong{font-size:14.5px}
.hub-chips{display:flex;gap:5px;flex-wrap:wrap}
.hub-bullets{margin:0;padding-left:18px;font-size:13px;line-height:1.5}
.hub-recent{font-size:12.5px;display:flex;flex-direction:column;gap:2px;border-left:2px solid var(--line,#45475a);padding-left:8px}
.hub-alertline{font-size:13px;color:var(--red,#f38ba8);font-weight:600}
.hub-logrow{display:flex;gap:6px;flex-wrap:wrap}
.hub-logrow .grow{flex:1 1 180px}
.hub-in{background:var(--bg3,#313244);border:1px solid var(--line,#45475a);color:var(--text,#cdd6f4);border-radius:8px;padding:8px 10px;font-size:13px;min-height:38px;font-family:inherit}
.hub-sit-act{display:flex;gap:6px;flex-wrap:wrap}
.hub-form{display:flex;flex-direction:column;gap:12px}
.hub-form label{display:flex;flex-direction:column;gap:4px;font-size:12px;color:var(--dim,#a6adc8);font-weight:600}
.hub-form textarea.hub-in{resize:vertical}
.hub-trend{display:flex;align-items:center;gap:10px;padding:6px 0;border-top:1px solid var(--line,#45475a);font-size:13px}
.hub-trend:first-child{border-top:0}.hub-trend>span:first-child{flex:1}
.hub-spark{width:120px;height:30px}.hub-spark path{fill:none;stroke:var(--accent,#89b4fa);stroke-width:2;vector-effect:non-scaling-stroke}
.hub-spark-one{font-weight:700;min-width:48px;text-align:right}
.hub-hero{flex-wrap:wrap}
.hub-hero .hub-people{flex:1 0 100%}

/* Inbox clean-up */
.hub-suggest{display:flex;flex-direction:column;gap:4px;padding:10px 0;border-top:1px solid var(--line,#45475a)}
.hub-suggest:first-child{border-top:0}
.hub-rules{margin-top:8px;font-size:13px}.hub-rules>summary{cursor:pointer;color:var(--dim,#a6adc8)}

.hub-card-age{ margin-left:auto; font-size:11px; opacity:.6; white-space:nowrap; }
.hub-card-age[hidden]{ display:none; }
.hub-card-head .hub-card-open{ margin-left:8px; }

/* Touch targets: on a phone or touch screen every control in the busiest pages is at least 36px tall. */
@media (max-width:700px), (pointer:coarse) {
  #page-settings button, #page-settings select, #page-settings summary,
  #page-workspace button, #page-workspace select,
  #page-news button, #page-news select,
  #page-health button, #page-health select,
  #page-email button, #page-email select,
  #page-calendar button, #page-growth button, #page-growth select,
  #page-games button, #page-tv button, #page-stocks button, #page-stocks select,
  #page-activity button, #page-activity select { min-height:36px; }
  #page-settings button, #page-workspace button, #page-news button, #page-health button, #page-email button,
  #page-calendar button, #page-growth button, #page-stocks button { min-width:36px; }
}
.hub-digest p{ margin:0 0 .7em; line-height:1.55; }
.hub-digest p:last-child{ margin-bottom:0; }