/* Hub v50 — announcement-first, fluid cards, compact owner rail. */
.page-hub .shell {
  width: min(1500px, calc(100% - clamp(16px, 2.4vw, 38px)));
  min-height: 100svh;
  padding: 9px 0 13px;
}

.page-hub .topbar { min-height: 46px; }
.page-hub .hero {
  min-height: 0;
  margin: 8px 0;
  padding: clamp(13px, 1.55vw, 21px) clamp(16px, 2vw, 27px);
}
.page-hub .hero .eyebrow { margin-bottom: 4px; font-size: 9px; }
.page-hub .hero h1 { font-size: clamp(28px, 3.1vw, 45px); line-height: 1; }
.page-hub .hero h1 br { display: none; }
.page-hub .hero h1 span { margin-left: 8px; }
.page-hub .hero > p:last-child { max-width: 850px; margin: 6px 0 0; font-size: 12px; line-height: 1.45; }

/* The announcement board is deliberately the strongest element after the hero. */
.page-hub .news-board {
  display: grid;
  grid-template-columns: minmax(250px, .72fr) minmax(0, 2fr);
  gap: 12px;
  margin: 0 0 11px;
  padding: 8px;
  border: 2px solid #e0ad15;
  border-radius: 18px;
  background: linear-gradient(120deg, #fff5bd, #fffef8 44%);
  box-shadow: 0 12px 30px rgba(113, 77, 0, .13);
}
.page-hub .news-board::before { display: none; }
.page-hub .news-board-head {
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: stretch;
  justify-content: space-between;
  gap: 10px;
  padding: 13px 14px;
  border-radius: 13px;
  color: #fff;
  background:
    radial-gradient(circle at 100% 0, rgba(255, 216, 77, .23), transparent 8rem),
    #0b1730;
}
.page-hub .news-heading-wrap { display: grid; grid-template-columns: 46px minmax(0, 1fr); align-items: center; gap: 11px; }
.page-hub .news-signal {
  width: 46px;
  height: 46px;
  display: grid;
  place-items: center;
  border-radius: 14px;
  color: #0b1730;
  background: linear-gradient(145deg, #ffe983, #ffd12f);
  font-size: 24px;
  box-shadow: 0 8px 18px rgba(244, 189, 18, .22);
  animation: news-signal-pulse 2.6s ease-in-out infinite;
}
.page-hub .news-board-head .eyebrow { display: block; margin: 0 0 3px; color: #ffd84d; font-size: 8px; }
.page-hub .news-board-head h2 { margin: 0; color: #fff; font-size: clamp(18px, 1.55vw, 23px); line-height: 1.15; }
.page-hub .news-board-head > .news-heading-wrap > div > p:last-child { margin: 5px 0 0; color: #c7d2e2; font-size: 11px; line-height: 1.4; }
.page-hub .news-manage {
  align-self: flex-start;
  min-height: 31px;
  padding: 6px 10px;
  border-color: rgba(255, 216, 77, .32);
  color: #ffe06a;
  background: rgba(255, 255, 255, .07);
  font-size: 9px;
  box-shadow: none;
}
.page-hub .news-manage:hover { color: #0b1730; background: #ffd84d; }
.page-hub .news-list {
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(240px, 100%), 1fr));
  align-content: stretch;
  gap: 8px;
  margin: 0;
}
.page-hub .news-card {
  position: relative;
  min-height: 112px;
  padding: 14px 15px 13px 18px;
  border: 1px solid #e1d5a2;
  border-left: 6px solid var(--news-accent);
  border-radius: 13px;
  background: rgba(255, 255, 255, .93);
  box-shadow: 0 6px 15px rgba(75, 52, 0, .07);
}
.page-hub .news-card::before { display: none; }
.page-hub .news-card .news-kind { font-size: 9px; letter-spacing: .1em; }
.page-hub .news-card h3 { margin: 5px 0 4px; color: #101f38; font-size: 17px; line-height: 1.25; white-space: normal; overflow: visible; }
.page-hub .news-card p { margin: 0; color: #536176; font-size: 12px; line-height: 1.5; white-space: pre-line; overflow: visible; }
.page-hub .news-card time { display: block; margin-top: 7px; color: #7b8493; font-size: 9px; }
.page-hub .news-empty { min-height: 112px; display: grid; place-items: center; padding: 16px; border: 1px dashed #d0b33e; background: rgba(255, 255, 255, .68); font-size: 12px; }

.page-hub .section-heading { margin: 0 0 7px; }
.page-hub .section-heading .eyebrow { display: none; }
.page-hub .section-heading h2 { font-size: 19px; }
.page-hub .section-heading > span { font-size: 10px; }
.page-hub .app-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 8px;
}
.page-hub .app-card,
.page-hub .graphic-featured {
  grid-column: span 1;
  width: 100%;
  min-width: 0;
  min-height: 154px;
  padding: 11px 12px;
  border-radius: 14px;
}
.page-hub .app-card .icon,
.page-hub .graphic-featured .icon { width: 34px; height: 34px; border-radius: 10px; font-size: 10px; }
.page-hub .app-card .number,
.page-hub .graphic-featured .number { top: 12px; right: 11px; font-size: 9px; }
.page-hub .app-card small,
.page-hub .graphic-featured small { margin-top: 7px; font-size: 7px; letter-spacing: .11em; }
.page-hub .app-card h3,
.page-hub .graphic-featured h3 { margin: 4px 0 2px; font-size: 14px; line-height: 1.28; }
.page-hub .app-card p,
.page-hub .graphic-featured p {
  display: -webkit-box;
  margin: 1px 0 0;
  overflow: hidden;
  color: var(--studio-muted);
  font-size: 9px;
  line-height: 1.38;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.page-hub .app-card b,
.page-hub .graphic-featured b { padding-top: 7px; font-size: 9px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

/* Owner access stays a short utility rail instead of becoming a second dashboard. */
.page-hub .owner-panel {
  display: flex;
  min-height: 45px;
  align-items: center;
  gap: 9px;
  margin-top: 9px;
  padding: 6px 7px;
  border-radius: 13px;
}
.page-hub .owner-panel > div {
  flex: 0 0 auto;
  display: flex;
  align-items: baseline;
  gap: 7px;
  padding: 0 10px 0 5px;
  border-right: 1px solid rgba(255, 255, 255, .18);
  white-space: nowrap;
}
.page-hub .owner-panel > div .eyebrow { margin: 0; font-size: 7px; }
.page-hub .owner-panel h2 { margin: 0; font-size: 12px; }
.page-hub .owner-panel > div > p:last-child { display: none; }
.page-hub .owner-panel nav {
  min-width: 0;
  flex: 1;
  display: flex;
  gap: 5px;
  overflow-x: auto;
  padding: 1px 0 2px;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
}
.page-hub .owner-panel nav a {
  min-width: max-content;
  min-height: 31px;
  flex: 1 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 9px;
  border-radius: 8px;
  font-size: 9px;
  white-space: nowrap;
  scroll-snap-align: start;
}
.page-hub .owner-panel nav span { margin: 0; overflow: hidden; font-size: 0; }
.page-hub .owner-panel nav span::after { content: "→"; font-size: 10px; }
.page-hub footer { margin-top: 8px; font-size: 8px; }

html[data-dark="true"] .page-hub .news-board { border-color: #f0c531; background: linear-gradient(120deg, #2d270f, #0e1d34 46%); }
html[data-dark="true"] .page-hub .news-board-head { color: #0b1730; background: linear-gradient(135deg, #ffd84d, #edb914); }
html[data-dark="true"] .page-hub .news-board-head .eyebrow,
html[data-dark="true"] .page-hub .news-board-head h2 { color: #0b1730; }
html[data-dark="true"] .page-hub .news-board-head > .news-heading-wrap > div > p:last-child { color: #4d421c; }
html[data-dark="true"] .page-hub .news-signal { background: #0b1730; box-shadow: 0 8px 18px rgba(7, 17, 31, .2); }
html[data-dark="true"] .page-hub .news-manage { border-color: rgba(11, 23, 48, .2); color: #0b1730; background: rgba(255, 255, 255, .36); }
html[data-dark="true"] .page-hub .news-card { border-color: #344764; border-left-color: var(--news-accent); background: #14243d; }
html[data-dark="true"] .page-hub .news-card h3 { color: #f3f7ff; }
html[data-dark="true"] .page-hub .news-card p,
html[data-dark="true"] .page-hub .news-card time { color: #afbbcd; }
html[data-dark="true"] .page-hub .news-empty { color: #dce5f2; background: #14243d; }

@keyframes news-signal-pulse {
  0%, 100% { transform: rotate(-4deg) scale(1); }
  50% { transform: rotate(3deg) scale(1.06); }
}

@media (max-width: 1279px) {
  .page-hub .app-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .page-hub .app-card,
  .page-hub .graphic-featured { min-height: 142px; }
  .page-hub .app-card p,
  .page-hub .graphic-featured p { display: none; }
}

@media (max-width: 900px) {
  .page-hub .shell { width: min(100% - 18px, 1500px); }
  .page-hub .hero { padding: 16px 18px; }
  .page-hub .hero h1 { font-size: clamp(27px, 5vw, 38px); }
  .page-hub .news-board { grid-template-columns: 1fr; gap: 8px; }
  .page-hub .news-board-head { flex-direction: row; align-items: center; padding: 10px 12px; }
  .page-hub .news-heading-wrap { grid-template-columns: 40px minmax(0, 1fr); }
  .page-hub .news-signal { width: 40px; height: 40px; border-radius: 12px; font-size: 21px; }
  .page-hub .news-board-head > .news-heading-wrap > div > p:last-child { font-size: 10px; }
  .page-hub .news-list { grid-template-columns: repeat(auto-fit, minmax(min(220px, 100%), 1fr)); }
  .page-hub .news-card,
  .page-hub .news-empty { min-height: 92px; }
  .page-hub .app-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .page-hub .app-card,
  .page-hub .graphic-featured { min-height: 136px; }
}

@media (max-width: 640px) {
  .page-hub .shell { width: min(100% - 12px, 1500px); padding-top: 6px; }
  .page-hub .topbar { padding: 6px 7px; }
  .page-hub .brand-mark { width: 36px; height: 36px; }
  .page-hub .brand strong { font-size: 12px; }
  .page-hub .top-actions { gap: 5px; }
  .page-hub .top-actions .ghost { min-height: 32px; padding: 6px 8px; font-size: 9px; }
  .page-hub .hero { margin: 6px 0; padding: 14px 15px; border-radius: 17px; }
  .page-hub .hero h1 { font-size: clamp(25px, 7.8vw, 32px); }
  .page-hub .hero h1 span { margin-left: 4px; }
  .page-hub .hero > p:last-child { font-size: 10px; }
  .page-hub .news-board { margin-bottom: 8px; padding: 6px; border-radius: 15px; }
  .page-hub .news-board-head { align-items: flex-start; }
  .page-hub .news-board-head .eyebrow { display: none; }
  .page-hub .news-board-head h2 { font-size: 17px; }
  .page-hub .news-board-head > .news-heading-wrap > div > p:last-child { margin-top: 3px; line-height: 1.3; }
  .page-hub .news-manage { flex: 0 0 auto; padding: 5px 7px; font-size: 8px; }
  .page-hub .news-card { padding: 12px 12px 11px 15px; }
  .page-hub .news-card h3 { font-size: 15px; }
  .page-hub .news-card p { font-size: 11px; }
  .page-hub .section-heading h2 { font-size: 17px; }
  .page-hub .section-heading > span { display: none; }
  .page-hub .app-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 6px; }
  .page-hub .app-card,
  .page-hub .graphic-featured { min-height: 128px; padding: 9px; border-radius: 12px; }
  .page-hub .app-card h3,
  .page-hub .graphic-featured h3 { font-size: 13px; }
  .page-hub .owner-panel { min-height: 43px; gap: 6px; margin-top: 7px; padding: 5px; }
  .page-hub .owner-panel > div { padding: 0 8px 0 4px; }
  .page-hub .owner-panel > div .eyebrow { display: none; }
  .page-hub .owner-panel h2 { font-size: 10px; }
  .page-hub .owner-panel nav a { min-height: 30px; padding: 5px 8px; font-size: 8px; }
}

@media (max-width: 420px) {
  .page-hub .news-board-head { display: grid; grid-template-columns: 1fr auto; gap: 6px; }
  .page-hub .news-heading-wrap { grid-template-columns: 36px minmax(0, 1fr); gap: 8px; }
  .page-hub .news-signal { width: 36px; height: 36px; font-size: 19px; }
  .page-hub .news-manage { align-self: center; max-width: 75px; white-space: normal; line-height: 1.15; }
}

@media (max-width: 350px) {
  .page-hub .app-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
  .page-hub .news-signal { animation: none; }
}
/* Graphic and shipping are equal, side-by-side main entries. */
.page-hub .app-grid>.graphic-featured{grid-column:span 1!important}
.page-hub .shipping-featured{border-color:#72dfd1;background:linear-gradient(130deg,#073f49 0%,#087d83 58%,#20aaa0 100%);color:#fff;box-shadow:0 25px 65px rgba(8,125,131,.3)}
.page-hub .shipping-featured:hover{border-color:#fff;box-shadow:0 30px 75px rgba(8,125,131,.4)}
.page-hub .shipping-featured .icon{background:rgba(255,255,255,.17);color:#fff}
.page-hub .shipping-featured .number,.page-hub .shipping-featured p{color:#d8fffa}
.page-hub .shipping-featured small,.page-hub .shipping-featured b{color:#fff}
.hub-feature-card{cursor:pointer}
.hub-feature-actions{display:flex;align-items:center;gap:5px;margin-top:auto;padding-top:7px}
.hub-feature-actions>a{min-width:0;padding:6px 8px;border:1px solid rgba(255,255,255,.3);border-radius:8px;background:rgba(255,255,255,.12);color:#fff;font-size:9px;font-weight:900;line-height:1.1;white-space:nowrap}
.hub-feature-actions>a:first-child{flex:1}
.hub-feature-actions>a:hover{background:rgba(255,255,255,.24)}
.page-hub .app-card[data-attention]{overflow:visible}
.system-attention-badge{position:absolute;z-index:6;top:-9px;right:-9px;display:grid;place-items:center;min-width:28px;height:28px;padding:0 8px;border:3px solid var(--surface,#fff);border-radius:999px;background:#e11d48;color:#fff;font-size:12px;font-weight:950;line-height:1;box-shadow:0 8px 20px rgba(190,18,60,.3)}
.graphic-featured .system-attention-badge{top:10px;right:10px;border-color:#fff;background:#f43f5e}
.attention-button{position:relative;font-weight:850}.attention-button #attention-total{display:inline-grid;place-items:center;min-width:22px;height:22px;padding:0 6px;margin-left:4px;border-radius:999px;background:#e11d48;color:#fff;font-size:11px}.attention-button #attention-total[hidden]{display:none}
.attention-panel{margin:14px 0 0;padding:16px 18px;border:1px solid #bfd3f2;border-radius:16px;background:var(--surface,#fff);box-shadow:0 18px 44px rgba(15,23,42,.14)}.attention-panel[hidden]{display:none}.attention-panel h2,.attention-panel p{margin:2px 0}.attention-panel{display:grid;grid-template-columns:minmax(220px,.65fr) minmax(300px,1.35fr);gap:18px}.attention-list{display:grid;gap:7px;align-content:start}.attention-list>a{display:flex;align-items:center;justify-content:space-between;padding:9px 11px;border-radius:10px;background:#f3f7fd;border:1px solid #dbe7f7;font-weight:800}.attention-list>a b{display:grid;place-items:center;min-width:25px;height:25px;border-radius:999px;background:#e11d48;color:#fff;font-size:11px}
@media(max-width:580px){.page-hub .app-grid>.graphic-featured{grid-column:span 1!important}.graphic-featured .system-attention-badge{top:8px;right:8px}.hub-feature-actions{gap:3px}.hub-feature-actions>a{padding:5px 6px;font-size:8px}}
@media(max-width:700px){.attention-panel{grid-template-columns:1fr}.attention-button{order:-1}}