/*
  Digital news platform redesign
  Reference lock:
  - BBC/major news platform pattern: black-white editorial structure, restrained accent color, strong section hierarchy.
  - Washington Post: top story weighting, dense result rows, hairline dividers.
  - Matter RSS inbox: left/center/right reading workflow, quiet article list density.
  - Parallel Deep Research: structured research metadata, citations/score side panel feel.
  - Readwise: scholarly workspace tone, blue actions, subtle yellow highlights.
  - Hashnode/Lovable: admin shell, article tables, log/status tooling.
*/

:root {
  --bg-page: #f4f6f9;
  --bg-surface: #ffffff;
  --bg-elevated: #edf0f4;
  --bg-hover: #e4e8ef;
  --border-subtle: #dce1e9;
  --border-mid: #c8d0db;
  --text-1: #0d1520;
  --text-2: #5a6478;
  --text-3: #8c95a6;
  --accent: #2563eb;
  --ui-canvas: #f4f6f9;
  --ui-surface: #ffffff;
  --ui-surface-soft: #edf0f4;
  --ui-surface-muted: #e4e8ef;
  --ui-ink: #0d1520;
  --ui-ink-2: #2d3650;
  --ui-muted: #5a6478;
  --ui-faint: #8c95a6;
  --ui-border: #dce1e9;
  --ui-border-strong: #c8d0db;
  --ui-blue: #2563eb;
  --ui-blue-dark: #1a4fd6;
  --ui-teal: #0891b2;
  --ui-yellow: #fef3c7;
  --ui-green: #059669;
  --ui-orange: #ea580c;
  --ui-red: #dc2626;
  --ui-radius: 12px;
  --ui-radius-sm: 8px;
  --ui-shadow: 0 1px 2px rgba(13, 21, 32, 0.06), 0 8px 24px rgba(13, 21, 32, 0.04);
  --ui-font: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --ui-serif: "SF Pro Display", ui-sans-serif, system-ui, -apple-system, sans-serif;
}

html {
  background: var(--ui-canvas);
}

body {
  background: var(--ui-canvas) !important;
  color: var(--ui-ink) !important;
  font-family: var(--ui-font) !important;
  letter-spacing: 0;
}

body::selection {
  background: var(--ui-yellow);
  color: var(--ui-ink);
}

/* Retire previous decorative AI glow layer. The product is a news platform, not an AI poster. */
body > .pointer-events-none.fixed.inset-0,
.ai-grid {
  display: none !important;
}

a {
  color: inherit;
}

button,
input,
select,
textarea {
  font-family: inherit !important;
}

/* Frontend shell */
header.sticky {
  background: rgba(255, 255, 255, 0.96) !important;
  border-bottom: 1px solid #d8d8d8 !important;
  box-shadow: none;
}

header.sticky > div {
  max-width: 1280px !important;
  min-height: 0 !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
}

.news-nav-shell {
  padding-left: 0 !important;
  padding-right: 0 !important;
}

.news-nav-shell {
  display: block !important;
}

.news-nav-main {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  min-height: 66px;
}

.news-nav-left {
  display: flex;
  align-items: stretch;
  flex: 1 1 auto;
  gap: 14px;
  min-width: 0;
}

.news-nav-right {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
  gap: 10px;
  margin-left: auto;
  min-width: 0;
}

.news-channel-nav {
  flex: 1 1 auto;
  min-height: 66px;
  align-items: stretch;
  overflow-x: auto;
  margin-left: 4px;
  padding-left: 12px;
  border-left: 1px solid #ececec;
  scrollbar-width: none;
}

.news-nav-tools {
  flex: 0 0 auto;
}

.news-search {
  width: min(28vw, 360px) !important;
  height: 38px !important;
  margin-left: 0;
  flex: 0 1 360px;
}

.ai-title {
  color: var(--ui-ink) !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
  font-size: 23px !important;
  font-weight: 900 !important;
  letter-spacing: 0 !important;
}

.ai-title::before {
  content: "川";
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  margin-right: 10px;
  border: 2px solid var(--ui-ink);
  border-radius: 0;
  background: #fff;
  box-shadow: inset 0 -4px 0 var(--ui-red);
  color: var(--ui-ink);
  font-size: 16px;
  font-family: var(--ui-serif);
  font-weight: 800;
  filter: none;
}

#moduleTabs {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

#moduleTabs button {
  position: relative;
  height: 66px !important;
  padding: 0 12px !important;
  border-radius: 0 !important;
  color: #333 !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

#layoutBtns button,
.sortBtn,
.keywordBtn,
#clearFilters,
#showAllNews {
  border-radius: 999px !important;
  color: var(--ui-muted) !important;
  background: transparent !important;
  border: 0 !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

#moduleTabs button:hover {
  background: #f5f5f5 !important;
  color: #000 !important;
  transform: none !important;
}

#moduleTabs button.bg-neutral-900 {
  background: transparent !important;
  color: #000 !important;
}

#moduleTabs button.bg-neutral-900::after {
  content: "";
  position: absolute;
  right: 14px;
  bottom: 0;
  left: 14px;
  height: 3px;
  background: var(--ui-red);
}

#layoutBtns button:hover,
.sortBtn:hover,
.keywordBtn:hover,
#clearFilters:hover,
#showAllNews:hover {
  background: var(--ui-surface-soft) !important;
  color: var(--ui-ink) !important;
  transform: none !important;
}

#layoutBtns button.bg-neutral-900,
.sortBtn.bg-blue-100 {
  background: var(--ui-ink) !important;
  color: #fff !important;
}

#searchInput,
header input,
header select,
#timeModal input,
#timeModal select,
.form-control,
.form-select {
  background: var(--ui-surface) !important;
  color: var(--ui-ink) !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 10px !important;
  box-shadow: none !important;
}

header select {
  height: 34px !important;
  min-width: 112px;
  border-radius: 4px !important;
  font-weight: 650;
}

#layoutBtns {
  overflow: hidden;
  border: 1px solid var(--ui-border);
  border-radius: 4px;
}

#layoutBtns button {
  height: 32px !important;
  border-radius: 0 !important;
}

#searchInput:focus,
input:focus,
select:focus,
textarea:focus,
.form-control:focus,
.form-select:focus {
  border-color: var(--ui-blue) !important;
  box-shadow: 0 0 0 3px rgba(71, 140, 208, 0.16) !important;
}

main.mx-auto.max-w-7xl {
  max-width: 1280px !important;
  padding-top: 22px !important;
  padding-left: 16px !important;
  padding-right: 16px !important;
  grid-template-columns: minmax(760px, 1fr) 380px !important;
  gap: 18px !important;
}

@media (max-width: 1023px) {
  main.mx-auto.max-w-7xl {
    display: block !important;
  }
}

main > section.lg\:col-span-8,
main > aside.lg\:col-span-4 {
  grid-column: auto !important;
}

.ai-brief-hero {
  margin-bottom: 12px;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
}

.ai-brief-hero h1 {
  margin: 0 0 6px;
  font-family: var(--ui-serif);
  color: var(--ui-ink);
  font-size: 32px;
  line-height: 1.05;
  letter-spacing: -0.02em;
  font-weight: 600;
}

.ai-brief-hero p {
  margin: 0;
  color: var(--ui-muted);
  font-size: 14px;
  line-height: 1.55;
}

.ai-brief-status {
  display: grid;
  gap: 1px;
  min-width: 132px;
  padding: 10px 12px;
  background: var(--ui-surface);
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-radius);
  box-shadow: var(--ui-shadow);
}

.ai-brief-status span,
.ai-brief-status em {
  color: var(--ui-muted);
  font-size: 11px;
  font-style: normal;
  line-height: 1.2;
}

