/* arcanecircuits.com staging. Grimoire meets engineering datasheet. Every colour is a theme token; load after
   tokens.css, motifs.css, icons.css and emblem.css. One orchestrated motion: the living emblem (plus the single lightning seam). */

/* Self-hosted fonts (SIL Open Font License 1.1, see assets/fonts/OFL.txt). Latin subset; Noto Sans Runic for the rune lines only. */
@font-face { font-family: "Cinzel"; font-style: normal; font-weight: 500 700; font-display: swap; src: url(../fonts/cinzel-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/ibm-plex-mono-latin-400.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "IBM Plex Mono"; font-style: normal; font-weight: 500; font-display: swap; src: url(../fonts/ibm-plex-mono-latin-500.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "IBM Plex Sans"; font-style: normal; font-weight: 400 600; font-display: swap; src: url(../fonts/ibm-plex-sans-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }
@font-face { font-family: "Noto Sans Runic"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/noto-sans-runic-runic.woff2) format("woff2"); unicode-range: U+16A0-16F8; }
@font-face { font-family: "Noto Sans Runic"; font-style: normal; font-weight: 400; font-display: swap; src: url(../fonts/noto-sans-runic-latin.woff2) format("woff2"); unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD; }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 84px; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body {
	margin: 0; background: var(--surface); color: var(--ink); font: var(--text-body); font-size: 16px; line-height: 1.6;
	overflow-x: hidden;
}
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
img { max-width: 100%; height: auto; display: block; }
a { color: var(--rune); text-underline-offset: 3px; }
a:focus-visible, .btn:focus-visible { outline: 2px solid var(--rune); outline-offset: 3px; }
h1, h2, h3 { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }

.wrap { width: min(1200px, 100% - 32px); margin-inline: auto; }
.skip { position: absolute; left: -999px; top: 8px; z-index: 50; padding: 8px 12px; background: var(--rune); color: var(--on-accent); }
.skip:focus { left: 16px; }

/* ---------- buttons (square-cut, brass outline) ---------- */
.btn {
	display: inline-flex; align-items: center; gap: var(--space-2); min-height: 44px; padding: 10px 22px;
	font: 600 13px/1 var(--font-sans); letter-spacing: .12em; text-transform: uppercase; text-decoration: none;
	color: var(--ink); border: 1px solid var(--line); border-radius: var(--radius-sm); background: transparent;
	transition: border-color .15s, color .15s, background-color .15s;
}
.btn:hover { border-color: var(--rune); color: var(--rune); }
.btn--primary { background: var(--rune); border-color: var(--rune); color: var(--on-accent); box-shadow: var(--glow-rune); }
.btn--primary:hover { background: var(--glow); border-color: var(--glow); color: var(--on-accent); }
.btn--sm { min-height: 36px; padding: 8px 14px; font-size: 12px; }
.actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }

/* ---------- sticky nav ---------- */
.nav {
	position: sticky; top: 0; z-index: 20;
	background: color-mix(in srgb, var(--void) 88%, transparent); backdrop-filter: blur(10px);
	border-bottom: 1px solid var(--line);
}
.nav::after { /* measured rule: brass ticks under the bar */
	content: ""; position: absolute; left: 0; right: 0; bottom: -5px; height: 4px; pointer-events: none;
	background: repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px 24px);
	opacity: .55;
}
.nav__bar { position: relative; min-height: 64px; }
.nav__links { display: grid; grid-template-columns: 1fr 150px 1fr; align-items: center; min-height: 64px; }
.nav__list { display: flex; align-items: center; gap: var(--space-6); }
.nav__list--l { justify-content: flex-end; padding-right: var(--space-4); }
.nav__list--r { justify-content: flex-start; padding-left: var(--space-4); }
.nav__list a:not(.btn) {
	color: var(--ink-muted); text-decoration: none; font: 500 12px/1 var(--font-mono); letter-spacing: .14em; text-transform: uppercase;
	padding: 8px 0; border-bottom: 1px solid transparent; white-space: nowrap;
}
.nav__list a:not(.btn):hover { color: var(--rune); border-bottom-color: var(--rune); }
.nav__no { color: var(--steel-light); margin-right: 8px; }
/* the crest: the living emblem centred in the bar, overhanging its lower edge into the hero */
.nav__crest { position: relative; display: block; height: 64px; border-radius: 50%; }
.nav__crest .ac-emblem {
	--ac-size: 176px; --ac-inset: 12%;
	position: absolute; left: 50%; top: -16px; translate: -50% 0; z-index: 2;
	filter: drop-shadow(0 6px 14px rgb(0 0 0 / .65)) drop-shadow(0 0 16px rgb(var(--glow-rgb) / .35));
}
.nav__crest:focus-visible { outline: 2px solid var(--rune); outline-offset: -8px; }

