/* ==========================================================================
   Livecoin — "Blueprint Terminal"
   Palette from the logo: electric blue gradient, cyan accents, slate ".net".
   ========================================================================== */

:root {
	--blue-700: #0B5BC4;
	--blue-600: #1273E6;
	--blue-500: #1E9BF0;
	--cyan-400: #3DD5FF;
	--cyan-300: #5CE1FF;
	--slate-400: #8AA6CC;
	--slate-300: #B7C8E2;

	--ink: #07111F;
	--ink-2: #0C1A2E;
	--ink-3: #13243D;
	--text: #0B1B33;
	--muted: #53627A;
	--bg: #F4F8FE;
	--paper: #FFFFFF;
	--line: #DCE6F5;
	--line-2: #C9D8EE;
	--up: #12B886;
	--down: #E5484D;

	--grad: linear-gradient(100deg, var(--blue-600) 0%, var(--blue-500) 55%, var(--cyan-400) 100%);
	--grid: rgba(18, 115, 230, .055);

	--f-head: "Space Grotesk", ui-sans-serif, system-ui, sans-serif;
	--f-body: "Inter", ui-sans-serif, system-ui, -apple-system, "Segoe UI", sans-serif;
	--f-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;

	--r: 14px;
	--r-sm: 8px;
	--shadow: 0 1px 2px rgba(7, 17, 31, .05), 0 8px 24px -12px rgba(7, 17, 31, .18);
	--shadow-hi: 0 2px 4px rgba(7, 17, 31, .06), 0 20px 40px -18px rgba(18, 115, 230, .45);
	--wrap: 1240px;
	--gut: clamp(16px, 3vw, 28px);
	--cat: var(--blue-600);
}

/* ---------- Reset / base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; scroll-padding-top: 90px; }
body {
	margin: 0;
	font: 400 16px/1.6 var(--f-body);
	color: var(--text);
	background-color: var(--bg);
	background-image:
		linear-gradient(var(--grid) 1px, transparent 1px),
		linear-gradient(90deg, var(--grid) 1px, transparent 1px);
	background-size: 32px 32px;
	-webkit-font-smoothing: antialiased;
	text-rendering: optimizeLegibility;
	overflow-x: clip;
}
img, svg, video { max-width: 100%; height: auto; display: block; }
a { color: inherit; text-decoration: none; }
a:hover { color: var(--blue-600); }
h1, h2, h3, h4 { font-family: var(--f-head); line-height: 1.15; margin: 0; letter-spacing: -.01em; color: var(--ink); }
p { margin: 0 0 1em; }
ul, ol { margin: 0; padding: 0; list-style: none; }
button { font: inherit; cursor: pointer; }
:focus-visible { outline: 2px solid var(--blue-500); outline-offset: 3px; border-radius: 4px; }

.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: absolute; left: 12px; top: -60px; z-index: 1000;
	background: var(--ink); color: #fff; padding: 10px 16px; border-radius: var(--r-sm);
	transition: top .15s;
}
.skip-link:focus { top: 12px; color: #fff; }
.site-main:focus { outline: none; }

.wrap { width: 100%; max-width: var(--wrap); margin: 0 auto; padding: 0 var(--gut); }
.wrap--narrow { max-width: 860px; }

.btn {
	display: inline-flex; align-items: center; gap: 8px;
	border: 0; border-radius: 999px; padding: 11px 20px;
	background: var(--grad); color: #fff; font-weight: 600; font-size: 15px;
	box-shadow: 0 8px 20px -10px rgba(18, 115, 230, .8);
	transition: transform .15s, box-shadow .15s;
}
.btn:hover { color: #fff; transform: translateY(-1px); box-shadow: 0 12px 24px -10px rgba(18, 115, 230, .9); }

/* ---------- Live dot / candles ---------- */
.live-dot {
	display: inline-block; width: 8px; height: 8px; border-radius: 50%;
	background: var(--up); box-shadow: 0 0 0 0 rgba(18, 184, 134, .6);
	animation: pulse 2s infinite; vertical-align: middle;
}
@keyframes pulse {
	0% { box-shadow: 0 0 0 0 rgba(18, 184, 134, .55); }
	70% { box-shadow: 0 0 0 8px rgba(18, 184, 134, 0); }
	100% { box-shadow: 0 0 0 0 rgba(18, 184, 134, 0); }
}
.candles line { stroke-width: 1.2; }
.candles .up { fill: var(--cat); stroke: var(--cat); }
.candles .dn { fill: var(--slate-300); stroke: var(--slate-300); }