.ai-brief-status strong {
  color: var(--ui-ink);
  font-size: 22px;
  line-height: 1.1;
  font-weight: 780;
}

.ai-workspace-summary {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr minmax(240px, 1.4fr);
  gap: 10px;
  margin-bottom: 14px;
}

.ai-kpi {
  min-height: 86px;
  padding: 13px 14px;
  background: var(--ui-surface);
  border: 1px solid var(--ui-border);
  border-radius: var(--ui-radius);
  box-shadow: 0 1px 1px rgba(25, 24, 23, 0.03);
}

.ai-kpi span {
  display: block;
  margin-bottom: 7px;
  color: var(--ui-muted);
  font-size: 11px;
  font-weight: 700;
}

.ai-kpi strong {
  display: block;
  color: var(--ui-ink);
  font-size: 21px;
  line-height: 1.15;
  font-weight: 780;
}

.ai-kpi em {
  display: block;
  margin-top: 5px;
  color: var(--ui-blue-dark);
  font-size: 11px;
  font-style: normal;
  line-height: 1.35;
}

.ai-kpi-wide {
  background: linear-gradient(180deg, #fffdf0 0%, #ffffff 76%);
}

main > section > .flex.flex-wrap.items-center.gap-3:first-child {
  /* reset — only .news-control-bar should get card treatment */
}
}

#timeControlBtn,
#prevDate,
#nextDate,
#todayBtn,
#last7Btn,
#last30Btn,
#clearDateBtn,
#cancelTimeBtn,
#confirmTimeBtn,
#loadMoreBtn {
  border-radius: 10px !important;
  font-weight: 650 !important;
}

#confirmTimeBtn,
#loadMoreBtn {
  background: var(--ui-ink) !important;
  color: #fff !important;
}

#timeModal {
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 16px !important;
  box-shadow: var(--ui-shadow) !important;
  color: var(--ui-ink) !important;
}

/* Content cards and lists */
.ni-section,
.rounded-2xl.border.bg-white,
aside > div.rounded-2xl,
.card {
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 16px !important;
  box-shadow: var(--ui-shadow) !important;
  color: var(--ui-ink) !important;
}

.ni-section-hd,
.p-4.border-b,
.card-header {
  background: var(--ui-surface) !important;
  border-bottom: 1px solid var(--ui-border) !important;
  color: var(--ui-ink) !important;
}

.ni-section-title,
.font-semibold,
.card-title {
  color: var(--ui-ink) !important;
}

.ni-section-count {
  color: var(--ui-muted) !important;
}

.ni-section-bd {
  padding: 0 !important;
}

.space-y-8 > .ni-section + .ni-section {
  margin-top: 14px !important;
}

.ni-section .p-4 {
  padding: 0 !important;
}

.ni-section .grid.gap-4 {
  gap: 0 !important;
}

.ai-editorial-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(360px, 0.92fr);
  min-height: 320px;
}

.ai-lead-story {
  display: flex;
  min-height: 320px;
  flex-direction: column;
  padding: 22px 24px;
  border-right: 1px solid var(--ui-border);
  cursor: pointer;
}

.ai-lead-story:hover,
.ai-brief-row:hover {
  background: #fbfcfd;
}

.ai-lead-kicker {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-bottom: 14px;
}

.ai-lead-kicker span,
.ai-lead-kicker b,
.ai-brief-meta b {
  display: inline-flex;
  align-items: center;
  min-height: 22px;
  padding: 3px 8px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1;
  font-weight: 760;
}

.ai-lead-kicker span {
  background: var(--ui-ink);
  color: #fff;
}

.ai-lead-kicker b,
.ai-brief-meta b {
  background: var(--ui-yellow);
  border: 1px solid #eadf8f;
  color: var(--ui-ink);
}

.ai-lead-story h2 {
  margin: 0;
  color: var(--ui-ink);
  font-family: var(--ui-serif);
  font-size: 30px;
  line-height: 1.16;
  letter-spacing: -0.012em;
  font-weight: 650;
}

.ai-lead-story p {
  margin: 14px 0 0;
  color: var(--ui-muted);
  font-size: 15px;
  line-height: 1.72;
}

.ai-lead-judgement {
  display: grid;
  gap: 4px;
  margin-top: 18px;
  padding: 12px 13px;
  background: var(--ui-surface-soft);
  border: 1px solid var(--ui-border);
  border-radius: 12px;
}

.ai-lead-judgement strong {
  color: var(--ui-ink);
  font-size: 13px;
}

.ai-lead-judgement span {
  color: var(--ui-muted);
  font-size: 13px;
  line-height: 1.45;
}

.ai-lead-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  padding-top: 16px;
  color: var(--ui-faint);
  font-size: 12px;
}

.ai-brief-list {
  display: grid;
  align-content: stretch;
}

.ai-brief-row {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  gap: 12px;
  min-height: 80px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--ui-border);
  cursor: pointer;
}

.ai-brief-row:last-child {
  border-bottom: 0;
}

.ai-brief-rank {
  color: var(--ui-faint);
  font-size: 18px;
  font-family: var(--ui-serif);
  line-height: 1.25;
  font-weight: 650;
}

.ai-brief-row h3 {
  margin: 0;
  color: var(--ui-ink);
  font-size: 15px;
  line-height: 1.42;
  font-weight: 720;
}

.ai-brief-row p {
  display: -webkit-box;
  margin: 7px 0 0;
  overflow: hidden;
  color: var(--ui-muted);
  font-size: 13px;
  line-height: 1.55;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.ai-brief-meta {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 7px;
  margin-top: 9px;
  color: var(--ui-faint);
  font-size: 11px;
}

.ai-section-continuation {
  border-top: 1px solid var(--ui-border);
}

.ni-card {
  background: var(--ui-surface) !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  border-bottom: 1px solid var(--ui-border) !important;
  min-height: 196px;
}

.ni-card:hover {
  background: #fbfcfd !important;
  transform: none !important;
  box-shadow: inset 3px 0 0 var(--ui-blue) !important;
}

.ni-bar {
  display: none !important;
}

.ni-card-body {
  padding: 16px 18px !important;
  display: flex;
  min-height: 196px;
  flex-direction: column;
}

.ni-card-title,
.ni-lt {
  color: var(--ui-ink) !important;
  font-size: 15px !important;
  line-height: 1.48 !important;
  font-weight: 700 !important;
  letter-spacing: -0.005em !important;
}

.ni-card-summary,
.ni-ls {
  color: var(--ui-muted) !important;
  font-size: 13.5px !important;
  line-height: 1.7 !important;
  margin-bottom: 12px !important;
}

.ni-card-footer {
  color: var(--ui-faint) !important;
  border-top: 1px solid var(--ui-border) !important;
  margin-top: auto !important;
  padding-top: 10px !important;
}

.ai-rank-badge {
  position: absolute;
  top: 12px;
  right: 12px;
  color: var(--ui-faint);
  font-size: 10px;
  font-weight: 750;
}

.ai-card-insight {
  display: grid;
  gap: 3px;
  margin: 2px 0 12px;
  padding: 9px 10px;
  background: var(--ui-surface-soft);
  border: 1px solid var(--ui-border);
  border-radius: 10px;
}

.ai-card-insight strong {
  color: var(--ui-ink);
  font-size: 12px;
  line-height: 1.2;
}

.ai-card-insight span {
  color: var(--ui-muted);
  font-size: 12px;
  line-height: 1.35;
}

.ai-empty-workspace {
  overflow: hidden;
  background: var(--ui-surface);
  border: 1px solid var(--ui-border);
  border-radius: 16px;
  box-shadow: var(--ui-shadow);
}

.ai-empty-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 16px 18px;
  border-bottom: 1px solid var(--ui-border);
}