/* ---------- hero: the scene ---------- */
.hero--scene {
	--h: clamp(640px, calc(100svh - 64px), 900px);
	--fx: 50%; /* which point of the art stays put as the viewport narrows */
	position: relative; height: var(--h); overflow: hidden; isolation: isolate; background: var(--void);
}
.scene-stage { position: absolute; inset: 0; z-index: 0; }
.scene-box {
	position: absolute; top: 50%; left: var(--fx);
	width: max(100%, calc(var(--h) * 2752 / 1536)); aspect-ratio: 2752 / 1536;
	translate: calc(-1 * var(--fx)) -50%;
}
.scene-art, .scene-art img { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.scene-art img { object-fit: cover; }
/* desktop: zoomed out so the whole scene shows; the art's edges fade into the page colour (owner, 2026-11-09) */
@media (min-width: 901px) {
	.scene-box { width: calc(var(--h) * 2752 / 1536 * .86); }
	.scene-art {
		-webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent), linear-gradient(180deg, transparent, #000 7%);
		-webkit-mask-composite: source-in;
		mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent), linear-gradient(180deg, transparent, #000 7%);
		mask-composite: intersect;
	}
}
/* the circuit backdrop's traces, faint, rising over the lower scene so the hero blends into the page */
.scene-haze::before {
	content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .38; mix-blend-mode: screen;
	background: url(../brand/circuit-backdrop.svg) center bottom / cover no-repeat;
	-webkit-mask-image: linear-gradient(0deg, #000 0%, rgb(0 0 0 / .55) 30%, transparent 58%);
	mask-image: linear-gradient(0deg, #000 0%, rgb(0 0 0 / .55) 30%, transparent 58%);
}
/* haze: darkens the top for the nav, the left and right edges, and fades the floor into the page */
.scene-haze {
	position: absolute; inset: 0; z-index: 1; pointer-events: none;
	background:
		linear-gradient(180deg, rgb(5 11 13 / .55) 0%, transparent 18%),
		radial-gradient(120% 70% at 50% 40%, transparent 55%, rgb(5 11 13 / .55) 100%),
		linear-gradient(0deg, var(--void) 0%, rgb(5 11 13 / .92) 16%, rgb(5 11 13 / .45) 36%, transparent 54%);
}
.scene-copy { position: absolute; z-index: 2; inset: auto 0 clamp(28px, 6vh, 64px); text-align: center; padding-inline: 16px; }
.scene-lockup { width: min(1180px, 100%); margin-inline: auto; }
.scene-title { margin: 0; font: 700 clamp(44px, 7.4vw, 104px)/1 var(--font-display); letter-spacing: .06em; text-transform: uppercase; }
.scene-title__word { display: inline-block; }
/* rune lines: Futhark transliteration of ARCANE CIRCUITS, above and below the title */
.scene-runes {
	margin: 0 0 6px; font: 400 clamp(16px, 2vw, 26px)/1 "Noto Sans Runic", "Segoe UI Historic", monospace; letter-spacing: .5em; padding-left: .5em;
	color: var(--glow); opacity: .95; text-shadow: 0 0 10px rgb(var(--glow-rgb) / .55); white-space: nowrap; overflow: hidden;
}
.scene-runes--low { margin: 8px 0 0; }
/* traces run out from both sides of a small metal plate, ending in solder pads */
.scene-rail { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 10px; }
.scene-trace { flex: 0 1 520px; min-width: 0; height: 40px; overflow: hidden; }
.scene-trace--r { transform: scaleX(-1); }
.scene-trace path { fill: none; stroke: var(--glow); stroke-width: 2; stroke-linejoin: round; filter: drop-shadow(0 0 4px rgb(var(--glow-rgb) / .6)); }
.scene-trace circle { fill: var(--void); stroke: var(--glow); stroke-width: 2; }
.scene-trace .ac-lightning-glow { stroke: var(--glow); stroke-width: 6; opacity: .45; filter: none; }
.scene-trace .ac-lightning { stroke: var(--lightning); stroke-width: 2; filter: drop-shadow(0 0 3px var(--lightning)); }
.scene-plate { flex: none; --_c: 9px; padding: 8px 18px 8px 22px; font: 700 clamp(14px, 1.5vw, 20px)/1 var(--font-display); letter-spacing: .5em; text-transform: uppercase; }
.scene-plate .ac-metal { display: block; margin-right: -.5em; }
.scene-tagline { margin: 10px auto 0; max-width: 46ch; color: var(--ink); font-size: clamp(15px, 1.35vw, 18px); text-shadow: 0 1px 8px rgb(0 0 0 / .9); }

/* ---------- hero art placement per width: the wizard sits on the centre line of the render ---------- */
@media (max-width: 900px) { .hero--scene { --h: clamp(600px, 100svh, 760px); } }
@media (max-width: 640px) {
	.hero--scene { --h: 700px; }
	.scene-copy { bottom: 28px; }
	.scene-title { font-size: clamp(40px, 13.5vw, 64px); }
	.scene-title__word { display: block; }
	.scene-runes { letter-spacing: .28em; }
	.scene-trace { flex-basis: 140px; }
}

/* the lightning arc in the left trace is the only thing besides the emblem that moves (stopped under reduced motion in motifs.css) */
.scene-trace .ac-lightning--strike { stroke-dasharray: 1; }

/* ---------- section scaffolding (datasheet heads) ---------- */
/* the page: the circuit tile sits fixed and faint behind every section (body text stays well above 4.5:1) */
body::before {
	content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: .5;
	background: url(../brand/circuit-tile.svg) center top / min(1200px, 160vw) auto repeat-y;
}
.section { padding-block: clamp(56px, 7vw, 104px); background: transparent; }
.section + .section { border-top: 1px solid var(--line-subtle); }
.sec-head { display: flex; align-items: baseline; gap: var(--space-4); margin-bottom: var(--space-8); }
.sec-head__no { font: 500 13px/1 var(--font-mono); color: var(--gold); letter-spacing: .1em; }
.sec-head__title { font: var(--text-display-lg); font-size: clamp(28px, 3vw, 40px); letter-spacing: .04em; text-transform: uppercase; }
.sec-head__rule {
	flex: 1; align-self: center; height: 7px; min-width: 40px;
	background:
		linear-gradient(var(--line), var(--line)) 0 100% / 100% 1px no-repeat,
		repeating-linear-gradient(90deg, var(--line) 0 1px, transparent 1px 16px) 0 100% / 100% 7px no-repeat;
	opacity: .8;
}

/* 01: capabilities grid, ruled like a datasheet table */
.caps { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border: 1px solid var(--line); border-radius: var(--radius-sm); }
.cap { position: relative; padding: var(--space-12) var(--space-8) var(--space-8); background: var(--surface-raised); }
.cap + .cap { border-left: 1px solid var(--line); }
.cap__no { position: absolute; top: 18px; right: 22px; font: 500 12px/1 var(--font-mono); color: var(--steel-light); letter-spacing: .14em; }
.cap__icon { margin-bottom: var(--space-6); }
.cap h3 { font: var(--text-heading); letter-spacing: .03em; margin-bottom: var(--space-3); }
.cap p { margin: 0; color: var(--ink-muted); max-width: 32ch; }

/* 02: process band, a teal slab with a trace joining four nodes */
/* full-strength circuit backdrop behind Process and Contact, under a teal scrim so text stays legible */
.band, .band-art {
	background: linear-gradient(rgb(5 22 26 / .42), rgb(5 22 26 / .3)), url(../brand/circuit-backdrop.svg) center bottom / cover no-repeat, var(--teal-deep);
	color: var(--on-teal-deep);
}
.band .sec-head__no { color: var(--brass); }
.band__lead { margin: calc(-1 * var(--space-4)) 0 var(--space-8); font: 400 18px/1.5 var(--font-sans); color: var(--on-teal-deep); opacity: .9; }
.flow { position: relative; display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-6); }
.flow__step:not(:last-child)::before { /* the trace to the next node, ending in a pad */
	content: ""; position: absolute; top: 35px; left: 84px; right: calc(-1 * var(--space-6) + 12px); height: 2px;
	background: var(--glow); box-shadow: 0 0 8px rgb(var(--glow-rgb) / .6);
}
/* each step sits on a dark glass plate so its text reads over the bright traces (owner, 2026-11-09) */
.flow__step {
	position: relative; padding: var(--space-6) var(--space-4) var(--space-6);
	background: linear-gradient(rgb(4 18 21 / .9), rgb(4 18 21 / .82)); border: 1px solid rgb(var(--glow-rgb) / .35); border-radius: 4px;
	-webkit-backdrop-filter: blur(3px); backdrop-filter: blur(3px);
}
.flow__step:not(:last-child)::before { top: calc(var(--space-6) + 35px); left: calc(var(--space-4) + 84px); right: calc(-1 * var(--space-6)); }
.flow__step p { margin: 0; color: color-mix(in srgb, var(--glow) 55%, var(--ink)); font: 500 16px/1.55 var(--font-sans); }
.flow__node {
	position: relative; display: grid; place-items: center; width: 72px; height: 72px; margin-bottom: var(--space-4);
	border-radius: 50%; border: 2px solid var(--glow); background: var(--teal-deep); color: var(--on-teal-deep);
	box-shadow: 0 0 0 6px var(--teal-deep);
}
.flow__no { display: block; font: 500 11px/1 var(--font-mono); letter-spacing: .18em; text-transform: uppercase; color: var(--glow); text-shadow: 0 0 6px rgb(var(--glow-rgb) / .45); margin-bottom: var(--space-2); }
.flow h3 { font: var(--text-heading); letter-spacing: .04em; text-transform: uppercase; margin-bottom: var(--space-2); }

/* 03: gallery, framed plates */
.gallery { display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); gap: var(--space-6); align-items: stretch; }
.frame { margin: 0; position: relative; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius-sm); background: var(--void); }
.frame::before, .frame::after { /* brass corner brackets */
	content: ""; position: absolute; width: 22px; height: 22px; border: 2px solid var(--brass); pointer-events: none;
}
.frame::before { top: -4px; left: -4px; border-width: 2px 0 0 2px; }
.frame::after { bottom: -4px; right: -4px; border-width: 0 2px 2px 0; }
.frame picture, .frame img { width: 100%; height: 100%; object-fit: cover; }
.frame--tall { display: flex; flex-direction: column; }
.frame--tall picture { flex: 1; min-height: 0; }
.frame--tall img { aspect-ratio: 4 / 5; object-position: 50% 30%; }
.frame figcaption {
	display: flex; gap: var(--space-4); align-items: baseline; padding: 12px 4px 2px;
	font: 400 13px/1.4 var(--font-mono); color: var(--ink-muted);
}
.frame__no { color: var(--gold); letter-spacing: .14em; text-transform: uppercase; }

