/* design-daily ↔ shared ix contract (news-daily site/assets/ix/README.md, docs/THEMES.md「站点交互层」).
   1) map this site's theme tokens to the --ix-* names shared variants use (every theme: tokens come from themes/<id>/theme.json);
   2) small per-variant DOM adaptations for this site's markup (hooks only; never .grid/.card). Always loaded; no visual effect by default. */
:root{--ix-bg:var(--bg);--ix-surface:var(--card);--ix-ink:var(--fg);--ix-muted:var(--mu);--ix-line:var(--line);--ix-accent:var(--accent);--ix-on-accent:var(--on-accent);--ix-radius:var(--radius);--ix-font-d:var(--font-d);--ix-font:var(--font);--ix-per:2}
/* topbar/dock: the nav hook is a display:contents wrapper here → give it a box only while the dock is on; nav.js hover pill steps aside (the dock magnifies instead) */
html[data-ix-topbar="dock"] .top .nls{display:inline-flex;align-items:center}
html[data-ix-topbar="dock"] .top .nav-hl{display:none}
html[data-ix-topbar="dock"] .top .nls a::after,html[data-ix-topbar="dock"] .top .nls .nsearch::after{display:none}
@media (max-width:640px){html[data-ix-topbar="dock"] .top .nls{display:contents}}
/* topbar/dock on desktop: the tray must still read as separate chips (搜索 · 归档 · 收藏), not one merged button →
   each control is its own chip (padding + pill radius + faint fill) with a visible gap; hover/focus tint per chip; current = accent (dock.css) */
@media (min-width:641px){
html[data-ix-topbar="dock"] .top .nls{gap:4px}
html[data-ix-topbar="dock"] .top .nls>a{height:28px;padding:0 12px;border-radius:999px;transition:background-color .2s,color .2s}
html[data-ix-topbar="dock"] .top .nls>a:not([aria-current]){background:color-mix(in srgb,var(--fg) 6%,transparent)}
html[data-ix-topbar="dock"] .top .nls>a:not([aria-current]):hover,html[data-ix-topbar="dock"] .top .nls>a:not([aria-current]):focus-visible{background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--fg)}
html[data-ix-topbar="dock"] .top .nls>a:focus-visible{outline:2px solid var(--accent);outline-offset:1px}
html[data-ix-topbar="dock"] .top .nls>.nsearch{height:28px;padding:0 12px;border-radius:999px;background:color-mix(in srgb,var(--fg) 6%,transparent);transition:background-color .2s,color .2s}
html[data-ix-topbar="dock"] .top .nls>.nsearch:hover,html[data-ix-topbar="dock"] .top .nls>.nsearch:focus-visible{background:color-mix(in srgb,var(--accent) 16%,transparent);color:var(--fg);outline:2px solid var(--accent);outline-offset:1px}
}
/* topbar/catalog: black banner → hover pill / underline in white-on-black terms */
html[data-ix-topbar="catalog"] .top .nav-hl{background:#222;box-shadow:none}
html[data-ix-topbar="catalog"] .top a:not(.logo)::after,html[data-ix-topbar="catalog"] .top .nsearch::after{background:#e91d2a}
html[data-ix-topbar="catalog"] .top .nsearch:hover,html[data-ix-topbar="catalog"] .top .nsearch.hl,html[data-ix-topbar="catalog"] .top .nsearch:focus-visible{color:#fff;background:#222}
html[data-ix-topbar="catalog"] .top .favcount{background:#fff;color:#000}
html[data-ix-topbar="catalog"] .top .sync{color:#fcc20f}
/* toast/island: keep the error tint of copy.js toasts */
html[data-ix-toast="island"] .dd-toast.bad{background:#b91c1c;color:#fff}
@media (prefers-reduced-motion:reduce){html[data-ix-topbar="dock"] .top .nls a,html[data-ix-topbar="dock"] .top .nls .nsearch{transition:none;transform:none!important}}
html.dd-rm[data-ix-topbar="dock"] .top .nls .nsearch{transform:none!important}