.ai-empty-head strong,
.ai-empty-head span {
  display: block;
}

.ai-empty-head strong {
  color: var(--ui-ink);
  font-size: 15px;
  line-height: 1.35;
}

.ai-empty-head span {
  margin-top: 4px;
  color: var(--ui-muted);
  font-size: 13px;
  line-height: 1.45;
}

.ai-empty-score {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  flex: 0 0 auto;
  border-radius: 12px;
  background: var(--ui-ink);
  color: #fff;
  font-size: 16px;
  font-weight: 800;
}

.ai-empty-body {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(280px, 0.9fr);
  gap: 0;
}

.ai-empty-primary {
  padding: 22px 24px;
  border-right: 1px solid var(--ui-border);
}

.ai-empty-kicker {
  display: inline-flex;
  margin-bottom: 12px;
  padding: 4px 8px;
  background: var(--ui-yellow);
  border: 1px solid #eadf8f;
  border-radius: 999px;
  color: var(--ui-ink);
  font-size: 11px;
  font-weight: 750;
}

.ai-empty-primary h3 {
  margin: 0 0 8px;
  color: var(--ui-ink);
  font-family: var(--ui-serif);
  font-size: 24px;
  line-height: 1.22;
  font-weight: 600;
}

.ai-empty-primary p {
  max-width: 620px;
  margin: 0;
  color: var(--ui-muted);
  font-size: 14px;
  line-height: 1.7;
}

.ai-empty-checks {
  display: grid;
}

.ai-empty-checks > div {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr);
  column-gap: 10px;
  padding: 15px 18px;
  border-bottom: 1px solid var(--ui-border);
}

.ai-empty-checks > div:last-child {
  border-bottom: 0;
}

.ai-empty-checks span {
  color: var(--ui-blue-dark);
  font-size: 12px;
  font-weight: 800;
}

.ai-empty-checks strong {
  color: var(--ui-ink);
  font-size: 13px;
  line-height: 1.35;
}

.ai-empty-checks em {
  grid-column: 2;
  color: var(--ui-muted);
  font-size: 12px;
  font-style: normal;
  line-height: 1.45;
}

.ai-skeleton-list {
  display: grid;
}

.ai-skeleton-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 72px;
  gap: 18px;
  align-items: center;
  padding: 16px 18px;
  border-bottom: 1px solid var(--ui-border);
}

.ai-skeleton-row:last-child {
  border-bottom: 0;
}

.ai-skel-line,
.ai-skel-pill {
  display: block;
  border-radius: 999px;
  background: linear-gradient(90deg, #eceee6 0%, #fafaf3 48%, #eceee6 100%);
  background-size: 220% 100%;
  animation: aiShimmer 1.4s ease-in-out infinite;
}

.ai-skel-title {
  width: 56%;
  height: 12px;
  margin-bottom: 12px;
}

.ai-skel-copy {
  width: 88%;
  height: 9px;
  margin-bottom: 8px;
}

.ai-skel-copy.mid {
  width: 62%;
}

.ai-skel-copy.short {
  width: 42%;
}

.ai-skel-pill {
  width: 64px;
  height: 28px;
}

@keyframes aiShimmer {
  0% {
    background-position: 120% 0;
  }
  100% {
    background-position: -120% 0;
  }
}

.ni-list-item {
  padding: 15px 18px !important;
  border-bottom: 1px solid var(--ui-border) !important;
}

.ni-list-item:hover {
  padding-left: 22px !important;
  background: #fbfcfd !important;
}

.ni-badge,
.ni-tag,
.badge {
  border-radius: 999px !important;
  font-weight: 650 !important;
  letter-spacing: 0 !important;
}

.ni-score,
.ni-grade-S,
.ni-grade-A {
  background: rgba(37, 99, 235, 0.08) !important;
  color: var(--ui-blue-dark) !important;
  border: 1px solid rgba(37, 99, 235, 0.22) !important;
}

.ni-src-news,
.ni-ln-news {
  background: rgba(71, 140, 208, 0.1) !important;
  color: var(--ui-blue-dark) !important;
  border-color: rgba(71, 140, 208, 0.24) !important;
}

.ni-src-twitter,
.ni-ln-twitter {
  background: rgba(1, 106, 113, 0.1) !important;
  color: var(--ui-teal) !important;
  border-color: rgba(1, 106, 113, 0.2) !important;
}

.ni-src-wechat,
.ni-ln-wechat {
  background: rgba(13, 139, 97, 0.1) !important;
  color: var(--ui-green) !important;
  border-color: rgba(13, 139, 97, 0.22) !important;
}

.ni-src-youtube,
.ni-ln-youtube {
  background: rgba(194, 65, 61, 0.1) !important;
  color: var(--ui-red) !important;
  border-color: rgba(194, 65, 61, 0.22) !important;
}

.ni-tw-header {
  background: var(--ui-surface-soft) !important;
  border-bottom: 1px solid var(--ui-border) !important;
}

.ni-tw-avatar {
  background: var(--ui-ink) !important;
  color: #fff !important;
  border: 0 !important;
}

.ni-tw-name {
  color: var(--ui-ink) !important;
}

.ni-tw-sub {
  color: var(--ui-muted) !important;
}

.ni-more-btn {
  background: var(--ui-surface) !important;
  border-top: 1px solid var(--ui-border) !important;
  color: var(--ui-blue-dark) !important;
}

.ni-more-btn:hover {
  background: var(--ui-surface-soft) !important;
}

aside {
  position: sticky;
  top: 84px;
  align-self: start;
}

aside .p-4 {
  padding: 16px !important;
}

aside h4 {
  font-size: 14px !important;
  letter-spacing: -0.005em;
}

#trending li,
#readingStats .flex,
#userInfoWidget .flex {
  border-color: var(--ui-border) !important;
}

.text-gray-400,
.text-gray-500,
.text-gray-600,
.text-neutral-500,
.text-neutral-600,
.opacity-70 {
  color: var(--ui-muted) !important;
  opacity: 1 !important;
}

.text-blue-600,
.text-blue-700 {
  color: var(--ui-blue-dark) !important;
}

.bg-blue-100,
.bg-blue-50 {
  background: rgba(71, 140, 208, 0.1) !important;
}

.bg-green-50 {
  background: rgba(13, 139, 97, 0.1) !important;
}

.text-green-600,
.text-green-700 {
  color: var(--ui-green) !important;
}

footer {
  border-top: 1px solid var(--ui-border) !important;
  color: var(--ui-muted) !important;
}

/* Admin redesign: Bootstrap kept, product language replaced. */
.mobile-header {
  background: var(--ui-canvas) !important;
  border-bottom: 1px solid var(--ui-border) !important;
}

.container-fluid > .row {
  background: var(--ui-canvas);
}

.sidebar {
  background: var(--ui-surface) !important;
  color: var(--ui-ink) !important;
  border-right: 1px solid var(--ui-border);
  box-shadow: none !important;
}

.sidebar h5,
.sidebar small,
.sidebar .bi {
  color: var(--ui-ink) !important;
  opacity: 1 !important;
}

.sidebar .nav-link {
  color: var(--ui-muted) !important;
  border-radius: 10px !important;
  margin: 2px 0 !important;
  font-weight: 600;
}

.sidebar .nav-link:hover,
.sidebar .nav-link.active {
  color: var(--ui-ink) !important;
  background: var(--ui-surface-soft) !important;
  transform: none !important;
}

.sidebar .nav-link.active {
  box-shadow: inset 3px 0 0 var(--ui-blue);
}

.main-content {
  background: var(--ui-canvas) !important;
  padding: 28px !important;
}

