:root {
  color-scheme: dark;
  --page: #06111f;
  --page-deep: #030b15;
  --surface: #081a2c;
  --surface-raised: #0b2036;
  --surface-soft: #102741;
  --line: #163754;
  --line-bright: #145d96;
  --blue: #1687f8;
  --blue-bright: #27a5ff;
  --cyan: #27d3e8;
  --text: #f3f7fd;
  --muted: #a4b4c7;
  --muted-dim: #74889e;
  --green: #25d6a2;
  --amber: #f6b73c;
  --purple: #b38cff;
  --red: #ff727e;
  --header-bg: rgb(3 12 23 / 96%);
  --footer-bg: #030d18;
  --footer-heading: #f3f7fd;
  --footer-divider: #10283c;
  --nav-link: #d0dbea;
  --search-bg: #0b2137;
  --search-border: #194a70;
  --input-bg: #061626;
  --input-border: #1a3a56;
  --input-placeholder: #74889e;
  --article-copy: #d2dce8;
  --article-excerpt: #c3d1df;
  --article-meta: #c0cede;
  --aside-link: #c1d1e2;
  --aside-hover: #0c2942;
  --blockquote-bg: #0b2238;
  --blockquote-text: #e2edfa;
  --control-text: #d7e6f6;
  --radius: 12px;
  --shadow: 0 16px 48px rgb(0 0 0 / 22%);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

:root[data-theme="light"] {
  color-scheme: light;
  --page: #f4f7fb;
  --page-deep: #eaf0f6;
  --surface: #ffffff;
  --surface-raised: #f0f5fa;
  --surface-soft: #e5edf5;
  --line: #d5e0ea;
  --line-bright: #79a8ce;
  --blue: #0875ca;
  --blue-bright: #075fa6;
  --cyan: #087b8d;
  --text: #172a3c;
  --muted: #455a6f;
  --muted-dim: #617589;
  --header-bg: rgb(255 255 255 / 97%);
  --footer-bg: #edf2f7;
  --footer-heading: #172a3c;
  --footer-divider: #d5e0ea;
  --nav-link: #34495d;
  --search-bg: #f2f6fa;
  --search-border: #c1d1df;
  --input-bg: #ffffff;
  --input-border: #c3d2df;
  --input-placeholder: #6c7f91;
  --article-copy: #26394b;
  --article-excerpt: #41566b;
  --article-meta: #52677b;
  --aside-link: #33495d;
  --aside-hover: #e9f2fa;
  --blockquote-bg: #eaf2f8;
  --blockquote-text: #26394b;
  --control-text: #26394b;
  --shadow: 0 16px 48px rgb(22 42 62 / 10%);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 88px; }
body { margin: 0; min-width: 320px; background: var(--page); color: var(--text); font-size: 16px; line-height: 1.65; }
body, input, textarea, select, button { font-family: inherit; }
button, input, textarea, select { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--blue-bright); }
img { max-width: 100%; }
button { cursor: pointer; }
::selection { background: #1267ae; color: #fff; }
:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }
.sr-only { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 1000; padding: 9px 14px; transform: translateY(-150%); background: var(--blue); border-radius: 8px; }
.skip-link:focus { transform: none; }