/* ---------- Ticker ---------- */
.ticker {
	display: flex; align-items: center; gap: 14px;
	background: var(--ink); color: #D9E6F7;
	font: 500 12.5px/1 var(--f-mono);
	height: 36px; padding: 0 var(--gut); overflow: hidden;
	border-bottom: 1px solid rgba(61, 213, 255, .18);
}
.ticker__label { display: inline-flex; align-items: center; gap: 8px; color: #fff; text-transform: uppercase; letter-spacing: .12em; flex: none; }
.ticker__src { flex: none; color: var(--slate-400); font-size: 11px; }
.ticker__viewport {
	flex: 1; display: flex; overflow: hidden; min-width: 0;
	mask-image: linear-gradient(90deg, transparent, #000 40px, #000 calc(100% - 40px), transparent);
}
.ticker__track { display: flex; flex: none; gap: 28px; padding-right: 28px; animation: marquee 45s linear infinite; }
.ticker:hover .ticker__track { animation-play-state: paused; }
@keyframes marquee { to { transform: translateX(-100%); } }
.tick { display: inline-flex; gap: 8px; align-items: center; white-space: nowrap; }
.tick b { color: #fff; font-weight: 600; }
.tick__price { color: #C8D6EA; }
.tick.is-up .tick__chg { color: #33E0A1; }
.tick.is-down .tick__chg { color: #FF7A7E; }
.tick.is-up .tick__chg::before { content: "▲ "; font-size: 9px; }
.tick.is-down .tick__chg::before { content: "▼ "; font-size: 9px; }

/* ---------- Header ---------- */
.site-header {
	position: sticky; top: 0; z-index: 50;
	background: rgba(255, 255, 255, .88);
	backdrop-filter: saturate(1.4) blur(14px);
	-webkit-backdrop-filter: saturate(1.4) blur(14px);
	border-bottom: 1px solid var(--line);
}
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }
@media (max-width: 600px) { .admin-bar .site-header { top: 0; } }
.site-header__bar { display: flex; align-items: center; gap: 28px; height: 70px; }
.logo { display: block; flex: none; }
.logo img { width: 190px; height: auto; }
.nav { flex: 1; min-width: 0; }
.nav__list { display: flex; gap: 4px; flex-wrap: nowrap; overflow-x: auto; scrollbar-width: none; }
.nav__list::-webkit-scrollbar { display: none; }
.nav__list a, .nav .menu-item a {
	display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
	padding: 8px 12px; border-radius: 999px;
	font: 600 14px/1 var(--f-head); color: var(--text);
	transition: background .15s, color .15s;
}
.nav__list a::before {
	content: ""; width: 4px; height: 14px; border-radius: 2px;
	background: var(--cat, var(--blue-600));
	box-shadow: 0 -3px 0 -1px var(--cat, var(--blue-600)), 0 3px 0 -1px var(--cat, var(--blue-600));
}
.nav__list a:hover, .nav__item.is-current a, .nav .current-menu-item a {
	background: color-mix(in srgb, var(--cat, var(--blue-600)) 12%, transparent); color: var(--ink);
}
.site-header__tools { display: flex; gap: 6px; margin-left: auto; }
.icon-btn {
	width: 42px; height: 42px; display: grid; place-items: center;
	border: 1px solid var(--line); border-radius: 12px; background: var(--paper); color: var(--ink);
	transition: border-color .15s, color .15s;
}
.icon-btn:hover { border-color: var(--blue-500); color: var(--blue-600); }
.icon-btn--menu { display: none; }
.burger { display: grid; gap: 4px; }
.burger i { display: block; width: 18px; height: 2px; background: currentColor; border-radius: 2px; transition: transform .2s, opacity .2s; }
[aria-expanded="true"] .burger i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
[aria-expanded="true"] .burger i:nth-child(2) { opacity: 0; }
[aria-expanded="true"] .burger i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.site-search { border-top: 1px solid var(--line); background: var(--paper); padding: 16px 0; }
.search-form {
	display: flex; align-items: center; gap: 10px;
	background: var(--paper); border: 1px solid var(--line-2); border-radius: 999px; padding: 6px 6px 6px 18px;
	box-shadow: var(--shadow);
}
.search-form:focus-within { border-color: var(--blue-500); box-shadow: 0 0 0 4px rgba(30, 155, 240, .15); }
.search-form__prompt { font: 600 14px var(--f-mono); color: var(--blue-600); }
.search-form__input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font: 16px var(--f-body); color: var(--ink); padding: 8px 0; }

/* ---------- Badges / meta ---------- */
.badge {
	display: inline-flex; align-items: center; gap: 7px;
	font: 600 11px/1 var(--f-mono); text-transform: uppercase; letter-spacing: .08em;
	color: var(--ink); background: color-mix(in srgb, var(--cat) 16%, #fff);
	border: 1px solid color-mix(in srgb, var(--cat) 35%, transparent);
	padding: 6px 10px; border-radius: 999px;
}
.badge__candle { width: 3px; height: 10px; border-radius: 1px; background: var(--cat); box-shadow: 0 -2px 0 -1px var(--cat), 0 2px 0 -1px var(--cat); }
.meta {
	display: flex; flex-wrap: wrap; align-items: center; gap: 6px;
	font: 500 12px/1.4 var(--f-mono); color: var(--muted);
}
.meta__sep { opacity: .5; }
.meta__author { color: var(--text); font-weight: 600; }

/* ---------- Cards ---------- */
.card { position: relative; display: flex; flex-direction: column; min-width: 0; }
.card__title { font-size: 18px; font-weight: 600; line-height: 1.25; }
.card__title a { background-image: linear-gradient(currentColor, currentColor); background-size: 0 1.5px; background-repeat: no-repeat; background-position: 0 100%; transition: background-size .25s; }
.card:hover .card__title a { background-size: 100% 1.5px; }
.card__excerpt { color: var(--muted); font-size: 15px; line-height: 1.55; margin: 0; }
.card__body { display: flex; flex-direction: column; gap: 10px; }
.media { display: block; position: relative; overflow: hidden; background: var(--ink-2); }
.media__img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2, .7, .2, 1); }
.card:hover .media__img { transform: scale(1.045); }
.media__fallback {
	display: grid; place-items: center; width: 100%; height: 100%; min-height: 160px;
	background: radial-gradient(circle at 30% 30%, color-mix(in srgb, var(--cat) 55%, var(--ink)), var(--ink));
	font: 700 28px var(--f-mono); color: rgba(255, 255, 255, .85); letter-spacing: .1em;
}

/* stack */
.card--stack {
	background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
	overflow: hidden; box-shadow: var(--shadow); transition: transform .2s, box-shadow .2s, border-color .2s;
}
.card--stack:hover { transform: translateY(-3px); box-shadow: var(--shadow-hi); border-color: color-mix(in srgb, var(--cat) 45%, var(--line)); }
.card--stack .card__media { aspect-ratio: 16 / 9; }
.card--stack .card__body { padding: 16px 18px 18px; flex: 1; }
.card--stack .meta { margin-top: auto; }
.card--stack::after {
	content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--cat);
	transform: scaleX(0); transform-origin: left; transition: transform .3s;
}
.card--stack:hover::after { transform: scaleX(1); }

/* overlay */
.card--overlay { border-radius: var(--r); overflow: hidden; isolation: isolate; min-height: 220px; background: var(--ink); box-shadow: var(--shadow); }
.card--overlay .card__media { position: absolute; inset: 0; z-index: -2; }
.card--overlay::before {
	content: ""; position: absolute; inset: 0; z-index: -1;
	background: linear-gradient(180deg, rgba(7, 17, 31, 0) 25%, rgba(7, 17, 31, .55) 55%, rgba(7, 17, 31, .94) 100%);
}
.card--overlay .card__body { margin-top: auto; padding: 20px; color: #fff; position: relative; }
.card--overlay .card__title, .card--overlay .card__title a { color: #fff; }
.card--overlay .card__excerpt { color: rgba(233, 241, 252, .85); }
.card--overlay .meta { color: rgba(214, 228, 247, .78); }
.card--overlay .meta__author { color: #fff; }
.card--overlay .badge { background: rgba(7, 17, 31, .55); color: #fff; border-color: color-mix(in srgb, var(--cat) 60%, transparent); backdrop-filter: blur(6px); align-self: flex-start; }
.card--overlay:hover { box-shadow: var(--shadow-hi); }
.card--overlay.is-lead .card__title, .bento__1 .card__title { font-size: clamp(24px, 3vw, 34px); line-height: 1.1; }

/* row */
.card--row { flex-direction: row; gap: 14px; align-items: flex-start; }
.card--row .card__media { flex: none; width: 128px; aspect-ratio: 16 / 10; border-radius: var(--r-sm); }
.card--row .card__title { font-size: 16px; }
.card--row .card__body { gap: 6px; }

/* text */
.card--text .card__title { font-size: 20px; }

/* mini */
.card--mini { padding: 14px 16px 14px 18px; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r-sm); border-left: 3px solid var(--cat); }
.card--mini .card__title { font-size: 16px; }
.card--mini .card__body { gap: 8px; }

/* ---------- Hero ---------- */
.hero { padding: 34px 0 28px; }
.hero__intro { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 24px; margin-bottom: 22px; }
.hero__date { display: inline-flex; align-items: center; gap: 10px; margin: 0; font: 500 12px var(--f-mono); color: var(--muted); text-transform: uppercase; letter-spacing: .1em; order: 2; }
.hero__title {
	font-size: clamp(28px, 3.6vw, 46px); font-weight: 700; letter-spacing: -.03em; max-width: 24ch;
	background: linear-gradient(100deg, var(--ink) 30%, var(--blue-600) 75%, var(--cyan-400));
	-webkit-background-clip: text; background-clip: text; color: transparent;
}
.hero__grid { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 20px; }
.bento { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(240px, auto)); gap: 14px; }
/* The wire never sets the hero height — it fills the bento's height and scrolls. */
.hero__grid .wire { contain: size; overflow-y: auto; scrollbar-width: thin; scrollbar-color: #2A3D59 transparent; }
.bento__1 { grid-column: span 2; grid-row: span 2; min-height: 460px; }
.bento__1 .card__body { padding: 28px; gap: 12px; }
.bento .card:not(.bento__1) .card__title { font-size: 16.5px; }
.bento .card:not(.bento__1) .card__body { padding: 16px; gap: 8px; }

.wire {
	position: relative;
	background: var(--ink); color: #DCE8F8; border-radius: var(--r); padding: 20px 20px 10px;
	background-image: linear-gradient(rgba(61, 213, 255, .06) 1px, transparent 1px), linear-gradient(90deg, rgba(61, 213, 255, .06) 1px, transparent 1px);
	background-size: 20px 20px;
	border: 1px solid rgba(61, 213, 255, .2);
}
.wire__title { display: flex; align-items: center; gap: 10px; color: #fff; font-size: 14px; text-transform: uppercase; letter-spacing: .14em; font-family: var(--f-mono); margin-bottom: 8px; }
.wire__list li {
	position: relative; display: grid; grid-template-columns: 50px 1fr; gap: 2px 10px;
	padding: 12px 0; border-top: 1px dashed rgba(138, 166, 204, .25);
}
.wire__list li:first-child { border-top: 0; }
.wire__time { font: 500 11.5px var(--f-mono); color: var(--cyan-300); padding-top: 3px; }
.wire__head { font: 500 14.5px/1.35 var(--f-body); color: #fff; }
.wire__head a:hover { color: var(--cyan-300); }
.wire__cat { grid-column: 2; font: 600 10.5px var(--f-mono); color: var(--cat); letter-spacing: .1em; }

/* ---------- Category tiles ---------- */
.tiles { padding: 30px 0 10px; }
.tiles__title { font-size: 13px; font-family: var(--f-mono); font-weight: 600; text-transform: uppercase; letter-spacing: .14em; color: var(--muted); margin-bottom: 14px; }
.tiles__grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 12px; }
.tile a {
	position: relative; display: flex; flex-direction: column; gap: 4px; height: 100%;
	padding: 16px 16px 14px; background: var(--paper); border: 1px solid var(--line); border-radius: var(--r);
	overflow: hidden; transition: transform .2s, box-shadow .2s, border-color .2s;
}
.tile a::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 3px; background: var(--cat); }
.tile a:hover { transform: translateY(-3px); box-shadow: var(--shadow-hi); border-color: color-mix(in srgb, var(--cat) 50%, var(--line)); color: inherit; }
.tile__sym { font: 700 20px var(--f-mono); color: var(--cat); letter-spacing: .04em; filter: saturate(1.1) brightness(.92); }
.tile__name { font: 600 14.5px/1.25 var(--f-head); color: var(--ink); }
.tile__count { font: 500 11.5px var(--f-mono); color: var(--muted); }
.tile__spark { margin-top: 8px; opacity: .85; }

/* ---------- Category blocks ---------- */
.cat-block { padding: 56px 0; position: relative; }
.cat-head {
	display: grid; grid-template-columns: auto 1fr auto auto; align-items: center; gap: 18px 22px;
	padding-bottom: 18px; margin-bottom: 24px; border-bottom: 1px dashed var(--line-2); position: relative;
}
.cat-head::after { content: ""; position: absolute; left: 0; bottom: -1px; width: 80px; height: 2px; background: var(--cat); }
.cat-head__index {
	width: 62px; height: 62px; display: grid; place-content: center; text-align: center;
	border-radius: 14px; background: var(--paper); border: 1px solid color-mix(in srgb, var(--cat) 45%, var(--line));
	box-shadow: inset 0 -3px 0 var(--cat);
	font-family: var(--f-mono);
}
.cat-head__index span { font-size: 11px; color: var(--muted); line-height: 1; }
.cat-head__index b { font-size: 14px; color: var(--ink); line-height: 1.3; }
.cat-head__kicker { margin: 0 0 4px; font: 600 11.5px var(--f-mono); color: var(--muted); text-transform: uppercase; letter-spacing: .14em; }
.cat-head__title { font-size: clamp(24px, 3vw, 34px); font-weight: 700; letter-spacing: -.02em; }
.cat-head__title a:hover { color: inherit; text-decoration: underline; text-decoration-color: var(--cat); text-decoration-thickness: 3px; text-underline-offset: 6px; }
.cat-head__more {
	display: inline-flex; align-items: center; gap: 8px; white-space: nowrap;
	font: 600 13.5px var(--f-head); padding: 10px 16px; border-radius: 999px;
	border: 1px solid var(--line-2); background: var(--paper); transition: border-color .15s, background .15s;
}
.cat-head__more:hover { border-color: var(--cat); background: color-mix(in srgb, var(--cat) 10%, #fff); color: var(--ink); }
.cat-head--compact { grid-template-columns: 1fr auto; }

/* Bitcoin — feature + list */
.g-feature-list { display: grid; grid-template-columns: minmax(0, 1.45fr) minmax(0, 1fr); gap: 24px; }
.g-feature-list .is-lead { min-height: 470px; }
.g-feature-list__list { display: grid; gap: 4px; align-content: start; }
.g-feature-list__list .card { padding: 14px; border-radius: var(--r); transition: background .15s; }
.g-feature-list__list .card:hover { background: var(--paper); box-shadow: var(--shadow); }

/* Ethereum — 4 cards */
.g-cards-4 { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }

/* DeFi — mosaic */
.g-mosaic { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); grid-template-rows: repeat(2, minmax(230px, auto)); gap: 14px; }
.g-mosaic__1 { grid-row: span 2; }
.g-mosaic__1 .card__title { font-size: 26px; }
.g-mosaic .card:not(.g-mosaic__1) .card__title { font-size: 16.5px; }
.g-mosaic .card:not(.g-mosaic__1) .card__body { padding: 16px; gap: 8px; }
.g-mosaic__2 { grid-column: 2; }
.g-mosaic__5 { grid-column: 3; grid-row: 2; }
/* 5 items => col 2 rows 1-2, col 3 rows 1-2 */
.g-mosaic__3 { grid-column: 3; grid-row: 1; }
.g-mosaic__4 { grid-column: 2; grid-row: 2; }

/* Markets — dark terminal */
.cat-block.is-dark {
	background: var(--ink); color: #DCE8F8;
	background-image:
		radial-gradient(ellipse at 80% 0%, rgba(30, 155, 240, .25), transparent 55%),
		linear-gradient(rgba(61, 213, 255, .06) 1px, transparent 1px),
		linear-gradient(90deg, rgba(61, 213, 255, .06) 1px, transparent 1px);
	background-size: auto, 32px 32px, 32px 32px;
}
.is-dark .cat-head { border-bottom-color: rgba(138, 166, 204, .28); }
.is-dark .cat-head__title, .is-dark .cat-head__index b { color: #fff; }
.is-dark .cat-head__kicker, .is-dark .cat-head__index span { color: var(--slate-400); }
.is-dark .cat-head__index { background: var(--ink-2); }
.is-dark .cat-head__more { background: transparent; color: #fff; border-color: rgba(138, 166, 204, .4); }
.is-dark .cat-head__more:hover { background: rgba(61, 213, 255, .1); color: #fff; }
.is-dark .candles .dn { fill: #3A5170; stroke: #3A5170; }
.g-terminal { border: 1px solid rgba(61, 213, 255, .25); border-radius: var(--r); background: rgba(12, 26, 46, .75); overflow: hidden; box-shadow: 0 30px 60px -30px rgba(0, 0, 0, .6), 0 0 0 1px rgba(61, 213, 255, .05) inset; }
.g-terminal__chrome { display: flex; align-items: center; gap: 7px; padding: 10px 14px; border-bottom: 1px solid rgba(61, 213, 255, .15); font: 500 12px var(--f-mono); color: var(--slate-400); }
.g-terminal__chrome i { width: 10px; height: 10px; border-radius: 50%; background: #2A3D59; }
.g-terminal__chrome i:first-child { background: var(--down); }
.g-terminal__chrome i:nth-child(2) { background: #FFB547; }
.g-terminal__chrome i:nth-child(3) { background: var(--up); }
.g-terminal__chrome span { margin-left: 8px; }
.g-terminal__body { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); }
.g-terminal .card--stack { background: transparent; border: 0; border-radius: 0; box-shadow: none; border-right: 1px solid rgba(61, 213, 255, .15); }
.g-terminal .card--stack:hover { transform: none; }
.g-terminal .card--stack .card__body { padding: 20px 22px 24px; }
.g-terminal .card__title, .g-terminal .card__title a { color: #fff; }
.g-terminal .is-lead .card__title { font-size: 26px; }
.g-terminal .card__excerpt { color: #A9BCD6; }
.g-terminal .meta { color: var(--slate-400); }
.g-terminal__list li {
	display: grid; grid-template-columns: 48px 1fr auto; gap: 14px; align-items: center;
	padding: 20px 22px; border-bottom: 1px solid rgba(61, 213, 255, .1);
	transition: background .15s;
}
.g-terminal__list li:last-child { border-bottom: 0; }
.g-terminal__list li:hover { background: rgba(61, 213, 255, .05); }
.g-terminal__list .card__title { font-size: 16.5px; margin-bottom: 6px; }
.g-terminal__list .card__title a:hover { color: var(--cyan-300); }
.g-terminal__n { font: 600 13px var(--f-mono); color: var(--cyan-400); }

/* NFT — horizontal scroller */
.g-scroller { overflow-x: auto; scroll-snap-type: x mandatory; margin: 0 calc(var(--gut) * -1); padding: 4px var(--gut) 18px; scrollbar-width: thin; scrollbar-color: var(--cat) transparent; }
.g-scroller__track { display: grid; grid-auto-flow: column; grid-auto-columns: 280px; gap: 16px; }
.g-scroller .card { scroll-snap-align: start; aspect-ratio: 1 / 1.12; min-height: 0; }
.g-scroller .card::after {
	content: ""; position: absolute; inset: 0; border-radius: inherit; pointer-events: none;
	border: 1px solid transparent;
	background: linear-gradient(135deg, var(--cat), transparent 40%, transparent 60%, var(--cyan-400)) border-box;
	-webkit-mask: linear-gradient(#000 0 0) padding-box, linear-gradient(#000 0 0);
	-webkit-mask-composite: xor; mask-composite: exclude; opacity: .8;
}
.g-scroller .card__title { font-size: 17px; }

/* Regulation — numbered columns */
.g-numbered { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; counter-reset: n; border-top: 1px solid var(--line); }
.g-numbered > li { position: relative; padding: 22px 22px 24px; border-right: 1px solid var(--line); }
.g-numbered > li:last-child { border-right: 0; }
.g-numbered > li:hover { background: var(--paper); }
.g-numbered__n {
	display: block; margin-bottom: 14px;
	font: 700 54px/1 var(--f-head); letter-spacing: -.04em;
	color: transparent; -webkit-text-stroke: 1.5px var(--cat);
}
.g-numbered > li:hover .g-numbered__n { color: var(--cat); }

/* Tech — overlay duo + minis */
.g-duo { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.g-duo .card { min-height: 380px; }
.g-duo .card__title { font-size: clamp(20px, 2.4vw, 28px); }
.g-duo__minis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 16px; }

/* ---------- CTA ---------- */
.cta { padding: 20px 0 70px; }
.cta__inner {
	display: grid; grid-template-columns: 1fr minmax(0, 1.1fr); gap: 24px; align-items: center;
	padding: 32px; border-radius: 20px; color: #fff;
	background: var(--grad); box-shadow: var(--shadow-hi); position: relative; overflow: hidden;
}
.cta__inner::before {
	content: ""; position: absolute; inset: 0; pointer-events: none;
	background-image: linear-gradient(rgba(255, 255, 255, .09) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .09) 1px, transparent 1px);
	background-size: 24px 24px;
}
.cta h2 { color: #fff; font-size: 28px; margin-bottom: 6px; position: relative; }
.cta p { margin: 0; opacity: .9; position: relative; }
.cta .search-form { position: relative; border: 0; }

/* ---------- Breadcrumbs ---------- */
.crumbs ol { display: flex; flex-wrap: wrap; gap: 6px; font: 500 12.5px var(--f-mono); color: var(--muted); margin-bottom: 18px; }
.crumbs li { display: inline-flex; align-items: center; gap: 6px; max-width: 100%; }
.crumbs li + li::before { content: "/"; opacity: .5; }
.crumbs a:hover { color: var(--blue-600); }
.crumbs [aria-current] { color: var(--text); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; max-width: 46ch; }

/* ---------- Archive head ---------- */
.arch-head { position: relative; overflow: hidden; padding: 34px 0 30px; background: var(--paper); border-bottom: 1px solid var(--line); }
.arch-head::after { content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: linear-gradient(90deg, var(--cat), transparent 70%); }
.arch-head__bg { position: absolute; right: -40px; bottom: -10px; width: min(1200px, 110%); opacity: .14; pointer-events: none; }
.arch-head__bg svg { width: 100%; height: auto; }
.arch-head .wrap { position: relative; }
.arch-head__row { display: grid; grid-template-columns: auto 1fr auto; gap: 24px; align-items: center; }
.arch-head__sym {
	width: 92px; height: 92px; display: grid; place-items: center; border-radius: 22px;
	font: 700 22px var(--f-mono); color: #fff; letter-spacing: .04em;
	background: radial-gradient(circle at 30% 25%, color-mix(in srgb, var(--cat) 80%, #fff), var(--cat) 60%, color-mix(in srgb, var(--cat) 60%, var(--ink)));
	box-shadow: 0 16px 30px -14px var(--cat);
}
.arch-head__avatar { border-radius: 22px; }
.arch-head__title { font-size: clamp(30px, 4.5vw, 52px); font-weight: 700; letter-spacing: -.03em; }
.arch-head__page { color: var(--muted); font-weight: 500; font-size: .55em; }
.arch-head__desc { color: var(--muted); max-width: 70ch; margin: 10px 0 0; font-size: 17px; }
.arch-head__search { margin-top: 18px; max-width: 640px; }
.arch-head__stats { display: flex; gap: 12px; margin: 0; }
.arch-head__stats div { padding: 12px 16px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg); min-width: 110px; }
.arch-head__stats dt { font: 500 11px var(--f-mono); color: var(--muted); text-transform: uppercase; letter-spacing: .1em; }
.arch-head__stats dd { margin: 4px 0 0; font: 700 22px var(--f-head); color: var(--ink); }
.chips { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.chips a { display: inline-block; padding: 7px 14px; border: 1px solid var(--line-2); border-radius: 999px; font-size: 14px; font-weight: 500; background: var(--paper); }
.chips a:hover { border-color: var(--cat); }

.arch-body { padding-top: 30px; padding-bottom: 70px; }
.arch-lead { margin-bottom: 22px; }
.arch-lead .card { min-height: 460px; }
.arch-lead .card__body { max-width: 760px; padding: 32px; }
.arch-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px; }
.arch-grid .card__title { font-size: 19px; }
.empty { padding: 60px 0; text-align: center; color: var(--muted); }

.pager ul { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin-top: 40px; }
.pager a, .pager span {
	display: inline-flex; align-items: center; justify-content: center; min-width: 44px; height: 44px; padding: 0 14px;
	border: 1px solid var(--line-2); border-radius: 12px; background: var(--paper);
	font: 600 14px var(--f-mono);
}
.pager a:hover { border-color: var(--cat); color: var(--ink); }
.pager .current { background: var(--ink); color: #fff; border-color: var(--ink); }
.pager .dots { border: 0; background: transparent; }

/* ---------- Article ---------- */
.progress { position: fixed; left: 0; right: 0; top: 0; height: 3px; z-index: 60; pointer-events: none; }
.progress i { display: block; height: 100%; background: var(--grad); transform: scaleX(0); transform-origin: left; box-shadow: 0 0 10px var(--cyan-400); }
.article__head { padding: 34px 0 28px; }
/* Same outer width as .article__layout (rail 220 + gap 56 + main 740). */
.article__head-wrap { max-width: calc(220px + 56px + 740px + 2 * var(--gut)); }
.article__head .badge { margin-bottom: 16px; }
.article__title { font-size: clamp(30px, 4.6vw, 52px); font-weight: 700; letter-spacing: -.03em; line-height: 1.08; }
.article__dek { font-size: clamp(18px, 2vw, 21px); line-height: 1.5; color: var(--muted); margin: 18px 0 0; }
.byline { display: flex; align-items: center; gap: 12px; margin-top: 26px; padding-top: 20px; border-top: 1px dashed var(--line-2); }
.byline__avatar { border-radius: 50%; }
.byline__text { display: flex; flex-direction: column; gap: 2px; font-size: 14.5px; }
.byline__text a { font-weight: 600; color: var(--ink); }
.byline__dates { font: 500 12.5px var(--f-mono); color: var(--muted); }
.byline__read { margin-left: auto; font: 600 12px var(--f-mono); padding: 7px 12px; border-radius: 999px; background: color-mix(in srgb, var(--cat) 14%, #fff); color: var(--ink); white-space: nowrap; }
.article__hero { margin: 0 0 32px; }
.article__hero img { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--r); box-shadow: var(--shadow); }
.article__hero figcaption { font-size: 13px; color: var(--muted); margin-top: 10px; }

.article__layout { display: grid; grid-template-columns: 220px minmax(0, 740px); gap: 56px; justify-content: center; align-items: start; padding-top: 8px; padding-bottom: 60px; }
/* Rail stretches to the article height so its content can stick while scrolling. */
.article__rail { align-self: stretch; }
.rail-sticky { position: sticky; top: 96px; display: grid; gap: 28px; }
.admin-bar .rail-sticky { top: 128px; }
.toc__title, .share__title { font: 600 11.5px var(--f-mono); text-transform: uppercase; letter-spacing: .14em; color: var(--muted); margin-bottom: 10px; }
.toc ol { border-left: 2px solid var(--line); counter-reset: toc; }
.toc li { counter-increment: toc; }
.toc a { display: block; padding: 6px 0 6px 14px; margin-left: -2px; border-left: 2px solid transparent; font-size: 14px; line-height: 1.35; color: var(--muted); }
.toc a::before { content: counter(toc, decimal-leading-zero) " "; font: 500 11px var(--f-mono); color: var(--slate-400); }
.toc a:hover, .toc a.is-active { color: var(--ink); border-left-color: var(--cat); }
.share { display: flex; flex-wrap: wrap; gap: 8px; }
.share__title { width: 100%; margin-bottom: 2px; }
.share__btn { display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px 7px 8px; border-radius: 10px; border: 1px solid var(--line-2); background: var(--paper); font-size: 13px; font-weight: 600; color: var(--ink); }
.share__btn:hover { border-color: var(--cat); color: var(--ink); }
.share__icon { width: 20px; height: 20px; border-radius: 5px; flex: none; }
.share__btn:not(:has(.share__icon)) { padding-left: 12px; }

.prose { font-size: 18px; line-height: 1.75; color: #1A2A42; }
.prose > * { margin-top: 0; margin-bottom: 0; }
.prose > * + * { margin-top: 1.2em; }
.prose li p, .prose blockquote p, .prose .keytakeaways p { margin: 0; }
.prose > p:first-child::first-letter { float: left; font: 700 3.6em/.85 var(--f-head); margin: .08em .1em 0 0; color: var(--cat); }
.prose h2 { font-size: 28px; margin-top: 1.8em; padding-left: 16px; position: relative; }
.prose h2::before { content: ""; position: absolute; left: 0; top: .15em; bottom: .15em; width: 4px; border-radius: 2px; background: var(--cat); }
.prose h3 { font-size: 22px; margin-top: 1.6em; }
.prose a { color: var(--blue-600); text-decoration: underline; text-decoration-thickness: 1.5px; text-underline-offset: 3px; }
.prose a:hover { color: var(--blue-700); }
.prose ul, .prose ol { padding-left: 1.3em; }
.prose ul { list-style: none; padding-left: 0; }
.prose ul li { position: relative; padding-left: 22px; }
.prose ul li::before { content: ""; position: absolute; left: 4px; top: .7em; width: 8px; height: 8px; border-radius: 2px; background: var(--cat); transform: rotate(45deg); }
.prose ol { list-style: decimal; }
.prose li + li { margin-top: .45em; }
.prose blockquote {
	margin: 1.8em 0; padding: 22px 26px; border-radius: var(--r); background: var(--paper);
	border: 1px solid var(--line); border-left: 4px solid var(--cat); font-size: 20px; font-family: var(--f-head); color: var(--ink);
}
.prose blockquote p { margin: 0; }
.prose blockquote cite { display: block; margin-top: 10px; font: 500 13px var(--f-mono); color: var(--muted); font-style: normal; }
.prose img, .prose figure { border-radius: 12px; }
.prose figure { margin: 1.8em 0; }
.prose figcaption { font-size: 13.5px; color: var(--muted); margin-top: 8px; }
.prose table { width: 100%; border-collapse: collapse; font-size: 15px; background: var(--paper); border: 1px solid var(--line); border-radius: 12px; overflow: hidden; display: block; overflow-x: auto; }
.prose th, .prose td { padding: 11px 14px; text-align: left; border-bottom: 1px solid var(--line); white-space: nowrap; }
.prose th { background: var(--ink); color: #fff; font: 600 12px var(--f-mono); text-transform: uppercase; letter-spacing: .08em; }
.prose td { font-family: var(--f-mono); font-size: 14px; }
.prose code { font: 14px var(--f-mono); background: #E8F0FB; padding: 2px 6px; border-radius: 5px; }
.prose pre { background: var(--ink); color: #DCE8F8; padding: 18px; border-radius: 12px; overflow-x: auto; }
.prose pre code { background: none; padding: 0; color: inherit; }
.prose .keytakeaways, .prose .wp-block-group.is-style-takeaways {
	padding: 22px 24px; border-radius: var(--r); background: linear-gradient(135deg, color-mix(in srgb, var(--cat) 10%, #fff), #fff);
	border: 1px solid color-mix(in srgb, var(--cat) 35%, var(--line));
}
.prose .keytakeaways h2 { margin-top: 0; font-size: 18px; font-family: var(--f-mono); text-transform: uppercase; letter-spacing: .1em; padding-left: 0; }
.prose .keytakeaways h2::before { display: none; }
.prose .keytakeaways ul { margin-top: 12px; }

.tags { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 36px; }
.tags a { display: inline-block; padding: 7px 12px; border-radius: 8px; background: var(--paper); border: 1px solid var(--line); font: 500 13px var(--f-mono); }
.tags a:hover { border-color: var(--cat); color: var(--ink); }
.page-links { margin-top: 24px; font-family: var(--f-mono); }

.related { padding: 50px 0 70px; background: var(--paper); border-top: 1px solid var(--line); }

.comments { margin-top: 40px; }
.comments__title { font-size: 22px; margin-bottom: 16px; }
.comments__list .comment { padding: 16px 0; border-top: 1px solid var(--line); }
.comment-form input[type="text"], .comment-form input[type="email"], .comment-form input[type="url"], .comment-form textarea {
	width: 100%; padding: 12px 14px; border: 1px solid var(--line-2); border-radius: 10px; font: inherit; background: var(--paper);
}
.comment-form label { display: block; font-weight: 600; font-size: 14px; margin-bottom: 6px; }

/* ---------- 404 ---------- */
.nf { padding: 70px 0 50px; text-align: center; }
.nf__code { font: 700 clamp(90px, 18vw, 180px)/1 var(--f-head); letter-spacing: -.06em; margin: 0; background: var(--grad); -webkit-background-clip: text; background-clip: text; color: transparent; }
.nf__code span { font: 600 18px var(--f-mono); color: var(--down); -webkit-text-fill-color: var(--down); letter-spacing: 0; vertical-align: top; margin-left: 8px; }
.nf .arch-head__desc { margin-left: auto; margin-right: auto; }
.nf__search { max-width: 560px; margin: 26px auto 0; }

/* ---------- Footer ---------- */
.site-footer { position: relative; background: var(--ink); color: #A9BCD6; overflow: hidden; }
.site-footer__grid-bg {
	position: absolute; inset: 0; pointer-events: none;
	background-image: radial-gradient(ellipse at 10% 0%, rgba(30, 155, 240, .22), transparent 50%), linear-gradient(rgba(61, 213, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(61, 213, 255, .05) 1px, transparent 1px);
	background-size: auto, 32px 32px, 32px 32px;
}
.site-footer .wrap { position: relative; }
.site-footer__top { display: grid; grid-template-columns: 1.4fr 1fr 1fr; gap: 40px; padding-top: 56px; padding-bottom: 40px; }
.site-footer__brand p { max-width: 42ch; margin-top: 16px; font-size: 15px; }
.site-footer__title { font: 600 11.5px var(--f-mono); text-transform: uppercase; letter-spacing: .14em; color: #fff; margin-bottom: 14px; }
.site-footer__col li { margin-bottom: 9px; }
.site-footer__col li[style] a::before { content: ""; display: inline-block; width: 3px; height: 11px; border-radius: 1px; background: var(--cat); margin-right: 10px; vertical-align: -1px; }
.site-footer a:hover { color: var(--cyan-300); }
.site-footer__bottom { display: flex; flex-wrap: wrap; gap: 8px 24px; align-items: center; padding-top: 20px; padding-bottom: 28px; border-top: 1px solid rgba(138, 166, 204, .18); font-size: 13px; }
.site-footer__bottom p { margin: 0; }
.site-footer__disclaimer { color: #7F93B0; flex: 1; }
.to-top { font: 600 12px var(--f-mono); color: #fff; }

/* ---------- Responsive ---------- */
@media (max-width: 1180px) {
	.hero__grid { grid-template-columns: 1fr; }
	.hero__grid .wire { contain: none; overflow: visible; }
	.wire__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: 24px; }
	.wire__list li:nth-child(2) { border-top: 0; }
	.tiles__grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
	.g-cards-4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.g-numbered { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.g-numbered > li:nth-child(2) { border-right: 0; }
	.g-numbered > li:nth-child(n+3) { border-top: 1px solid var(--line); }
	.article__layout { grid-template-columns: 190px minmax(0, 1fr); gap: 36px; }
	.article__head-wrap { max-width: var(--wrap); }
}

@media (max-width: 1240px) {
	/* backdrop-filter would become the containing block of the fixed nav panel. */
	.site-header { backdrop-filter: none; -webkit-backdrop-filter: none; background: var(--paper); }
	.site-header__bar { height: 62px; gap: 12px; }
	.icon-btn--menu { display: grid; }
	.nav {
		position: fixed; left: 0; right: 0; top: var(--nav-top, 98px); bottom: 0; z-index: 49;
		background: var(--paper); padding: 16px var(--gut) 40px; overflow-y: auto;
		transform: translateY(-8px); opacity: 0; visibility: hidden; transition: opacity .2s, transform .2s, visibility .2s;
	}
	.nav.is-open { transform: none; opacity: 1; visibility: visible; }
	.nav__list { flex-direction: column; overflow: visible; gap: 2px; }
	.nav__list a, .nav .menu-item a { font-size: 18px; padding: 14px 12px; border-radius: 12px; display: flex; }
	body.nav-open { overflow: hidden; }
}

@media (max-width: 960px) {
	.article__layout { grid-template-columns: minmax(0, 1fr); gap: 0; }
	.article__rail { order: 2; margin-top: 30px; }
	.rail-sticky { position: static; }
	.toc { display: none; }
	.bento { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; }
	.bento__1 { grid-column: span 2; grid-row: auto; min-height: 400px; }
	.g-feature-list, .g-terminal__body, .g-duo { grid-template-columns: 1fr; }
	.g-terminal .card--stack { border-right: 0; border-bottom: 1px solid rgba(61, 213, 255, .15); }
	.g-mosaic { grid-template-columns: repeat(2, minmax(0, 1fr)); grid-template-rows: none; }
	.g-mosaic .card { grid-column: auto !important; grid-row: auto !important; }
	.g-mosaic__1 { grid-column: span 2 !important; min-height: 380px; }
	.g-duo__minis { grid-template-columns: 1fr; }
	.arch-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.arch-head__row { grid-template-columns: auto 1fr; }
	.arch-head__stats { grid-column: 1 / -1; }
	.cat-head { grid-template-columns: auto 1fr auto; }
	.cat-head__spark { display: none; }
	.cta__inner { grid-template-columns: 1fr; }
	.site-footer__top { grid-template-columns: 1fr 1fr; }
	.site-footer__brand { grid-column: 1 / -1; }
}

@media (max-width: 600px) {
	body { font-size: 15.5px; }
	.logo img { width: 150px; }
	.ticker__src { display: none; }
	.hero { padding-top: 22px; }
	.bento { grid-template-columns: 1fr; }
	.bento__1 { grid-column: auto; min-height: 380px; }
	.bento__1 .card__body { padding: 20px; }
	.bento .card { min-height: 240px; }
	.wire__list { grid-template-columns: 1fr; }
	.wire__list li:nth-child(2) { border-top: 1px dashed rgba(138, 166, 204, .25); }
	.tiles__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
	.tile:last-child { grid-column: span 2; }
	.cat-block { padding: 40px 0; }
	.cat-head { grid-template-columns: auto 1fr; }
	.cat-head__more { grid-column: 1 / -1; justify-self: start; }
	.cat-head__index { width: 52px; height: 52px; }
	.g-cards-4, .g-numbered, .arch-grid { grid-template-columns: 1fr; }
	.g-numbered > li { border-right: 0; border-top: 1px solid var(--line); }
	.g-mosaic { grid-template-columns: 1fr; }
	.g-mosaic__1 { grid-column: auto !important; }
	.g-feature-list .is-lead, .arch-lead .card { min-height: 380px; }
	.arch-lead .card__body { padding: 20px; }
	.card--row .card__media { width: 104px; }
	.g-terminal__list li { grid-template-columns: 40px 1fr; padding: 16px; }
	.g-terminal__spark { display: none; }
	.g-scroller__track { grid-auto-columns: 78%; }
	.arch-head__sym { width: 64px; height: 64px; font-size: 16px; border-radius: 16px; }
	.byline { flex-wrap: wrap; }
	.byline__read { margin-left: 0; }
	.prose { font-size: 17px; }
	.prose h2 { font-size: 24px; }
	.cta__inner { padding: 22px; }
	.search-form .btn { padding: 10px 14px; }
	.site-footer__top { grid-template-columns: 1fr; }
}

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

@media print {
	.ticker, .site-header, .site-footer, .article__rail, .related, .progress, .comments { display: none !important; }
	body { background: #fff; }
}

/* Category archive header without the symbol box. */
.arch-head__row--nosym { grid-template-columns: 1fr auto; }
@media (max-width: 960px) { .arch-head__row--nosym { grid-template-columns: 1fr; } }

/* ---------- HTML sitemap ---------- */
.html-sitemap { columns: 3 300px; column-gap: 28px; }
.html-sitemap__group {
	break-inside: avoid; margin-bottom: 28px; padding: 20px 22px;
	background: var(--paper); border: 1px solid var(--line); border-top: 3px solid var(--cat, var(--blue-600)); border-radius: var(--r);
}
.html-sitemap__title { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 20px; margin-bottom: 12px; }
.html-sitemap__title span { font: 600 12px var(--f-mono); color: var(--muted); padding: 4px 8px; border-radius: 999px; background: var(--bg); }
.html-sitemap li { padding: 7px 0; border-top: 1px dashed var(--line); font-size: 14.5px; line-height: 1.4; }
.html-sitemap li:first-child { border-top: 0; }
.html-sitemap__more { display: inline-block; margin-top: 10px; font: 600 13px var(--f-head); color: var(--blue-600); }