.main-content h1,
.main-content .h2 {
  color: var(--ui-ink);
  font-family: var(--ui-serif);
  font-size: 30px;
  letter-spacing: -0.02em;
}

.card {
  transition: none !important;
}

.card:hover {
  transform: none !important;
}

.card-header {
  border-radius: 16px 16px 0 0 !important;
  font-weight: 700;
}

.stat-card,
.bg-gradient-primary,
.bg-gradient-success,
.bg-gradient-info,
.bg-gradient-warning,
.bg-gradient-secondary,
.bg-gradient-dark {
  background: var(--ui-surface) !important;
  color: var(--ui-ink) !important;
}

.stat-card {
  border-top: 4px solid var(--ui-blue) !important;
}

.stat-card .stat-icon,
.stat-card .opacity-75 {
  color: var(--ui-muted) !important;
  opacity: 1 !important;
}

.btn {
  border-radius: 10px !important;
  font-weight: 650 !important;
  transform: none !important;
}

.btn-primary,
.btn-outline-primary:hover {
  background: var(--ui-blue) !important;
  border-color: var(--ui-blue) !important;
  color: #fff !important;
}

.btn-outline-primary {
  color: var(--ui-blue-dark) !important;
  border-color: rgba(71, 140, 208, 0.45) !important;
}

.btn-outline-info,
.btn-outline-success,
.btn-outline-secondary,
.btn-secondary {
  color: var(--ui-ink-2) !important;
  border-color: var(--ui-border-strong) !important;
  background: var(--ui-surface) !important;
}

.table {
  color: var(--ui-ink) !important;
}

.table thead th {
  background: var(--ui-surface-soft) !important;
  border-bottom: 1px solid var(--ui-border) !important;
  color: var(--ui-muted);
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
}

.table tbody tr:hover {
  background: rgba(71, 140, 208, 0.06) !important;
}

.modal-content,
.dropdown-menu {
  border: 1px solid var(--ui-border) !important;
  border-radius: 16px !important;
  box-shadow: var(--ui-shadow) !important;
}

.alert {
  border-radius: 12px !important;
  border: 1px solid var(--ui-border) !important;
}

@media (max-width: 768px) {
  body {
    overflow-x: hidden;
  }

  header.sticky > div {
    max-width: 100vw !important;
    overflow-x: auto;
  }

  .news-nav-main {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    padding: 10px 0;
    min-height: auto;
  }

  .news-nav-left {
    width: 100%;
    flex-wrap: wrap;
    gap: 8px;
  }

  .news-nav-right {
    width: 100%;
    flex-wrap: wrap;
    gap: 10px;
  }

  .news-channel-nav {
    width: calc(100% + 32px);
    min-height: 42px;
    order: 3;
    margin-left: -16px;
    margin-right: -16px;
    padding-left: 16px;
    padding: 0 16px;
    border-left: 0;
  }

  main.mx-auto.max-w-7xl {
    width: 100% !important;
    overflow-x: hidden;
  }

  .news-nav-tools {
    order: 1;
  }

  .news-search {
    order: 2;
    margin-left: 0;
    min-width: 100%;
    width: 100% !important;
    flex-basis: 100%;
  }

  .ai-brief-hero {
    align-items: stretch;
    flex-direction: column;
  }

  .ai-workspace-summary {
    grid-template-columns: 1fr;
  }

  .ai-kpi-wide {
    grid-column: auto;
  }

  .ai-empty-body {
    grid-template-columns: 1fr;
  }

  .ai-empty-primary {
    border-right: 0;
    border-bottom: 1px solid var(--ui-border);
  }

  .ai-empty-primary h3 {
    font-size: 21px;
  }

  .ai-editorial-grid {
    grid-template-columns: 1fr;
  }

  .ai-lead-story {
    min-height: auto;
    border-right: 0;
    border-bottom: 1px solid var(--ui-border);
  }

  .ai-lead-story h2 {
    font-size: 24px;
  }

  header.sticky > div {
    min-height: auto !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  #moduleTabs {
    width: max-content;
    overflow-x: auto;
    justify-content: flex-start;
  }

  header .relative.flex.items-center:not(.news-search) {
    width: 100% !important;
  }

  aside {
    position: static;
    margin-top: 20px;
  }

  main > section.lg\:col-span-8::before {
    font-size: 28px;
  }

  .main-content {
    padding: 18px !important;
  }
}

/* ===== 2026-06-18 Broad editorial cleanup =====
   Refero lock: Monocle/Nofilter for publication discipline, Medium for reader
   surfaces, Washington Post for preference chips, Hashnode only for compact
   technical density. Remove user-facing "AI demo" chrome. */

.bg-gradient-to-r,
.bg-gradient-to-br,
.from-blue-500,
.from-blue-600,
.from-blue-50,
.from-purple-50,
.to-blue-500,
.to-blue-600,
.to-purple-600 {
  background: var(--ui-surface) !important;
  background-image: none !important;
}

.text-blue-600,
.text-blue-700,
.text-purple-700,
.text-green-600,
.text-green-700 {
  color: var(--ui-blue) !important;
}

.bg-blue-50,
.bg-blue-100,
.bg-green-50,
.bg-green-100,
.bg-purple-50,
.bg-purple-100,
.bg-pink-50,
.bg-pink-100 {
  background: var(--ui-surface-soft) !important;
}

.border-blue-200,
.border-blue-300,
.border-blue-400,
.border-blue-500,
.border-blue-600,
.border-purple-200 {
  border-color: var(--ui-border-strong) !important;
}

.shadow,
.shadow-sm,
.shadow-md,
.shadow-lg,
.shadow-xl,
.shadow-2xl,
.hover\:shadow-lg:hover,
.hover\:shadow-xl:hover {
  box-shadow: none !important;
}

#profileSettingsModal .bg-white.rounded-2xl,
.modal-container,
.ai-chat-container,
#aiChatWindow,
.batch-summary-content {
  border-radius: 8px !important;
  border: 1px solid var(--ui-border) !important;
  box-shadow: none !important;
}

#profileSettingsModal .bg-white.rounded-2xl {
  width: min(560px, calc(100vw - 32px)) !important;
  max-width: 560px !important;
  max-height: 86vh !important;
  margin: auto !important;
}

#profileSettingsModal {
  background: rgba(23, 22, 21, 0.22) !important;
  backdrop-filter: blur(2px) !important;
  -webkit-backdrop-filter: blur(2px) !important;
}

#profileSettingsModal .sticky {
  background: var(--ui-surface) !important;
  color: var(--ui-ink) !important;
  border-bottom: 1px solid var(--ui-border) !important;
  border-radius: 8px 8px 0 0 !important;
}

#profileSettingsModal .sticky h3,
#profileSettingsModal .sticky p,
#profileSettingsModal .sticky button {
  color: var(--ui-ink) !important;
}

#profileSettingsModal [id^="step-indicator-"] {
  height: 2px !important;
  background: var(--ui-border) !important;
  border-radius: 0 !important;
}

#profileSettingsModal #step-indicator-1,
#profileSettingsModal #step-indicator-2.bg-white,
#profileSettingsModal #step-indicator-3.bg-white {
  background: var(--ui-ink) !important;
}

#profileSettingsModal h2,
.preview-title,
.lab-title,
.modal-title {
  color: var(--ui-ink) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
}

