/* ==========================================================================
   Intrinsic Ninja — console theme
   Sections: 1 tokens · 2 base · 3 layout & chrome · 4 header/nav · 5 ambient
   (boot, activity, glitch, static) · 6 components (panels, buttons, cards,
   chips, crumbs, specs) · 7 block styles / editor content · 8 forms ·
   9 footer · 10 404 · 11 motion & print
   ========================================================================== */

/* 1. Tokens ------------------------------------------------------------- */
:root {
	--bg: #04070E;
	--bg-2: #070C16;
	--panel: #0B1322;
	--panel-2: #111C30;
	--line: #1F3454;
	--line-strong: #2F4E78;
	--text: #DDE7F5;
	--muted: #9DB0CB;
	--cyan: #5CE1FF;
	--cyan-dim: #2FB4D6;
	--cyan-glow: rgba(92, 225, 255, 0.35);
	--amber: #FFB454;
	--green: #5CFF9D;
	--red: #FF5A5A;
	--font-display: 'Rajdhani', 'Segoe UI', system-ui, sans-serif;
	--font-body: 'IBM Plex Sans', 'Segoe UI', system-ui, sans-serif;
	--font-mono: 'IBM Plex Mono', ui-monospace, Menlo, monospace;
	--radius: 2px;
	--gutter: clamp(1rem, 3vw, 2rem);
	--wide: 1240px;
	--narrow: 760px;
	--header-h: 64px;
	--ease: cubic-bezier(0.2, 0.7, 0.2, 1);
	color-scheme: dark;
}

/* 2. Base --------------------------------------------------------------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
body {
	margin: 0;
	background: var(--bg);
	color: var(--text);
	font-family: var(--font-body);
	font-size: 1.0625rem;
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
	background-image:
		radial-gradient(1200px 600px at 80% -10%, rgba(92, 225, 255, 0.07), transparent 60%),
		radial-gradient(800px 500px at -10% 100%, rgba(255, 180, 84, 0.05), transparent 60%);
	background-attachment: fixed;
}
/* fine grid, like a plotter screen */
body::before {
	content: "";
	position: fixed; inset: 0; z-index: 0; pointer-events: none;
	background-image:
		linear-gradient(rgba(92, 225, 255, 0.045) 1px, transparent 1px),
		linear-gradient(90deg, rgba(92, 225, 255, 0.045) 1px, transparent 1px);
	background-size: 48px 48px;
	mask-image: linear-gradient(180deg, rgba(0,0,0,.6), rgba(0,0,0,.15) 40%, rgba(0,0,0,.35));
}
.site { position: relative; z-index: 1; display: flex; flex-direction: column; min-height: 100vh; }

img, svg, video { max-width: 100%; height: auto; }
figure { margin: 0; }
a { color: var(--cyan); text-decoration-thickness: 1px; text-underline-offset: 0.18em; }
a:hover { color: #fff; }
:focus-visible { outline: 2px solid var(--amber); outline-offset: 3px; border-radius: 2px; }
::selection { background: var(--cyan); color: var(--bg); }

h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-display);
	font-weight: 600;
	line-height: 1.12;
	letter-spacing: 0.01em;
	margin: 0 0 0.5em;
	color: #fff;
	text-wrap: balance;
}
h1 { font-size: clamp(2.2rem, 5vw, 3.6rem); font-weight: 700; }
h2 { font-size: clamp(1.6rem, 3vw, 2.1rem); }
h3 { font-size: clamp(1.2rem, 2vw, 1.4rem); }
h4 { font-size: 1.1rem; }
p { margin: 0 0 1.1em; }
p:last-child { margin-bottom: 0; }
ul, ol { padding-left: 1.3em; }
li { margin-bottom: 0.35em; }
code, kbd, pre { font-family: var(--font-mono); font-size: 0.92em; }
pre { background: var(--panel); border: 1px solid var(--line); padding: 1rem; overflow: auto; border-radius: var(--radius); }
blockquote { margin: 1.5rem 0; padding: 0.5rem 0 0.5rem 1.25rem; border-left: 2px solid var(--amber); color: var(--muted); font-style: italic; }
hr { border: 0; border-top: 1px solid var(--line); margin: 2rem 0; }
table { border-collapse: collapse; width: 100%; font-size: 0.95rem; }
th, td { text-align: left; padding: 0.6rem 0.75rem; border-bottom: 1px solid var(--line); vertical-align: top; }
th { font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.85rem; color: var(--cyan); }

.screen-reader-text {
	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; top: -100px; left: 1rem; z-index: 1000;
	background: var(--amber); color: var(--bg); padding: 0.6rem 1rem;
	font-family: var(--font-display); font-weight: 700; text-transform: uppercase; letter-spacing: .08em;
}
.skip-link:focus { top: 1rem; width: auto; height: auto; clip: auto; margin: 0; overflow: visible; }

.eyebrow, .is-style-eyebrow {
	font-family: var(--font-mono);
	font-size: 0.78rem;
	letter-spacing: 0.16em;
	text-transform: uppercase;
	color: var(--cyan);
	margin: 0 0 0.75rem;
}
.eyebrow::before, .is-style-eyebrow::before { content: "// "; opacity: 0.6; }
.readout, .is-style-readout { font-family: var(--font-mono); font-size: 0.82rem; color: var(--muted); letter-spacing: 0.04em; }
.lead, .is-style-lead { font-size: clamp(1.15rem, 1.8vw, 1.35rem); color: var(--text); line-height: 1.5; }

/* 3. Layout ------------------------------------------------------------- */
.site-main { flex: 1; width: 100%; max-width: var(--wide); margin: 0 auto; padding: 1.5rem var(--gutter) 4rem; }
.site-main > * + * { margin-top: 2rem; }
.page-top { margin-bottom: 1.5rem; }
.page-header { padding: 1rem 0 0.5rem; max-width: 900px; }
.page-header__intro { max-width: 62ch; color: var(--muted); font-size: 1.1rem; }
.entry-content > * { margin-block: 1.25rem; }
.entry-content > *:first-child { margin-top: 0; }
.entry-content--narrow { max-width: var(--narrow); }
.entry-content--narrow > .alignwide, .entry-content--narrow > .alignfull { max-width: none; }
.entry-content > .alignwide { max-width: var(--wide); }
.entry-content > .alignfull { margin-inline: calc(-1 * var(--gutter)); }
.post-hero { border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; margin-bottom: 2rem; }
.post-hero img { display: block; width: 100%; }

.grid { display: grid; gap: 1.25rem; }
.grid--cards { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); }
.grid--2 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }

/* 4. Header & nav ------------------------------------------------------- */
.site-header {
	position: sticky; top: 0; z-index: 50;
	background: rgba(4, 7, 14, 0.82);
	backdrop-filter: blur(10px) saturate(1.2);
	border-bottom: 1px solid var(--line);
}
.site-header__inner {
	max-width: var(--wide); margin: 0 auto; padding: 0 var(--gutter);
	min-height: var(--header-h);
	display: flex; align-items: center; gap: 1rem;
}
.brand { display: inline-flex; align-items: center; gap: 0.7rem; text-decoration: none; color: #fff; min-height: 44px; }
.brand__mark, .brand .custom-logo { width: 38px; height: 38px; object-fit: contain; }
.brand__text { display: flex; flex-direction: column; line-height: 1.05; }
.brand__name { font-family: var(--font-display); font-weight: 700; font-size: 1.15rem; letter-spacing: 0.06em; text-transform: uppercase; }
.brand__tag { font-family: var(--font-mono); font-size: 0.62rem; letter-spacing: 0.2em; color: var(--cyan); text-transform: uppercase; }

.status { display: none; align-items: center; gap: 0.5rem; margin-left: 0.5rem; font-family: var(--font-mono); font-size: 0.7rem; color: var(--muted); letter-spacing: 0.08em; text-transform: uppercase; }
.status__dot { width: 7px; height: 7px; border-radius: 50%; background: var(--green); box-shadow: 0 0 8px var(--green); animation: pulse 2.4s infinite; }
.status__clock { color: var(--cyan); }
@media (min-width: 1100px) { .status { display: inline-flex; } }

.nav-toggle {
	margin-left: auto; display: inline-flex; align-items: center; gap: 0.5rem;
	background: transparent; border: 1px solid var(--line-strong); color: var(--text);
	min-height: 44px; min-width: 44px; padding: 0 0.9rem; cursor: pointer; border-radius: var(--radius);
	font-family: var(--font-display); text-transform: uppercase; letter-spacing: 0.1em; font-weight: 600;
}
.nav-toggle__icon { display: inline-flex; flex-direction: column; gap: 4px; }
.nav-toggle__icon i { display: block; width: 18px; height: 2px; background: var(--cyan); transition: transform .25s var(--ease), opacity .2s; }
.nav-toggle[aria-expanded="true"] .nav-toggle__icon i:nth-child(1) { transform: translateY(6px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle__icon i:nth-child(2) { opacity: 0; }
.nav-toggle[aria-expanded="true"] .nav-toggle__icon i:nth-child(3) { transform: translateY(-6px) rotate(-45deg); }

.primary-nav .menu, .sub-menu { list-style: none; margin: 0; padding: 0; }
.primary-nav .menu > li { position: relative; }
.menu-link {
	display: inline-flex; align-items: center; min-height: 44px; padding: 0 0.85rem;
	color: var(--text); text-decoration: none;
	font-family: var(--font-display); font-weight: 600; font-size: 1.02rem; letter-spacing: 0.1em; text-transform: uppercase;
	border-bottom: 2px solid transparent;
	transition: color .15s, border-color .15s;
}
.menu-link:hover, .menu-link[aria-current="page"] { color: var(--cyan); border-bottom-color: var(--cyan); }
.menu-link.btn { border-bottom: 0; }
.submenu-toggle {
	background: transparent; border: 0; color: var(--cyan); cursor: pointer;
	min-width: 44px; min-height: 44px; display: inline-flex; align-items: center; justify-content: center;
}
.submenu-toggle svg { transition: transform .2s; }
.submenu-toggle[aria-expanded="true"] svg { transform: rotate(180deg); }
.sub-menu { display: none; }
.sub-menu.is-open { display: block; }
.sub-menu .menu-link { font-size: 0.92rem; text-transform: none; letter-spacing: 0.02em; font-family: var(--font-body); font-weight: 500; }

.sound-toggle {
	display: inline-flex; align-items: center; gap: 0.45rem;
	background: transparent; border: 1px solid var(--line); color: var(--muted); cursor: pointer;
	min-height: 44px; padding: 0 0.75rem; border-radius: var(--radius);
	font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.1em; text-transform: uppercase;
}
.sound-toggle[aria-pressed="true"] { color: var(--cyan); border-color: var(--line-strong); }
.sound-toggle[aria-pressed="false"] .sound-toggle__wave { display: none; }

/* mobile: full-screen overlay */
@media (max-width: 959px) {
	.primary-nav {
		position: absolute; top: 100%; left: 0; right: 0; height: calc(100dvh - var(--header-h) - 26px); z-index: 49;
		background: var(--bg);
		padding: 1.5rem var(--gutter) 3rem;
		overflow: auto;
		display: none;
		border-top: 1px solid var(--line);
	}
	.primary-nav.is-open { display: block; animation: nav-in .28s var(--ease); }
	.primary-nav .menu { display: flex; flex-direction: column; }
	.primary-nav .menu > li { display: grid; grid-template-columns: 1fr auto; align-items: center; border-bottom: 1px solid var(--line); }
	.primary-nav .menu > li > .menu-link { font-size: 1.5rem; min-height: 60px; padding-left: 0; border-bottom: 0; grid-column: 1; }
	.primary-nav .menu > li.cta { margin-top: 1rem; border: 0; }
	.primary-nav .menu > li.cta > .menu-link { justify-content: center; }
	.sub-menu { grid-column: 1 / -1; padding: 0 0 0.75rem 1rem; }
	.sub-menu .menu-link { min-height: 48px; font-size: 1.05rem; padding-left: 0; }
	.sound-toggle { margin-top: 1.5rem; }
	@keyframes nav-in { from { opacity: 0; transform: translateY(-6px); } }
}
@media (min-width: 960px) {
	.nav-toggle { display: none; }
	.primary-nav { margin-left: auto; display: flex; align-items: center; gap: 0.5rem; }
	.primary-nav .menu { display: flex; align-items: center; gap: 0.1rem; }
	.primary-nav .menu > li { display: flex; align-items: center; }
	.primary-nav .menu > li.cta { margin-left: 0.5rem; }
	.sub-menu {
		position: absolute; top: 100%; left: 0; min-width: 240px; margin-top: 0;
		background: var(--panel); border: 1px solid var(--line-strong); border-radius: var(--radius);
		padding: 0.5rem 0; box-shadow: 0 20px 40px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(92,225,255,.08);
	}
	.sub-menu::before { content: ""; position: absolute; top: -1px; left: 12px; width: 32px; height: 2px; background: var(--cyan); }
	.primary-nav .menu > li.menu-item-has-children::after { content: ""; position: absolute; left: 0; right: 0; top: 100%; height: 14px; }
	.sub-menu .menu-link { display: flex; width: 100%; padding: 0.5rem 1rem; min-height: 40px; border-bottom: 0; }
	.sub-menu .menu-link:hover { background: var(--panel-2); }
	.sound-toggle { margin-left: 0.5rem; }
	.sound-toggle__label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
}

/* 5. Ambient chrome ----------------------------------------------------- */
/* activity strip: LEDs + bars + log */
.activity {
	display: flex; align-items: center; gap: 1rem;
	max-width: var(--wide); margin: 0 auto; padding: 0.35rem var(--gutter);
	font-family: var(--font-mono); font-size: 0.66rem; color: var(--muted); letter-spacing: 0.08em;
	min-height: 26px;
}
.activity--header { border-top: 1px solid rgba(31, 52, 84, 0.6); }
.activity__leds { display: inline-flex; gap: 4px; }
.activity__leds i { width: 6px; height: 6px; border-radius: 1px; background: var(--line-strong); animation: led 1.8s infinite; }
.activity__leds i:nth-child(1) { animation-delay: 0s; }
.activity__leds i:nth-child(2) { animation-delay: .15s; }
.activity__leds i:nth-child(3) { animation-delay: .3s; }
.activity__leds i:nth-child(4) { animation-delay: .45s; }
.activity__leds i:nth-child(5) { animation-delay: .6s; }
.activity__leds i:nth-child(6) { animation-delay: .75s; }
@keyframes led { 0%, 20% { background: var(--cyan); box-shadow: 0 0 6px var(--cyan-glow); } 30%, 100% { background: var(--line-strong); box-shadow: none; } }
.activity__bars { display: inline-flex; align-items: flex-end; gap: 2px; height: 12px; }
.activity__bars i { width: 3px; background: var(--cyan-dim); animation: bar 1.4s ease-in-out infinite; transform-origin: bottom; height: 100%; opacity: .8; }
.activity__bars i:nth-child(odd) { animation-duration: 1.9s; }
.activity__bars i:nth-child(3n) { animation-delay: .4s; }
.activity__bars i:nth-child(4n) { animation-delay: .9s; animation-duration: 1.1s; }
@keyframes bar { 0%, 100% { transform: scaleY(.2); } 50% { transform: scaleY(1); } }
.activity__log { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; text-transform: uppercase; }
.activity__log::after { content: "_"; animation: blink 1s steps(1) infinite; }
@keyframes blink { 50% { opacity: 0; } }
@keyframes pulse { 0%, 100% { opacity: 1; } 50% { opacity: .35; } }

/* boot / loading overlay */
.boot {
	position: fixed; inset: 0; z-index: 2000; background: var(--bg);
	display: flex; align-items: center; justify-content: center;
	opacity: 1; transition: opacity .35s var(--ease); pointer-events: none;
}
.boot.is-done { opacity: 0; visibility: hidden; }
.boot__inner { width: min(360px, 80vw); font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: .2em; text-transform: uppercase; color: var(--cyan); }
.boot__label { margin-bottom: .6rem; }
.boot__label::after { content: ""; animation: dots 1.2s steps(4) infinite; }
@keyframes dots { 0% { content: ""; } 25% { content: "."; } 50% { content: ".."; } 75% { content: "..."; } }
.boot__bar { height: 3px; background: var(--line); overflow: hidden; position: relative; }
.boot__bar i { position: absolute; inset: 0; width: 0; background: var(--cyan); box-shadow: 0 0 10px var(--cyan-glow); animation: boot-bar .9s var(--ease) forwards; }
@keyframes boot-bar { 0% { width: 0; } 60% { width: 55%; } 100% { width: 100%; } }
.boot__lines { margin-top: .6rem; color: var(--muted); display: grid; gap: 2px; }
.boot__lines span { opacity: 0; animation: line-in .2s forwards; }
.boot__lines span:nth-child(1) { animation-delay: .1s; }
.boot__lines span:nth-child(2) { animation-delay: .4s; }
.boot__lines span:nth-child(3) { animation-delay: .75s; color: var(--green); }
.boot__lines span::before { content: "> "; }
.boot__lines span::after { content: " ok"; color: var(--green); }
.boot__lines span:last-child::after { content: ""; }
@keyframes line-in { to { opacity: 1; } }
.no-js .boot { display: none; }

/* glitch title (brief, on load) */
.glitch { position: relative; }
.glitch.is-glitching::before, .glitch.is-glitching::after {
	content: attr(data-text); position: absolute; inset: 0; overflow: hidden; pointer-events: none;
	color: #fff;
}
.glitch.is-glitching::before { left: 2px; text-shadow: -2px 0 var(--cyan); clip-path: inset(30% 0 45% 0); animation: glitch-a .45s steps(2) 3; }
.glitch.is-glitching::after { left: -2px; text-shadow: 2px 0 var(--red); clip-path: inset(60% 0 10% 0); animation: glitch-b .45s steps(2) 3; }
@keyframes glitch-a { 0% { clip-path: inset(10% 0 80% 0); transform: translate(-3px, 0); } 50% { clip-path: inset(40% 0 30% 0); transform: translate(3px, -1px); } 100% { clip-path: inset(70% 0 5% 0); transform: translate(-1px, 1px); } }
@keyframes glitch-b { 0% { clip-path: inset(60% 0 20% 0); transform: translate(3px, 0); } 50% { clip-path: inset(15% 0 70% 0); transform: translate(-3px, 1px); } 100% { clip-path: inset(80% 0 2% 0); transform: translate(2px, -1px); } }

/* analogue static on "screen" media */
.screen { position: relative; overflow: hidden; background: var(--panel); }
.screen > img, .screen > video, .screen img { display: block; width: 100%; }
.screen::after {
	content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0;
	background-image: repeating-linear-gradient(0deg, rgba(255,255,255,.06) 0 1px, transparent 1px 3px);
	mix-blend-mode: screen;
}
.screen.is-static::after { opacity: 1; animation: static-fade .5s steps(6) forwards; }
.screen.is-static::before {
	content: ""; position: absolute; inset: -20%; z-index: 1; pointer-events: none;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 0.6 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");
	animation: static-shift .5s steps(8) forwards;
}
@keyframes static-shift { 0% { transform: translate(0,0); opacity: .9; } 50% { transform: translate(-6%, 4%); opacity: .6; } 100% { transform: translate(5%, -6%); opacity: 0; } }
@keyframes static-fade { to { opacity: 0; } }

/* page-transition overlay */
.glitch-overlay {
	position: fixed; inset: 0; z-index: 1900; pointer-events: none; opacity: 0;
	background: repeating-linear-gradient(0deg, rgba(92,225,255,.12) 0 2px, transparent 2px 6px);
	mix-blend-mode: screen;
}
.glitch-overlay.is-active { animation: overlay-glitch .38s steps(5) forwards; }
@keyframes overlay-glitch { 0% { opacity: 0; transform: translateY(0); } 20% { opacity: 1; transform: translateY(-2%) skewX(2deg); } 60% { opacity: .8; transform: translateY(1%) skewX(-3deg); } 100% { opacity: 1; background: var(--bg); } }

/* 6. Components --------------------------------------------------------- */
/* Panel: the core container. Corner brackets, header strip, ID code. */
.panel, .wp-block-group.is-style-panel, .wp-block-group.is-style-panel-amber, .wp-block-group.is-style-panel-ghost {
	position: relative;
	background: linear-gradient(180deg, var(--panel), var(--bg-2));
	border: 1px solid var(--line);
	border-radius: var(--radius);
	--accent: var(--cyan);
}
.wp-block-group.is-style-panel-amber { --accent: var(--amber); }
.wp-block-group.is-style-panel-ghost { background: transparent; }
.panel::before, .panel::after,
.wp-block-group.is-style-panel::before, .wp-block-group.is-style-panel::after,
.wp-block-group.is-style-panel-amber::before, .wp-block-group.is-style-panel-amber::after,
.wp-block-group.is-style-panel-ghost::before, .wp-block-group.is-style-panel-ghost::after {
	content: ""; position: absolute; width: 14px; height: 14px; pointer-events: none;
	border-color: var(--accent); border-style: solid;
}
.panel::before, .wp-block-group.is-style-panel::before, .wp-block-group.is-style-panel-amber::before, .wp-block-group.is-style-panel-ghost::before { top: -1px; left: -1px; border-width: 2px 0 0 2px; }
.panel::after, .wp-block-group.is-style-panel::after, .wp-block-group.is-style-panel-amber::after, .wp-block-group.is-style-panel-ghost::after { bottom: -1px; right: -1px; border-width: 0 2px 2px 0; }
.wp-block-group.is-style-panel, .wp-block-group.is-style-panel-amber, .wp-block-group.is-style-panel-ghost { padding: clamp(1.25rem, 3vw, 2rem); }
.wp-block-group.is-style-panel > *:first-child, .wp-block-group.is-style-panel-amber > *:first-child, .wp-block-group.is-style-panel-ghost > *:first-child { margin-top: 0; }
.wp-block-group.is-style-panel > *:last-child, .wp-block-group.is-style-panel-amber > *:last-child, .wp-block-group.is-style-panel-ghost > *:last-child { margin-bottom: 0; }

.panel__head {
	display: flex; justify-content: space-between; align-items: center; gap: 1rem;
	padding: 0.5rem 1rem; border-bottom: 1px solid var(--line);
	font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.16em; text-transform: uppercase; color: var(--cyan);
	background: rgba(92, 225, 255, 0.04);
}
.panel__head::before { content: ""; width: 6px; height: 6px; background: var(--accent); margin-right: -.5rem; box-shadow: 0 0 6px var(--accent); }
.panel__label { flex: 1; }
.panel__code { color: var(--muted); }
.panel__body { padding: clamp(1.25rem, 3vw, 2rem); }
.panel__body--row { display: flex; flex-wrap: wrap; gap: 0.75rem; }
.panel--cta { text-align: center; }
.panel--cta .panel__body { padding-block: clamp(2rem, 5vw, 3.5rem); }
.panel--cta p { max-width: 56ch; margin-inline: auto; }
.panel--cta h2 { font-size: clamp(1.8rem, 3.5vw, 2.6rem); }

/* Keep prose readable inside wide panels (dashboard look: left-aligned, capped line length) */
.entry-content .wp-block-group > p, .entry-content .wp-block-group > ul, .entry-content .wp-block-group > ol, .entry-content .wp-block-group > h2, .entry-content .wp-block-group > h3, .entry-content .wp-block-group > .wp-block-details, .entry-content .wp-block-group > .wp-block-table { max-width: 72ch; }
.entry-content .wp-block-group > h1 { max-width: 20ch; }
.entry-content .wp-block-group > .is-style-lead { max-width: 60ch; }
.entry-content .wp-block-group > .steps, .entry-content .wp-block-group > .step { max-width: 72ch; }
.panel--cta > * { margin-inline: auto; }

/* HUD frame: bracket corners only, no fill */
.wp-block-group.is-style-hud, .wp-block-image.is-style-hud {
	position: relative; padding: 1rem;
	background: linear-gradient(var(--cyan), var(--cyan)) top left / 18px 1px no-repeat, linear-gradient(var(--cyan), var(--cyan)) top left / 1px 18px no-repeat, linear-gradient(var(--cyan), var(--cyan)) top right / 18px 1px no-repeat, linear-gradient(var(--cyan), var(--cyan)) top right / 1px 18px no-repeat, linear-gradient(var(--cyan), var(--cyan)) bottom left / 18px 1px no-repeat, linear-gradient(var(--cyan), var(--cyan)) bottom left / 1px 18px no-repeat, linear-gradient(var(--cyan), var(--cyan)) bottom right / 18px 1px no-repeat, linear-gradient(var(--cyan), var(--cyan)) bottom right / 1px 18px no-repeat;
}

/* Buttons */
.btn, .wp-block-button__link, .wp-element-button, .gform_button, button.button {
	display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
	min-height: 46px; padding: 0.6rem 1.35rem;
	font-family: var(--font-display); font-weight: 700; font-size: 0.98rem; letter-spacing: 0.1em; text-transform: uppercase;
	text-decoration: none; border-radius: var(--radius); cursor: pointer; border: 1px solid transparent;
	transition: transform .12s var(--ease), box-shadow .2s, background .15s, color .15s;
	position: relative;
}
.btn--primary, .wp-block-button:not(.is-style-ghost):not(.is-style-amber) .wp-block-button__link, .gform_button, .wp-element-button {
	background: var(--cyan); color: var(--bg) !important; border-color: var(--cyan);
	clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}
.btn--primary:hover, .wp-block-button:not(.is-style-ghost):not(.is-style-amber) .wp-block-button__link:hover, .gform_button:hover { background: #fff; color: var(--bg) !important; }
.btn--ghost, .wp-block-button.is-style-ghost .wp-block-button__link {
	background: transparent; color: var(--cyan) !important; border-color: var(--cyan-dim);
}
.btn--ghost:hover, .wp-block-button.is-style-ghost .wp-block-button__link:hover { background: rgba(92,225,255,.1); color: #fff !important; border-color: var(--cyan); }
.btn--amber, .wp-block-button.is-style-amber .wp-block-button__link { background: var(--amber); color: var(--bg) !important; border-color: var(--amber); clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px)); }
.btn--amber:hover, .wp-block-button.is-style-amber .wp-block-button__link:hover { background: #fff; }
.btn:active, .wp-block-button__link:active { transform: translateY(1px); }
.wp-block-buttons { gap: 0.75rem; }

/* Cards */
.card { background: linear-gradient(180deg, var(--panel), var(--bg-2)); border: 1px solid var(--line); border-radius: var(--radius); position: relative; transition: border-color .2s, transform .2s var(--ease), box-shadow .2s; }
.card::after { content: ""; position: absolute; top: -1px; left: 12px; width: 28px; height: 2px; background: var(--cyan); opacity: .7; }
.card:hover { border-color: var(--line-strong); transform: translateY(-2px); box-shadow: 0 16px 40px rgba(0,0,0,.45), 0 0 0 1px rgba(92,225,255,.12); }
.card__link { display: flex; flex-direction: column; height: 100%; color: inherit; text-decoration: none; }
.card__link:focus-visible { outline-offset: 4px; }
.card__media { aspect-ratio: 16 / 10; border-bottom: 1px solid var(--line); }
.card__media img { width: 100%; height: 100%; object-fit: cover; }
.card__placeholder { height: 100%; display: grid; place-items: center; font-family: var(--font-display); font-size: 3rem; font-weight: 700; color: var(--line-strong); background: repeating-linear-gradient(45deg, transparent 0 14px, rgba(92,225,255,.04) 14px 15px); }
.card__body { padding: 1.1rem 1.2rem 1.3rem; }
.card__body .eyebrow { margin-bottom: .4rem; }
.card__title { font-size: 1.3rem; margin-bottom: .35rem; }
.card__excerpt { color: var(--muted); font-size: .95rem; margin: 0; }
.card__meta { margin: 0; }
.card:hover .card__title { color: var(--cyan); }

/* App cards (pattern) */
.app-card { display: grid; grid-template-columns: 64px 1fr; gap: 1rem; align-items: start; }
.app-card__icon { width: 64px; height: 64px; border-radius: 14px; border: 1px solid var(--line-strong); background: var(--panel-2); display: grid; place-items: center; font-family: var(--font-display); font-weight: 700; font-size: 1.4rem; color: var(--cyan); overflow: hidden; }
.app-card__icon img { width: 100%; height: 100%; object-fit: cover; }

/* Filter chips */
.filter { display: flex; flex-wrap: wrap; gap: .5rem; align-items: center; }
.chip {
	display: inline-flex; align-items: center; min-height: 40px; padding: 0 1rem;
	border: 1px solid var(--line-strong); border-radius: 999px; background: transparent; color: var(--text);
	font-family: var(--font-mono); font-size: .78rem; letter-spacing: .12em; text-transform: uppercase; text-decoration: none; cursor: pointer;
}
.chip:hover { border-color: var(--cyan); color: var(--cyan); }
.chip.is-active, .chip[aria-pressed="true"] { background: var(--cyan); border-color: var(--cyan); color: var(--bg); }
.filter__status { margin: 0 0 0 auto; }
[data-filter-grid] .card.is-hidden { display: none; }

/* Breadcrumbs */
.breadcrumbs ol { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: .35rem; font-family: var(--font-mono); font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.breadcrumbs li + li::before { content: "/"; margin-right: .35rem; opacity: .5; }
.breadcrumbs a { color: var(--muted); text-decoration: none; }
.breadcrumbs a:hover { color: var(--cyan); }
.breadcrumbs [aria-current] { color: var(--cyan); }

/* Specs (definition list) */
.specs { display: flex; flex-wrap: wrap; gap: 1.5rem 2.5rem; margin: 1rem 0 0; padding: 1rem 0 0; border-top: 1px solid var(--line); }
.specs div { display: flex; flex-direction: column; gap: .15rem; }
.specs dt { font-family: var(--font-mono); font-size: .68rem; letter-spacing: .16em; text-transform: uppercase; color: var(--muted); }
.specs dd { margin: 0; font-family: var(--font-display); font-size: 1.15rem; font-weight: 600; color: #fff; }

/* Post navigation & pagination */
.post-nav { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-top: 1.5rem; font-family: var(--font-display); font-weight: 600; text-transform: uppercase; letter-spacing: .08em; }
.post-nav__next { margin-left: auto; text-align: right; }
.pagination { margin-top: 2rem; }
.pagination .nav-links { display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; }
.pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 44px; min-height: 44px; padding: 0 .75rem; border: 1px solid var(--line-strong); text-decoration: none; font-family: var(--font-mono); font-size: .85rem; color: var(--text); border-radius: var(--radius); }
.pagination .page-numbers.current { background: var(--cyan); color: var(--bg); border-color: var(--cyan); }
.single-footer { margin-top: 3rem; max-width: var(--narrow); }

/* Stat tiles (pattern) */
.stat { text-align: left; }
.stat__value { font-family: var(--font-display); font-size: clamp(2.2rem, 5vw, 3.2rem); font-weight: 700; color: var(--cyan); line-height: 1; margin: 0 0 .25rem; }
.stat__label { margin: 0; color: var(--muted); font-size: .95rem; }

/* Process steps (pattern) */
.step { counter-increment: step; position: relative; padding-left: 3.25rem; }
.step::before { content: "0" counter(step); position: absolute; left: 0; top: .1rem; font-family: var(--font-mono); font-size: .8rem; color: var(--amber); letter-spacing: .1em; border: 1px solid var(--amber); padding: .2rem .4rem; border-radius: var(--radius); }
.steps { counter-reset: step; }

/* 7. Block styles & editor content ------------------------------------- */
.entry-content .wp-block-image img { border-radius: var(--radius); }
.wp-block-image.is-style-screen { position: relative; overflow: hidden; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); }
.wp-block-image figcaption, .wp-block-gallery figcaption { font-family: var(--font-mono); font-size: .75rem; color: var(--muted); letter-spacing: .06em; text-align: left; margin-top: .5rem; }
.wp-block-image figcaption::before { content: "fig. "; color: var(--cyan); }

.wp-block-heading.is-style-label { font-family: var(--font-mono); font-size: .8rem; letter-spacing: .18em; text-transform: uppercase; color: var(--cyan); font-weight: 500; }
.wp-block-heading.is-style-label::before { content: "// "; opacity: .6; }

.wp-block-list.is-style-ticks { list-style: none; padding-left: 0; }
.wp-block-list.is-style-ticks li { position: relative; padding-left: 1.6rem; margin-bottom: .55rem; }
.wp-block-list.is-style-ticks li::before { content: ""; position: absolute; left: 0; top: .55em; width: 9px; height: 9px; border: 1px solid var(--green); background: rgba(92,255,157,.25); box-shadow: 0 0 6px rgba(92,255,157,.5); }

.wp-block-separator { border: 0; border-top: 1px solid var(--line); margin: 2rem auto; width: 100%; max-width: none; }
.wp-block-separator.is-style-scan { border: 0; height: 2px; background: linear-gradient(90deg, transparent, var(--cyan), transparent); opacity: .7; }

.wp-block-details { border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); padding: 0; }
.wp-block-details > summary { cursor: pointer; padding: 1rem 1.25rem 1rem 2.6rem; font-family: var(--font-display); font-weight: 600; font-size: 1.15rem; color: #fff; list-style: none; position: relative; min-height: 44px; }
.wp-block-details > summary::-webkit-details-marker { display: none; }
.wp-block-details > summary::before { content: "+"; position: absolute; left: 1rem; top: .95rem; width: 20px; height: 20px; border: 1px solid var(--cyan); color: var(--cyan); display: grid; place-items: center; font-family: var(--font-mono); font-size: .8rem; }
.wp-block-details[open] > summary::before { content: "−"; }
.wp-block-details > summary:hover { color: var(--cyan); }
.wp-block-details > :not(summary) { padding: 0 1.25rem; color: var(--muted); }
.wp-block-details > :not(summary):last-child { padding-bottom: 1.1rem; }
.wp-block-details + .wp-block-details { margin-top: .5rem; }

.wp-block-columns.is-style-panels { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 240px), 1fr)); gap: 1.25rem; }
.wp-block-columns.is-style-panels > .wp-block-column { flex-basis: auto !important; width: auto; }
.wp-block-columns:not(.is-style-panels) { gap: 1.25rem; }
.app-card__icon { margin-bottom: 1rem; }
.wp-block-columns.is-style-panels > .wp-block-column { background: linear-gradient(180deg, var(--panel), var(--bg-2)); border: 1px solid var(--line); border-radius: var(--radius); padding: 1.5rem; position: relative; }
.wp-block-columns.is-style-panels > .wp-block-column::after { content: ""; position: absolute; top: -1px; left: 12px; width: 28px; height: 2px; background: var(--cyan); opacity: .7; }
.wp-block-columns.is-style-panels > .wp-block-column > :first-child { margin-top: 0; }

.wp-block-quote { border-left: 2px solid var(--amber); padding-left: 1.25rem; }
.wp-block-quote cite { font-family: var(--font-mono); font-size: .8rem; color: var(--cyan); font-style: normal; letter-spacing: .06em; }
.wp-block-table td, .wp-block-table th { border-color: var(--line); }
.wp-block-cover { border-radius: var(--radius); }
.wp-block-embed iframe, .wp-block-video video { border-radius: var(--radius); border: 1px solid var(--line); }
.wp-block-gallery .wp-block-image img { border: 1px solid var(--line); }
.has-cyan-color { color: var(--cyan); } .has-amber-color { color: var(--amber); } .has-muted-color { color: var(--muted); } .has-green-color { color: var(--green); } .has-red-color { color: var(--red); }
.has-panel-background-color { background: var(--panel); } .has-panel-2-background-color { background: var(--panel-2); }
.has-mono-font-family { font-family: var(--font-mono); } .has-display-font-family { font-family: var(--font-display); }
.has-text-align-center { text-align: center; }
.wp-block-group.alignfull { padding-inline: var(--gutter); }
.wp-block-post-template { list-style: none; padding: 0; }
.wp-block-post-title a { color: #fff; text-decoration: none; }
.wp-block-post-title a:hover { color: var(--cyan); }
.wp-block-post-date, .wp-block-post-terms { font-family: var(--font-mono); font-size: .75rem; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.wp-block-post-excerpt__excerpt { color: var(--muted); font-size: .95rem; }
.wp-block-read-more { font-family: var(--font-display); text-transform: uppercase; letter-spacing: .08em; font-weight: 600; }
.wp-block-post-featured-image img { border: 1px solid var(--line); border-radius: var(--radius); }

/* legacy (Divi-converted) content */
.in-legacy-image img { border: 1px solid var(--line); border-radius: var(--radius); }
.in-legacy-blurb { padding: 1rem 1.25rem; border: 1px solid var(--line); border-radius: var(--radius); background: var(--panel); margin: 1rem 0; }
.in-legacy-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: .75rem; }
.in-legacy-gallery img { width: 100%; aspect-ratio: 4/3; object-fit: cover; border: 1px solid var(--line); }
.entry-content h4[style], .entry-content h2[style], .entry-content h3[style], .entry-content p[style], .entry-content span[style] { color: inherit !important; font-size: inherit !important; }
.entry-content h4:empty, .entry-content p:empty { display: none; }

/* 8. Forms (Gravity Forms + core) --------------------------------------- */
input, textarea, select { font: inherit; color: var(--text); }
.gform_wrapper, .comment-form { --gf-color-primary: var(--cyan); }
.gform_wrapper .gfield_label, .comment-form label, .gform_wrapper legend.gfield_label { font-family: var(--font-mono); font-size: .78rem; letter-spacing: .14em; text-transform: uppercase; color: var(--cyan); margin-bottom: .4rem; display: block; }
.gform_wrapper input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]), .gform_wrapper textarea, .gform_wrapper select,
.comment-form input:not([type="submit"]):not([type="checkbox"]), .comment-form textarea {
	width: 100%; background: var(--bg-2); border: 1px solid var(--line-strong); border-radius: var(--radius);
	padding: .75rem .9rem; min-height: 46px; color: var(--text);
}
.gform_wrapper input:focus, .gform_wrapper textarea:focus, .gform_wrapper select:focus, .comment-form input:focus, .comment-form textarea:focus { border-color: var(--cyan); outline: 2px solid var(--amber); outline-offset: 2px; box-shadow: 0 0 0 4px rgba(92,225,255,.1); }
.gform_wrapper .gfield_required { color: var(--amber); }
.gform_wrapper .gfield_description, .gform_wrapper .gfield_validation_message, .gform_wrapper .validation_message { font-size: .9rem; }
.gform_wrapper .gfield_validation_message, .gform_wrapper .validation_message, .gform_validation_errors { color: #FFB1B1; background: rgba(255,90,90,.08); border: 1px solid rgba(255,90,90,.5); padding: .6rem .9rem; border-radius: var(--radius); margin-top: .5rem; }
.gform_wrapper .gform_validation_errors h2 { color: #FFB1B1; font-size: 1.1rem; }
.gform_wrapper .gfield { margin-bottom: 1.25rem; }
.gform_confirmation_message { padding: 1.25rem; border: 1px solid var(--green); border-radius: var(--radius); background: rgba(92,255,157,.06); }
.gform_wrapper .gform_footer { padding: 0; margin-top: .5rem; }

/* 9. Footer ------------------------------------------------------------- */
.site-footer { border-top: 1px solid var(--line); background: linear-gradient(180deg, transparent, rgba(11,19,34,.9)); margin-top: 2rem; }
.site-footer__inner { max-width: var(--wide); margin: 0 auto; padding: 2.5rem var(--gutter) 2rem; }
.footer-note { max-width: 60ch; margin-bottom: 2rem; color: var(--muted); }
.footer-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 2rem 1.5rem; }
.footer-col__title { font-family: var(--font-mono); font-size: .74rem; letter-spacing: .16em; text-transform: uppercase; color: var(--cyan); font-weight: 500; padding-bottom: .5rem; border-bottom: 1px solid var(--line); margin-bottom: .75rem; }
.footer-col__num { color: var(--muted); margin-right: .25rem; }
.footer-menu { list-style: none; margin: 0; padding: 0; }
.footer-menu li { margin: 0; }
.footer-menu a { display: inline-flex; align-items: center; min-height: 40px; color: var(--text); text-decoration: none; font-size: .98rem; }
.footer-menu a:hover { color: var(--cyan); }
.footer-bar { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; align-items: center; margin-top: 2.5rem; padding-top: 1.25rem; border-top: 1px solid var(--line); font-family: var(--font-mono); font-size: .74rem; letter-spacing: .06em; color: var(--muted); }
.footer-bar p { margin: 0; }
.footer-legal__menu { list-style: none; margin: 0; padding: 0; display: flex; gap: 1rem; }
.footer-legal__menu a { color: var(--muted); display: inline-flex; min-height: 32px; align-items: center; }
.footer-legal__menu a:hover { color: var(--cyan); }
.footer-bar__sys { margin-left: auto; }

/* 10. 404 (Matrix) ------------------------------------------------------ */
body.matrix { background: #000; color: #00ff66; overflow: hidden; height: 100vh; font-family: var(--font-mono); }
body.matrix::before { display: none; }
body.matrix .skip-link { background: #00ff66; color: #000; }
#matrix-canvas { position: fixed; inset: 0; width: 100%; height: 100%; display: block; opacity: 0; transition: opacity .6s ease; }
.matrix__overlay { position: fixed; inset: 0; display: flex; flex-direction: column; opacity: 0; transition: opacity .6s ease; }
.matrix__nav { display: flex; justify-content: space-between; align-items: flex-start; padding: 18px 24px; gap: 1rem; }
.matrix__logo { font-size: 13px; font-weight: 700; letter-spacing: .1em; color: #00ff66; text-decoration: none; text-transform: uppercase; }
.matrix__transmission { display: block; font-size: 10px; color: #7aff9a; margin-top: 4px; }
.matrix__links { display: flex; gap: 20px; list-style: none; margin: 0; padding: 2px 0 0; }
.matrix__links a { font-size: 12px; color: #00ff66; text-decoration: none; letter-spacing: .05em; opacity: .85; min-height: 32px; display: inline-flex; align-items: center; }
.matrix__links a:hover { opacity: 1; text-decoration: underline; }
body.matrix :focus-visible { outline: 2px solid #00ff66; outline-offset: 3px; }
.matrix__unmute { position: absolute; bottom: 28px; right: 24px; font: inherit; font-size: 10px; color: #7aff9a; background: transparent; border: 1px solid #7aff9a; padding: 8px 12px; cursor: pointer; letter-spacing: .05em; min-height: 36px; transition: opacity .4s; }
.matrix__unmute.is-hidden { opacity: 0; pointer-events: none; }
.matrix__main { margin-top: auto; text-align: center; padding: 0 16px 36px; }
.matrix__title { font: inherit; font-size: 13px; color: #00ff66; margin: 0 0 6px; }
.matrix__sub { font-size: 11px; color: #7aff9a; margin: 0 0 6px; }
.matrix__sub--dim { color: #4fcf78; margin-bottom: 20px; }
.matrix__actions { display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; }
.matrix__btn { font: inherit; font-size: 11px; color: #00ff66; background: transparent; border: 1px solid #00ff66; padding: 9px 16px; min-height: 40px; cursor: pointer; text-decoration: none; display: inline-flex; align-items: center; gap: 6px; transition: background .12s, color .12s; }
.matrix__btn:hover { background: #00ff66; color: #000; }
.matrix__mobile { display: none; list-style: none; margin: 0 0 14px; padding: 0; flex-direction: column; gap: 6px; align-items: center; }
.matrix__mobile .matrix__btn { width: 220px; justify-content: center; }
.matrix__static { display: none; font-size: clamp(80px, 20vw, 180px); font-weight: 700; color: #00ff66; line-height: 1; margin-bottom: 16px; }
@media (max-width: 600px) { .matrix__links, .matrix__actions { display: none; } .matrix__mobile { display: flex; } }

/* 11. Motion & print ---------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: 0.001s !important; animation-iteration-count: 1 !important; transition-duration: 0.001s !important; scroll-behavior: auto !important; }
	.boot { display: none; }
	.glitch.is-glitching::before, .glitch.is-glitching::after { display: none; }
	.screen.is-static::before, .screen.is-static::after { display: none; }
	.glitch-overlay { display: none; }
	#matrix-canvas { display: none; }
	.matrix__static { display: block; }
	.matrix__overlay { opacity: 1; }
}
@media print {
	body { background: #fff; color: #000; }
	body::before, .site-header, .site-footer, .activity, .boot, .glitch-overlay, .sound-toggle { display: none !important; }
	a { color: #000; }
}

/* ==========================================================================
   12. Sci-fi v2 — heavier console chrome. Overrides sections above.
   ========================================================================== */
:root {
	--font-ui: 'Orbitron', 'Rajdhani', 'Segoe UI', system-ui, sans-serif;
	--notch: 12px;
	--corner-cut: polygon(0 0, calc(100% - var(--notch)) 0, 100% var(--notch), 100% 100%, var(--notch) 100%, 0 calc(100% - var(--notch)));
}

/* global overlays: scanlines, roaming beam, vignette */
.fx { position: fixed; inset: 0; z-index: 3; pointer-events: none; }
.fx__scanlines { position: absolute; inset: 0; background: repeating-linear-gradient(0deg, rgba(255,255,255,.035) 0 1px, transparent 1px 3px); mix-blend-mode: overlay; opacity: .7; }
.fx__beam { position: absolute; left: 0; right: 0; height: 140px; top: -140px; background: linear-gradient(180deg, transparent, rgba(92,225,255,.06) 60%, rgba(92,225,255,.14) 98%, transparent); animation: beam 11s linear infinite; }
@keyframes beam { 0% { transform: translateY(0); } 100% { transform: translateY(calc(100vh + 140px)); } }
.fx__vignette { position: absolute; inset: 0; background: radial-gradient(120% 90% at 50% 40%, transparent 55%, rgba(0,0,0,.55) 100%); }
body::before { background-size: 32px 32px; mask-image: linear-gradient(180deg, rgba(0,0,0,.7), rgba(0,0,0,.2) 40%, rgba(0,0,0,.45)); }
/* radar rings top-right */
.site::before { content: ""; position: fixed; top: -180px; right: -180px; width: 720px; height: 720px; z-index: 0; pointer-events: none; border-radius: 50%;
	background: repeating-radial-gradient(circle, rgba(92,225,255,.09) 0 1px, transparent 1px 64px); opacity: .5;
	mask-image: radial-gradient(circle, #000 20%, transparent 70%); }
.site::after { content: ""; position: fixed; top: -180px; right: -180px; width: 720px; height: 720px; z-index: 0; pointer-events: none; border-radius: 50%;
	background: conic-gradient(from 0deg, rgba(92,225,255,.16), transparent 22%); opacity: .5; animation: sweep 14s linear infinite; mask-image: radial-gradient(circle, #000 20%, transparent 68%); }
@keyframes sweep { to { transform: rotate(360deg); } }
.site > * { position: relative; z-index: 1; }

/* typography: UI face for controls, glow on titles */
.brand__name, .menu-link, .btn, .wp-block-button__link, .wp-element-button, .gform_button, .chip, .nav-toggle, .sound-toggle, .footer-col__title, .panel__label, .wp-block-heading.is-style-label, .boot__label { font-family: var(--font-ui); }
.menu-link { font-size: .82rem; font-weight: 500; letter-spacing: .14em; }
.btn, .wp-block-button__link, .wp-element-button, .gform_button { font-size: .8rem; font-weight: 700; letter-spacing: .14em; }
.brand__name { font-size: 1rem; letter-spacing: .18em; }
.chip { font-family: var(--font-ui); font-size: .68rem; }
h1 { text-shadow: 0 0 28px rgba(92,225,255,.28); }
.page-title { text-shadow: 0 0 28px rgba(92,225,255,.28); }

/* header: hard bottom edge with tick ruler + telemetry */
.site-header { border-bottom: 1px solid var(--line-strong); box-shadow: 0 1px 0 rgba(92,225,255,.12), 0 12px 40px rgba(0,0,0,.45); }
.site-header::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 6px; pointer-events: none;
	background: repeating-linear-gradient(90deg, rgba(92,225,255,.5) 0 1px, transparent 1px 24px); opacity: .35; }
.status { gap: .7rem; }
.status__sig { display: inline-flex; align-items: flex-end; gap: 2px; height: 10px; }
.status__sig i { width: 3px; background: var(--cyan); opacity: .9; }
.status__sig i:nth-child(1) { height: 30%; } .status__sig i:nth-child(2) { height: 55%; } .status__sig i:nth-child(3) { height: 80%; } .status__sig i:nth-child(4) { height: 100%; animation: pulse 1.3s steps(2) infinite; }
.status__hex { color: var(--amber); }

/* panels: notched corners, ID tab, animated top trace */
.panel, .wp-block-group.is-style-panel, .wp-block-group.is-style-panel-amber, .wp-block-group.is-style-panel-ghost, .card, .wp-block-columns.is-style-panels > .wp-block-column, .wp-block-details {
	clip-path: var(--corner-cut);
	border-radius: 0;
}
.panel::after, .wp-block-group.is-style-panel::after, .wp-block-group.is-style-panel-amber::after, .wp-block-group.is-style-panel-ghost::after { bottom: 0; right: 0; width: 26px; height: 26px; border-width: 0 2px 2px 0; clip-path: polygon(0 100%, 100% 100%, 100% 0); }
.panel::before, .wp-block-group.is-style-panel::before, .wp-block-group.is-style-panel-amber::before, .wp-block-group.is-style-panel-ghost::before { width: 26px; height: 26px; top: 0; left: 0; }
/* the top trace */
.wp-block-group.is-style-panel, .wp-block-group.is-style-panel-amber, .wp-block-group.is-style-panel-ghost, .panel {
	background-image: linear-gradient(90deg, transparent 0%, var(--accent) 50%, transparent 100%), linear-gradient(180deg, var(--panel), var(--bg-2));
	background-size: 40% 1px, 100% 100%; background-repeat: no-repeat; background-position: -40% 0, 0 0;
	animation: trace 6s linear infinite;
}
.wp-block-group.is-style-panel-ghost { background-image: linear-gradient(90deg, transparent 0%, var(--accent) 50%, transparent 100%); background-size: 40% 1px; background-color: rgba(11,19,34,.35); }
@keyframes trace { 0% { background-position: -40% 0, 0 0; } 100% { background-position: 140% 0, 0 0; } }
/* system label as an ID tab */
.wp-block-heading.is-style-label, .panel__label {
	display: flex; align-items: center; gap: .7rem; margin: 0 0 1.1rem;
	font-size: .66rem; letter-spacing: .2em; color: var(--cyan);
}
.wp-block-heading.is-style-label::before, .panel__label::before { content: "▣"; opacity: 1; font-size: .8rem; color: var(--accent, var(--cyan)); }
.wp-block-heading.is-style-label::after { content: ""; flex: 1; height: 1px; background: linear-gradient(90deg, var(--line-strong), transparent); }
.panel__head::before { display: none; }
.wp-block-group.is-style-panel-amber .wp-block-heading.is-style-label { color: var(--amber); }
/* tick ruler along the left of every wide panel */
.entry-content > .wp-block-group.alignwide.is-style-panel, .entry-content > .wp-block-group.alignwide.is-style-panel-ghost, .entry-content > .wp-block-group.alignwide.is-style-panel-amber { padding-left: clamp(1.6rem, 4vw, 2.6rem); }
.entry-content > .wp-block-group.alignwide.is-style-panel, .entry-content > .wp-block-group.alignwide.is-style-panel-ghost, .entry-content > .wp-block-group.alignwide.is-style-panel-amber { box-shadow: inset 12px 0 0 -11px var(--line-strong); }

/* hero: ruler + crosshair + telemetry column */
.hero { padding: clamp(1.5rem, 4vw, 3rem) clamp(1.25rem, 4vw, 3rem) clamp(1.5rem, 4vw, 3rem) clamp(2rem, 5vw, 3.5rem); overflow: hidden; }
.hero::before { content: ""; position: absolute; left: 10px; top: 24px; bottom: 24px; width: 8px; pointer-events: none;
	background: repeating-linear-gradient(180deg, var(--cyan) 0 1px, transparent 1px 12px); opacity: .45; mask-image: linear-gradient(180deg, transparent, #000 15%, #000 85%, transparent); }
.hero::after { content: "SYS · ONLINE"; position: absolute; right: 26px; top: 18px; font: 500 .6rem/1 var(--font-mono); letter-spacing: .2em; color: var(--muted); pointer-events: none; }
.hero .wp-block-heading { position: relative; }
.hero { display: grid; grid-template-columns: minmax(0, 1fr); gap: 0 2rem; }
.hero > * { grid-column: 1; }
.hero__telemetry { display: none; }
@media (min-width: 1000px) {
	.hero--telemetry { grid-template-columns: minmax(0, 1fr) 300px; }
	.hero__telemetry { display: block; grid-column: 2; grid-row: 1 / span 6; align-self: center; }
}
.telemetry { font-family: var(--font-mono); font-size: .62rem; letter-spacing: .12em; color: var(--muted); text-transform: uppercase; display: grid; gap: .8rem; }
.telemetry__ring { position: relative; width: 220px; height: 220px; margin: 0 auto; }
.telemetry__ring svg { width: 100%; height: 100%; display: block; }
.telemetry__ring .r1 { animation: sweep 18s linear infinite; transform-origin: 50% 50%; }
.telemetry__ring .r2 { animation: sweep 9s linear infinite reverse; transform-origin: 50% 50%; }
.telemetry__ring .r3 { animation: sweep 30s linear infinite; transform-origin: 50% 50%; }
.telemetry__ring .core { animation: pulse 2s ease-in-out infinite; }
.telemetry__ring .txt { font-family: var(--font-mono); font-size: 9px; fill: var(--cyan); letter-spacing: .15em; }
.telemetry__rows { display: grid; gap: .45rem; }
.telemetry__row { display: grid; grid-template-columns: 5.5em 1fr auto; align-items: center; gap: .6rem; }
.telemetry__bar { height: 4px; background: var(--line); position: relative; overflow: hidden; }
.telemetry__bar i { position: absolute; inset: 0; width: 50%; background: var(--cyan); animation: tbar 3.2s ease-in-out infinite alternate; }
.telemetry__row:nth-child(2) .telemetry__bar i { animation-duration: 4.1s; width: 72%; background: var(--amber); }
.telemetry__row:nth-child(3) .telemetry__bar i { animation-duration: 2.6s; width: 34%; }
.telemetry__row:nth-child(4) .telemetry__bar i { animation-duration: 5s; width: 88%; background: var(--green); }
@keyframes tbar { from { transform: scaleX(.55); transform-origin: left; } to { transform: scaleX(1); transform-origin: left; } }
.telemetry__val { color: var(--cyan); }

/* cards: brackets + scan on hover */
.card::before { content: ""; position: absolute; top: 0; left: 0; width: 18px; height: 18px; border-top: 2px solid var(--cyan); border-left: 2px solid var(--cyan); z-index: 2; }
.card::after { top: auto; left: auto; bottom: 0; right: 0; width: 18px; height: 18px; background: none; border-bottom: 2px solid var(--cyan); border-right: 2px solid var(--cyan); opacity: 1; }
.card__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 0, rgba(92,225,255,.18) 50%, transparent 100%); transform: translateY(-100%); opacity: 0; transition: transform .6s var(--ease), opacity .2s; pointer-events: none; }
.card:hover .card__media::after { transform: translateY(100%); opacity: 1; }
.card__body .eyebrow::before { content: "▸ "; }
.card:hover { box-shadow: 0 16px 40px rgba(0,0,0,.5), 0 0 0 1px rgba(92,225,255,.35), 0 0 24px rgba(92,225,255,.15); }

/* buttons: glow + indicator */
.btn--primary, .wp-block-button:not(.is-style-ghost):not(.is-style-amber) .wp-block-button__link, .gform_button, .wp-element-button { box-shadow: 0 0 0 1px rgba(92,225,255,.4), 0 0 18px rgba(92,225,255,.25); }
.btn--primary:hover, .wp-block-button:not(.is-style-ghost):not(.is-style-amber) .wp-block-button__link:hover { box-shadow: 0 0 0 1px #fff, 0 0 28px rgba(92,225,255,.5); }
.btn--ghost::before, .wp-block-button.is-style-ghost .wp-block-button__link::before { content: ""; width: 6px; height: 6px; background: var(--cyan); box-shadow: 0 0 6px var(--cyan); margin-right: .2rem; }
.wp-block-button.is-style-ghost .wp-block-button__link { clip-path: var(--corner-cut); --notch: 8px; }

/* app cards: icon glow, index */
.app-card__icon { box-shadow: inset 0 0 0 1px rgba(92,225,255,.3), 0 0 20px rgba(92,225,255,.15); clip-path: var(--corner-cut); --notch: 10px; border-radius: 0; position: relative; }
.app-card__icon::after { content: ""; position: absolute; inset: 6px; border: 1px dashed rgba(92,225,255,.35); }

/* stats: readout look */
.stat__value { font-family: var(--font-ui); font-size: clamp(1.9rem, 4vw, 2.6rem); letter-spacing: .04em; text-shadow: 0 0 18px rgba(92,225,255,.4); }
.stat::after { content: ""; display: block; height: 3px; margin-top: .8rem; background: repeating-linear-gradient(90deg, var(--cyan) 0 8px, transparent 8px 12px); opacity: .5; }

/* steps: brackets on numbers */
.step::before { font-family: var(--font-ui); background: rgba(255,180,84,.08); }

/* details/FAQ */
.wp-block-details > summary::before { clip-path: var(--corner-cut); --notch: 5px; }

/* breadcrumbs: bracketed */
.breadcrumbs ol::before { content: "["; color: var(--line-strong); margin-right: .2rem; }
.breadcrumbs ol::after { content: "]"; color: var(--line-strong); margin-left: .2rem; }

/* footer: telemetry rule */
.site-footer { position: relative; }
.site-footer::before { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: repeating-linear-gradient(90deg, var(--cyan) 0 40px, transparent 40px 48px, var(--amber) 48px 56px, transparent 56px 120px); opacity: .35; }
.footer-col__title { clip-path: none; }

/* boot v2 */
.boot { background: radial-gradient(60% 60% at 50% 50%, #08101E, var(--bg)); }
.boot__inner { text-align: center; }
.boot__ring { position: relative; width: 84px; height: 84px; margin: 0 auto 1.2rem; }
.boot__ring i { position: absolute; inset: 0; border-radius: 50%; border: 2px solid transparent; border-top-color: var(--cyan); animation: sweep 1.1s linear infinite; }
.boot__ring i:nth-child(2) { inset: 12px; border-top-color: var(--amber); animation-duration: 1.7s; animation-direction: reverse; }
.boot__ring i:nth-child(3) { inset: 24px; border-top-color: var(--green); animation-duration: .8s; }
.boot__lines { text-align: left; width: max-content; margin-inline: auto; }
.boot__hex { margin-top: .8rem; color: var(--amber); letter-spacing: .3em; }

/* mobile nav tweaks for the UI face */
@media (max-width: 959px) { .primary-nav .menu > li > .menu-link { font-size: 1.15rem; letter-spacing: .2em; } }

@media (prefers-reduced-motion: reduce) {
	.fx__beam, .site::after, .telemetry__ring .r1, .telemetry__ring .r2, .telemetry__ring .r3, .boot__ring i { animation: none !important; }
	.wp-block-group.is-style-panel, .wp-block-group.is-style-panel-amber, .wp-block-group.is-style-panel-ghost, .panel { animation: none !important; }
}

/* About video: framed like a screen */
.wp-block-video.is-style-screen { position: relative; overflow: hidden; border: 1px solid var(--line); clip-path: var(--corner-cut); background: #000; }
.wp-block-video.is-style-screen video { display: block; width: 100%; height: auto; }
.wp-block-video.is-style-screen::after { content: ""; position: absolute; inset: 0; pointer-events: none; background: repeating-linear-gradient(0deg, rgba(0,0,0,.18) 0 2px, transparent 2px 4px); }

/* Case-study screen galleries: phone screenshots, uncropped, framed as screens */
.wp-block-gallery.screens { gap: 1rem; align-items: start; }
.wp-block-gallery.screens .wp-block-image { flex: 1 1 200px; max-width: 100%; }
/* Keep the UA width/height-attribute aspect ratio: overriding it left lazy images un-sized before load (huge boxes, layout shift). */
.wp-block-gallery.screens .wp-block-image img { width: 100%; height: auto !important; object-fit: contain; border: 1px solid var(--line); clip-path: var(--corner-cut); --notch: 8px; background: #000; }
/* Selector must out-rank core's `.has-nested-images figure.wp-block-image figcaption` (0,3,2), which pins captions over the image with a blur overlay. */
.wp-block-gallery.screens figure.wp-block-image figcaption { position: static; background: none; backdrop-filter: none; padding: .4rem 0 0; color: var(--muted); font-family: var(--font-mono); font-size: .72rem; letter-spacing: .06em; text-align: left; }
.wp-block-gallery.screens figure.wp-block-image:has(figcaption)::before { content: none; }
@media (min-width: 700px) { .wp-block-gallery.screens.columns-4 .wp-block-image { flex-basis: calc(25% - .75rem); } .wp-block-gallery.screens.columns-3 .wp-block-image { flex-basis: calc(33.333% - .7rem); } }

/* Fix: keep the sticky header (and its mobile overlay) above page content */
.site > .site-header { z-index: 50; }
@media (max-width: 599px) { .hero::after { display: none; } }

/* Tablet pass: fewer orphan tiles, readable screen galleries, sane video size when columns stack */
.wp-block-columns.is-style-panels { grid-template-columns: repeat(auto-fit, minmax(min(100%, 210px), 1fr)); }
@media (max-width: 899px) { .wp-block-gallery.screens .wp-block-image { flex-basis: calc(50% - .5rem) !important; } }
@media (max-width: 781px) { .wp-block-video.is-style-screen { max-width: 420px; margin-inline: auto; } }
@media (min-width: 960px) and (max-width: 1099px) { .menu-link { padding: 0 .6rem; font-size: .76rem; } .brand__tag { display: none; } }
.wp-block-columns.is-style-panels { grid-template-columns: repeat(auto-fit, minmax(min(100%, 196px), 1fr)); gap: 1rem; }
.grid--cards { grid-template-columns: repeat(auto-fill, minmax(min(100%, 220px), 1fr)); }
@media (min-width: 960px) and (max-width: 1199px) { .grid--cards { grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1rem; } }

/* Accessibility pass: 24px minimum targets, bigger form checkboxes */
.breadcrumbs a { display: inline-block; padding: .3rem 0; }
.gform_wrapper .gfield-choice-input, .gform_wrapper input[type="checkbox"], .gform_wrapper input[type="radio"] { width: 22px; height: 22px; accent-color: var(--cyan); vertical-align: middle; margin-right: .5rem; }
.gform_wrapper .gchoice label { display: inline-block; padding: .35rem 0; cursor: pointer; }
/* Non-text contrast (WCAG 1.4.11): control boundaries at >= 3:1 */
.gform_wrapper input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]), .gform_wrapper textarea, .gform_wrapper select, .comment-form input:not([type="submit"]):not([type="checkbox"]), .comment-form textarea { border-color: var(--cyan-dim); }
.chip, .nav-toggle, .sound-toggle, .pagination .page-numbers { border-color: var(--cyan-dim); }

/* FAQ accordion toggles: amber, click plays the button sound (see main.js) */
.wp-block-details > summary::before { border-color: var(--amber); color: var(--amber); background: rgba(255,180,84,.08); box-shadow: 0 0 8px rgba(255,180,84,.25); }
.wp-block-details[open] > summary::before { background: var(--amber); color: var(--bg); }
.wp-block-details > summary:hover::before, .wp-block-details > summary:focus-visible::before { background: var(--amber); color: var(--bg); }
/* Process step numbers: solid amber, matching the open accordion toggles */
.step::before { background: var(--amber); color: var(--bg); border-color: var(--amber); font-weight: 700; box-shadow: 0 0 10px rgba(255,180,84,.35); }

/* App icons in cards: real icons, no dashed inner frame */
.app-card__icon img { display: block; width: 100%; height: 100%; object-fit: cover; }
.app-card__icon:has(img) { background: transparent; box-shadow: 0 0 20px rgba(92,225,255,.15); clip-path: none; border-radius: 14px; border-color: rgba(92,225,255,.25); }
.app-card__icon:has(img)::after { display: none; }