/* who we are (mission) */
.mission__body { max-width: 62ch; }
.mission__lead { margin: 0 0 var(--space-4); font: 600 clamp(24px, 2.8vw, 38px)/1.25 var(--font-display); color: var(--ink); }
.mission__body p:not(.mission__lead) { margin: 0; color: var(--ink-muted); font-size: clamp(16px, 1.3vw, 19px); }

/* about plate in the gallery */
.about { display: flex; flex-direction: column; justify-content: center; padding: var(--space-8); }
.about h3 { font: var(--text-heading); letter-spacing: .04em; margin-bottom: var(--space-4); }
.about p { margin: 0 0 var(--space-4); color: var(--ink-muted); }
.about .btn { align-self: flex-start; margin-top: var(--space-2); }
.about__mark { width: 96px; height: 96px; margin-bottom: var(--space-6); color: var(--glow, #47cfd4); }

/* 04: contact plate */
.contact__plate { display: grid; grid-template-columns: 1.4fr 1fr; gap: var(--space-12); align-items: center; padding: clamp(28px, 4vw, 56px); }
.contact__lead { margin: 0 0 var(--space-4); font: 600 clamp(22px, 2.4vw, 32px)/1.3 var(--font-display); color: var(--ink); }
.reveal__note { margin: 0 0 var(--space-3); color: var(--ink-muted); }
.reveal__widget { min-height: 65px; margin-bottom: var(--space-2); }
.reveal__status { min-height: 1.4em; margin: 0 0 var(--space-2); color: var(--glow); font: 500 14px/1.4 var(--font-sans); }
.contact__accent { margin: 0; color: var(--brass); font: 500 15px/1.5 var(--font-mono); letter-spacing: .04em; }
.spec { margin: 0 0 var(--space-6); padding-bottom: var(--space-4); border-bottom: 1px solid var(--line); }
.spec dt { font: 500 11px/1 var(--font-mono); letter-spacing: .2em; text-transform: uppercase; color: var(--steel-light); margin-bottom: var(--space-2); }
.spec dd { margin: 0; font: 500 17px/1.4 var(--font-mono); overflow-wrap: anywhere; }

/* footer */
.footer { background: var(--void); border-top: 1px solid var(--line); }
.footer__bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: var(--space-4); padding-block: var(--space-6); }
.footer__brand { display: inline-flex; align-items: center; gap: var(--space-3); color: var(--ink-muted); font: 400 14px/1 var(--font-mono); }
.footer__brand .ac-icon { color: var(--steel-light); }
.footer__links { display: flex; gap: var(--space-6); font: 400 14px/1 var(--font-mono); }
.footer__links a { color: var(--ink-muted); text-decoration: none; padding-block: 8px; }
.footer__links a:hover, .footer__links a[aria-current="page"] { color: var(--ink); text-decoration: underline; text-underline-offset: 4px; }

/* ---------- legal pages (privacy, terms) ---------- */
.legal__body { max-width: 72ch; }
.legal__body h2 { font: var(--text-heading); letter-spacing: .03em; margin: var(--space-8) 0 var(--space-3); color: var(--ink); }
.legal__body p, .legal__body li { color: var(--ink-muted); }
.legal__body p { margin: 0 0 var(--space-4); }
.legal__body ul { margin: 0 0 var(--space-4); padding-left: 1.25em; }
.legal__body li + li { margin-top: var(--space-2); }
.legal__body strong { color: var(--ink); }
.legal__body a { color: var(--rune); }
.legal__date { font: 400 13px/1.4 var(--font-mono); letter-spacing: .08em; }

/* ---------- responsive ---------- */
@media (max-width: 960px) {
	.caps { grid-template-columns: 1fr; }
	.cap + .cap { border-left: 0; border-top: 1px solid var(--line); }
	.flow { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: var(--space-8); }
	.flow__step::before { display: none; }
	.gallery { grid-template-columns: 1fr; }
	.contact__plate { grid-template-columns: 1fr; gap: var(--space-6); }
}
@media (max-width: 720px) {
	.nav__links { grid-template-columns: auto auto; justify-content: center; column-gap: 12px; grid-template-areas: "crest crest" "l r"; row-gap: 2px; padding-bottom: 8px; }
	.nav__crest { grid-area: crest; justify-self: center; width: 84px; height: 84px; margin-top: 6px; }
	.nav__crest .ac-emblem { --ac-size: 100px; --ac-inset: 12%; top: -8px; }
	.nav__list--l { grid-area: l; padding-right: 0; gap: 12px; }
	.nav__list--r { grid-area: r; padding-left: 0; gap: 12px; }
	.nav__list a:not(.btn) { padding: 6px 0; font-size: 11px; }
	.nav__no, .nav__cta { display: none; }
	.sec-head { flex-wrap: wrap; }
	.cap { padding: var(--space-8) var(--space-6) var(--space-6); }
	.flow { grid-template-columns: 1fr; }
	.gallery { grid-template-columns: 1fr; }
}


/* 404 */
.notfound { min-height: 100svh; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: var(--space-8); padding: var(--space-12) var(--space-4); text-align: center; }
.notfound__plate { width: min(440px, 100%); padding: var(--space-8); }
.notfound h1 { font-family: var(--font-display); font-weight: 700; font-size: clamp(1.8rem, 6vw, 2.4rem); letter-spacing: .05em; color: var(--ink); margin-bottom: var(--space-4); }
.notfound p { margin: var(--space-4) 0 0; font-size: 1.05rem; }
.notfound .ac-runes { width: min(640px, 100%); }
.scene-actions { justify-content: center; margin-top: var(--space-4); }

/* ---------- .ac-metal: brushed teal-steel lettering, matching the emblem rim ---------- */
.ac-metal { color: var(--steel-light); }
@supports ((-webkit-background-clip: text) or (background-clip: text)) {
	.ac-metal {
		background:
			repeating-linear-gradient(90deg, rgb(255 255 255 / .07) 0 1px, transparent 1px 3px),
			linear-gradient(180deg, #1b3a40 0%, #46888a 22%, #b9e3df 46%, #6dbbb8 62%, #234047 100%);
		-webkit-background-clip: text; background-clip: text; color: transparent; -webkit-text-fill-color: transparent;
		-webkit-text-stroke: .6px rgb(185 227 223 / .38);
		filter: drop-shadow(0 1px 0 #04090b) drop-shadow(0 2px 3px rgb(0 0 0 / .7)) drop-shadow(0 0 12px rgb(var(--glow-rgb) / .22));
	}
}
@media (forced-colors: active) { .ac-metal { background: none; -webkit-text-fill-color: currentColor; color: CanvasText; filter: none; } }