.role-card,
.interest-tag,
#profileSettingsModal label.flex,
.template-card,
.preview-item,
.test-result-item,
.editor-section,
.ai-assistant-btn,
.ai-lead-judgement {
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

.role-card:hover,
.interest-tag:hover,
.template-card:hover,
.ai-assistant-btn:hover {
  border-color: var(--ui-ink) !important;
  transform: none !important;
}

.role-card.bg-blue-50,
.interest-tag.bg-blue-50 {
  background: var(--ui-surface-soft) !important;
  border-color: var(--ui-ink) !important;
}

.role-mark,
.topic-mark,
.template-icon,
.label-icon,
.message-avatar,
.chat-avatar,
.ai-avatar {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 24px !important;
  height: 24px !important;
  padding: 0 6px !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 999px !important;
  background: var(--ui-surface-soft) !important;
  color: var(--ui-ink) !important;
  font-size: 11px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
}

.topic-mark {
  min-width: 28px !important;
}

#profileSettingsModal input,
#profileSettingsModal textarea,
#aiChatInput,
.cyber-textarea,
.chat-input {
  border: 1px solid var(--ui-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  background: #fff !important;
  color: var(--ui-ink) !important;
}

#profileSettingsModal input:focus,
#profileSettingsModal textarea:focus,
#aiChatInput:focus,
.cyber-textarea:focus,
.chat-input:focus {
  outline: 2px solid rgba(36, 95, 158, 0.16) !important;
  border-color: var(--ui-blue) !important;
  box-shadow: none !important;
}

#profileSettingsModal button.bg-blue-600,
#profileSettingsModal button.bg-gradient-to-r,
#openPromptLabBtn,
#openBatchSummaryBtn,
#startBatchSummaryBtn,
.lab-btn-primary,
.chat-send-btn,
.ai-chat-send,
#aiChatToggle,
#aiChatWindow button.bg-blue-500,
.test-btn-generate,
.rec-btn-primary {
  background: var(--ui-ink) !important;
  background-image: none !important;
  color: #fff !important;
  border: 1px solid var(--ui-ink) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  transform: none !important;
}

.lab-btn-secondary,
.rec-btn-secondary,
#profileSettingsModal button.border-2,
#showAllNews,
#clearFilters {
  background: #fff !important;
  color: var(--ui-ink) !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

#openPromptLabBtn svg,
#openPromptLabBtn::before,
#openBatchSummaryBtn svg {
  animation: none !important;
  background: none !important;
}

#promptLabModal .prompt-lab-content,
.lab-header,
.lab-footer,
.test-module,
.template-selector,
.prompt-editors,
.ai-assistant-section,
.assistant-chat-container,
.assistant-preview-section {
  background: var(--ui-surface) !important;
  background-image: none !important;
  border-color: var(--ui-border) !important;
  box-shadow: none !important;
}

.cyber-grid,
#lab-particles {
  display: none !important;
}

.prompt-lab-content {
  max-width: 960px !important;
  max-height: 88vh !important;
  overflow: hidden !important;
}

.lab-header {
  padding: 22px 28px !important;
}

.lab-icon-container {
  display: none !important;
}

.lab-title,
.lab-subtitle,
.section-label,
.ai-assistant-title,
.ai-assistant-desc,
.template-name,
.template-desc,
.preview-title,
.preview-subtitle,
.test-section-title,
.test-result-label {
  color: var(--ui-ink) !important;
  -webkit-text-fill-color: currentColor !important;
  text-shadow: none !important;
}

.lab-title {
  font-size: 24px !important;
}

.lab-subtitle,
.ai-assistant-desc,
.template-desc,
.preview-subtitle {
  color: var(--ui-muted) !important;
  font-size: 13px !important;
}

.lab-close-btn,
.toggle-btn {
  background: #fff !important;
  color: var(--ui-ink) !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

.template-grid {
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 12px !important;
}

.template-card {
  min-height: 92px !important;
  padding: 14px !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: flex-start !important;
  justify-content: flex-start !important;
  text-align: left !important;
  gap: 6px !important;
}

.template-card .template-icon {
  margin: 0 0 4px !important;
}

.template-name {
  font-size: 14px !important;
  font-weight: 700 !important;
}

.template-desc {
  line-height: 1.35 !important;
}

.ai-assistant-btn {
  min-height: 76px !important;
  padding: 14px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 12px !important;
}

.ai-assistant-content {
  display: block !important;
  text-align: left !important;
}

.section-label .label-line {
  background: var(--ui-border) !important;
  height: 1px !important;
}

.footer-info,
.version-info,
.status-indicator {
  color: var(--ui-muted) !important;
  -webkit-text-fill-color: currentColor !important;
}

.status-dot {
  background: var(--ui-muted) !important;
  box-shadow: none !important;
}

.version-info {
  display: none !important;
}

.toggle-icon,
.lab-close-btn svg,
.ai-assistant-arrow svg {
  color: var(--ui-ink) !important;
  stroke: currentColor !important;
}

.lab-icon-container,
.ai-assistant-icon,
.center-icon,
.ai-logo,
#aiChatMessages .rounded-full,
#aiChatWindow .bg-gradient-to-r,
.ai-chat-header,
.batch-summary-content > div:first-child,
#batchNewsStats,
#batchNewsStats > div > div:first-child {
  background: var(--ui-ink) !important;
  background-image: none !important;
  color: #fff !important;
  box-shadow: none !important;
}

.batch-summary-content > div:first-child {
  border-bottom: 1px solid var(--ui-border) !important;
}

#batchNewsStats {
  background: var(--ui-surface-soft) !important;
  color: var(--ui-ink) !important;
  border: 1px solid var(--ui-border) !important;
}

#aiChatContainer {
  bottom: 18px !important;
  left: 18px !important;
}

#aiChatToggle {
  padding: 10px 12px !important;
  border-radius: 999px !important;
}

#aiChatWindow {
  width: min(380px, calc(100vw - 32px)) !important;
  height: min(560px, calc(100vh - 48px)) !important;
}

#aiChatWindow > .text-white,
#aiChatWindow > div:first-child {
  background: var(--ui-ink) !important;
  background-image: none !important;
  color: #fff !important;
}

#aiChatWindow > div:first-child {
  min-height: 64px !important;
  height: auto !important;
  padding: 12px 14px !important;
}

#aiChatWindow h3,
#aiChatWindow > div:first-child p {
  color: #fff !important;
  margin: 0 !important;
  -webkit-text-fill-color: currentColor !important;
}

#aiChatWindow > div:first-child .flex.items-center.gap-2 > svg {
  display: none !important;
}

#aiChatMessages > .flex {
  align-items: flex-start !important;
}

#aiChatMessages > .flex > .flex-shrink-0,
#aiChatMessages .flex-shrink-0.rounded-full {
  width: 32px !important;
  min-width: 32px !important;
  max-width: 32px !important;
  height: 32px !important;
  min-height: 32px !important;
  max-height: 32px !important;
  flex: 0 0 32px !important;
  padding: 0 !important;
  border-radius: 999px !important;
}

.chat-bubble,
.message-content,
#aiChatMessages .bg-white {
  border: 1px solid var(--ui-border) !important;
  border-radius: 6px !important;
  box-shadow: none !important;
}

.center-node,
.saturn-ring,
.orbit-ring,
.node,
.starmap {
  box-shadow: none !important;
  filter: none !important;
}

.saturn-ring,
.orbit-ring,
.chat-hint-bubble {
  border-color: var(--ui-border) !important;
}

.area-label {
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border) !important;
  color: var(--ui-muted) !important;
  border-radius: 999px !important;
}

@media (max-width: 768px) {
  #profileSettingsModal .bg-white.rounded-2xl,
  .modal-container,
  .batch-summary-content {
    max-height: 92vh !important;
    width: calc(100vw - 24px) !important;
  }

  #aiChatContainer {
    left: 12px !important;
    bottom: 12px !important;
  }

  .bottom-trending-panel #trending {
    grid-template-columns: 1fr !important;
  }

  .bottom-trending-panel #trending li {
    min-height: auto !important;
    border-right: 0 !important;
    border-bottom: 1px solid var(--ui-border) !important;
  }

  .bottom-trending-panel #trending li:last-child {
    border-bottom: 0 !important;
  }
}

