/* Jin10-inspired information hierarchy: compact controls, quiet dividers, feed first. */
.portal-page.news-page { background: var(--portal-bg); }
.news-main { padding-top: 28px; }
.news-heading { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px 14px; margin-bottom: 10px; }
.news-heading h1 { margin: 0; font-size: clamp(1.75rem,4vw,2.25rem); letter-spacing: -.04em; }
.news-heading p { margin: 0; color: var(--portal-muted); font-size: .875rem; font-weight: 600; letter-spacing: .04em; }
.news-toolbar { position: sticky; top: 92px; z-index: 12; display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px 16px; margin-bottom: 0; border-bottom: 1px solid rgba(255,255,255,.12); background: rgba(5,8,13,.96); backdrop-filter: blur(12px); }
.news-actions { flex: 0 0 auto; }
.news-tabs { display: flex; gap: 28px; min-width: 0; }
.news-tabs button { position: relative; min-height: 48px; padding: 12px 0; border: 0; font: inherit; font-size: 1.125rem; font-weight: 700; line-height: 1.5; color: var(--portal-muted); background: transparent; cursor: pointer; }
.news-tabs button::after { content: ''; position: absolute; inset: auto 0 0; height: 2px; background: transparent; }
.news-tabs button[aria-selected="true"] { color: var(--portal-cyan); }
.news-tabs button[aria-selected="true"]::after { background: currentColor; }
.news-tabs button:hover { color: var(--portal-text); }
.news-filter-hint { margin: 0 0 0 auto; color: var(--portal-muted); font-size: .875rem; line-height: 1.5; }
.news-tabs button:focus-visible,
.news-retry:focus-visible,
.news-source-link:focus-visible { outline: 2px solid var(--portal-cyan); outline-offset: 4px; border-radius: 2px; }
.news-source-link { color: var(--portal-cyan) !important; font-size: 1rem; text-decoration: underline; text-underline-offset: 4px; }
.news-panel { border: 0; border-radius: 0; background: #fff; }
#news-frame-host { --provider-header-height: 56px; --feed-scale: 1; height: 1000px; height: max(1000px,calc(100dvh - 180px)); overflow: hidden; }
#news-frame-host[data-view="news"] { --feed-scale: 1.125; }
/* Scale the embedded reading surface without changing provider content or colors.
   Compensate dimensions and header offset so the enlarged feed stays inside its panel. */
#news-frame-host iframe { display: block; width: calc(100% / var(--feed-scale)); height: calc(100% / var(--feed-scale) + var(--provider-header-height)); margin-top: calc(-1 * var(--provider-header-height) * var(--feed-scale)); transform: scale(var(--feed-scale)); transform-origin: top left; border: 0; background: #fff; color-scheme: light; overscroll-behavior: contain; }
.news-notice { display: flex; align-items: center; flex-wrap: wrap; gap: 12px; padding: 20px 0; color: var(--portal-muted); font-size: 1rem; line-height: 1.6; }
.news-notice p { margin: 0; }
.news-spinner { flex: 0 0 auto; width: 18px; height: 18px; border: 2px solid var(--portal-border-strong); border-top-color: var(--portal-cyan); border-radius: 50%; animation: newsSpin .8s linear infinite; }
.news-retry { min-width: 48px; min-height: 44px; padding: 8px 4px; border: 0; color: var(--portal-muted); background: transparent; font: inherit; font-size: 1rem; cursor: pointer; }
.news-retry:hover { color: var(--portal-cyan); }
.news-no-script { padding: 24px 0; font-size: 1rem; line-height: 1.8; }
.news-no-script a { color: var(--portal-cyan); text-decoration: underline; }
.news-disclaimer { margin: 18px 0 0; color: var(--portal-muted); font-size: .875rem; line-height: 1.8; }
.news-disclaimer a { text-decoration: underline; text-underline-offset: 3px; }
.news-page [hidden] { display: none !important; }
@keyframes newsSpin { to { transform: rotate(360deg); } }
@media (max-width: 960px) {
  .news-toolbar { position: static; }
}
@media (max-width: 560px) {
  .news-main { padding-top: 22px; }
  .news-heading { margin-bottom: 12px; }
  .news-tabs { gap: 22px; }
  .news-tabs button { font-size: 1rem; }
  .news-filter-hint { order: 3; width: 100%; margin-left: 0; }
  #news-frame-host { height: 820px; height: max(820px,calc(100dvh - 210px)); }
}
@media (prefers-reduced-motion: reduce) {
  .news-spinner { animation: none; }
}
