/* Noir / Signal — monochrome surfaces with a single electric-lime accent. */
.mobile-feature {display:flex;align-items:center;gap:24px;margin:0 0 32px;padding:26px 28px;background:linear-gradient(115deg,#1d2114,#141414 65%);border:1px solid #41462e;border-radius:12px;}
.mobile-feature-mark {position:relative;flex:none;width:43px;height:70px;border:2px solid #ddff55;border-radius:10px;transform:rotate(-8deg);}
.mobile-feature-mark:before {content:'';position:absolute;top:6px;left:12px;width:15px;height:3px;background:#ddff55;border-radius:5px;}
.mobile-feature-mark span {position:absolute;inset:20px 6px 17px;background:#ddff5522;border:1px solid #788944;border-radius:4px;}
.mobile-feature-mark i {position:absolute;bottom:7px;left:12px;width:15px;height:3px;background:#ddff55;border-radius:4px;}
.mobile-feature-copy {flex:1;min-width:0;}
.topic-kicker {font-size:9px;letter-spacing:2px;color:#ddff55;}
.mobile-feature h2 {font-size:23px;font-weight:600;margin:9px 0;color:#f3f3ef;}
.mobile-feature p {font-size:12px;line-height:1.8;color:#aaa;margin:0;}
.topic-enter {padding:12px 16px;border:1px solid #ddff55;border-radius:6px;color:#111;background:#ddff55;font-size:12px;white-space:nowrap;}
.topic-enter span {margin-left:12px;}
.topic-enter:hover {background:#ebff98;}
.mobile-topic {border:1px solid #35382b;background:#151710;padding:23px;border-radius:10px;margin:0 0 24px;}
.topic-note>span {font-size:17px;color:#f3f3ef;font-weight:600;}
.topic-note p {font-size:12px;color:#aaa;line-height:1.9;margin:8px 0 17px;}
.mobile-groups {display:flex;flex-wrap:wrap;gap:8px;}
.mobile-groups button {border:1px solid #45483b;background:transparent;color:#ccc;font-size:12px;padding:9px 13px;border-radius:5px;}
.mobile-groups button:hover {border-color:#ddff55;}
.mobile-groups button.active {background:#ddff55;border-color:#ddff55;color:#111;}
.topic-sources {display:flex;flex-wrap:wrap;gap:8px 16px;color:#94988c;font-size:10px;margin:18px 0 0;}
.topic-sources a {color:#c1c7ae;text-decoration:underline;text-underline-offset:3px;}
@media(max-width:680px){.mobile-feature{gap:17px;flex-wrap:wrap;padding:21px 18px;margin-bottom:23px}.mobile-feature h2{font-size:21px}.mobile-feature p{font-size:11px}.topic-enter{width:100%;text-align:left;display:flex;justify-content:space-between}.mobile-topic{padding:18px}.mobile-groups button{font-size:11px;padding:9px 10px}}
:root {
  color-scheme: dark;
  --bg: #080808;
  --paper: #141414;
  --ink: #f4f4f1;
  --muted: #959595;
  --line: #292929;
  --green: #ddff55;
  --mint: #262b1b;
  --purple: #c7c7c7;
  --accent: #ddff55;
  --accent-ink: #11140a;
  --surface: #111111;
  --raised: #1a1a1a;
  --text-secondary: #aeaeae;
  background: var(--bg);
  color: var(--ink);
}
::selection { background: var(--accent); color: #090909; }
body { background: var(--bg); }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {
  outline: 2px solid var(--accent); outline-offset: 4px;
}
.skip-link { background: var(--accent); color: #111; }
.sidebar { background: #0d0d0d; border-color: var(--line); }
.brand { color: #fff; }
.brand-mark { background: var(--accent); color: #0b0b0b; border-radius: 8px; }
.brand small { color: #939393; }
.side-label { color: #828282; }
.nav-item { color: #b9b9b9; border-radius: 5px; }
.nav-item > span:last-child { color: #858585; }
.nav-item:hover { background: #1a1a1a; color: #fff; }
.nav-item.active { background: #222718; color: var(--accent); box-shadow: inset 2px 0 0 var(--accent); }
.nav-item.active > span:last-child { color: var(--accent); }
#category-nav { scrollbar-color: #3b3b3b transparent; }
#category-nav .nav-item .nav-number { color: #737373; }
#category-nav .nav-item.active .nav-number { color: #c3d97b; }
.side-foot { color: #989898; border-color: var(--line); }
.side-foot small { color: #777; }
.live-dot { background: var(--accent); }
.topbar { background: #0d0d0d; border-color: var(--line); }
.top-label, .edition { color: #8a8a8a; }
.top-divider { color: #454545; }
.topbar strong { color: #d6d6d6; }
.subtle-btn { border-color: #3a3a3a; color: #dedede; background: transparent; }
.subtle-btn:hover { border-color: #777; background: #202020; color: #fff; }
.eyebrow { color: #a4a4a4; }
.eyebrow > span { background: var(--accent); box-shadow: 0 0 0 4px #ddff550d; }
h1 { color: #f8f8f5; font-weight: 650; letter-spacing: -1.8px; }
h1 em { color: #f8f8f5; text-decoration: underline; text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 10px; }
.hero-copy > p { color: #a4a4a4; }
.hero-stats { color: #969696; }
.hero-stats b { color: #f0f0ed; font-variant-numeric: tabular-nums; }
.hero-stats span:last-child b { color: var(--accent); }
.hero-stats i { background: #3b3b3b; }
.art-label { color: #8b8b8b; }
.art-label span { color: #626262; }
.art-window { background: #151515; border-color: #414141; box-shadow: 0 20px 50px #0008; }
.art-top { background: #1b1b1b; border-color: #333; }
.art-top > span { background: #575757; }
.art-top i { color: #8c8c8c; }
.art-side { border-color: #333; }
.art-side > * { background: #353535; }
.art-side b { background: var(--accent); }
.art-breadcrumb { color: #909090; }
.art-tabs { color: #a7a7a7; border-color: #383838; }
.art-tabs b { color: var(--accent); }
.art-tabs b:after { background: var(--accent); }
.art-tiles > div { background: #1e1e1e; border-color: #353535; }
.art-tiles small, .art-tiles > div > span { color: #a4a4a4; }
.art-switch { background: var(--accent); }
.art-switch i { background: #161616; }
.art-progress { background: #414141; }
.art-progress i { background: #e7e7e7; }
.art-button { background: var(--accent); color: #111; font-weight: 650; }
.callout { background: #202020; border-color: #484848; color: #eee; box-shadow: 0 7px 20px #0006; }
.callout i { color: #a2a2a2; }
.callout-two { color: var(--accent); border-color: #6b7741; }
.art-caption { color: #808080; }
.search-box { background: #151515; border-color: #3b3b3b; box-shadow: 0 6px 16px #0004; border-radius: 8px; }
.search-box > span { color: #a7a7a7; }
.search-box input { color: #f2f2f2; }
.search-box input::placeholder { color: #8d8d8d; }
.search-box:focus-within { border-color: var(--accent); box-shadow: 0 0 0 3px #ddff5512; }
.search-box kbd { background: #222; border-color: #3b3b3b; color: #b2b2b2; }
.quick-filters > span { color: #929292; }
.quick-filters button { color: #b5b5b5; border-color: #353535; }
.quick-filters button:hover, .quick-filters button.active { color: var(--accent); border-color: #656f3a; background: #252b18; }
.catalog-heading { border-color: #292929; }
.section-eyebrow { color: #888; }
h2 { color: #f4f4f1; }
h2 > span { background: #242424; color: #bebebe; }
.catalog-heading p { color: #a0a0a0; }
.view-switch { background: #111; border-color: #353535; }
.view-switch button { color: #919191; }
.view-switch button.active { background: #343434; color: #f4f4f4; box-shadow: none; }
.card { background: #121212; border-color: #303030; border-radius: 8px; }
.card:hover { border-color: #727a50; box-shadow: 0 12px 30px #0006; transform: translateY(-3px); }
.card-visual, .card:nth-child(3n+2) .card-visual, .card:nth-child(3n) .card-visual { background: #181818; border-color: #303030; padding: 5px; }
.card-category { color: #a3a3a3; }
.card-category:before { background: #858585; }
.card h3 { color: #f0f0ed; }
.card-english { color: #999; }
.card-desc { color: #b3b3b3; }
.card-bottom { border-color: #292929; color: #909090; }
.card-bottom span:last-child { color: var(--accent); }
.favorite-btn { color: #777; }
.favorite-btn:hover, .favorite-btn.saved { color: var(--accent); }
.cards.list .card-visual { border-color: #303030; }
.pagination button { background: #141414; border-color: #393939; color: #c6c6c6; }
.pagination button:hover:not(:disabled) { border-color: #8c8c8c; }
.pagination button.active { background: var(--accent); color: #111; border-color: var(--accent); }
.pagination .page-summary { color: #949494; }
.empty, .empty p { color: #999; }
.empty > span { color: #767676; }
.empty h3 { color: #eee; }
.compare-card { background: #121212; border-color: #303030; }
.compare-card p { color: #b2b2b2; }
.compare-visuals > div { background: #181818; }
.compare-visuals small { color: #b8b8b8; }
.compare-card button { background: #242424; color: #e5e5e5; border: 1px solid #393939; }
.compare-card button:hover { color: var(--accent); border-color: #788447; }
footer { border-color: #2c2c2c; color: #939393; }
footer .footer-brand { color: #e3e3e3; }
footer .footer-brand span { color: #929292; }
footer a { color: #b0b0b0; }
footer a:hover { color: var(--accent); }
dialog { background: #121212; border-color: #454545; box-shadow: 0 24px 100px #000c; }
dialog::backdrop { background: #000b; backdrop-filter: blur(8px); }
.detail-head { color: #a5a5a5; border-color: #333; }
.icon-btn:hover { background: #2b2b2b; }
.detail-image { background: #181818; border-color: #363636; }
.detail-image > span { color: #959595; }
.detail-en { color: #aaa; }
.detail-copy h3 { color: var(--accent); }
.detail-copy p { color: #d0d0d0; }
.detail-note { background: #24271a; color: #d1d7b6!important; border-left: 2px solid var(--accent); border-radius: 3px; }
.primary-btn { background: var(--accent); color: #131609; border-color: var(--accent); font-weight: 650; }
.primary-btn:hover { background: #eaff91; border-color: #eaff91; }
.demo-section { border-color: #363636; }
.demo-section > p { color: #a1a1a1; }
.demo-section h3 > span { color: #999!important; }
.demo-stage { background: #181818; border-color: #3b3b3b; color: #dedede; }
.demo-stage input:not([type=checkbox]):not([type=radio]):not([type=range]), .demo-stage select, .demo-stage textarea { background: #202020; color: #efefef; border-color: #555; }
.demo-stage input::placeholder, .demo-stage textarea::placeholder { color: #9c9c9c; }
.demo-stage label { color: #d1d1d1; }
.demo-stage button { background: #252525; color: #e5e5e5; border-color: #505050; }
.demo-stage button:hover { border-color: #929292; }
.demo-tabs { border-color: #454545; }
.demo-tabs button { border: 0; border-bottom: 2px solid transparent; background: transparent; }
.demo-tabs button[aria-selected=true] { color: var(--accent); border-bottom-color: var(--accent); }
.demo-tab-panel { background: #222; color: #d6d6d6; }
.demo-switch { background: #626262!important; }
.demo-switch[aria-checked=true] { background: var(--accent)!important; }
.demo-switch i { background: #111; }
.demo-options input, .demo-stage progress, .demo-stage .slider-row input { accent-color: var(--accent); }
.demo-stage details { border-color: #444; }
.demo-stage details p, .demo-inline-result { color: #b4b4b4; }
.demo-menu { background: #252525; border-color: #555; box-shadow: 0 8px 24px #0007; }
.demo-tooltip [role=tooltip] { background: #f0f0ee; color: #111; }
.demo-stage .selected { background: var(--accent); color: #111; border-color: var(--accent); }
.demo-chips button { background: #303623; color: var(--accent); border-color: #525d36; }
.demo-stage .error-text { color: #ff8992; }
.demo-stage .rating-btn { background: transparent; color: #737373; border: 0; }
.demo-stage .rating-btn.selected { background: transparent; color: var(--accent); }
.demo-stage > p[style] { color: #adadad!important; }
#demo-toast { background: #303821!important; color: #e4f2ba; }
.toast { background: #f0f0ed; color: #111; box-shadow: 0 8px 32px #0009; border: 1px solid #fff; }
.scrim { background: #000a; }
@media print {
  :root { color-scheme: light; }
  body, .page, main { background: white; color: black; }
  .card, .compare-card { background: white; border-color: #aaa; }
  .card h3, h2, .card-desc, .card-english, .card-category, .card-bottom { color: #222; }
  .card-bottom span:last-child { color: #222; }
}