/* User center owns personal tools: filters and reading stats live inside it. */
#userInfoSection {
  padding-bottom: 0 !important;
}

.user-center-tools {
  margin: 14px -14px 0 !important;
  border-top: 1px solid var(--ui-border) !important;
}

.user-center-tools > #userFilterWidget,
.user-center-tools > #todayReadingWidget,
.user-center-tools > #summaryRulesWidget {
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  overflow: visible !important;
}

.user-center-tools > #userFilterWidget + #todayReadingWidget,
.user-center-tools > #todayReadingWidget + #summaryRulesWidget {
  border-top: 1px solid var(--ui-border) !important;
}

.user-center-tools > #userFilterWidget > .p-4.border-b,
.user-center-tools > #todayReadingWidget > .p-4.border-b,
.user-center-tools > #summaryRulesWidget > .p-4.border-b {
  padding: 12px 14px !important;
  border-bottom: 1px solid var(--ui-border) !important;
  background: transparent !important;
}

.user-center-tools > #userFilterWidget > .p-4:not(.border-b),
.user-center-tools > #todayReadingWidget > .p-4:not(.border-b),
.user-center-tools > #summaryRulesWidget > .p-4:not(.border-b) {
  padding: 12px 14px 14px !important;
}

.user-center-tools h4 {
  font-size: 13px !important;
  font-weight: 760 !important;
}

.user-center-tools #readingStats .space-y-3 {
  display: grid !important;
  gap: 8px !important;
}

.user-center-tools #readingStats .space-y-3 > div {
  margin: 0 !important;
}

.user-center-tools #selectedFiltersCount {
  line-height: 1.4 !important;
}

.user-center-tools #summaryRulesWidget .space-y-4 {
  gap: 10px !important;
}

.user-center-tools #summaryRulesWidget p,
.user-center-tools #summaryRulesWidget .text-xs {
  line-height: 1.45 !important;
}

.user-center-tools #openPromptLabBtn,
.user-center-tools #openBatchSummaryBtn {
  padding: 10px 12px !important;
  min-height: 40px !important;
}

.user-center-tools #openPromptLabBtn svg,
.user-center-tools #openBatchSummaryBtn svg {
  display: none !important;
}

@media (min-width: 769px) and (max-width: 1180px) {
  .bottom-trending-panel #trending {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .bottom-trending-panel #trending li {
    border-bottom: 1px solid var(--ui-border) !important;
  }

  .bottom-trending-panel #trending li:nth-child(2n) {
    border-right: 0 !important;
  }

  .bottom-trending-panel #trending li:nth-last-child(-n+2) {
    border-bottom: 0 !important;
  }
}

/* ===== 2026-06-18 Editorial homepage correction =====
   Refero lock: Monocle for restrained publication shell, Nofilter for explicit
   structure lines, The Verge only for tech-news density. */
:root {
  --ui-canvas: #fbfbf7;
  --ui-surface: #ffffff;
  --ui-surface-soft: #f6f6f1;
  --ui-ink: #171615;
  --ui-muted: #696a64;
  --ui-faint: #94958d;
  --ui-border: #ddddd4;
  --ui-border-strong: #bdbfb4;
  --ui-red: #bd2d2c;
  --ui-blue: #245f9e;
  --ui-radius: 8px;
  --ui-shadow: none;
}

body {
  background: var(--ui-canvas) !important;
}

header.sticky {
  background: rgba(255, 255, 255, 0.98) !important;
  border-bottom: 1px solid var(--ui-border) !important;
}

header.sticky > div,
main.mx-auto.max-w-7xl {
  max-width: 1360px !important;
}

.news-nav-main {
  min-height: 56px !important;
  gap: 18px !important;
}

.news-nav-left {
  align-items: center !important;
  gap: 18px !important;
}

.news-channel-nav {
  min-height: 56px !important;
  align-items: center !important;
  border-left: 0 !important;
  margin-left: 0 !important;
  padding-left: 0 !important;
  gap: 2px !important;
}

.ai-title {
  display: inline-flex !important;
  align-items: baseline !important;
  gap: 8px !important;
  height: auto !important;
  min-width: 108px !important;
  color: var(--ui-ink) !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-size: 25px !important;
  font-weight: 700 !important;
  letter-spacing: 0 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
  filter: none !important;
  transform: none !important;
}

.ai-title::before {
  display: none !important;
  content: none !important;
}

.ai-title small {
  color: var(--ui-muted);
  font-family: var(--ui-font);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0;
  padding-left: 8px;
  border-left: 1px solid var(--ui-border);
  white-space: nowrap;
}

#moduleTabs button {
  height: 56px !important;
  padding: 0 13px !important;
  font-size: 14px !important;
  font-weight: 700 !important;
}

#moduleTabs button.bg-neutral-900::after {
  right: 12px !important;
  left: 12px !important;
  height: 3px !important;
  background: var(--ui-red) !important;
}

.news-nav-right {
  gap: 12px !important;
}

.news-search {
  width: 320px !important;
  height: 34px !important;
  flex: 0 0 320px !important;
}

.news-search span {
  display: inline-flex;
  align-items: center;
  color: var(--ui-muted) !important;
}

#searchInput {
  border-radius: 999px !important;
  border-color: var(--ui-border) !important;
  background: #fff !important;
  height: 34px !important;
  padding-left: 34px !important;
  font-size: 13px !important;
}

header select {
  height: 34px !important;
  border-radius: 4px !important;
  min-width: 108px !important;
}

#layoutBtns {
  border-radius: 4px !important;
  height: 34px !important;
}

#layoutBtns button {
  height: 32px !important;
  padding: 0 13px !important;
  border-radius: 0 !important;
}

#layoutBtns button.bg-neutral-900 {
  background: var(--ui-ink) !important;
  color: #fff !important;
}

main.mx-auto.max-w-7xl {
  grid-template-columns: minmax(0, 1fr) 310px !important;
  gap: 18px !important;
  padding-top: 18px !important;
}

main > section.lg\:col-span-8 {
  gap: 0 !important;
}

.ai-brief-hero {
  display: block !important;
  margin: 0 0 10px !important;
  padding: 0 0 12px !important;
  border-bottom: 1px solid var(--ui-border) !important;
}

.ai-brief-hero h1 {
  margin: 0 0 5px !important;
  font-size: 27px !important;
  line-height: 1.1 !important;
  font-weight: 650 !important;
}

.ai-brief-hero p {
  max-width: 720px;
  font-size: 13px !important;
  line-height: 1.45 !important;
}

.ai-brief-status,
.ai-workspace-summary {
  display: none !important;
}

.news-control-bar {
  margin: 0 0 10px !important;
  padding: 8px 0 !important;
  border: 0 !important;
  border-bottom: 1px solid var(--ui-border) !important;
  background: transparent !important;
  box-shadow: none !important;
}

.news-control-bar > .relative > .flex {
  border-radius: 4px !important;
  border-color: var(--ui-border) !important;
  padding: 0 !important;
  overflow: hidden;
}

#prevDate,
#nextDate,
#timeControlBtn {
  height: 34px !important;
  border-radius: 0 !important;
  background: #fff !important;
}

#timeControlBtn {
  min-width: 230px !important;
  justify-content: flex-start !important;
  border-right: 1px solid var(--ui-border) !important;
  border-left: 1px solid var(--ui-border) !important;
}

.news-control-bar .ml-auto {
  margin-left: auto !important;
}

.news-control-bar .opacity-70 {
  color: var(--ui-muted) !important;
  opacity: 1 !important;
}