.site-header { position: sticky; z-index: 40; top: 0; width: 100%; background: var(--header-bg); border-bottom: 1px solid var(--line); backdrop-filter: blur(12px); }
.header-inner { min-height: 68px; max-width: 1440px; padding: 0 32px; margin: 0 auto; display: flex; align-items: center; gap: 28px; }
.brand { display: inline-flex; flex: 0 0 auto; align-items: center; gap: 10px; color: var(--text); }
.brand img { display: block; width: 164px; height: auto; border-radius: 0; }
.brand img.brand-mark { width: 46px; height: 46px; object-fit: contain; }
.brand-wordmark { font-size: 24px; font-weight: 780; letter-spacing: -.045em; line-height: 1; }
.brand:hover { color: var(--text); }
.main-nav { min-width: 0; flex: 1 1 auto; display: flex; align-items: center; justify-content: center; gap: clamp(12px, 2vw, 29px); }
.nav-link { position: relative; display: inline-flex; align-items: center; min-height: 68px; color: var(--nav-link); font-size: 14px; font-weight: 600; white-space: nowrap; }
.nav-link:hover, .nav-link.active { color: var(--blue-bright); }
.nav-link.active::after { position: absolute; right: 0; bottom: 0; left: 0; height: 2px; background: var(--blue); content: ""; }
.header-search { width: clamp(180px, 20vw, 270px); height: 40px; flex: 0 1 270px; display: flex; align-items: center; overflow: hidden; border: 1px solid var(--search-border); border-radius: 24px; background: var(--search-bg); }
.header-search input { min-width: 0; width: 100%; padding: 0 12px 0 15px; border: 0; outline: 0; background: transparent; color: var(--text); font-size: 13px; }
.header-search input::placeholder { color: var(--muted); }
.search-submit, .icon-button { display: inline-grid; flex: 0 0 auto; place-items: center; border: 0; color: var(--text); background: transparent; }
.search-submit { width: 38px; height: 38px; font-size: 25px; }
.icon-button { width: 40px; height: 40px; border: 1px solid var(--line); border-radius: 50%; font-size: 19px; }
.icon-button:hover, .search-submit:hover { color: var(--cyan); background: var(--surface-soft); }
.theme-toggle { color: #f4c874; }
.theme-toggle svg { display: block; }
.theme-icon-light { display: none; }
:root[data-theme="light"] .theme-toggle { color: #805800; }
:root[data-theme="light"] .theme-icon-dark { display: none; }
:root[data-theme="light"] .theme-icon-light { display: block; }
.search-submit svg { display: block; }
.menu-toggle, .mobile-search { display: none; }

.page-shell { width: min(100% - 64px, 1320px); margin: 0 auto; }
.home-shell { padding: 30px 0 72px; }
.home-feature-grid { display: grid; grid-template-columns: minmax(0, 1.8fr) minmax(280px, .88fr); gap: 16px; }
.feature-card { position: relative; min-height: 400px; display: flex; align-items: flex-end; overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: var(--surface-raised); }
.feature-cover { position: absolute; inset: 0; display: block; }
.feature-image { width: 100%; height: 100%; object-fit: cover; }
.feature-cover::after { position: absolute; inset: 0; background: linear-gradient(90deg, rgb(3 11 20 / 92%) 0%, rgb(3 11 20 / 70%) 43%, rgb(3 11 20 / 14%) 100%), linear-gradient(0deg, rgb(3 11 20 / 38%), transparent 54%); content: ""; }
.cover-placeholder { display: block; overflow: hidden; background: #0b2035; }
.cover-placeholder img { display: block; width: 100%; height: 100%; object-fit: cover; opacity: 1; }
.cover-illustration { transition: transform .22s ease; }
.story-card:hover .cover-illustration { transform: scale(1.025); }
.feature-copy { z-index: 1; width: min(78%, 660px); padding: 38px 38px 34px; pointer-events: none; }
.feature-copy > * { pointer-events: auto; }
.eyebrow { display: inline-block; color: var(--cyan); font-size: 12px; font-weight: 750; letter-spacing: .13em; line-height: 1.5; }
.feature-copy .feature-title { max-width: 670px; margin: 10px 0 12px; font-size: clamp(31px, 4.1vw, 51px); letter-spacing: -.045em; line-height: 1.08; }
.feature-copy .feature-title a:hover { color: #fff; }
.feature-copy > p { max-width: 570px; margin: 0 0 15px; color: #d5e0ee; font-size: 15px; }
.byline, .article-meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 17px; color: var(--article-meta); font-size: 13px; }
.button { display: inline-flex; min-height: 42px; align-items: center; justify-content: center; gap: 10px; padding: 0 17px; border: 1px solid transparent; border-radius: 8px; font-size: 13px; font-weight: 700; line-height: 1.2; transition: border-color .16s ease, background-color .16s ease, transform .16s ease; }
.button:hover { transform: translateY(-1px); }
.button-primary { color: #fff; border-color: #1a8cfa; background: #087df0; }
.button-primary:hover { color: #fff; border-color: #4bb0ff; background: #168bf7; }
.button-quiet { color: #dce8f6; border-color: var(--line); background: var(--surface); }
.button-quiet:hover { color: #fff; border-color: var(--line-bright); background: var(--surface-raised); }
.button-danger { color: #ffdce0; border-color: #783d49; background: #381c29; }
.button-danger:hover { color: #fff; border-color: var(--red); }
.feature-copy .button { margin-top: 19px; }
.feature-rail { display: flex; flex-direction: column; gap: 12px; }
.side-story { min-height: 120px; display: grid; grid-template-columns: 39% 1fr; overflow: hidden; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); }
.side-cover { min-height: 120px; overflow: hidden; }
.side-image { width: 100%; height: 100%; object-fit: cover; }
.side-story > div { align-self: center; padding: 13px 15px; }
.side-story h2 { margin: 5px 0 7px; font-size: 15px; line-height: 1.36; }
.side-story .eyebrow { font-size: 11px; }
.muted, .side-story .muted { color: var(--muted); font-size: 12px; }
.topic-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 15px; }
.topic-card { position: relative; min-width: 0; min-height: 132px; display: flex; align-items: flex-start; gap: 13px; padding: 18px 15px; overflow: hidden; border: 1px solid var(--line); border-radius: 13px; background: linear-gradient(135deg, var(--surface), var(--surface-raised)); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.topic-card::before { position: absolute; top: 18px; bottom: 18px; left: 0; width: 3px; border-radius: 0 4px 4px 0; background: var(--blue); content: ""; opacity: .85; }
.topic-card:hover { transform: translateY(-3px); border-color: var(--line-bright); box-shadow: var(--shadow); }
.topic-finance::before { background: #25d6a2; }
.topic-technology::before { background: #2c9cff; }
.topic-health::before { background: #ff648f; }
.topic-gadgets::before { background: #a37bff; }
.topic-gaming::before { background: #f4a648; }
.topic-guides::before { background: #62c4ff; }
.topic-reviews::before { background: #ffca66; }
.topic-symbol { width: 48px; height: 48px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid #195e9a; border-radius: 14px; color: #d5eeff; background: #0c3e71; }
.topic-symbol svg { display: block; }
.topic-finance .topic-symbol { border-color: #147d71; background: #0b4f4c; }
.topic-health .topic-symbol { border-color: #923d6b; background: #572844; }
.topic-gadgets .topic-symbol { border-color: #6844a4; background: #382759; }
.topic-gaming .topic-symbol { border-color: #a65433; background: #632f26; }
.topic-guides .topic-symbol { border-color: #22639c; color: #d5eeff; background: #123557; }
.topic-reviews .topic-symbol { border-color: #8c6429; color: #ffe1a1; background: #45351e; }
.topic-card > span:nth-child(2) { min-width: 0; flex: 1; padding: 1px 2px 0 0; }
.topic-card strong, .topic-card small { display: block; }
.topic-card strong { margin-bottom: 5px; font-size: 16px; line-height: 1.3; }
.topic-card small { color: var(--muted); font-size: 13px; line-height: 1.45; }
.topic-arrow { width: 30px; height: 30px; flex: 0 0 30px; display: grid; place-items: center; align-self: center; border: 1px solid var(--line); border-radius: 50%; color: var(--blue-bright); background: var(--surface); font-size: 17px; transition: transform .18s ease, color .18s ease, background .18s ease; }
.topic-card:hover .topic-arrow { transform: translateX(2px); border-color: var(--blue); color: #fff; background: var(--blue); }
.section-block { margin-top: 48px; }
.section-heading, .panel-heading { display: flex; align-items: end; justify-content: space-between; gap: 20px; margin-bottom: 17px; }
.section-heading h2, .panel-heading h2 { margin: 3px 0 0; font-size: clamp(22px, 2.6vw, 29px); letter-spacing: -.035em; line-height: 1.2; }
.text-link { color: var(--blue-bright); font-size: 13px; font-weight: 650; white-space: nowrap; }
.text-link:hover { color: var(--cyan); }
.story-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.story-card { overflow: hidden; border: 1px solid var(--line); border-radius: 11px; background: var(--surface); }
.story-card:hover { border-color: var(--line-bright); }
.story-cover { position: relative; display: block; aspect-ratio: 1.73 / 1; overflow: hidden; background: #0b2035; }
.story-image { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .2s ease; }
.story-card:hover .story-image { transform: scale(1.025); }
.category-pill { display: inline-flex; align-items: center; width: fit-content; padding: 4px 8px; border: 1px solid #1768aa; border-radius: 99px; color: #d5eeff; background: #0d3a64; font-size: 11px; font-weight: 750; letter-spacing: .05em; text-transform: uppercase; }
.story-cover .category-pill { position: absolute; bottom: 10px; left: 11px; }
.cat-finance { border-color: #147d71; color: #a8ffdf; background: #0d4643; }
.cat-health { border-color: #a04472; color: #ffc4df; background: #54223d; }
.cat-gadgets { border-color: #7650ba; color: #e1d0ff; background: #38255a; }
.cat-gaming { border-color: #a95a38; color: #ffd5bd; background: #532b21; }
.cat-guides { border-color: #266daa; color: #cbe7ff; background: #123654; }
.cat-reviews { border-color: #8a642a; color: #ffe2a5; background: #42331e; }
.story-copy { padding: 14px 14px 15px; }
.story-copy h3 { margin: 0; font-size: 16px; line-height: 1.4; }
.story-copy p { min-height: 40px; margin: 8px 0 12px; color: var(--muted); font-size: 14px; line-height: 1.55; }
.story-meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; color: var(--muted-dim); font-size: 12px; }
.empty-state { min-height: 210px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 28px; border: 1px dashed #204563; border-radius: 12px; text-align: center; background: #081a2b; }
.empty-mark { width: 48px; height: 48px; display: grid; place-items: center; border: 1px solid #1a65a5; border-radius: 15px; color: var(--blue-bright); background: #0b2c4b; }
.empty-state h2 { margin: 13px 0 4px; font-size: 19px; }
.empty-state p { max-width: 470px; margin: 0 0 11px; color: var(--muted); font-size: 13px; }
.welcome-hero { min-height: 420px; display: grid; grid-template-columns: 1.4fr .6fr; align-items: center; overflow: hidden; padding: clamp(30px, 5vw, 68px); border: 1px solid var(--line); border-radius: 14px; background: #081a2d; }
.welcome-copy { max-width: 670px; }
.welcome-copy h1 { margin: 14px 0; font-size: clamp(40px, 6.5vw, 76px); letter-spacing: -.06em; line-height: .99; }
.welcome-copy h1 span, .about-hero h1 span { color: var(--blue-bright); }
.welcome-copy p { max-width: 550px; margin: 0; color: #c1d1e2; font-size: 17px; }
.welcome-copy .button { margin-top: 23px; }
.welcome-art { display: grid; min-height: 220px; place-items: center; overflow: hidden; border: 1px solid #1c547f; border-radius: 10px; background: #07182a; }
.welcome-art img { display: block; width: 100%; height: 100%; min-height: 220px; object-fit: cover; }
.search-hint { min-height: 180px; display: grid; place-content: center; justify-items: center; color: var(--muted); }

.site-footer { margin-top: 30px; border-top: 1px solid var(--line); background: var(--footer-bg); }
.footer-main { width: min(100% - 64px, 1320px); display: grid; grid-template-columns: 1.15fr .9fr 1.35fr 1.15fr; gap: 30px; padding: 31px 0 25px; margin: auto; }
.footer-brand { padding-right: 24px; border-right: 1px solid var(--line); }
.footer-brand .brand img { width: 190px; }
.footer-brand .brand img.brand-mark { width: 46px; height: 46px; }
.footer-brand .brand-wordmark { font-size: 23px; }
.footer-brand p { margin: 3px 0 0 56px; color: var(--muted); font-size: 13px; letter-spacing: .015em; }
.footer-main h2 { margin: 4px 0 10px; color: var(--footer-heading); font-size: 14px; font-weight: 700; }
.footer-main nav > a { display: block; width: fit-content; margin: 5px 0; color: var(--muted); font-size: 14px; }
.footer-main nav > a:hover, .footer-bottom nav a:hover { color: var(--blue-bright); }
.footer-categories { padding-right: 25px; border-right: 1px solid var(--line); }
.footer-categories > div { display: grid; grid-template-columns: 1fr 1fr; grid-auto-flow: column; grid-template-rows: repeat(4, auto); column-gap: 14px; }
.social-links { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.social-icon { width: 34px; height: 34px; display: inline-grid; place-items: center; border: 1px solid #163754; border-radius: 50%; color: #fff; background: #0b2035; }
.social-icon:hover { transform: translateY(-1px); border-color: #258ef3; }
.social-icon svg { display: block; }
.social-x { color: #f4f6fa; }.social-facebook { color: #fff; background: #1877f2; }.social-instagram { color: #fff; background: #bd287d; }.social-youtube { color: #fff; background: #e62117; }.social-linkedin { color: #fff; background: #0a66c2; }
.social-placeholder { opacity: .95; }
.footer-bottom { width: min(100% - 64px, 1320px); display: flex; justify-content: space-between; gap: 15px; padding: 12px 0; margin: auto; border-top: 1px solid var(--footer-divider); color: var(--muted-dim); font-size: 12px; }
.footer-bottom nav { display: flex; align-items: center; gap: 9px; }
.footer-bottom nav a { color: var(--nav-link); }

.breadcrumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 22px 0 18px; color: var(--muted); font-size: 12px; }
.breadcrumbs span { color: var(--cyan); }
.breadcrumbs a:last-child { color: var(--text); }
.category-shell, .listing-shell, .info-shell { padding-bottom: 68px; }
.category-intro { padding: 28px 0 22px; }
.category-intro { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.category-intro > div { min-width: 0; }
.category-hero-icon { width: 94px; height: 94px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid #17649e; border-radius: 20px; color: #48b8ff; background: linear-gradient(145deg,#0b3151,#102138); box-shadow: 0 12px 34px rgb(0 0 0 / 18%); }
.category-hero-icon svg { width: 48px; height: 48px; }
.category-hero-icon.topic-finance { color: #50e0b0; border-color: #167867; background: linear-gradient(145deg,#0c413f,#132b36); }
.category-hero-icon.topic-health { color: #ff8daf; border-color: #884466; background: linear-gradient(145deg,#462439,#22213a); }
.category-hero-icon.topic-gadgets { color: #c5a0ff; border-color: #6545a2; background: linear-gradient(145deg,#33254f,#17243c); }
.category-hero-icon.topic-gaming { color: #ffb578; border-color: #945333; background: linear-gradient(145deg,#472c2b,#202038); }
.category-hero-icon.topic-guides { color: #64c6ff; border-color: #21649a; background: linear-gradient(145deg,#0b3151,#102138); }
.category-hero-icon.topic-reviews { color: #ffd36b; border-color: #8b6329; background: linear-gradient(145deg,#44331f,#23213a); }
.category-intro h1, .listing-heading h1, .contact-intro h1 { margin: 5px 0 7px; font-size: clamp(35px, 5vw, 53px); letter-spacing: -.05em; line-height: 1.08; }
.category-intro p, .contact-intro p { max-width: 680px; margin: 0 0 10px; color: var(--muted); font-size: 15px; }
.count-label { display: inline-flex; margin-top: 5px; color: var(--muted-dim); font-size: 12px; }
.category-feature { margin-bottom: 20px; }
.category-feature .feature-card { min-height: 330px; }
.category-feature .feature-copy .feature-title { font-size: clamp(28px, 3.7vw, 42px); }
.pagination { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; margin: 30px 0 5px; }
.page-link { min-width: 36px; height: 36px; display: inline-grid; place-items: center; padding: 0 9px; border: 1px solid var(--line); border-radius: 7px; color: var(--text); background: var(--surface); font-size: 13px; }
.page-link:hover, .page-link.current { color: #fff; border-color: #1889f1; background: #0b66bb; }
.listing-heading { padding: 25px 0 24px; }
.large-search { width: min(100%, 690px); display: flex; gap: 9px; margin: 18px 0 8px; }
.large-search input { min-width: 0; flex: 1; height: 46px; padding: 0 15px; border: 1px solid var(--input-border); border-radius: 8px; outline: 0; background: var(--surface); }
.large-search input:focus { border-color: var(--blue); }
.listing-sort { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 13px 0; }
.listing-sort label { color: var(--muted); font-size: 13px; }
.listing-sort select { min-height: 38px; padding: 0 30px 0 10px; border: 1px solid var(--input-border); border-radius: 7px; color: var(--text); background: var(--surface); font: inherit; }
.listing-sort .button { min-height: 38px; }

.article-shell { padding-bottom: 64px; }
.article-layout { display: grid; grid-template-columns: minmax(150px, 205px) minmax(0, 730px) minmax(180px, 250px); align-items: start; gap: 22px; }
.article-aside, .related-aside { position: sticky; top: 84px; display: grid; gap: 12px; }
.aside-card { padding: 15px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.aside-card h2 { margin: 0 0 12px; font-size: 16px; }
.aside-card > a:not(.related-link) { display: flex; gap: 8px; padding: 7px 5px; border-radius: 5px; color: var(--aside-link); font-size: 13px; line-height: 1.5; }
.aside-card > a:not(.related-link):hover { color: var(--cyan); background: var(--aside-hover); }
.aside-card > a span { flex: 0 0 22px; color: var(--blue-bright); font-size: 12px; }
.aside-card p { margin: 10px 0; color: var(--muted); font-size: 13px; }
.article-toc-mobile { display: none; }
.aside-card p strong { display: inline-block; margin-top: 3px; color: var(--text); font-weight: 600; }
.article-main { min-width: 0; }
.article-kickers { display: flex; align-items: center; gap: 9px; margin: 6px 0 12px; }
.article-main > h1 { margin: 0 0 11px; font-size: clamp(30px, 4vw, 46px); letter-spacing: -.045em; line-height: 1.1; }
.article-excerpt { margin: 0 0 15px; color: var(--article-excerpt); font-size: 17px; line-height: 1.6; }
.article-meta { padding: 0 0 18px; border-bottom: 1px solid var(--line); }
.article-cover { margin: 20px 0 22px; }
.article-image { display: block; width: 100%; max-height: 470px; aspect-ratio: 1.8 / 1; border-radius: 10px; object-fit: cover; background: var(--surface-raised); }
.article-cover .cover-placeholder { min-height: 250px; border-radius: 10px; }
.article-cover figcaption { padding: 6px 0; color: var(--muted-dim); font-size: 12px; }
.prose { color: var(--article-copy); font-size: 17px; line-height: 1.85; overflow-wrap: anywhere; }
.prose > :first-child { margin-top: 0; }
.prose h2, .prose h3, .prose h4 { color: var(--text); letter-spacing: -.025em; line-height: 1.25; }
.prose h2 { margin: 34px 0 11px; font-size: 27px; }
.prose h3 { margin: 27px 0 9px; font-size: 21px; }
.prose h4 { margin: 22px 0 8px; font-size: 17px; }
.prose p { margin: 0 0 18px; }
.prose ul, .prose ol { padding-left: 24px; margin: 0 0 18px; }
.prose li { padding: 3px 0; }
.prose blockquote { margin: 22px 0; padding: 14px 17px; border-left: 3px solid var(--blue); border-radius: 0 8px 8px 0; color: var(--blockquote-text); background: var(--blockquote-bg); }
.prose img { display: block; max-width: 100%; height: auto; margin: 18px auto; border-radius: 8px; }
.prose table { width: 100%; border-collapse: collapse; margin: 20px 0; font-size: 13px; }
.prose th, .prose td { padding: 9px 11px; border: 1px solid var(--line); text-align: left; }
.prose th { color: var(--text); background: var(--surface-raised); }
.prose a { color: var(--blue-bright); text-decoration: underline; text-underline-offset: 3px; }
.prose hr { margin: 25px 0; border: 0; border-top: 1px solid var(--line); }
.align-left { text-align: left; }.align-center { text-align: center; }.align-right { text-align: right; }.align-justify { text-align: justify; }
.related-link { display: block; padding: 10px 0; border-top: 1px solid var(--line); }
.related-link span, .related-link strong, .related-link small { display: block; }
.related-link span { color: var(--cyan); font-size: 12px; }
.related-link strong { margin: 3px 0; font-size: 14px; line-height: 1.4; }
.related-link small { color: var(--muted-dim); font-size: 12px; }
.article-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 24px 0; }
.article-tags > span { color: var(--muted); font-size: 12px; }
.article-tags a { padding: 4px 8px; border: 1px solid var(--line); border-radius: 99px; color: var(--cyan); font-size: 12px; }
.article-share { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 13px 0; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.article-share strong { margin-right: 5px; font-size: 12px; }
.article-share a, .article-share button { padding: 6px 10px; border: 1px solid var(--line); border-radius: 7px; color: var(--control-text); background: var(--surface); font-size: 12px; }
.article-share a:hover, .article-share button:hover { border-color: var(--blue); }
.updated-note { color: var(--muted-dim); font-size: 12px; }
.preview-notice { display: flex; justify-content: space-between; gap: 15px; margin: 14px 0; padding: 11px 14px; border: 1px solid #936b27; border-radius: 8px; color: #ffe4a9; background: #352912; font-size: 12px; }
.preview-notice a { color: #fff; text-decoration: underline; }
.article-layout .article-aside { grid-column: 1; grid-row: 1; }
.article-layout .article-main { grid-column: 2; grid-row: 1; }
.article-layout .related-aside { grid-column: 3; grid-row: 1; }

.info-content { padding-bottom: 26px; }
.about-page { padding-bottom: 5px; }
.about-breadcrumb, .contact-breadcrumb { padding-top: 1px; }
.about-hero, .contact-hero { position: relative; min-height: 340px; display: flex; align-items: center; overflow: hidden; border-top: 1px solid #0f2d44; border-bottom: 1px solid #0f2d44; background: #041321; }
.about-hero-photo, .contact-hero-photo { position: absolute; inset: 0 0 0 auto; width: 62%; height: 100%; object-fit: cover; object-position: center 54%; }
.about-hero-shade, .contact-hero-shade { position: absolute; inset: 0; background: linear-gradient(90deg,#03111e 0%,#03111e 35%,rgb(3 17 30 / 88%) 47%,rgb(3 17 30 / 27%) 74%,rgb(3 17 30 / 5%) 100%),linear-gradient(0deg,rgb(3 17 30 / 35%),transparent 40%); }
.about-hero-inner, .contact-hero-inner { position: relative; z-index: 1; width: min(1320px, calc(100% - 80px)); margin: 0 auto; }
.about-hero-copy { max-width: 620px; }
.about-hero h1, .contact-hero h1 { margin: 5px 0 12px; color: #f7f9fd; font-size: clamp(36px, 4.3vw, 49px); letter-spacing: -.035em; line-height: 1.08; }
.about-hero p, .contact-hero p { max-width: 610px; margin: 0 0 10px; color: #e0e7f0; font-size: 14px; line-height: 1.55; }
.about-hero .eyebrow, .contact-hero .eyebrow { color: #079fff; font-size: 11px; letter-spacing: .17em; }
.about-content { padding-top: 0; padding-bottom: 16px; }
.values-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 14px; margin-top: 18px; }
.value-card { padding: 23px; border: 1px solid #123858; border-radius: 9px; background: linear-gradient(145deg,#06192b,#071a2d); }
.value-card h2 { margin: 5px 0 8px; color: #f4f7fc; font-size: 21px; letter-spacing: -.015em; }
.value-card p { margin: 0; color: #cad5e2; font-size: 14px; line-height: 1.55; }
.value-wide { grid-column: 1 / -1; }
.value-items { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); margin-top: 13px; }
.value-item { min-width: 0; display: flex; align-items: center; gap: 13px; padding: 4px 14px; border-right: 1px solid #123553; }
.value-item:first-child { padding-left: 0; }
.value-item:last-child { padding-right: 0; border-right: 0; }
.value-icon { width: 52px; height: 52px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid #0e4a8c; border-radius: 50%; color: #168fff; background: #082c53; }
.value-icon svg { width: 26px; height: 26px; stroke-width: 2.3; }
.value-item h3 { margin: 0 0 3px; color: #f4f7fc; font-size: 13px; }
.value-item p { margin: 0; color: #bdcada; font-size: 13px; line-height: 1.45; }
.legal-hero { padding: 30px 0 22px; }
.legal-hero h1 { margin: 7px 0; font-size: clamp(36px, 5vw, 55px); letter-spacing: -.05em; }
.legal-hero p { max-width: 700px; color: var(--muted); font-size: 15px; }
.legal-list { display: grid; gap: 9px; }
.legal-list section { display: grid; grid-template-columns: 66px 1fr; align-items: start; gap: 18px; padding: 17px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.legal-list section > span { width: 49px; height: 49px; display: grid; place-items: center; border: 1px solid #155795; border-radius: 50%; color: var(--cyan); background: #0b2d4d; font-size: 15px; font-weight: 750; }
.legal-list h2 { margin: 1px 0 4px; font-size: 16px; }
.legal-list p { margin: 0; color: var(--muted); font-size: 13px; }
.contact-intro { padding: 30px 0 21px; }
.contact-layout { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(260px, .75fr); gap: 16px; }
.contact-content { padding-top: 16px; }
.contact-card, .contact-details { padding: 20px; border: 1px solid #123858; border-radius: 9px; background: linear-gradient(145deg,#06192b,#071a2d); }
.contact-card h2, .contact-details h2 { margin: 0 0 5px; color: #f3f7fd; font-size: 21px; }
.contact-form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px 16px; margin-top: 16px; }
.contact-form-grid label { display: grid; gap: 6px; color: #dce5ef; font-size: 13px; }
.contact-form-grid .contact-label { font-size: 13px; }
.contact-label b { color: #ff8894; }
.contact-form-grid .form-full { grid-column: 1 / -1; }
.contact-form-grid textarea { min-height: 104px; }
.contact-form-grid .button { width: 100%; min-height: 43px; }
.contact-form-grid .button svg { stroke-width: 2.2; }
.contact-details-intro { margin: 0 0 12px; color: var(--muted); font-size: 12px; }
.contact-methods { display: grid; }
.contact-method { display: flex; gap: 13px; padding: 13px 0; border-bottom: 1px solid #173650; }
.contact-method-icon { width: 46px; height: 46px; flex: 0 0 auto; display: grid; place-items: center; border: 1px solid #15558b; border-radius: 12px; color: #20a9ff; background: #0b2d4b; }
.contact-method h3 { margin: 0 0 2px; font-size: 13px; }
.contact-method a { color: #0ba8ff; font-size: 12px; font-weight: 600; }
.contact-method p { margin: 2px 0 0; color: #b8c7d7; font-size: 12px; line-height: 1.45; }
.contact-follow { padding-top: 13px; }
.contact-follow h3 { margin: 0; font-size: 13px; }
.contact-follow p { margin: 0 0 9px; color: var(--muted); font-size: 13px; }
.contact-follow .social-icon { width: 32px; height: 32px; }
.stack-form { display: grid; gap: 14px; }
.stack-form label, .admin-panel label, .settings-grid label, .seo-fields label { display: grid; gap: 6px; color: #d5e0ec; font-size: 12px; font-weight: 600; }
input, textarea, select { max-width: 100%; border: 1px solid var(--input-border); border-radius: 7px; background: var(--input-bg); color: var(--text); }
input, select { min-height: 40px; padding: 8px 10px; }
textarea { min-height: 90px; padding: 10px; resize: vertical; }
input::placeholder, textarea::placeholder { color: var(--input-placeholder); }
input:focus, textarea:focus, select:focus { border-color: var(--blue); outline: 2px solid rgb(22 135 248 / 14%); }
.honeypot { position: absolute !important; left: -10000px !important; width: 1px; height: 1px; overflow: hidden; }
.not-found { min-height: 420px; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; padding-bottom: 60px; }
.not-found h1 { margin: 10px 0; font-size: clamp(36px, 5vw, 54px); letter-spacing: -.05em; }
.not-found p { color: var(--muted); }

/* Admin workspace */
.admin-body { min-height: 100vh; background: #050f1b; }
.admin-topbar { position: sticky; z-index: 60; top: 0; height: 66px; display: flex; align-items: center; gap: 12px; padding: 0 22px; border-bottom: 1px solid #16334b; background: #040d18; }
.admin-topbar .brand { font-size: 24px; }
.admin-topbar .brand img { width: 36px; height: 36px; }
.admin-label { padding-left: 13px; border-left: 1px solid var(--line); color: #bfccda; font-size: 12px; }
.admin-top-actions { display: flex; align-items: center; gap: 10px; margin-left: auto; }
.admin-top-actions .button { min-height: 35px; font-size: 12px; }
.admin-user { padding: 0 8px; color: #d0dbea; font-size: 12px; }
.admin-top-actions form { margin: 0; }
.admin-menu-toggle { display: none; }
.admin-layout { min-height: calc(100vh - 66px); display: grid; grid-template-columns: 222px minmax(0, 1fr); }
.admin-sidebar { position: sticky; top: 66px; height: calc(100vh - 66px); display: flex; flex-direction: column; padding: 17px 12px; border-right: 1px solid #16334b; background: #061321; }
.sidebar-caption { padding: 6px 11px 12px; color: #71879d; font-size: 10px; font-weight: 700; letter-spacing: .17em; }
.admin-sidebar nav { display: grid; gap: 5px; }
.admin-nav-link { min-height: 42px; display: flex; align-items: center; gap: 11px; padding: 0 11px; border: 1px solid transparent; border-radius: 7px; color: #c4d0dd; font-size: 12px; }
.admin-nav-link > span { width: 20px; color: #a4bfda; font-size: 16px; text-align: center; }
.admin-nav-link:hover { color: #fff; background: #0d2438; }
.admin-nav-link.selected { border-color: #155a96; color: #fff; background: #0b3b69; }
.admin-nav-link.selected > span { color: #40aaff; }
.admin-nav-link small { margin-left: auto; padding: 1px 7px; border-radius: 99px; color: #fff; background: #a93455; font-size: 11px; }
.sidebar-footer { display: grid; gap: 7px; margin-top: auto; padding: 14px 6px 5px; border-top: 1px solid #183149; }
.sidebar-footer .brand { font-size: 20px; }
.sidebar-footer .brand img { width: 31px; height: 31px; }
.sidebar-footer small { color: var(--muted-dim); font-size: 11px; }
.admin-main { width: 100%; max-width: 1600px; padding: 25px clamp(18px, 3vw, 42px) 60px; margin: 0 auto; }
.admin-page-heading { display: flex; align-items: end; justify-content: space-between; margin-bottom: 20px; }
.admin-page-heading h1 { margin: 3px 0 0; font-size: 29px; letter-spacing: -.035em; }
.admin-page-heading .eyebrow { color: #7fa7c9; }
.admin-welcome { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 16px; padding: 17px 20px; border: 1px solid var(--line); border-radius: 10px; background: #091d30; }
.admin-welcome h2 { margin: 0; font-size: 16px; }
.admin-welcome p { margin: 3px 0 0; color: var(--muted); font-size: 13px; }
.admin-welcome .button { min-height: 38px; }
.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; margin-bottom: 17px; }
.stat-card { min-height: 86px; display: flex; align-items: center; gap: 12px; padding: 13px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.stat-icon { width: 42px; height: 42px; display: grid; flex: 0 0 auto; place-items: center; border: 1px solid #16568e; border-radius: 10px; color: #42a9ff; background: #0c3155; font-size: 18px; }
.stat-green .stat-icon { border-color: #176c57; color: var(--green); background: #0b4239; }
.stat-amber .stat-icon { border-color: #795822; color: var(--amber); background: #423219; }
.stat-purple .stat-icon { border-color: #59438b; color: var(--purple); background: #30244c; }
.stat-card > div { min-width: 0; }
.stat-card > div span, .stat-card > div strong { display: block; }
.stat-card > div span { color: var(--muted); font-size: 12px; }
.stat-card > div strong { margin-top: 2px; font-size: 24px; line-height: 1.1; }
.dashboard-grid { display: grid; grid-template-columns: minmax(0, 1.7fr) minmax(240px, .8fr); align-items: start; gap: 14px; }
.dashboard-side { display: grid; gap: 14px; }
.admin-panel { min-width: 0; padding: 17px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.admin-panel > h2 { margin: 0 0 13px; font-size: 15px; }
.admin-panel .panel-heading { align-items: center; margin-bottom: 13px; }
.admin-panel .panel-heading h2 { font-size: 16px; }
.admin-panel .panel-heading .eyebrow { color: #7694ae; }
.backup-preview-dialog { width: min(1040px, calc(100vw - 24px)); max-width: none; max-height: calc(100dvh - 24px); padding: 0; overflow: hidden; border: 1px solid var(--line); border-radius: 15px; color: var(--text); background: var(--page); box-shadow: 0 24px 90px rgb(0 0 0 / 45%); }
.backup-preview-dialog::backdrop { background: rgb(1 8 15 / 78%); backdrop-filter: blur(3px); }
.backup-preview-shell { display: flex; max-height: calc(100dvh - 24px); flex-direction: column; }
.backup-preview-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; padding: 18px 20px 13px; border-bottom: 1px solid var(--line); }
.backup-preview-header h2 { margin: 3px 0 4px; font-size: 23px; }
.backup-preview-header p { margin: 0; color: var(--muted); font-size: 12px; }
.backup-preview-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; padding: 10px 20px; border-bottom: 1px solid var(--line); }
.backup-preview-actions > span { margin-left: auto; color: var(--muted); font-size: 12px; }
.backup-preview-notice { min-height: 0; margin: 0; padding: 0 20px; color: var(--blue-bright); font-size: 12px; }
.backup-preview-notice:not(:empty) { padding-top: 9px; }
.backup-preview-content { display: grid; gap: 12px; min-height: 0; padding: 12px 20px 18px; overflow-y: auto; overscroll-behavior: contain; }
.backup-preview-section { min-width: 0; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface); }
.backup-preview-section-heading { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 6px 14px; margin-bottom: 9px; }
.backup-preview-section-heading h3 { margin: 0; font-size: 14px; }
.backup-preview-section-heading span { color: var(--muted); font-size: 11px; }
.backup-preview-page { margin-top: 8px; border: 1px solid var(--line); border-radius: 8px; background: var(--page); }
.backup-preview-page > summary { display: flex; align-items: center; justify-content: space-between; padding: 10px 12px; color: var(--text); font-size: 13px; font-weight: 700; cursor: pointer; }
.backup-preview-page-posts { display: grid; gap: 7px; padding: 0 8px 8px; }
.backup-preview-item { min-width: 0; padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.backup-preview-item-heading { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.backup-preview-choice { display: flex; min-width: 0; flex: 1; align-items: flex-start; gap: 9px; color: var(--text); font-size: 12px; cursor: pointer; }
.backup-preview-choice input[type="checkbox"] { width: 17px; min-height: 17px; height: 17px; flex: 0 0 auto; margin: 1px 0 0; accent-color: var(--blue); }
.backup-preview-choice-copy { display: grid; min-width: 0; gap: 2px; }
.backup-preview-choice-copy strong { overflow-wrap: anywhere; font-size: 12px; }
.backup-preview-choice-copy small { color: var(--muted); font-size: 10px; overflow-wrap: anywhere; }
.backup-preview-excerpt { max-width: 840px; margin: 6px 0 0 26px; color: var(--muted); font-size: 11px; line-height: 1.5; }
.backup-preview-edit { min-height: 31px; flex: 0 0 auto; padding: 4px 9px; font-size: 11px; }
.backup-preview-article-editor { margin: 10px 0 0 25px; padding-top: 10px; border-top: 1px solid var(--line); }
.backup-preview-editor-form { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.backup-preview-editor-form > .field-help, .backup-preview-editor-form [data-edit-field="body"], .backup-preview-editor-actions { grid-column: 1 / -1; }
.backup-preview-field { display: grid; min-width: 0; gap: 4px; color: var(--muted); font-size: 11px; font-weight: 600; }
.backup-preview-field input, .backup-preview-field textarea, .backup-preview-field select { width: 100%; min-width: 0; font-size: 12px; }
.backup-preview-field textarea { min-height: 72px; }
.backup-preview-editor-form [data-edit-field="body"] { min-height: 190px; }
.backup-preview-editor-actions { display: flex; gap: 8px; }
.backup-preview-editor-actions .button { min-height: 34px; padding: 6px 10px; font-size: 11px; }
.backup-preview-setting-editor { display: grid; gap: 5px; margin: 7px 0 0 26px; }
.backup-preview-setting-editor > input { width: 100%; min-height: 34px; }
.backup-preview-clear-secret { display: flex; align-items: center; gap: 7px; color: var(--muted); font-size: 11px; }
.backup-preview-clear-secret input { width: 15px; min-height: 15px; height: 15px; accent-color: var(--blue); }
.backup-preview-footer { display: flex; justify-content: flex-end; gap: 9px; padding: 12px 20px; border-top: 1px solid var(--line); background: var(--surface); }
.backup-preview-footer .button { min-height: 40px; }
.admin-table { width: 100%; border-collapse: collapse; font-size: 12px; text-align: left; }
.admin-table th { padding: 10px 8px; border-bottom: 1px solid #1a3b56; color: #9cb0c6; font-size: 11px; font-weight: 650; letter-spacing: .04em; text-transform: uppercase; white-space: nowrap; }
.admin-table td { padding: 11px 8px; border-bottom: 1px solid #142e44; color: #c8d6e4; vertical-align: middle; }
.admin-table tbody tr:last-child td { border-bottom: 0; }
.admin-table td strong, .admin-table td small { display: block; }
.admin-table td strong { max-width: 260px; overflow: hidden; color: #eef4fb; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.admin-table td small { max-width: 260px; overflow: hidden; margin-top: 3px; color: var(--muted-dim); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.table-wrap { width: 100%; overflow-x: auto; }
.status { display: inline-flex; align-items: center; padding: 3px 7px; border: 1px solid #285573; border-radius: 99px; color: #b9ddfb; background: #102e46; font-size: 11px; font-weight: 700; text-transform: capitalize; }
.status-published { border-color: #176651; color: #89edcf; background: #0c3935; }
.status-draft { border-color: #6d5425; color: #f8d58f; background: #342b18; }
.status-scheduled { border-color: #58468a; color: #d6c6ff; background: #2c2349; }
.table-action { padding: 3px 0; border: 0; color: var(--blue-bright); background: none; font-size: 12px; font-weight: 650; white-space: nowrap; }
.table-action:hover { color: var(--cyan); text-decoration: underline; }
.danger-text { color: #ff8791; }
.row-actions { display: flex; align-items: center; gap: 11px; }
.row-actions form, .media-card form { margin: 0; }
.admin-article-title { display: flex; align-items: center; gap: 9px; }
.admin-article-title img, .tiny-cover { width: 39px; height: 31px; flex: 0 0 auto; border-radius: 5px; object-fit: cover; background: #0e3150; }
.tiny-cover { display: grid; place-items: center; color: #53b3ff; font-weight: 800; }
.category-stat-list { display: grid; gap: 5px; }
.category-stat { min-height: 35px; display: flex; align-items: center; gap: 9px; padding: 0 7px; border-radius: 6px; color: #c5d3e1; font-size: 12px; }
.category-stat:hover { background: #10283d; }
.category-stat strong { margin-left: auto; color: #e5eef8; font-size: 12px; }
.category-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--blue); }
.cat-dot-finance { background: var(--green); }.cat-dot-technology { background: #2c9cff; }.cat-dot-health { background: #ff648f; }.cat-dot-gadgets { background: #a37bff; }.cat-dot-gaming { background: #f4a648; }.cat-dot-guides { background: #62c4ff; }.cat-dot-reviews { background: #ffca66; }
.quick-panel > a { display: flex; justify-content: space-between; padding: 10px 1px; border-top: 1px solid #16334b; color: #cdd9e6; font-size: 12px; }
.quick-panel > a span { color: var(--blue-bright); }
.admin-empty { display: grid; justify-items: center; padding: 32px 15px; text-align: center; }
.admin-empty h2, .admin-empty h3 { margin: 8px 0 3px; font-size: 17px; }
.admin-empty p { margin: 0 0 14px; color: var(--muted); font-size: 12px; }
.admin-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 13px; }
.filter-form { display: flex; flex: 1 1 600px; flex-wrap: wrap; gap: 8px; }
.filter-form input { flex: 1 1 190px; }
.filter-form select { min-width: 126px; }
.filter-form .button, .admin-toolbar > .button { min-height: 40px; }
.status-summary { display: flex; flex-wrap: wrap; gap: 15px; margin: 0 2px 12px; color: var(--muted); font-size: 12px; }
.mobile-article-list { display: none; }
.editor-actions-top { display: flex; justify-content: space-between; gap: 15px; margin: -8px 0 13px; }
.back-link { color: var(--blue-bright); font-size: 12px; }
.article-form { display: grid; grid-template-columns: minmax(0, 1fr) 280px; align-items: start; gap: 14px; }
.editor-main-column, .editor-side-column { display: grid; gap: 12px; min-width: 0; }
.editor-panel { display: grid; gap: 8px; }
.field-label { margin-top: 5px; color: #d7e2ef; font-size: 12px; font-weight: 700; }
.title-input { min-height: 52px; font-size: 18px; font-weight: 650; }
.slug-input { display: flex; align-items: center; overflow: hidden; border: 1px solid #1a3a56; border-radius: 7px; background: #061626; }
.slug-input span { padding-left: 10px; color: var(--muted-dim); font-size: 11px; white-space: nowrap; }
.slug-input input { min-width: 0; flex: 1; border: 0; background: transparent; }
.editor-panel > textarea { font-size: 14px; }
.rich-editor-panel { padding: 0; overflow: hidden; }
.rich-editor-panel .panel-heading { padding: 15px 16px 0; }
.rich-editor-panel .panel-heading h2 { margin-top: 3px; }
.rich-editor-panel .panel-heading .muted { font-size: 11px; }
.editor-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 4px; padding: 9px 11px; border-top: 1px solid #17334b; border-bottom: 1px solid #17334b; background: #071725; }
.editor-toolbar button, .editor-toolbar select { min-height: 30px; padding: 4px 7px; border: 1px solid transparent; border-radius: 5px; color: #d4dfeb; background: transparent; font-size: 11px; }
.editor-toolbar button:hover, .editor-toolbar select:hover { border-color: #24506d; background: #112b40; }
.editor-toolbar span { height: 19px; margin: 0 3px; border-left: 1px solid #29445b; }
.editor-toolbar select { min-height: 30px; padding: 3px 5px; border-color: #1b3c56; background: #0a1d2e; }
.rich-editor { min-height: 360px; padding: 18px; outline: 0; color: #d5dfeb; font-size: 14px; line-height: 1.8; overflow-wrap: anywhere; }
.rich-editor:focus { box-shadow: inset 0 0 0 1px #165c91; }
.rich-editor > :first-child { margin-top: 0; }
.rich-editor h2 { font-size: 23px; }.rich-editor h3 { font-size: 19px; }
.rich-editor img { max-width: 100%; height: auto; }
.editor-foot { display: flex; justify-content: space-between; gap: 10px; padding: 9px 13px; border-top: 1px solid #16334b; color: var(--muted-dim); font-size: 11px; }
.seo-panel { padding: 0; overflow: hidden; }
.seo-panel summary { display: flex; flex-direction: column; gap: 4px; padding: 15px; cursor: pointer; list-style: none; }
.seo-panel summary::-webkit-details-marker { display: none; }
.seo-panel summary strong { font-size: 14px; }
.seo-fields { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 0 15px 15px; }
.seo-fields label:nth-child(2) { grid-row: span 2; }
.publish-panel { display: grid; gap: 12px; }
.publish-panel .panel-heading { margin-bottom: 1px; }
.publish-panel label small, .admin-panel label small { color: var(--muted-dim); font-size: 11px; font-weight: 400; }
.publish-panel select, .publish-panel input, .editor-side-column select, .editor-side-column input { width: 100%; }
.field-help { margin: -5px 0 0; color: var(--muted-dim); font-size: 11px; line-height: 1.5; }
.publish-buttons { display: grid; gap: 7px; }
.publish-buttons .button { width: 100%; }
.editor-side-column > .admin-panel { display: grid; gap: 12px; }
.image-preview { min-height: 95px; display: grid; place-items: center; overflow: hidden; border: 1px dashed #284a65; border-radius: 7px; color: var(--muted-dim); background: #061626; font-size: 12px; }
.image-preview img { width: 100%; max-height: 180px; object-fit: cover; }
.danger-panel { border-color: #633242; }
.danger-panel h2 { color: #ffacb5; }
.danger-panel p { color: var(--muted); font-size: 12px; }
.delete-article-panel { max-width: 360px; margin-top: 12px; }
.admin-columns { display: grid; grid-template-columns: minmax(0, 1.55fr) minmax(270px, .75fr); align-items: start; gap: 14px; }
.admin-columns .stack-form { margin-top: 14px; }
.upload-panel { display: grid; grid-template-columns: 1fr 1.6fr; gap: 15px; margin-bottom: 14px; }
.upload-panel h2 { margin: 3px 0; font-size: 16px; }
.upload-panel p { margin: 0; }
.upload-form { display: grid; grid-template-columns: 1fr 1fr; align-items: end; gap: 10px; }
.upload-form input[type=file] { width: 100%; padding: 6px; font-size: 12px; }
.upload-form .button { grid-column: 1 / -1; }
.media-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.media-card { overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: #061626; }
.media-card > img { display: block; width: 100%; aspect-ratio: 1.5 / 1; object-fit: cover; background: #0b2035; }
.media-card-copy { display: grid; gap: 6px; padding: 9px; }
.media-card-copy > strong { overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.media-card-copy > small { color: var(--muted-dim); font-size: 11px; }
.media-card-copy label { font-size: 11px; }
.media-card-copy label input { min-height: 34px; font-size: 12px; }
.settings-panel { margin-bottom: 14px; }
.settings-panel h2 { margin: 3px 0; font-size: 17px; }
.settings-panel > p { margin: 0 0 15px; }
.settings-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 13px; }
.settings-grid .settings-full { grid-column: 1 / -1; }
.settings-grid textarea { min-height: 70px; }
.settings-logo { display: flex; align-items: center; gap: 16px; color: var(--muted); font-size: 12px; }
.settings-logo img { border-radius: 12px; }
.message-list { display: grid; gap: 10px; }
.message-card { padding: 15px; border: 1px solid var(--line); border-radius: 9px; background: #061626; }
.message-heading { display: flex; align-items: start; justify-content: space-between; gap: 10px; }
.message-heading h2 { margin: 4px 0; font-size: 15px; }
.message-card p { color: #c3d0dd; font-size: 12px; white-space: pre-wrap; overflow-wrap: anywhere; }
.message-card .message-sender { color: var(--muted); font-size: 11px; }
.message-sender a { color: var(--blue-bright); }
.notice { margin: 0 0 12px; padding: 10px 12px; border: 1px solid var(--line-bright); border-radius: 7px; color: #d7eafb; background: #0c2941; font-size: 12px; }
.notice p { margin: 4px 0 0; }
.notice-error { border-color: #7d3546; color: #ffd6db; background: #351b27; }
.notice-success { border-color: #176651; color: #b0ffe5; background: #10382f; }
.notice-info { border-color: #24527a; color: #d2e8fb; background: #102a41; }
.notice code, code { padding: 2px 4px; border-radius: 4px; color: #bde2ff; background: #0b263d; font-size: .95em; }
.login-body { min-height: 100vh; }
.login-wrap { min-height: 100vh; display: grid; align-content: center; justify-items: center; padding: 24px; }
.login-brand { display: flex; align-items: center; gap: 11px; margin-bottom: 16px; color: var(--muted); font-size: 12px; }
.login-card { width: min(100%, 420px); padding: 25px; border: 1px solid var(--line); border-radius: 13px; background: var(--surface); box-shadow: var(--shadow); }
.login-card h1 { margin: 4px 0; font-size: 26px; }
.login-card > p { margin: 0 0 16px; color: var(--muted); font-size: 12px; }
.login-card .stack-form { margin-top: 15px; }
.button-full { width: 100%; margin-top: 2px; }
.login-card .back-link { display: block; margin-top: 15px; text-align: center; }
.login-foot { color: var(--muted-dim); font-size: 11px; }

@media (max-width: 1120px) {
  .header-inner { gap: 18px; padding-inline: 22px; }
  .main-nav { gap: 13px; }
  .nav-link { font-size: 12px; }
  .page-shell, .footer-main, .footer-bottom { width: min(100% - 44px, 1320px); }
  .article-layout { grid-template-columns: minmax(140px, 185px) minmax(0, 1fr); }
  .article-layout .related-aside { grid-column: 2; grid-row: 2; position: static; }
  .related-aside .aside-card { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0 12px; }
  .related-aside .aside-card h2 { grid-column: 1 / -1; }
  .story-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .media-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 900px) {
  .header-inner { min-height: 62px; gap: 12px; padding: 0 16px; }
  .menu-toggle { display: inline-grid; width: 34px; height: 34px; border: 0; font-size: 19px; }
  .brand { gap: 7px; font-size: 23px; }
  .brand img { width: 140px; height: auto; }
  .main-nav { position: absolute; top: 61px; right: 0; left: 0; display: none; align-items: stretch; padding: 9px 16px 13px; border-bottom: 1px solid var(--line); background: var(--header-bg); }
  .main-nav.open { display: grid; grid-template-columns: repeat(3, 1fr); gap: 3px 10px; }
  .nav-link { min-height: 38px; justify-content: center; border-radius: 5px; font-size: 12px; }
  .nav-link.active::after { right: 20%; left: 20%; }
  .header-search { width: min(100%, 250px); flex: 1 1 auto; margin-left: auto; }
  .mobile-search { display: none; }
  .page-shell, .footer-main, .footer-bottom { width: min(100% - 32px, 700px); }
  .home-shell { padding-top: 16px; }
  .home-feature-grid { grid-template-columns: 1fr; }
  .feature-card { min-height: 380px; }
  .feature-copy { width: 87%; padding: 28px; }
  .feature-rail { display: grid; grid-template-columns: repeat(3, 1fr); }
  .side-story { display: block; }
  .side-cover { display: block; height: 100px; min-height: auto; }
  .side-story > div { padding: 9px 10px 11px; }
  .side-story h2 { font-size: 14px; }
  .side-story .muted { font-size: 12px; }
  .topic-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .topic-card:last-child { grid-column: 1 / -1; }
  .story-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .article-layout { grid-template-columns: minmax(0, 1fr); }
  .article-layout .article-aside { position: static; grid-column: 1; grid-row: 2; }
  .article-layout .article-main { grid-column: 1; grid-row: 1; }
  .article-layout .related-aside { grid-column: 1; grid-row: 3; }
  .article-aside .article-toc-desktop { display: none; }
  .article-toc-mobile { display: grid; gap: 3px; margin: 0 0 24px; }
  .article-toc-mobile h2 { font-size: 17px; }
  .article-aside .aside-card { display: flex; flex-wrap: wrap; gap: 4px 8px; }
  .article-aside .aside-card h2 { width: 100%; }
  .article-aside .aside-card > a:not(.related-link) { flex: 1 1 42%; }
  .article-aside .aside-card + .aside-card { display: grid; grid-template-columns: 1fr 1fr; }
  .article-aside .aside-card + .aside-card h2 { grid-column: 1 / -1; }
  .article-aside .aside-card + .aside-card p { margin: 0; }
  .related-aside .aside-card { display: block; }
  .related-aside .aside-card h2 { margin-bottom: 5px; }
  .welcome-hero { min-height: 340px; }
  .admin-layout { grid-template-columns: 1fr; }
  .admin-topbar { height: 60px; padding: 0 13px; }
  .admin-menu-toggle { display: inline-grid; width: 32px; height: 32px; border: 0; }
  .admin-topbar .brand { font-size: 21px; }
  .admin-topbar .brand img { width: 32px; height: 32px; }
  .admin-sidebar { position: fixed; z-index: 50; top: 60px; bottom: 0; left: 0; width: 245px; height: auto; transform: translateX(-105%); transition: transform .18s ease; box-shadow: var(--shadow); }
  .admin-sidebar.open { transform: translateX(0); }
  .admin-top-actions { gap: 4px; }
  .admin-top-actions .admin-user { display: none; }
  .admin-top-actions .button { padding-inline: 9px; }
  .admin-main { padding: 20px 16px 45px; }
  .admin-welcome { padding: 13px; }
  .dashboard-grid { grid-template-columns: 1fr; }
  .dashboard-side { grid-template-columns: 1fr 1fr; align-items: start; }
  .article-form { grid-template-columns: minmax(0, 1fr) 250px; }
  .admin-columns { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  body { font-size: 16px; }
  .header-inner { gap: 7px; padding-inline: 9px; }
  .brand { font-size: 21px; }
  .brand img { width: 136px; height: auto; }
  .header-search { width: 37px; height: 37px; flex: 0 0 37px; margin-left: auto; border: 0; background: transparent; }
  .header-search input { position: absolute; width: 1px; height: 1px; padding: 0; opacity: 0; pointer-events: none; }
  .search-submit { width: 37px; height: 37px; border: 1px solid var(--line); border-radius: 50%; font-size: 23px; }
  .header-search.search-open { position: absolute; z-index: 3; right: 10px; left: 10px; width: auto; height: 42px; flex: 1 1 auto; margin-left: 0; background: var(--search-bg); }
  .header-search.search-open input { position: static; width: 100%; height: 40px; flex: 1 1 auto; padding: 0 11px; opacity: 1; pointer-events: auto; }
  .page-shell, .footer-main, .footer-bottom { width: calc(100% - 28px); }
  .home-shell { padding-top: 12px; }
  .feature-card { min-height: 430px; align-items: flex-end; }
  .feature-cover::after { background: linear-gradient(0deg, rgb(3 11 20 / 94%) 0%, rgb(3 11 20 / 76%) 52%, rgb(3 11 20 / 10%) 100%); }
  .feature-copy { width: 100%; padding: 23px 19px; }
  .feature-copy .feature-title { font-size: 34px; }
  .feature-copy > p { font-size: 15px; }
  .byline { gap: 7px 10px; font-size: 12px; }
  .feature-rail { grid-template-columns: 1fr; gap: 8px; }
  .side-story { min-height: 91px; display: grid; grid-template-columns: 31% 1fr; }
  .side-cover { height: auto; min-height: 91px; }
  .side-story > div { padding: 9px 10px; }
  .side-story h2 { margin: 3px 0; font-size: 14px; }
  .side-story .muted { font-size: 12px; }
  .section-block { margin-top: 32px; }
  .section-heading { margin-bottom: 12px; }
  .section-heading h2 { font-size: 21px; }
  .topic-grid { grid-template-columns: 1fr; gap: 10px; }
  .topic-card { min-height: 88px; align-items: center; gap: 13px; padding: 13px 14px; }
  .topic-symbol { width: 44px; height: 44px; border-radius: 13px; }
  .topic-card > span:nth-child(2) { padding-right: 4px; }
  .topic-card strong { margin-bottom: 3px; font-size: 15px; }
  .topic-card small { display: block; font-size: 12px; line-height: 1.4; }
  .topic-arrow { width: 28px; height: 28px; flex-basis: 28px; }
  .story-grid { grid-template-columns: 1fr; gap: 10px; }
  .story-card { display: grid; grid-template-columns: 34% 1fr; }
  .story-cover { min-height: 130px; aspect-ratio: auto; }
  .story-cover .category-pill { bottom: 6px; left: 6px; padding: 3px 6px; font-size: 10px; }
  .story-copy { display: flex; flex-direction: column; justify-content: center; padding: 10px; }
  .story-copy h3 { font-size: 15px; }
  .story-copy p { display: none; }
  .story-meta { margin-top: 8px; font-size: 11px; }
  .welcome-hero { min-height: 380px; grid-template-columns: 1fr; padding: 25px 20px; }
  .welcome-copy h1 { font-size: 49px; }
  .welcome-copy p { font-size: 14px; }
  .welcome-art { min-height: 88px; justify-content: end; }
  .welcome-art img { width: 68px; }
  .footer-main { grid-template-columns: 1fr 1fr; gap: 22px 15px; padding: 25px 0; }
  .footer-brand { grid-column: 1 / -1; }
  .footer-bottom { flex-direction: column; gap: 6px; font-size: 12px; }
  .category-shell, .listing-shell, .info-shell { padding-bottom: 43px; }
  .category-intro { padding: 20px 0 17px; }
  .category-intro h1, .listing-heading h1, .contact-intro h1 { font-size: 37px; }
  .category-feature .feature-card { min-height: 335px; }
  .category-feature .feature-copy { padding: 19px; }
  .category-feature .feature-copy .feature-title { font-size: 30px; }
  .pagination { gap: 5px; margin-top: 20px; }
  .page-link { min-width: 32px; height: 32px; padding-inline: 7px; }
  .large-search { align-items: stretch; }
  .large-search .button { padding-inline: 11px; }
  .breadcrumbs { padding-top: 15px; padding-bottom: 10px; font-size: 12px; }
  .article-shell { padding-bottom: 42px; }
  .article-main > h1 { font-size: 32px; }
  .article-excerpt { font-size: 16px; }
  .article-meta { gap: 8px 12px; font-size: 12px; }
  .article-image { aspect-ratio: 1.35 / 1; }
  .prose { font-size: 16px; line-height: 1.8; }
  .prose h2 { font-size: 23px; }
  .prose h3 { font-size: 19px; }
  .article-share { gap: 6px; }
  .article-share strong { width: 100%; }
  .about-hero { min-height: auto; grid-template-columns: 1fr; padding: 23px 19px; }
  .about-hero h1 { font-size: 42px; }
  .about-hero p { font-size: 13px; }
  .about-mark { min-height: 86px; justify-content: end; }
  .about-mark img { width: 68px; }
  .values-grid { grid-template-columns: 1fr; }
  .value-card { padding: 17px; }
  .value-card h2 { font-size: 19px; }
  .value-wide { grid-column: auto; }
  .value-list { grid-template-columns: 1fr 1fr; gap: 7px; }
  .value-list p { margin: 4px 0; font-size: 12px; }
  .legal-list section { grid-template-columns: 41px 1fr; gap: 12px; padding: 12px; }
  .legal-list section > span { width: 38px; height: 38px; font-size: 11px; }
  .legal-list h2 { font-size: 14px; }
  .legal-list p { font-size: 12px; }
  .contact-layout { grid-template-columns: 1fr; }
  .contact-card, .contact-aside { padding: 16px; }
  .admin-topbar { padding: 0 7px; gap: 5px; }
  .admin-topbar .brand { gap: 4px; font-size: 17px; letter-spacing: -1px; }
  .admin-topbar .brand img { width: 29px; height: 29px; }
  .admin-label { padding-left: 7px; font-size: 11px; }
  .admin-top-actions .button { min-height: 34px; padding-inline: 8px; font-size: 11px; }
  .admin-page-heading h1 { font-size: 25px; }
  .admin-welcome { align-items: flex-start; flex-direction: column; }
  .stat-grid { grid-template-columns: repeat(2, 1fr); gap: 7px; }
  .stat-card { min-height: 70px; gap: 8px; padding: 8px; }
  .stat-icon { width: 33px; height: 33px; font-size: 14px; }
  .stat-card > div span { font-size: 11px; }
  .stat-card > div strong { font-size: 19px; }
  .dashboard-grid { gap: 9px; }
  .dashboard-side { grid-template-columns: 1fr; }
  .admin-panel { padding: 12px; }
  .dashboard-grid .admin-table th:nth-child(2), .dashboard-grid .admin-table td:nth-child(2), .dashboard-grid .admin-table th:nth-child(4), .dashboard-grid .admin-table td:nth-child(4) { display: none; }
  .dashboard-grid .admin-table td strong, .dashboard-grid .admin-table td small { max-width: 140px; }
  .filter-form { flex-basis: 100%; }
  .filter-form input { flex-basis: 100%; }
  .filter-form select { min-width: calc(50% - 4px); flex: 1; }
  .admin-toolbar > .button { width: 100%; }
  .status-summary { gap: 6px 11px; }
  .article-table-panel .table-wrap { display: none; }
  .mobile-article-list { display: grid; gap: 8px; }
  .mobile-admin-article { padding: 11px; border: 1px solid #17344b; border-radius: 7px; background: #061626; }
  .mobile-admin-article > div { display: flex; align-items: center; gap: 8px; }
  .mobile-admin-article h2 { margin: 7px 0 3px; font-size: 14px; }
  .mobile-admin-article p { margin: 0 0 7px; color: var(--muted); font-size: 12px; }
  .mobile-admin-article .button { min-height: 36px; font-size: 12px; }
  .editor-actions-top { align-items: flex-start; flex-direction: column; gap: 3px; }
  .article-form { grid-template-columns: 1fr; }
  .editor-side-column { grid-row: 1; }
  .editor-main-column { grid-row: 2; }
  .editor-side-column > .admin-panel { gap: 9px; }
  .editor-side-column > .admin-panel:not(.publish-panel):not(.danger-panel) { grid-template-columns: 1fr; }
  .editor-toolbar { gap: 2px; padding: 7px; }
  .editor-toolbar button { padding-inline: 5px; }
  .editor-toolbar select { max-width: 100px; }
  .rich-editor { min-height: 300px; padding: 13px; }
  .editor-foot { flex-direction: column; gap: 2px; }
  .seo-fields { grid-template-columns: 1fr; }
  .upload-panel { grid-template-columns: 1fr; }
  .upload-form { grid-template-columns: 1fr; }
  .upload-form .button { grid-column: auto; }
  .media-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .settings-grid { grid-template-columns: 1fr; }
  .settings-grid .settings-full { grid-column: auto; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* Reference-matched brand lockup, page heroes, and editorial iconography */
.brand img { width: 164px; height: auto; border-radius: 0; }
.admin-topbar .brand img { width: 146px; height: auto; }
.admin-topbar .brand img.brand-mark { width: 42px; height: 42px; }
.sidebar-footer .brand img { width: 132px; height: auto; }
.sidebar-footer .brand img.brand-mark { width: 36px; height: 36px; }
.login-brand .brand img { width: 152px; height: auto; }
.login-brand .brand img.brand-mark { width: 44px; height: 44px; }
.admin-topbar .brand-wordmark { font-size: 22px; }
.sidebar-footer .brand-wordmark { font-size: 19px; }
.login-brand .brand-wordmark { font-size: 22px; }
.admin-topbar .brand { font-size: inherit; letter-spacing: normal; }
.sidebar-footer .brand { font-size: inherit; }
.settings-logo img { width: 72px; height: 72px; border-radius: 0; }
.article-share a, .article-share button { display: inline-flex; align-items: center; gap: 6px; }
.article-share svg { display: block; }
.not-found-icon { width: 66px; height: 66px; display: grid; place-items: center; margin: 5px 0 14px; border: 1px solid #155795; border-radius: 18px; color: #32a8ff; background: #0b2d4d; }

:root[data-theme="light"] .empty-state,
:root[data-theme="light"] .welcome-hero,
:root[data-theme="light"] .welcome-art,
:root[data-theme="light"] .cover-placeholder {
  border-color: var(--line);
  background: var(--surface);
}
:root[data-theme="light"] .welcome-copy p { color: var(--article-copy); }
:root[data-theme="light"] .value-card,
:root[data-theme="light"] .contact-card,
:root[data-theme="light"] .contact-details {
  border-color: var(--line);
  background: var(--surface);
}
:root[data-theme="light"] .value-card h2,
:root[data-theme="light"] .value-item h3,
:root[data-theme="light"] .contact-card h2,
:root[data-theme="light"] .contact-details h2,
:root[data-theme="light"] .contact-form-grid label,
:root[data-theme="light"] .contact-method h3,
:root[data-theme="light"] .contact-method p {
  color: var(--text);
}
:root[data-theme="light"] .value-card p,
:root[data-theme="light"] .value-item p { color: var(--muted); }
:root[data-theme="light"] .value-item,
:root[data-theme="light"] .contact-method { border-color: var(--line); }
:root[data-theme="light"] .main-nav { background: var(--header-bg); }
:root[data-theme="light"] .feature-copy .feature-title,
:root[data-theme="light"] .feature-copy .feature-title a { color: #f3f7fd; }
:root[data-theme="light"] .feature-copy .eyebrow { color: #27d3e8; }
:root[data-theme="light"] .feature-copy .byline { color: #c0cede; }
:root[data-theme="light"] .button-quiet,
:root[data-theme="light"] .button-quiet:hover { color: var(--text); }
:root[data-theme="light"] .about-hero,
:root[data-theme="light"] .contact-hero {
  border-color: var(--line);
  background: var(--surface-raised);
}
:root[data-theme="light"] .about-hero-shade,
:root[data-theme="light"] .contact-hero-shade {
  background: linear-gradient(90deg, #f4f7fb 0%, #f4f7fb 35%, rgb(244 247 251 / 92%) 47%, rgb(244 247 251 / 36%) 74%, rgb(244 247 251 / 6%) 100%), linear-gradient(0deg, rgb(234 240 246 / 35%), transparent 40%);
}
:root[data-theme="light"] .about-hero h1,
:root[data-theme="light"] .contact-hero h1 { color: var(--text); }
:root[data-theme="light"] .about-hero p,
:root[data-theme="light"] .contact-hero p { color: var(--muted); }
:root[data-theme="light"] .about-hero .eyebrow,
:root[data-theme="light"] .contact-hero .eyebrow { color: var(--blue); }
:root[data-theme="light"] .category-hero-icon {
  border-color: #c4d7e6;
  color: var(--blue);
  background: linear-gradient(145deg, #ffffff, #e6eef6);
  box-shadow: 0 12px 34px rgb(22 42 62 / 8%);
}
:root[data-theme="light"] .value-icon,
:root[data-theme="light"] .contact-method-icon,
:root[data-theme="light"] .empty-mark {
  border-color: #c4dced;
  color: var(--blue);
  background: #edf5fb;
}
:root[data-theme="light"] .legal-list section > span {
  border-color: #c4dced;
  color: var(--blue);
  background: #edf5fb;
}

@media (max-width: 1120px) {
  .header-inner { gap: 14px; }
  .brand img { width: 146px; }
  .main-nav { gap: 11px; }
  .nav-link { font-size: 12px; }
  .header-search { flex-basis: 210px; }
  .footer-main { grid-template-columns: 1.15fr .8fr 1.15fr 1fr; gap: 20px; }
  .footer-brand { padding-right: 15px; }
  .footer-categories { padding-right: 15px; }
  .about-hero-inner, .contact-hero-inner { width: min(1320px, calc(100% - 64px)); }
  .value-item { gap: 9px; padding-inline: 10px; }
  .value-icon { width: 46px; height: 46px; }
}

@media (max-width: 820px) {
  .brand img { width: 140px; }
  .admin-topbar .brand img { width: 132px; height: auto; }
  .sidebar-footer .brand img { width: 126px; height: auto; }
  .footer-main { grid-template-columns: 1fr 1fr; gap: 17px 20px; }
  .footer-brand { grid-column: 1 / -1; padding: 0 0 14px; border-right: 0; border-bottom: 1px solid var(--line); }
  .footer-categories { padding-right: 0; border-right: 0; }
  .footer-follow { grid-column: 1 / -1; padding-top: 12px; border-top: 1px solid var(--line); }
  .about-hero, .contact-hero { min-height: 325px; }
  .about-hero-inner, .contact-hero-inner { width: min(100% - 40px, 700px); }
  .about-hero-photo, .contact-hero-photo { width: 70%; }
  .about-hero-shade, .contact-hero-shade { background: linear-gradient(90deg,#03111e 0%,rgb(3 17 30 / 96%) 32%,rgb(3 17 30 / 78%) 53%,rgb(3 17 30 / 15%) 100%); }
  .value-items { grid-template-columns: 1fr 1fr; row-gap: 12px; }
  .value-item:nth-child(2) { border-right: 0; }
  .value-item:nth-child(3) { padding-left: 0; }
  .category-hero-icon { width: 78px; height: 78px; }
  .contact-layout { grid-template-columns: 1fr; }
}

@media (max-width: 560px) {
  .header-inner { gap: 7px; padding-inline: 9px; }
  .brand img { width: 140px; }
  .header-search { flex: 0 0 37px; }
  .header-search.search-open { flex: 1 1 auto; }
  .theme-toggle { width: 38px; height: 38px; }
  .footer-main, .footer-bottom { width: calc(100% - 28px); }
  .footer-main { grid-template-columns: 1fr 1fr; gap: 15px 14px; padding: 22px 0 17px; }
  .footer-brand .brand img { width: 164px; }
  .footer-brand p { margin-left: 34px; font-size: 12px; }
  .footer-categories > div { column-gap: 8px; }
  .social-links { gap: 8px; }
  .social-icon { width: 31px; height: 31px; }
  .footer-bottom { align-items: flex-start; gap: 8px; font-size: 12px; }
  .footer-bottom nav { flex-wrap: wrap; gap: 6px; }
  .about-hero, .contact-hero { min-height: 350px; }
  .about-hero-inner, .contact-hero-inner { width: calc(100% - 38px); }
  .about-hero-photo, .contact-hero-photo { width: 100%; opacity: .58; }
  .about-hero-shade, .contact-hero-shade { background: linear-gradient(90deg,rgb(3 17 30 / 98%) 0%,rgb(3 17 30 / 89%) 48%,rgb(3 17 30 / 65%) 100%),linear-gradient(0deg,rgb(3 17 30 / 35%),transparent); }
  .about-hero h1, .contact-hero h1 { font-size: 36px; }
  .about-hero p, .contact-hero p { font-size: 13px; }
  .about-content { padding-bottom: 10px; }
  .values-grid { grid-template-columns: 1fr; gap: 10px; margin-top: 12px; }
  .value-card { padding: 17px; }
  .value-card h2 { font-size: 18px; }
  .value-card p { font-size: 12px; }
  .value-wide { grid-column: auto; }
  .value-items { grid-template-columns: 1fr; row-gap: 0; margin-top: 8px; }
  .value-item, .value-item:nth-child(2), .value-item:nth-child(3) { min-height: 66px; padding: 8px 0; border-right: 0; border-bottom: 1px solid #123553; }
  .value-item:last-child { border-bottom: 0; }
  .value-icon { width: 42px; height: 42px; }
  .value-item h3 { font-size: 12px; }
  .value-item p { font-size: 12px; }
  .category-intro { align-items: flex-start; }
  .category-hero-icon { width: 58px; height: 58px; border-radius: 14px; }
  .category-hero-icon svg { width: 30px; height: 30px; }
  .contact-content { padding-top: 10px; }
  .contact-card, .contact-details { padding: 15px; }
  .contact-form-grid { grid-template-columns: 1fr; gap: 11px; }
  .contact-form-grid .form-full { grid-column: auto; }
  .contact-form-grid input, .contact-form-grid select { min-height: 43px; }
  .contact-method { gap: 10px; }
  .contact-method-icon { width: 41px; height: 41px; }
  .not-found-icon { width: 56px; height: 56px; }
}

.nav-signout { display: flex; align-items: center; margin: 0; }
.nav-signout button.nav-link { padding: 0; border: 0; background: transparent; font: inherit; cursor: pointer; }
.nav-signin { color: var(--blue-bright); }
.feature-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-top: 19px; }
.feature-actions .button { margin-top: 0; }
.bookmark-form { display: inline-flex; margin: 0; }
.bookmark-action { min-height: 34px; display: inline-flex; align-items: center; justify-content: center; gap: 7px; padding: 0 10px; border: 1px solid var(--line-bright); border-radius: 7px; color: var(--text); background: var(--surface); font: inherit; font-size: 12px; font-weight: 700; white-space: nowrap; cursor: pointer; }
.bookmark-action:hover, .bookmark-action.is-saved { border-color: var(--blue); color: var(--blue-bright); background: var(--surface-raised); }
.feature-actions .bookmark-action { border-color: rgb(204 222 241 / 35%); color: #f3f7fd; background: rgb(5 19 34 / 70%); }
.feature-actions .bookmark-action:hover, .feature-actions .bookmark-action.is-saved { border-color: #51aaff; color: #fff; background: rgb(8 68 119 / 85%); }
.story-copy > .bookmark-form { margin-top: 10px; }
.article-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 20px; }
.article-actions .article-meta { margin: 0; }
.signin-prompt { padding: 17px; border: 1px solid var(--line); border-radius: 8px; background: var(--surface); }
.signin-prompt p, .signed-in-note { color: var(--muted); font-size: 13px; }
.signin-prompt .button { margin-top: 6px; }
.settings-group { padding-top: 9px; border-top: 1px solid var(--line); }
.settings-group h3 { margin: 0 0 4px; font-size: 16px; }
.settings-group p { margin: 0; font-size: 12px; }
.settings-group code { overflow-wrap: anywhere; color: var(--cyan); }
.settings-secret-field { display: grid; align-content: start; gap: 5px; }
.secret-clear { display: flex !important; grid-template-columns: auto 1fr !important; align-items: center; gap: 7px !important; margin-top: 1px; color: var(--muted) !important; font-size: 11px !important; }
.secret-clear input { width: 15px; min-height: 15px; }
:root[data-theme="light"] .bookmark-action { color: var(--text); }
:root[data-theme="light"] .feature-actions .bookmark-action { color: #f3f7fd; }

@media (max-width: 900px) {
  .nav-signout { min-height: 38px; justify-content: center; }
  .nav-signout button.nav-link { min-height: 38px; }
}

@media (max-width: 560px) {
  .backup-preview-dialog { width: 100vw; max-height: 100dvh; margin: 0; border-radius: 0; }
  .backup-preview-shell { max-height: 100dvh; }
  .backup-preview-header { padding: 14px; }
  .backup-preview-actions { padding-inline: 14px; }
  .backup-preview-actions > span { width: 100%; margin-left: 0; }
  .backup-preview-notice { padding-inline: 14px; }
  .backup-preview-content { padding: 10px 12px 14px; }
  .backup-preview-editor-form { grid-template-columns: 1fr; }
  .backup-preview-article-editor { margin-left: 0; }
  .backup-preview-footer { padding: 10px 12px; }
  .backup-preview-footer .button { flex: 1; }
}