:root {
    color-scheme: dark;
    --bg: #0F0B14;
    --surface: #18131F;
    --surface-2: #211A2B;
    --surface-3: #2A2136;
    --glass: rgba(15, 11, 20, .84);
    --border: #2C2438;
    --border-strong: #3E3350;
    --text: #F3EEF6;
    --muted: #AEA3BD;
    --faint: #8B819B;
    --gold: #FFC93C;
    --gold-soft: #FFE08A;
    --orange: #FF9A3D;
    --rose: #FF5C93;
    --pink: #FF4FD8;
    --violet: #C18CFF;
    --cyan: #3DE8FF;
    --mint: #2EF5A6;
    --red: #FF6B6B;
    --link: #FFCE5C;
    --sec: var(--gold);
    --on-gold: #231A05;
    --hex-grad: linear-gradient(110deg, #FFE27A 0%, #FFC93C 22%, #FF9A3D 48%, #FF5C93 74%, #E64FE6 100%);
    --gold-grad: linear-gradient(120deg, #FFF1C2 0%, #FFD54A 40%, #FF9A3D 78%, #FF6B8A 100%);
    --btn-grad: linear-gradient(120deg, #FFD54A 0%, #FFB02E 50%, #FF8A3D 100%);
    --pls-grad: linear-gradient(110deg, #3DE8FF 0%, #6E8BFF 35%, #A05CFF 65%, #E64FE6 100%);
    --px-grad: linear-gradient(110deg, #2EF5A6 0%, #3DE8FF 100%);
    --sec-grad: var(--hex-grad);
    --hero-grad: linear-gradient(150deg, #2A1F33 0%, #1B1523 55%, #2B1A26 100%);
    --card-grad: linear-gradient(160deg, rgba(255, 255, 255, .035) 0%, rgba(255, 255, 255, 0) 55%);
    --glow-1: rgba(255, 79, 216, .13);
    --glow-2: rgba(255, 201, 60, .11);
    --glow-3: rgba(160, 92, 255, .10);
    --shadow: 0 .5rem 1.75rem rgba(0, 0, 0, .35);
    --shadow-card: 0 4px 1.125rem rgba(0, 0, 0, .22);
    --radius: 1.125rem;
    --radius-sm: .75rem;
    --font-body: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --font-head: Inter, system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
    --font-mono: "JetBrains Mono", ui-monospace, Consolas, monospace;
    --max: 75rem;
    --appbar-h: 7.4rem;
    --glow-gold: 255, 201, 60;
    --glow-orange: 255, 154, 61;
    --glow-pink: 255, 92, 147;
    --glow-cyan: 61, 232, 255;
    --grid-line: rgba(var(--glow-gold), .055);
}
@media (min-width: 1440px) {
    :root { --max: 80rem; }
}
@media (min-width: 1921px) {
    html { font-size: clamp(100%, calc(100% + (min(100vw, 177.78vh) - 1920px) * .00625), 125%); }
}
@media (min-width: 2400px) and (min-aspect-ratio: 2/1) {
    :root { --max: 92rem; }
}
@media (min-width: 3000px) {
    :root { --max: 96rem; }
}
@media (min-width: 900px) and (max-width: 1151.98px) {
    :root { --appbar-h: 9.9rem; }
}

[data-theme="light"] {
    color-scheme: only light;
    --bg: #FBF7F1;
    --surface: #FFFFFF;
    --surface-2: #F6EFE5;
    --surface-3: #EFE5D7;
    --glass: rgba(251, 247, 241, .88);
    --border: #EADFD0;
    --border-strong: #D9CAB5;
    --text: #1E1724;
    --muted: #5E5468;
    --faint: #6B6176;
    --gold: #8A5A00;
    --gold-soft: #A86A00;
    --orange: #A3470A;
    --rose: #B0124E;
    --pink: #A8005F;
    --violet: #6D00D9;
    --cyan: #006B8F;
    --mint: #00704A;
    --red: #C8102E;
    --link: #9A4A00;
    --hero-grad: linear-gradient(150deg, #FFF6E6 0%, #FFFFFF 55%, #FFEFF5 100%);
    --card-grad: linear-gradient(160deg, rgba(255, 201, 60, .06) 0%, rgba(255, 255, 255, 0) 55%);
    --gold-grad: linear-gradient(120deg, #B26B00 0%, #C2410C 55%, #B0124E 100%);
    --glow-1: rgba(255, 79, 216, .07);
    --glow-2: rgba(255, 201, 60, .14);
    --glow-3: rgba(160, 92, 255, .05);
    --shadow: 0 .5rem 1.625rem rgba(80, 50, 20, .10);
    --shadow-card: 0 3px .875rem rgba(80, 50, 20, .07);
    --grid-line: rgba(138, 90, 0, .07);
}

body.sec-pulsechain, body.sec-learn, body.sec-timeline { --sec: var(--cyan); --sec-grad: var(--pls-grad); }
body.sec-pulsex { --sec: var(--mint); --sec-grad: var(--px-grad); }
body.sec-memes { --sec: var(--pink); }
body.sec-richard-heart { --sec: var(--violet); }
body.sec-security { --sec: var(--red); }

html { scroll-behavior: smooth; scroll-padding-top: var(--appbar-h); }
body {
    font-family: var(--font-body);
    font-size: 1rem;
    line-height: 1.65;
    color: var(--text);
    background: var(--bg);
    font-feature-settings: "cv11", "ss01", "ss03";
}
a { color: var(--link); text-underline-offset: .18em; text-decoration-thickness: 1px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--gold); outline-offset: 2px; border-radius: .375rem; }
::selection { background: color-mix(in srgb, var(--gold) 35%, transparent); }
h1, h2, h3, h4 { font-family: var(--font-head); font-weight: 800; line-height: 1.15; letter-spacing: -.02em; }

.container { width: 100%; max-width: var(--max); margin: 0 auto; padding: 0 1rem; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 1000; padding: .6rem 1rem; background: var(--gold); color: var(--on-gold); font-weight: 700; }
.skip-link:focus { left: 0; }
.ico { width: 1.25rem; height: 1.25rem; flex: 0 0 auto; }

.bg-layers { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; }
.bg-glow {
    position: absolute; inset: 0;
    background:
        radial-gradient(59.375rem 33.75rem at 86% -10%, var(--glow-1), transparent 60%),
        radial-gradient(48.75rem 30rem at -12% 8%, var(--glow-2), transparent 56%),
        radial-gradient(56.25rem 35rem at 50% 112%, var(--glow-3), transparent 60%);
}
.bg-grid {
    position: absolute; inset: 0; overflow: hidden;
    -webkit-mask-image: radial-gradient(ellipse 95% 75% at 50% 0%, #000 0%, rgba(0, 0, 0, .55) 45%, transparent 82%);
    mask-image: radial-gradient(ellipse 95% 75% at 50% 0%, #000 0%, rgba(0, 0, 0, .55) 45%, transparent 82%);
}
.bg-grid::before {
    content: ""; position: absolute; top: -3rem; left: -3rem; right: 0; bottom: 0;
    background-image: linear-gradient(var(--grid-line) 1px, transparent 1px), linear-gradient(90deg, var(--grid-line) 1px, transparent 1px);
    background-size: 3rem 3rem;
}
.bg-vignette { position: absolute; inset: 0; background: radial-gradient(ellipse 80% 70% at 50% 40%, transparent 55%, rgba(8, 5, 12, .5) 100%); }
[data-theme="light"] .bg-vignette { display: none; }
.bg-dust { display: none; position: absolute; inset: 0; overflow: hidden; }
.bg-dust::before, .bg-dust::after, .bg-dust i { content: ""; position: absolute; left: 0; right: 0; top: 0; background-repeat: repeat; }
.bg-dust i {
    display: block; height: calc(100% + 22rem); opacity: .7;
    background-image:
        radial-gradient(1.2px 1.2px at 12% 18%, rgba(var(--glow-gold), .7) 50%, transparent 100%),
        radial-gradient(1px 1px at 63% 37%, rgba(var(--glow-pink), .6) 50%, transparent 100%),
        radial-gradient(1.4px 1.4px at 38% 71%, rgba(var(--glow-cyan), .5) 50%, transparent 100%),
        radial-gradient(1px 1px at 86% 88%, rgba(var(--glow-gold), .55) 50%, transparent 100%),
        radial-gradient(1px 1px at 92% 9%, rgba(255, 255, 255, .35) 50%, transparent 100%);
    background-size: 22rem 22rem;
}
.bg-dust::before {
    height: calc(100% + 31rem); opacity: .5;
    background-image:
        radial-gradient(2px 2px at 27% 44%, rgba(var(--glow-orange), .55) 50%, transparent 100%),
        radial-gradient(1.6px 1.6px at 71% 12%, rgba(var(--glow-gold), .5) 50%, transparent 100%),
        radial-gradient(1.8px 1.8px at 55% 83%, rgba(var(--glow-pink), .45) 50%, transparent 100%);
    background-size: 31rem 31rem;
}
.bg-dust::after {
    height: calc(100% + 17rem); opacity: .4;
    background-image:
        radial-gradient(.8px .8px at 33% 23%, rgba(255, 255, 255, .5) 50%, transparent 100%),
        radial-gradient(.8px .8px at 77% 64%, rgba(var(--glow-gold), .6) 50%, transparent 100%),
        radial-gradient(.8px .8px at 8% 79%, rgba(var(--glow-cyan), .5) 50%, transparent 100%);
    background-size: 17rem 17rem;
}
.bg-grain {
    display: none; position: absolute; inset: -50%; width: 200%; height: 200%; opacity: .03;
    background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
    background-size: 256px 256px;
    animation: grain .6s steps(6) infinite;
}
[data-theme="light"] .bg-grain { opacity: .018; }
@keyframes grain {
    0%, 100% { transform: translate(0); } 20% { transform: translate(-2%, -3%); } 40% { transform: translate(3%, 1%); }
    60% { transform: translate(-1%, 3%); } 80% { transform: translate(2%, -2%); }
}

.appbar {
    position: sticky; top: 0; z-index: 50;
    background: var(--glass);
    -webkit-backdrop-filter: blur(.875rem) saturate(140%);
    backdrop-filter: blur(.875rem) saturate(140%);
    border-bottom: 1px solid var(--border);
    transition: box-shadow .3s, background-color .3s;
}
.appbar.is-scrolled { box-shadow: 0 .75rem 2rem -1rem rgba(0, 0, 0, .65); }
[data-theme="light"] .appbar.is-scrolled { box-shadow: 0 .75rem 2rem -1.2rem rgba(80, 50, 20, .3); }
.appbar-in { display: flex; align-items: center; gap: .55rem; padding-top: .65rem; padding-bottom: .45rem; }
.brand { display: inline-flex; align-items: center; gap: .5rem; color: var(--text); text-decoration: none; font-weight: 600; font-size: 1.2rem; letter-spacing: -.025em; margin-right: auto; }
.brand b { font-weight: 850; color: #FFC93C; }
.appbar .brand { min-width: 0; }
.appbar .brand-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
@media (max-width: 16.8em) {
    .appbar-in { gap: .25rem; }
    .appbar .iconbtn { min-width: 2.25rem; height: 2.25rem; padding: 0 .35rem; }
}
[data-theme="light"] .brand b { color: #B26B00; }
.logo-mark { width: 2.25rem; height: 2.25rem; flex: 0 0 auto; margin: -2px 0; color: var(--text); }
/* light backgrounds: same gradient direction, deeper stops so the pale gold edge keeps its contrast */
[data-theme="light"] .logo-mark stop:nth-child(1) { stop-color: #F5A800; }
[data-theme="light"] .logo-mark stop:nth-child(2) { stop-color: #FF9419; }
[data-theme="light"] .logo-mark stop:nth-child(3) { stop-color: #FF6F35; }
[data-theme="light"] .logo-mark stop:nth-child(4) { stop-color: #F04784; }
[data-theme="light"] .logo-mark stop:nth-child(5) { stop-color: #C93FD6; }
[data-theme="light"] .logo-mark path:nth-of-type(2) { fill: #FFCD38; }
[data-theme="light"] .logo-mark path:nth-of-type(3) { fill: #FBB812; }
[data-theme="light"] .logo-mark path:nth-of-type(4) { fill: #EE9414; }
[data-theme="light"] .logo-mark path:nth-of-type(5) { fill: #F5A80C; }
[data-theme="light"] .logo-mark path:nth-of-type(6) { fill: #EC861A; }
[data-theme="light"] .logo-mark path:nth-of-type(7) { fill: #DF632C; }
.appbar-search { display: flex; align-items: center; gap: .35rem; flex: 0 1 23.75rem; }
.appbar-search input {
    flex: 1; min-width: 0; height: 2.625rem; padding: 0 1rem;
    background: var(--surface-2); color: var(--text);
    border: 1px solid var(--border-strong); border-radius: 999px;
}
.appbar-search input:focus { border-color: var(--gold); outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 35%, transparent); }
.appbar-search input::placeholder { color: var(--faint); }
.iconbtn {
    display: inline-flex; align-items: center; justify-content: center;
    min-width: 2.625rem; height: 2.625rem; padding: 0 .625rem;
    border-radius: .75rem; border: 1px solid var(--border-strong);
    background: var(--surface-2); color: var(--text); text-decoration: none;
    transition: border-color .2s, transform .15s;
}
.iconbtn:hover { border-color: var(--gold); }
.iconbtn:active { transform: scale(.93); }
.ico-moon { display: none; }
[data-theme="light"] .ico-moon { display: block; }
[data-theme="light"] .ico-sun { display: none; }
.only-mobile { display: none; }
.header-laser {
    position: absolute; left: 0; right: 0; bottom: -1px; height: 2px;
    background: var(--hex-grad); opacity: .7;
    box-shadow: 0 0 12px 1px rgba(255, 154, 61, .35), 0 0 24px 4px rgba(255, 79, 216, .15);
    transform-origin: left; animation: header-laser 1.1s ease-out both;
}
[data-theme="light"] .header-laser { box-shadow: none; opacity: .55; }
@keyframes header-laser { from { transform: scaleX(0); opacity: 0; } 15% { opacity: .7; } to { transform: scaleX(1); } }

.chipnav { display: flex; gap: .4rem; overflow-x: auto; padding-top: .2rem; padding-bottom: .7rem; scrollbar-width: none; scroll-snap-type: x proximity; -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); mask-image: linear-gradient(90deg, #000 88%, transparent); }
.chipnav .chip { scroll-snap-align: start; }
@media (min-width: 900px) {
    .chipnav { flex-wrap: wrap; overflow: visible; -webkit-mask-image: none; mask-image: none; }
}
@media (min-width: 900px) and (max-width: 1151.98px) {
    .chipnav { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: .35rem; }
    .chipnav:not(:has(> .chip:nth-child(11))) { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .chipnav:has(> .chip:nth-child(13)) { grid-template-columns: repeat(7, minmax(0, 1fr)); }
    .chipnav .chip { justify-content: center; min-width: 0; padding-left: .5rem; padding-right: .5rem; font-size: .82rem; }
}
@media (min-width: 1152px) and (max-width: 1279.98px) {
    .chipnav { gap: .3rem; }
    .chipnav .chip { padding: .34rem .62rem; font-size: .8rem; }
}
.chipnav::-webkit-scrollbar { display: none; }
.chip {
    --chip: var(--gold);
    flex: 0 0 auto; display: inline-flex; align-items: center; gap: .4rem;
    min-height: 2.375rem; padding: .4rem .82rem;
    border-radius: 999px; border: 1px solid var(--border);
    background: var(--surface); color: var(--muted);
    font-weight: 700; font-size: .86rem; line-height: 1.2;
    text-decoration: none; white-space: nowrap; cursor: pointer;
    transition: color .2s, border-color .2s, background .2s;
}
.chip:hover { color: var(--chip); border-color: var(--border-strong); }
.chip-pls, .chip-cyan { --chip: var(--cyan); }
.chip-hex { --chip: var(--gold); }
.chip-pulsex { --chip: var(--mint); }
.chip-meme { --chip: var(--pink); }
.chip-danger { --chip: var(--red); }
.chip-rh { --chip: var(--violet); }
.chip.is-active {
    color: var(--chip);
    border-color: color-mix(in srgb, var(--chip) 55%, transparent);
    background: linear-gradient(120deg, color-mix(in srgb, var(--chip) 22%, var(--surface)), color-mix(in srgb, var(--chip) 10%, var(--surface)));
}

.main { padding-top: 1.25rem; padding-bottom: 3.5rem; min-height: 60vh; }
.hud-label {
    font-size: .74rem; font-weight: 700;
    text-transform: uppercase; letter-spacing: .1em; line-height: 1.5;
    color: var(--muted);
}
.hud-label a { color: inherit; }
.hud-label .ico { width: .875rem; height: .875rem; display: inline-block; vertical-align: -2px; }
.accent-label { color: var(--sec); }

.crumbs ol { list-style: none; padding: 0; display: flex; flex-wrap: wrap; gap: .1rem .5rem; font-size: .84rem; color: var(--faint); }
.crumbs li + li::before { content: "›"; margin-right: .5rem; color: var(--border-strong); }
.crumbs a { color: var(--muted); text-decoration: none; }
.crumbs a:hover { color: var(--gold); }

.page-head {
    position: relative; overflow: hidden; margin: 1rem 0 1.75rem; padding: 1.5rem 1.4rem 1.4rem;
    background: var(--hero-grad); border: 1px solid var(--border-strong); border-radius: 1.375rem; box-shadow: var(--shadow);
}
.page-head::after {
    content: ""; position: absolute; right: -3.75rem; top: -5rem; width: 16.25rem; height: 16.25rem; border-radius: 50%; pointer-events: none;
    background: radial-gradient(circle, color-mix(in srgb, var(--sec) 22%, transparent), transparent 70%);
}
.page-title {
    position: relative; font-size: clamp(1.9rem, 3.4vw + .9rem, 3rem); margin: .4rem 0 1rem; max-width: 24ch;
    background: linear-gradient(120deg, var(--text) 0%, var(--text) 50%, color-mix(in srgb, var(--sec) 75%, var(--text)) 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}
[data-theme="light"] .page-title { background: none; color: var(--text); }
.voice-tag { position: relative; color: var(--sec); }
.voice-tag-community { color: var(--violet); }
.voice-tag-meme { color: var(--pink); }
.tldr {
    position: relative; max-width: 78ch; padding: 1rem 1.25rem 1rem 1.4rem;
    background: color-mix(in srgb, var(--bg) 45%, transparent); border: 1px solid var(--border); border-radius: var(--radius-sm);
    font-size: 1.05rem;
}
[data-theme="light"] .tldr { background: rgba(255, 255, 255, .7); }
.tldr::before { content: ""; position: absolute; left: 0; top: .75rem; bottom: .75rem; width: 4px; border-radius: 4px; background: var(--sec-grad); }
.tldr .hud-label { margin-bottom: .2rem; color: var(--sec); }
.tldr p { margin: 0; }
.satire-note {
    position: relative; display: flex; gap: .6rem; align-items: flex-start; max-width: 78ch; margin-top: 1rem; padding: .8rem 1rem;
    border-radius: var(--radius-sm); border: 1px dashed color-mix(in srgb, var(--pink) 60%, transparent);
    background: color-mix(in srgb, var(--pink) 9%, transparent); font-size: .92rem;
}
.satire-note > span, .disclaimer-inline > span { flex: 1 1 auto; min-width: 0; }
.satire-note .ico { color: var(--pink); margin-top: .15rem; }

.layout { display: block; }
.toc { margin-bottom: 1.5rem; padding: 1rem 1.2rem; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-card); }
.toc .hud-label { color: var(--sec); }
.toc ol { margin: .4rem 0 0; padding-left: 1.1rem; font-size: .9rem; }
.toc li { margin: .3rem 0; }
.toc li::marker { color: var(--faint); }
.toc a { color: var(--muted); text-decoration: none; }
.toc a:hover { color: var(--gold); }
@media (min-width: 1100px) {
    .layout.has-toc { display: grid; grid-template-columns: 15rem minmax(0, 1fr); gap: 2.5rem; align-items: start; }
    .layout.has-toc .toc { position: sticky; top: calc(var(--appbar-h) + 1rem); }
}

.prose { max-width: 74ch; font-size: 1.04rem; }
.prose-wide { max-width: 92ch; }
.prose > * + * { margin-top: 1rem; }
.prose h2 { position: relative; font-size: clamp(1.4rem, 1.1vw + 1rem, 1.75rem); margin-top: 2.6rem; padding-left: 1rem; }
.prose h2::before { content: ""; position: absolute; left: 0; top: .2em; bottom: .2em; width: .3125rem; border-radius: .3125rem; background: var(--sec-grad); }
.prose h3 { font-size: 1.2rem; margin-top: 1.9rem; }
.prose h4 { font-size: 1.05rem; margin-top: 1.5rem; }
.prose ul, .prose ol { padding-left: 1.3rem; }
.prose li + li { margin-top: .35rem; }
.prose li::marker { color: var(--sec); }
.prose strong { color: var(--text); font-weight: 700; }
.prose :not(pre) > code { font-family: var(--font-mono); font-size: .86em; padding: .1em .38em; border-radius: .375rem; background: var(--surface-2); border: 1px solid var(--border); overflow-wrap: anywhere; }
.prose a, .faq-a a, .sources a { overflow-wrap: anywhere; }
.prose pre { overflow-x: auto; padding: 1rem 1.1rem; border-radius: var(--radius-sm); background: var(--surface); border: 1px solid var(--border); font-size: .88rem; }
.prose blockquote { padding: .6rem 1rem; border-left: 4px solid var(--sec); border-radius: 0 var(--radius-sm) var(--radius-sm) 0; background: var(--surface); color: var(--muted); }
.prose hr { border: 0; height: 1px; background: var(--border); margin: 2rem 0; }
.prose img { border-radius: var(--radius-sm); }
.table-wrap { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); box-shadow: var(--shadow-card); }
.table-wrap table { width: 100%; font-size: .92rem; }
.table-wrap th { text-align: left; font-size: .72rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); border-bottom: 1px solid var(--border-strong); white-space: nowrap; }
.table-wrap th, .table-wrap td { padding: .65rem .85rem; vertical-align: top; }
.table-wrap td { border-top: 1px solid var(--border); }
.table-wrap tr:first-child td { border-top: 0; }
.table-wrap tbody tr:hover td { background: color-mix(in srgb, var(--gold) 4%, transparent); }

.addr { display: inline-flex; align-items: center; gap: .1rem; max-width: 100%; padding: .05rem .15rem .05rem .55rem; border-radius: .625rem; background: var(--surface-2); border: 1px solid var(--border-strong); vertical-align: middle; }
.addr code { font-family: var(--font-mono); font-size: .8rem; word-break: break-all; background: none; border: 0; padding: 0; }
.addr-btn { display: inline-flex; align-items: center; justify-content: center; width: 1.875rem; height: 1.875rem; flex: 0 0 auto; border: 0; border-radius: .5rem; background: transparent; color: var(--muted); }
.addr-btn:hover { color: var(--gold); background: color-mix(in srgb, var(--gold) 12%, transparent); }
.addr-btn svg { width: 1rem; height: 1rem; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.addr-btn.is-copied { color: var(--mint); }

.cards { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 16.25rem), 1fr)); }
.cards-2 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 21.25rem), 1fr)); }
.cards-3 { grid-template-columns: repeat(auto-fill, minmax(min(100%, 16.25rem), 1fr)); }
.card {
    position: relative; overflow: hidden;
    padding: 1.1rem 1.2rem; border-radius: var(--radius);
    background: var(--card-grad), var(--surface);
    border: 1px solid var(--border);
    box-shadow: var(--shadow-card);
    transition: border-color .25s, transform .25s, box-shadow .25s;
}
.card-link { display: flex; flex-direction: column; gap: .35rem; color: var(--text); text-decoration: none; }
.card-link:hover { border-color: var(--border-strong); transform: translateY(-3px); box-shadow: var(--shadow), 0 0 0 1px color-mix(in srgb, var(--sec) 22%, transparent); }
.card-title { font-weight: 800; font-size: 1.1rem; line-height: 1.25; letter-spacing: -.015em; }
.card-desc { color: var(--muted); font-size: .93rem; line-height: 1.5; }
.card-go { margin-top: auto; padding-top: .35rem; color: var(--sec); }
.card-go .ico { transition: transform .2s; }
.card-link:hover .card-go .ico { transform: translateX(4px); }
.spot::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; transition: opacity .3s; background: radial-gradient(23.75rem circle at var(--mx, 50%) var(--my, 0%), color-mix(in srgb, var(--sec) 11%, transparent), transparent 50%); }
.spot:hover::before { opacity: 1; }
.accent-pls, .accent-cyan { --sec: var(--cyan); --sec-grad: var(--pls-grad); }
.accent-hex { --sec: var(--gold); --sec-grad: var(--hex-grad); }
.accent-pulsex { --sec: var(--mint); --sec-grad: var(--px-grad); }
.accent-meme { --sec: var(--pink); }
.accent-danger { --sec: var(--red); }
.accent-rh { --sec: var(--violet); }
.card-accent { border-left: 4px solid var(--sec); }
.explore .card-link, .section-cards .card-link { border-left: 4px solid var(--sec); }

.hero {
    position: relative; overflow: hidden; margin: .5rem 0 1rem; padding: 2rem 1.5rem 1.6rem;
    background: var(--hero-grad); border: 1px solid var(--border-strong); border-radius: 1.5rem; box-shadow: var(--shadow);
}
.hero::before {
    content: ""; position: absolute; right: -7.5rem; top: -8.75rem; width: 26.25rem; height: 26.25rem; border-radius: 50%; pointer-events: none;
    background: radial-gradient(circle, rgba(255, 154, 61, .20), rgba(255, 79, 216, .08) 45%, transparent 70%);
}
.hero > * { position: relative; }
.hero-kicker { margin-bottom: .55rem; color: var(--gold); }
.hero-title {
    font-size: clamp(2.2rem, 5vw + .7rem, 4.1rem); font-weight: 900; line-height: 1.04; letter-spacing: -.035em; max-width: 17ch;
    background: linear-gradient(110deg, var(--text) 0%, var(--text) 34%, #FFE08A 52%, #FFB02E 68%, #FF6B8A 86%, #E64FE6 100%);
    -webkit-background-clip: text; background-clip: text; color: transparent;
}
[data-theme="light"] .hero-title { background: linear-gradient(110deg, var(--text) 0%, var(--text) 38%, #C77700 56%, #E0531A 74%, #C2185B 100%); -webkit-background-clip: text; background-clip: text; }
.hero-sub { max-width: 62ch; margin-top: 1.1rem; font-size: 1.12rem; color: var(--muted); }
.hero-sub p { margin: 0; }
.hero-cta { display: flex; flex-wrap: wrap; gap: .7rem; margin: 1.6rem 0 1.4rem; }
.hero-title.is-scrambling { background: none; -webkit-text-fill-color: transparent; color: transparent; }
.hero-title.is-scrambling::after { content: attr(data-scr); content: attr(data-scr) / ""; position: absolute; left: 0; top: 0; right: 0; color: var(--gold); -webkit-text-fill-color: var(--gold); pointer-events: none; }

.btn {
    display: inline-flex; align-items: center; justify-content: center; gap: .5rem; min-height: 2.875rem; padding: .6rem 1.2rem;
    border-radius: .75rem; border: 1px solid var(--border-strong); background: var(--surface-2); color: var(--text);
    font-weight: 700; font-size: .95rem; text-decoration: none; cursor: pointer;
    transition: transform .15s, filter .2s, border-color .2s, box-shadow .2s;
}
.btn:hover { border-color: var(--gold); }
.btn:active { transform: scale(.97); }
.btn-primary { background: var(--btn-grad); color: var(--on-gold); border-color: transparent; box-shadow: 0 6px 20px rgba(255, 154, 61, .25); }
.btn-primary:hover { filter: brightness(1.08); border-color: transparent; box-shadow: 0 8px 26px rgba(255, 154, 61, .38); }
.btn-ghost { background: transparent; }

.price-strip { display: grid; gap: .65rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 10.625rem), 1fr)); margin: .4rem 0 .2rem; }
.price {
    display: flex; flex-direction: column; gap: .1rem; min-width: 0; padding: .7rem .9rem;
    border-radius: .875rem; border: 1px solid var(--border); background: rgba(255, 255, 255, .04);
    color: var(--text); text-decoration: none; transition: border-color .2s, transform .2s;
}
[data-theme="light"] .price { background: rgba(255, 255, 255, .75); }
.price:hover { border-color: var(--border-strong); transform: translateY(-2px); }
.price-sym { font-size: .74rem; font-weight: 700; letter-spacing: .08em; color: var(--muted); }
.price-v { font-family: var(--font-mono); font-weight: 600; font-size: 1.02rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.price-c { align-self: flex-start; padding: .05rem .5rem; border-radius: 999px; font-size: .72rem; font-weight: 800; }
.price-c:empty { display: none; }
.price-c.is-up, .is-up { color: var(--mint); }
.price-c.is-down, .is-down { color: var(--red); }
.price-c.is-up { background: color-mix(in srgb, var(--mint) 15%, transparent); }
.price-c.is-down { background: color-mix(in srgb, var(--red) 15%, transparent); }
.price-src { grid-column: 1 / -1; color: var(--faint); font-size: .68rem; }

.kpis { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14.375rem), 1fr)); margin-top: .75rem; }
.kpi { display: flex; flex-direction: column; gap: .3rem; color: var(--text); text-decoration: none; }
.kpi-ico { display: inline-flex; align-items: center; justify-content: center; width: 2.5rem; height: 2.5rem; border-radius: .75rem; margin-bottom: .2rem; color: var(--sec); background: color-mix(in srgb, var(--sec) 15%, transparent); }
.kpi-ico .ico { width: 1.375rem; height: 1.375rem; }
a.kpi:hover { border-color: var(--border-strong); transform: translateY(-3px); }
.kpi-v { font-size: 2.1rem; font-weight: 900; line-height: 1.1; letter-spacing: -.03em; }
.kpi-t { font-size: 1.05rem; font-weight: 800; line-height: 1.3; letter-spacing: -.01em; }
.kpi-s { color: var(--faint); font-size: .84rem; }
.grad-text { background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.status-board, .explore, .latest, .section-cards, .token-group, .directory, .legal, .meme-wall, .news-list { margin-top: 2.5rem; }
.section-h { display: flex; align-items: center; gap: .6rem; margin-bottom: 1rem; font-size: 1.45rem; }
.section-h .badge { font-size: .72rem; }
.status-board > h2, .explore > h2, .latest > h2, .token-group > h2, .legal > h2, .directory > h2 { margin-bottom: 1rem; }
.explore > h2, .latest > h2, .token-group > h2, .legal > h2 { font-size: 1.5rem; }
.badge { display: inline-flex; align-items: center; justify-content: center; min-width: 1.625rem; height: 1.5rem; padding: 0 .55rem; border-radius: 999px; font-size: .72rem; font-weight: 800; letter-spacing: 0; background: color-mix(in srgb, var(--sec) 16%, transparent); color: var(--sec); }
.group-note { color: var(--muted); max-width: 72ch; margin: -.4rem 0 1rem; }
.more { display: inline-flex; align-items: center; gap: .35rem; margin-top: 1rem; font-weight: 700; }

.pill { display: inline-flex; align-items: center; gap: .3rem; padding: .2rem .7rem; border-radius: 999px; font-size: .74rem; font-weight: 800; line-height: 1.5; background: color-mix(in srgb, var(--muted) 15%, transparent); color: var(--muted); }
.pill-trusted, .pill-ok { background: color-mix(in srgb, var(--mint) 16%, transparent); color: var(--mint); }
.pill-community-run { background: color-mix(in srgb, var(--orange) 16%, transparent); color: var(--orange); }
.pill-bridged { background: color-mix(in srgb, var(--cyan) 16%, transparent); color: var(--cyan); }
.pill-status { background: color-mix(in srgb, var(--violet) 16%, transparent); color: var(--violet); }
.tier { display: inline-block; padding: .08rem .55rem; border-radius: 999px; font-size: .68rem; font-weight: 800; letter-spacing: .02em; white-space: nowrap; vertical-align: 1px; background: color-mix(in srgb, var(--muted) 15%, transparent); color: var(--muted); }
.tier-1 { background: color-mix(in srgb, var(--mint) 16%, transparent); color: var(--mint); }
.tier-2 { background: color-mix(in srgb, var(--gold) 16%, transparent); color: var(--gold); }
.tier-3 { background: color-mix(in srgb, var(--violet) 16%, transparent); color: var(--violet); }
.tier-0 { background: transparent; border: 1px dashed color-mix(in srgb, var(--red) 60%, transparent); color: var(--red); }

.sources { margin-top: 3rem; padding: 1.2rem 1.3rem; max-width: 92ch; background: var(--surface); border: 1px solid var(--border); border-radius: var(--radius); box-shadow: var(--shadow-card); }
.sources h2 { margin-bottom: .75rem; color: var(--sec); }
.sources ol { padding-left: 1.4rem; font-size: .9rem; }
.sources li { margin: .45rem 0; overflow-wrap: anywhere; }
.sources li::marker { color: var(--faint); font-size: .8rem; }
.src-note, .src-legend { color: var(--faint); }
.src-legend { font-size: .82rem; margin-top: .75rem; }
.faq { margin-top: 2.5rem; max-width: 92ch; }
.faq h2 { margin-bottom: .9rem; font-size: 1.45rem; }
.faq details { padding: 0; margin: .6rem 0; }
.faq summary { cursor: pointer; padding: .95rem 2.8rem .95rem 1.2rem; font-weight: 700; font-size: 1.02rem; list-style: none; position: relative; min-height: 3rem; }
.faq summary:focus-visible { outline-offset: -4px; border-radius: calc(var(--radius) - 2px); }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: ""; position: absolute; right: 1.2rem; top: 1.25rem; width: .5625rem; height: .5625rem; border-right: 2px solid var(--faint); border-bottom: 2px solid var(--faint); transform: rotate(45deg); transition: transform .25s; }
.faq details[open] summary::after { transform: rotate(-135deg); top: 1.45rem; border-color: var(--sec); }
.faq details[open] { border-left: 4px solid var(--sec); }
.faq details[open] summary { color: var(--sec); }
.faq-a { padding: 0 1.2rem 1rem; color: var(--muted); }
.faq-a > * + * { margin-top: .6rem; }
.prevnext { display: grid; grid-template-columns: 1fr 1fr; gap: 1rem; margin-top: 2.5rem; }
.prevnext a { display: flex; flex-direction: column; gap: .2rem; color: var(--text); text-decoration: none; font-weight: 700; }
.pn-next { text-align: right; align-items: flex-end; }
.disclaimer-inline { display: flex; gap: .55rem; align-items: flex-start; margin-top: 2rem; padding: .8rem 1rem; border-radius: var(--radius-sm); background: color-mix(in srgb, var(--orange) 8%, transparent); border: 1px solid color-mix(in srgb, var(--orange) 30%, transparent); font-size: .88rem; color: var(--muted); }
.disclaimer-inline .ico { width: 1.125rem; height: 1.125rem; margin-top: .15rem; color: var(--orange); }

.token-card { margin-bottom: 1.5rem; max-width: 92ch; border-left: 4px solid var(--sec); }
.token-top { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .85rem; }
.facts { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 12.5rem), 1fr)); }
.facts > div { padding: .7rem .9rem; border-radius: .875rem; border: 1px solid var(--border); background: rgba(255, 255, 255, .03); min-width: 0; }
[data-theme="light"] .facts > div { background: var(--surface-2); }
.facts > div:first-child { grid-column: 1 / -1; }
.facts dt { font-size: .72rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); }
.facts dd { margin: .2rem 0 0; font-size: 1.12rem; font-weight: 800; }
.facts-note { display: block; font-size: .78rem; font-weight: 500; color: var(--faint); }
.token-sym { align-self: flex-start; padding: .15rem .6rem; border-radius: 999px; font-family: var(--font-mono); font-weight: 600; font-size: .78rem; color: var(--sec); background: color-mix(in srgb, var(--sec) 14%, transparent); }
.token-meta { margin-top: auto; padding-top: .4rem; color: var(--faint); font-size: .74rem; }
.token-mini { border-left: 4px solid var(--sec); }
.tier-box-community-run { --sec: var(--orange); }
.tier-box-bridged { --sec: var(--cyan); }
.tier-box-trusted { --sec: var(--mint); }

.myth-box { display: grid; gap: 1rem; margin-bottom: 2rem; }
@media (min-width: 800px) { .myth-box { grid-template-columns: 1fr 1fr; } }
.myth-claim { border-left: 4px solid var(--red); }
.myth-claim .hud-label { color: var(--red); }
.myth-answer { border-left: 4px solid var(--mint); }
.myth-answer .hud-label { color: var(--mint); }
.myth-claim-t { font-size: 1.18rem; font-weight: 800; margin: .4rem 0; letter-spacing: -.01em; }
.myth-who { color: var(--faint); font-size: .88rem; }

.filter-chips { display: flex; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 1.25rem; }
.az .chip { min-width: 2.5rem; justify-content: center; padding: .35rem .6rem; }
.conduit { position: relative; list-style: none; padding: 0 0 0 2rem; margin: 1rem 0; max-width: 92ch; }
.conduit::before { content: ""; position: absolute; left: .5rem; top: .3rem; bottom: .3rem; width: 3px; border-radius: 3px; background: linear-gradient(180deg, #FFC93C, #FF9A3D 35%, #FF5C93 65%, #A05CFF); opacity: .85; }
.conduit-node { position: relative; margin: .9rem 0; }
.conduit-node .card { padding: .9rem 1.15rem; }
.conduit-t { font-weight: 700; font-size: 1.03rem; margin: .2rem 0 0; }
.conduit-year { position: relative; margin: 1.8rem 0 .4rem -2rem; padding-left: 2rem; font-size: 1.6rem; font-weight: 900; letter-spacing: -.03em; }
.conduit-year { background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; width: max-content; }
.beacon { position: absolute; left: -1.93rem; top: 1.15rem; width: .875rem; height: .875rem; border-radius: 50%; background: var(--gold); box-shadow: 0 0 0 4px var(--bg), 0 0 14px color-mix(in srgb, var(--gold) 70%, transparent); }
.proj-pulsechain .beacon { background: var(--cyan); box-shadow: 0 0 0 4px var(--bg), 0 0 14px color-mix(in srgb, var(--cyan) 70%, transparent); }
.proj-pulsex .beacon { background: var(--mint); box-shadow: 0 0 0 4px var(--bg), 0 0 14px color-mix(in srgb, var(--mint) 70%, transparent); }
.proj-rh .beacon { background: var(--violet); box-shadow: 0 0 0 4px var(--bg), 0 0 14px color-mix(in srgb, var(--violet) 70%, transparent); }
.proj-pulsechain .card { border-left: 4px solid var(--cyan); }
.proj-hex .card { border-left: 4px solid var(--gold); }
.proj-pulsex .card { border-left: 4px solid var(--mint); }
.proj-rh .card { border-left: 4px solid var(--violet); }
:is([data-fx="mid"], [data-fx="high"]) .legal .conduit-node:last-child .beacon { animation: beacon 2.4s ease-in-out infinite; }
@keyframes beacon { 50% { box-shadow: 0 0 0 4px var(--bg), 0 0 24px 6px color-mix(in srgb, var(--gold) 60%, transparent); } }
.legal-dl { display: grid; gap: .5rem; margin: .7rem 0 0; font-size: .93rem; }
.legal-dl dt { font-size: .7rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--faint); }
.legal-dl dd { margin: 0; }
.legal-src { margin-top: .6rem; font-size: .84rem; }
.legal h3 { font-size: 1.22rem; margin: 2rem 0 .5rem; }

.glossary { margin-top: 1.5rem; max-width: 92ch; }
.gl-letter { font-size: 2rem; font-weight: 900; margin: 1.8rem 0 .4rem; background: var(--gold-grad); -webkit-background-clip: text; background-clip: text; color: transparent; width: max-content; }
.gl-item { margin: .6rem 0; }
.gl-item:target { border-color: var(--gold); box-shadow: 0 0 0 1px var(--gold), var(--shadow); }
.gl-item dt { font-weight: 800; font-size: 1.12rem; }
.gl-item dd { margin: .3rem 0 0; color: var(--muted); }
.gl-body { margin-top: .5rem; }
.gl-body > * + * { margin-top: .5rem; }
.gl-rel { margin-top: .5rem; }

.link-list { list-style: none; padding: 0; display: grid; gap: .6rem; max-width: 92ch; }
.link-list li { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .9rem; padding: .8rem 1rem; border-left: 4px solid var(--mint); }
.link-list a { font-weight: 800; }
.link-host { font-family: var(--font-mono); font-size: .8rem; color: var(--faint); margin-right: auto; }
.service-meta { display: flex; flex-wrap: wrap; gap: .35rem; margin-top: auto; padding-top: .4rem; }
.creator-f { font-size: .78rem; color: var(--faint); margin-top: auto; }
.service, .creator { border-left: 4px solid var(--sec); }

.meme-wall { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(min(100%, 17.5rem), 1fr)); }
.meme { margin: 0; border-radius: var(--radius); overflow: hidden; border: 1px solid var(--border); background: var(--surface); box-shadow: var(--shadow-card); transition: transform .25s; }
.meme:hover { transform: translateY(-3px) rotate(-.4deg); }
.meme img { width: 100%; aspect-ratio: 1 / 1; object-fit: cover; }
.meme-type {
    width: 100%; aspect-ratio: 1 / 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .55rem;
    padding: 1.5rem; text-align: center; color: #fff;
    background: radial-gradient(circle at 25% 15%, rgba(255, 201, 60, .38), transparent 55%), radial-gradient(circle at 85% 90%, rgba(255, 79, 216, .45), transparent 55%), #1A0F1C;
}
.meme-1 .meme-type { background: radial-gradient(circle at 75% 12%, rgba(255, 154, 61, .45), transparent 55%), radial-gradient(circle at 12% 92%, rgba(160, 92, 255, .45), transparent 55%), #150C1E; }
.meme-2 .meme-type { background: linear-gradient(160deg, #3A1530 0%, #160D1A 65%); }
.meme-3 .meme-type { background: radial-gradient(circle at 50% 35%, rgba(255, 213, 74, .32), transparent 60%), #1C1408; }
.meme-line { display: block; font-weight: 900; text-transform: uppercase; line-height: 1.02; letter-spacing: -.01em; text-shadow: 0 2px 0 rgba(0, 0, 0, .55); }
.meme-line-1 { font-size: 1.12rem; color: rgba(255, 255, 255, .88); }
.meme-line-2 { font-size: clamp(1.8rem, 4vw, 2.6rem); background: linear-gradient(110deg, #FFE08A, #FFB02E 40%, #FF6B8A 80%, #E64FE6); -webkit-background-clip: text; background-clip: text; color: transparent; text-shadow: none; filter: drop-shadow(0 2px .625rem rgba(255, 154, 61, .35)); }
.meme-line-3, .meme-line-4 { font-family: var(--font-mono); font-weight: 500; font-size: .8rem; letter-spacing: .1em; color: rgba(243, 238, 246, .82); text-shadow: none; }
.meme figcaption { padding: .8rem 1rem; font-size: .92rem; color: var(--muted); }
.meme figcaption .hud-label { color: var(--pink); }

.article-meta { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin: -.5rem 0 1.25rem; color: var(--faint); }
.yt { margin: 0 0 1.75rem; max-width: 56.25rem; }
.yt-lazy, .yt iframe { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; border: 0; padding: 0; border-radius: var(--radius); overflow: hidden; background: #000; cursor: pointer; box-shadow: var(--shadow); }
.yt-lazy img { width: 100%; height: 100%; object-fit: cover; opacity: .88; transition: opacity .2s, transform .4s; }
.yt-lazy:hover img { opacity: 1; transform: scale(1.02); }
.yt-play { position: absolute; left: 50%; top: 50%; width: 4.875rem; height: 4.875rem; margin: -2.4375rem 0 0 -2.4375rem; display: flex; align-items: center; justify-content: center; border-radius: 50%; background: var(--btn-grad); color: var(--on-gold); box-shadow: 0 8px 30px rgba(255, 154, 61, .5); }
.play-glyph { display: block; width: 100%; height: 100%; fill: currentColor; }
.yt figcaption { margin-top: .55rem; font-size: .85rem; color: var(--faint); }
.article-meta a, .yt figcaption a { display: inline-block; padding-block: .35rem; margin-block: -.35rem; }
.news-thumb { width: 100%; aspect-ratio: 16 / 9; height: auto; object-fit: cover; border-radius: var(--radius-sm); margin-bottom: .5rem; }
.news-list { display: grid; gap: 1rem; max-width: 61.25rem; }
.news-row { display: grid; grid-template-columns: 1fr; gap: .9rem; border-left: 4px solid var(--sec); }
.news-body { display: flex; flex-direction: column; gap: .3rem; }
@media (min-width: 700px) { .news-row { grid-template-columns: 220px 1fr; align-items: start; } .news-row .news-thumb { margin: 0; } }

.search-big { display: flex; flex-wrap: wrap; gap: .6rem; max-width: 47.5rem; margin: 1rem 0; }
.search-big input { flex: 1 1 15rem; min-width: 0; min-height: 3.125rem; padding: 0 1.1rem; font-size: 1.05rem; color: var(--text); background: var(--surface-2); border: 1px solid var(--border-strong); border-radius: .875rem; }
.search-big input:focus { border-color: var(--gold); outline: none; box-shadow: 0 0 0 3px color-mix(in srgb, var(--gold) 35%, transparent); }
.search-results { list-style: none; padding: 0; display: grid; gap: .7rem; max-width: 56.25rem; margin-top: 1rem; }
.search-results li a { display: block; padding: .9rem 1.1rem; border-radius: var(--radius); border: 1px solid var(--border); border-left: 4px solid var(--gold); background: var(--surface); box-shadow: var(--shadow-card); color: var(--text); text-decoration: none; transition: transform .2s, border-color .2s; }
.search-results li a:hover { transform: translateY(-2px); border-color: var(--border-strong); }
.search-results li { min-width: 0; }
.sr-t, .sr-u, .sr-x { overflow-wrap: anywhere; }
.sr-t { display: block; font-weight: 800; font-size: 1.06rem; }
.sr-u { display: block; font-family: var(--font-mono); font-size: .74rem; color: var(--faint); }
.sr-x { display: block; margin-top: .3rem; font-size: .9rem; color: var(--muted); }
.search-results mark { background: color-mix(in srgb, var(--gold) 28%, transparent); color: inherit; border-radius: 3px; padding: 0 .1em; }
.hero-error .hero-title { max-width: 20ch; }
.guess { margin-top: 1rem; }

.site-footer { position: relative; overflow: hidden; margin-top: 2rem; padding: 2.75rem 0 2rem; border-top: 1px solid var(--border); background: linear-gradient(180deg, color-mix(in srgb, var(--surface) 70%, transparent), var(--surface)); }
.site-footer::before {
    content: ""; position: absolute; inset: 0; pointer-events: none;
    background-image: linear-gradient(90deg, rgba(var(--glow-gold), .035) 1px, transparent 1px), linear-gradient(0deg, rgba(var(--glow-gold), .035) 1px, transparent 1px);
    background-size: 1.5rem 1.5rem;
    -webkit-mask-image: linear-gradient(180deg, #000, transparent 85%);
    mask-image: linear-gradient(180deg, #000, transparent 85%);
}
[data-theme="light"] .site-footer::before { background-image: linear-gradient(90deg, rgba(138, 90, 0, .05) 1px, transparent 1px), linear-gradient(0deg, rgba(138, 90, 0, .05) 1px, transparent 1px); }
.site-footer > .container { position: relative; }
.footer-grid { display: grid; gap: 2rem; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.footer-brand { grid-column: 1 / -1; }
@media (min-width: 1000px) { .footer-grid { grid-template-columns: 2fr repeat(4, minmax(0, 1fr)); } .footer-brand { grid-column: auto; } }
.footer-brand p { color: var(--muted); font-size: .92rem; margin-top: .7rem; max-width: 42ch; }
.footer-brand .footer-note { color: var(--faint); font-size: .84rem; }
.footer-col h2 { margin-bottom: .6rem; color: var(--gold); }
.footer-col ul { list-style: none; padding: 0; }
.footer-col li { margin: .3rem 0; }
.footer-col a { color: var(--muted); text-decoration: none; font-size: .93rem; display: inline-block; padding: .15rem 0; }
.footer-col a:hover { color: var(--gold); }
.footer-col a { position: relative; }
.footer-col a::before, .footer-col a::after { content: ""; position: absolute; width: .5rem; height: .5rem; opacity: 0; pointer-events: none; transition: opacity .25s, transform .25s; }
.footer-col a::before { left: -.45rem; top: .05rem; border-left: 1px solid var(--gold); border-top: 1px solid var(--gold); transform: translate(.25rem, .25rem); }
.footer-col a::after { right: -.45rem; bottom: .05rem; border-right: 1px solid var(--rose); border-bottom: 1px solid var(--rose); transform: translate(-.25rem, -.25rem); }
@media (hover: hover) {
    .footer-col a:hover::before, .footer-col a:hover::after { opacity: 1; transform: none; }
}
.footer-bottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem 1.5rem; margin-top: 2rem; }
.footer-meta { margin: 0; color: var(--faint); }
.footer-meta a { text-decoration: none; }
.pwa-appstore-btn {
    display: inline-flex; align-items: center; margin-top: .75rem; margin-bottom: .5rem; padding: .375rem 1rem .375rem .5rem;
    background: #000; border: 1px solid #a6a6a6; border-radius: .4375rem; color: #fff; text-decoration: none;
    transition: background .2s, border-color .2s;
}
.pwa-appstore-btn:hover { background: #222; border-color: #ccc; color: #fff; text-decoration: none; }
.pwa-appstore-btn svg { flex-shrink: 0; margin-right: .375rem; }
.pwa-appstore-text { display: flex; flex-direction: column; align-items: flex-start; text-align: left; padding-top: 1px; }
.pwa-appstore-small { color: #fff; font-size: .5rem; text-transform: uppercase; letter-spacing: .5px; margin-bottom: -1px; }
.pwa-appstore-big { color: #fff; font-size: 1rem; font-weight: 500; line-height: 1.2; }
.fx-switch { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .8rem; }
.fx-switch .hud-label { color: var(--faint); }
.fx-now { color: var(--muted); letter-spacing: .06em; }
.fx-opts { display: inline-flex; gap: .15rem; padding: .2rem; border-radius: 999px; border: 1px solid var(--border-strong); background: var(--surface); }
.fx-opts button { min-height: 2.25rem; padding: 0 .85rem; border: 0; border-radius: 999px; cursor: pointer; background: none; color: var(--muted); font: 700 .78rem/1 var(--font-body); }
.fx-opts button:hover { color: var(--text); }
.fx-opts button[aria-pressed="true"] { color: var(--gold); background: color-mix(in srgb, var(--gold) 16%, transparent); }
@media (pointer: coarse) {
    .fx-opts button { min-height: 2.75rem; padding: 0 1rem; }
}

.nav-mobile { display: none; }
@media (max-width: 900px) {
    body { padding-bottom: calc(4.625rem + env(safe-area-inset-bottom)); }
    .nav-mobile {
        position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
        display: grid; grid-template-columns: repeat(5, 1fr); align-items: end;
        padding: .3rem .25rem calc(.3rem + env(safe-area-inset-bottom));
        background: var(--glass); -webkit-backdrop-filter: blur(.875rem); backdrop-filter: blur(.875rem);
        border-top: 1px solid var(--border);
    }
    .nav-mobile > a, .nav-mobile > button {
        display: flex; flex-direction: column; align-items: center; gap: 2px; min-height: 3.25rem; justify-content: center;
        padding: .25rem 0; border: 0; background: none; color: var(--muted); font-size: .68rem; font-weight: 700; text-decoration: none;
        cursor: pointer;
    }
    /* must stay after the rule above: an author display value overrides the UA style of the hidden attribute */
    .nav-mobile [hidden] { display: none; }
    .nav-mobile > a[aria-current="page"] { color: var(--gold); }
    .nav-mobile .ico { width: 1.375rem; height: 1.375rem; }
    .nav-center-circle { position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; width: 3.375rem; height: 3.375rem; margin-top: -1.5rem; border-radius: 50%; background: var(--btn-grad); color: var(--on-gold); box-shadow: 0 0 0 4px var(--bg), 0 8px 24px rgba(255, 154, 61, .45); }
    .nav-center { color: var(--text) !important; }
    .nav-mobile::before {
        content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 2px; pointer-events: none;
        background: var(--hex-grad); opacity: .45; box-shadow: 0 0 .6rem rgba(var(--glow-orange), .35);
    }
    [data-theme="light"] .nav-mobile::before { box-shadow: none; opacity: .5; }
    .nav-mobile > a[aria-current="page"] .ico { filter: drop-shadow(0 0 .35rem rgba(var(--glow-gold), .65)); }
}
@media (max-width: 43.75em) {
    .appbar-search { display: none; }
    .only-mobile { display: inline-flex; }
    .brand { font-size: 1.06rem; }
    .appbar-in { gap: .4rem; }
    .bg-grain { display: none; }
    .hero { padding: 1.5rem 1.1rem 1.3rem; border-radius: 1.25rem; }
    .page-head { padding: 1.2rem 1.05rem 1.1rem; border-radius: 1.25rem; }
    .prevnext { grid-template-columns: 1fr; }
    .pn-next { text-align: left; align-items: flex-start; }
}
@media (max-width: 22.5em) {
    .appbar .iconbtn-official { display: none; }
    .brand { font-size: 1rem; gap: .45rem; }
    .logo-mark { width: 2rem; height: 2rem; }
}

.laser-section { position: relative; }
.laser-section.is-in::before {
    content: ""; position: absolute; left: 0; right: 0; top: -.8rem; height: 2px; pointer-events: none;
    background: linear-gradient(90deg, transparent 0%, color-mix(in srgb, var(--sec) 90%, transparent) 20%, #FFF4D6 50%, color-mix(in srgb, var(--sec) 90%, transparent) 80%, transparent 100%);
    box-shadow: 0 0 14px 3px color-mix(in srgb, var(--sec) 50%, transparent);
    animation: laser-in .9s ease-out forwards;
}
.page-head.laser-section.is-in::before, .hero.laser-section.is-in::before, [data-fx="off"] .laser-section.is-in::before { display: none; }
[data-fx="off"] .header-laser { animation: none; }
@keyframes laser-in { 0% { transform: scaleX(0); opacity: 1; } 55% { transform: scaleX(1); opacity: 1; } 100% { transform: scaleX(1); opacity: 0; } }

@media (orientation: landscape) and (max-height: 520px) {
    .appbar { position: relative; }
    .appbar-in { padding-top: .45rem; padding-bottom: .3rem; }
    .chipnav { padding-bottom: .45rem; }
    .main { padding-top: .75rem; }
    html { scroll-padding-top: 0; }
    .nav-mobile > a, .nav-mobile > button { min-height: 2.75rem; padding: .1rem 0; }
    .nav-center-circle { width: 2.75rem; height: 2.75rem; margin-top: -1rem; }
    body { padding-bottom: calc(3.6rem + env(safe-area-inset-bottom)); }
}

[data-fx="low"] .appbar, [data-fx="low"] .nav-mobile, [data-fx="off"] .appbar, [data-fx="off"] .nav-mobile {
    -webkit-backdrop-filter: none; backdrop-filter: none; background: color-mix(in srgb, var(--bg) 97%, transparent);
}
:is([data-fx="mid"], [data-fx="high"]):not([data-theme="light"]) .bg-dust { display: block; }
:is([data-fx="mid"], [data-fx="high"]) .tpl-home .bg-dust i { animation: dust-a 46s linear infinite; }
.bg-dust::before, .bg-dust::after { display: none; }
[data-fx="high"] .tpl-home .bg-dust::before { display: block; animation: dust-b 70s linear infinite; }
[data-fx="high"] .tpl-home .bg-dust::after { display: block; animation: dust-c 34s linear infinite; }
[data-fx="high"] .tpl-home .bg-grid::before { animation: grid-drift 32s linear infinite; }
@media (min-width: 701px) {
    [data-fx="high"]:not([data-theme="light"]) .tpl-home .bg-grain { display: block; }
}
@keyframes dust-a { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, -22rem, 0); } }
@keyframes dust-b { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, -31rem, 0); } }
@keyframes dust-c { from { transform: translate3d(0, 0, 0); } to { transform: translate3d(0, -17rem, 0); } }
@keyframes grid-drift { to { transform: translate3d(3rem, 3rem, 0); } }

@media (prefers-reduced-motion: reduce) {
    *, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
    .bg-grain, .bg-dust { display: none !important; }
}
@media print {
    .appbar, .nav-mobile, .bg-layers, .site-footer, .toc, .prevnext { display: none !important; }
    body { background: #fff; color: #000; }
    .page-title, .hero-title { background: none; color: #000; }
    .hero, .page-head { box-shadow: none; background: none; }
}