.sortBtn {
  height: 34px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  color: var(--ui-muted) !important;
  background: transparent !important;
}

.sortBtn.bg-blue-100 {
  background: var(--ui-ink) !important;
  color: #fff !important;
}

.ni-section,
.rounded-2xl.border.bg-white,
aside > div.rounded-2xl {
  border-radius: var(--ui-radius) !important;
  box-shadow: none !important;
}

.ni-section-hd,
aside > div.rounded-2xl > .p-4.border-b {
  padding: 12px 14px !important;
}

.ni-section-title,
aside h4.font-semibold {
  font-size: 14px !important;
  font-weight: 760 !important;
  letter-spacing: 0 !important;
}

aside.lg\:col-span-4 {
  gap: 14px !important;
}

aside > div.rounded-2xl {
  overflow: hidden !important;
}

aside > div.rounded-2xl .p-4 {
  padding: 13px 14px !important;
}

#trending {
  padding: 10px 12px !important;
}

#trending li {
  align-items: flex-start !important;
  padding: 9px 0 !important;
  border-bottom: 1px solid var(--ui-border) !important;
  border-radius: 0 !important;
}

#trending li:last-child {
  border-bottom: 0 !important;
}

#trending li > span {
  width: 22px !important;
  color: var(--ui-muted) !important;
  background: none !important;
  -webkit-text-fill-color: currentColor !important;
  font-family: Georgia, "Times New Roman", serif !important;
}

#trending a div {
  font-size: 13px !important;
  line-height: 1.42 !important;
}

.bottom-trending-panel {
  margin-top: 6px !important;
  border-radius: var(--ui-radius) !important;
  box-shadow: none !important;
}

.bottom-trending-panel > .p-4.border-b {
  padding: 12px 14px !important;
}

@media (min-width: 769px) {
  .bottom-trending-panel > .p-4.border-b {
    padding-left: 96px !important;
  }
}

.bottom-trending-panel #trending {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
  gap: 0 !important;
  padding: 0 !important;
}

.bottom-trending-panel #trending li {
  min-height: 112px !important;
  padding: 16px 14px !important;
  border-bottom: 0 !important;
  border-right: 1px solid var(--ui-border) !important;
  display: grid !important;
  grid-template-columns: 28px minmax(0, 1fr) !important;
  gap: 10px !important;
}

.bottom-trending-panel #trending li:last-child {
  border-right: 0 !important;
}

.bottom-trending-panel #trending li > span {
  width: 28px !important;
  font-size: 18px !important;
  line-height: 1 !important;
}

.bottom-trending-panel #trending a div {
  font-size: 14px !important;
  line-height: 1.45 !important;
  text-wrap: pretty;
}

#quickFilterContent .mb-4,
#readingStats .space-y-3 > * {
  margin-bottom: 10px !important;
}

#showAllNews,
#clearFilters {
  padding: 5px 8px !important;
  border-radius: 4px !important;
  background: transparent !important;
}

.ai-editorial-grid {
  min-height: 280px !important;
  grid-template-columns: minmax(0, 1.04fr) minmax(340px, 0.96fr) !important;
}

.ai-lead-story {
  min-height: 280px !important;
  padding: 20px 22px !important;
}

.ai-lead-story h2 {
  font-size: 27px !important;
}

.ai-lead-judgement {
  border-radius: 6px !important;
}

@media (max-width: 1023px) {
  main.mx-auto.max-w-7xl {
    display: block !important;
  }
}

@media (max-width: 768px) {
  .news-nav-main {
    min-height: auto !important;
    gap: 8px !important;
    padding: 8px 0 !important;
  }

  .news-nav-left {
    width: 100% !important;
    flex-wrap: nowrap !important;
    gap: 10px !important;
  }

  .ai-title {
    min-width: 94px !important;
    font-size: 22px !important;
  }

  .ai-title small {
    display: none !important;
  }

  .news-channel-nav {
    order: initial !important;
    width: auto !important;
    min-height: 36px !important;
    margin: 0 !important;
    padding: 0 !important;
    flex: 1 1 auto !important;
  }

  #moduleTabs button {
    height: 36px !important;
    padding: 0 9px !important;
    font-size: 13px !important;
  }

  .news-search {
    width: 100% !important;
    flex: 1 1 100% !important;
    order: 1 !important;
  }

  .news-nav-tools {
    width: 100% !important;
    order: 2 !important;
  }

  .news-nav-tools select {
    flex: 1 1 auto !important;
  }

  #layoutBtns {
    flex: 0 0 auto !important;
  }

  .ai-brief-hero h1 {
    font-size: 25px !important;
  }

  .news-control-bar {
    align-items: stretch !important;
  }

  .news-control-bar > .relative,
  .news-control-bar > .ml-auto {
    width: 100% !important;
  }

  #timeControlBtn {
    min-width: 0 !important;
    flex: 1 1 auto !important;
  }

  .ai-editorial-grid {
    grid-template-columns: 1fr !important;
  }
}

/* Final placement: trend list belongs below the content grid, not in the sidebar. */
.bottom-trending-panel {
  grid-column: 1 / -1 !important;
  width: 100% !important;
}

.bottom-trending-panel #trending {
  display: grid !important;
  grid-template-columns: repeat(5, minmax(0, 1fr)) !important;
}

@media (min-width: 769px) and (max-width: 1180px) {
  .bottom-trending-panel #trending {
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
  }

  .bottom-trending-panel #trending li {
    border-right: 1px solid var(--ui-border) !important;
    border-bottom: 1px solid var(--ui-border) !important;
  }

  .bottom-trending-panel #trending li:nth-child(2n) {
    border-right: 0 !important;
  }
}

@media (max-width: 768px) {
  .bottom-trending-panel {
    margin-top: 18px !important;
  }

  .bottom-trending-panel #trending {
    grid-template-columns: 1fr !important;
  }

  .bottom-trending-panel #trending li {
    min-height: auto !important;
    border-right: 0 !important;
    border-bottom: 1px solid var(--ui-border) !important;
  }

  .bottom-trending-panel #trending li:last-child {
    border-bottom: 0 !important;
  }
}

/* Single-column newsroom layout */
main.mx-auto.max-w-7xl {
  grid-template-columns: 1fr !important;
  gap: 22px !important;
}

main > section.lg\:col-span-8 {
  grid-column: 1 / -1 !important;
  order: 1 !important;
}

.bottom-trending-panel {
  grid-column: 1 / -1 !important;
  order: 2 !important;
}

main > aside.lg\:col-span-4 {
  display: none !important;
}

#aiChatContainer {
  display: none !important;
}

/* User button in header */
.news-nav-user-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 34px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1px solid var(--ui-border-strong);
  background: var(--ui-surface);
  color: var(--ui-ink);
  font-size: 13px;
  font-weight: 650;
  cursor: pointer;
  text-decoration: none;
  white-space: nowrap;
  transition: background 0.15s;
}
.news-nav-user-btn:hover {
  background: var(--ui-surface-soft);
}
.news-nav-user-btn svg {
  flex-shrink: 0;
}

@media (max-width: 1023px) {
  main.mx-auto.max-w-7xl {
    display: grid !important;
    grid-template-columns: 1fr !important;
  }
}

/* ============================================
   POLISH PASS — Jun 2026
   ============================================ */

/* 1. Control bar — use semantic class, not :first-child */
.news-control-bar {
  background: var(--ui-surface) !important;
  border: 1px solid var(--ui-border) !important;
  border-radius: 14px !important;
  padding: 8px 14px !important;
  box-shadow: 0 1px 3px rgba(25, 24, 23, 0.07) !important;
}

/* 2. Skeleton shimmer — more visible on cream bg */
.ai-skel-line,
.ai-skel-pill {
  background: linear-gradient(
    90deg,
    #d4d8cc 0%,
    #e4e8dc 48%,
    #d4d8cc 100%
  ) !important;
  background-size: 220% 100% !important;
  animation: aiShimmer 1.4s ease-in-out infinite !important;
}

/* 3. Loading "读" badge — tone it down */
.ai-loading-workspace .ai-empty-score {
  width: 34px !important;
  height: 34px !important;
  border-radius: 8px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  background: var(--ui-muted) !important;
  letter-spacing: 0.03em !important;
}

/* 4. aside — remove sticky in single-column mode */
aside {
  position: static !important;
  align-self: auto !important;
}

/* 5. "注册账户" button — clearer ghost style */
#userInfoGuest a:last-child {
  background: transparent !important;
  color: var(--ui-ink) !important;
  border: 1px solid var(--ui-border-strong) !important;
}
#userInfoGuest a:last-child:hover {
  background: var(--ui-surface-soft) !important;
}
/* "立即登录" — ink fill */
#userInfoGuest a:first-of-type {
  background: var(--ui-ink) !important;
  color: #fff !important;
  border: 0 !important;
}
#userInfoGuest a:first-of-type:hover {
  opacity: 0.85 !important;
}

/* 6. CTA buttons in aside — override garish inline gradients */
#openPromptLabBtn,
#openBatchSummaryBtn {
  background: var(--ui-surface-muted) !important;
  color: var(--ui-ink) !important;
  border: 1px solid var(--ui-border-strong) !important;
  border-radius: var(--ui-radius) !important;
  padding: 11px 16px !important;
  box-shadow: none !important;
  font-size: 13px !important;
  font-weight: 650 !important;
}
#openPromptLabBtn:hover,
#openBatchSummaryBtn:hover {
  background: var(--ui-surface-soft) !important;
  transform: none !important;
  box-shadow: none !important;
}
#openPromptLabBtn svg,
#openBatchSummaryBtn svg {
  animation: none !important;
}

/* 7. CTA helper text below buttons */
aside .text-xs.text-gray-500.text-center {
  color: var(--ui-faint) !important;
  margin-top: 5px !important;
  font-size: 11.5px !important;
}

/* 8. Aside divider gradient — keep but quieter */
aside .space-y-4 > [style*="linear-gradient"] {
  opacity: 0.55;
}

/* 9. KPI "--" placeholder — intentional grey */
#deskHotCount,
#deskFeaturedCount,
#deskBriefCount {
  color: var(--ui-faint) !important;
  font-size: 17px !important;
}

/* 10. Empty trending list */
#trending:empty::after {
  content: "今日热榜整理中";
  display: block;
  padding: 24px 0;
  text-align: center;
  color: var(--ui-faint);
  font-size: 13px;
  font-style: italic;
}

/* 11. Guest welcome text */
#userInfoGuest p.text-gray-600 {
  color: var(--ui-muted) !important;
  font-size: 13px !important;
}

/* 12. "热榜" section header padding when in bottom panel */
.bottom-trending-panel h4 {
  font-size: 11px !important;
  font-weight: 720 !important;
  color: var(--ui-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}

/* 13. Aside section headings */
aside h4 {
  font-size: 11px !important;
  font-weight: 720 !important;
  color: var(--ui-muted) !important;
  text-transform: uppercase !important;
  letter-spacing: 0.08em !important;
}

/* 14. Aside card header padding — tighter */
aside .p-4.border-b {
  padding: 12px 16px !important;
}

/* 15. Reading stats rows */
#readingStats .flex {
  padding: 9px 0 !important;
  font-size: 13px !important;
}

/* 16. Channel nav active tab — red underline,  */
#moduleTabs button.bg-neutral-900 {
  font-weight: 800 !important;
  color: var(--ui-ink) !important;
}

/* 17. Score badge — tech blue instead of warm yellow */
.ni-score,
.ni-grade-S,
.ni-grade-A {
  background: rgba(37, 99, 235, 0.1) !important;
  color: var(--ui-blue-dark) !important;
  border: 1px solid rgba(37, 99, 235, 0.25) !important;
}

/* 18. ai-brief-hero spacing refinement */
.ai-brief-hero {
  margin-bottom: 16px !important;
  padding-top: 4px !important;
}

/* 19. KPI wide card — editorial warm tint */
.ai-kpi-wide {
  background: linear-gradient(160deg, #fffef6 0%, var(--ui-surface) 60%) !important;
  border-left: 3px solid #e8d800 !important;
}

/* 20. Scrollbar — themed */
* { scrollbar-width: thin; scrollbar-color: #d0d4c8 transparent; }
::-webkit-scrollbar { width: 5px; height: 5px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: #d0d4c8; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #b8bcb0; }

/* ============================================
   FLAT EDITORIAL — 去气泡框，BBC风格直排
   ============================================ */

/* 所有内容区域：去掉边框、阴影、圆角 */
.ni-section,
.ni-card,
.ai-empty-workspace,
.ai-empty-workspace.ai-loading-workspace,
.rounded-2xl.border.bg-white,
.bottom-trending-panel {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

/* section 分区只用顶部分隔线 */
.ni-section {
  border-top: 2px solid var(--ui-ink) !important;
  padding-top: 12px !important;
  margin-top: 32px !important;
}

/* section 标题：BBC风格 小标签 + 箭头 */
.ni-section-hd {
  background: transparent !important;
  border-bottom: 0 !important;
  padding: 0 0 12px !important;
}
.ni-section-title {
  font-size: 13px !important;
  font-weight: 750 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.06em !important;
  color: var(--ui-ink) !important;
}
.ni-section-count {
  font-size: 12px !important;
}
.ni-section-dot { display: none !important; }

/* 文章列表行：仅底部分隔线，无气泡 */
.ni-card {
  border-bottom: 1px solid var(--ui-border) !important;
  min-height: auto !important;
}
.ni-card:hover {
  background: rgba(25,24,23,0.03) !important;
  box-shadow: none !important;
}
.ni-card-body {
  min-height: auto !important;
  padding: 14px 0 !important;
}

/* list items — 去掉padding撑起的气泡感 */
.ni-list-item {
  padding: 13px 0 !important;
  border-bottom: 1px solid var(--ui-border) !important;
}
.ni-list-item:hover {
  background: rgba(25,24,23,0.03) !important;
  padding-left: 4px !important;
}

/* 控制栏：去掉气泡框 */
.news-control-bar {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  border-bottom: 1px solid var(--ui-border) !important;
  padding-bottom: 12px !important;
}

/* 加载状态：去掉大气泡 */
.ai-empty-workspace {
  padding: 0 !important;
}
.ai-empty-head {
  padding: 14px 0 !important;
  border-bottom: 1px solid var(--ui-border) !important;
}

/* 骨架行：去掉气泡感 */
.ai-skeleton-row {
  padding: 14px 0 !important;
  border-bottom: 1px solid var(--ui-border) !important;
}

/* 热榜：去掉气泡 */
.bottom-trending-panel {
  border-top: 2px solid var(--ui-ink) !important;
  padding-top: 12px !important;
}
.bottom-trending-panel > .p-4.border-b {
  border-bottom: 0 !important;
  padding: 0 0 12px !important;
}

/* 编辑区 card insight: 去气泡 */
.ai-card-insight {
  background: transparent !important;
  border: 0 !important;
  border-left: 2px solid var(--ui-border) !important;
  border-radius: 0 !important;
  padding: 4px 10px !important;
}

/* time modal 保留边框（功能弹窗需要） */
#timeModal {
  border: 1px solid var(--ui-border) !important;
  border-radius: 12px !important;
  box-shadow: 0 4px 20px rgba(25,24,23,0.12) !important;
}