html { scroll-behavior: smooth; }
body { background: var(--ground); }

/* circuito atmosférico global */
.field-circuit {
  position: fixed;
  inset: 0;
  z-index: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  opacity: 0.58;
}
.field-circuit__traces {
  fill: none;
  stroke: oklch(0.63 0.055 220 / 0.16);
  stroke-width: 1.15;
  vector-effect: non-scaling-stroke;
}
.field-circuit__vias {
  fill: var(--ground);
  stroke: oklch(0.69 0.07 220 / 0.28);
  stroke-width: 1;
  vector-effect: non-scaling-stroke;
}
.field-circuit__signals {
  fill: none;
  stroke-linecap: round;
}
.field-circuit .signal {
  stroke: var(--sun);
  stroke-width: 2;
  stroke-dasharray: 0.025 0.975;
  stroke-dashoffset: 1;
  vector-effect: non-scaling-stroke;
  animation: circuitSignal 8s linear infinite;
}
.field-circuit .signal--2,
.field-circuit .signal--5 {
  stroke: var(--ice-soft);
  opacity: 0.68;
}
.field-circuit .signal--2 { animation-duration: 11s; animation-delay: -5s; }
.field-circuit .signal--3 { animation-duration: 9.5s; animation-delay: -7s; }
.field-circuit .signal--4 { animation-duration: 13s; animation-delay: -3s; }
.field-circuit .signal--5 { animation-duration: 10s; animation-delay: -8s; }
.field-circuit .signal--6 { animation-duration: 12s; animation-delay: -1s; }
@keyframes circuitSignal { to { stroke-dashoffset: 0; } }

/* estática suave global */
.field-noise {
  position: fixed; inset: 0; z-index: 1; pointer-events: none; opacity: 0.06; mix-blend-mode: soft-light;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='f'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.85' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23f)'/%3E%3C/svg%3E");
  background-size: 170px 170px;
}
@media (prefers-reduced-motion: no-preference) { .field-noise { animation: fieldStatic 0.9s steps(1) infinite; } }
@keyframes fieldStatic { 0%{opacity:.06;background-position:0 0} 25%{opacity:.04;background-position:-20px 12px} 50%{opacity:.07;background-position:14px -16px} 75%{opacity:.035;background-position:22px 18px} 100%{opacity:.06;background-position:0 0} }
.field-vignette { position: fixed; inset: 0; z-index: 1; pointer-events: none;
  background:
    radial-gradient(70% 64% at 50% 42%, var(--ground) 0%, transparent 72%),
    radial-gradient(135% 100% at 50% 28%, transparent 44%, var(--ground-deep) 100%); }

@media (max-width: 700px) {
  .field-circuit { opacity: 0.4; width: 145%; left: -22.5%; }
  .field-circuit__traces { stroke-width: 0.9; }
}
@media (prefers-reduced-motion: reduce) {
  .field-circuit .signal { animation: none; opacity: 0.18; }
}

.frame { position: fixed; inset: 0; z-index: 30; pointer-events: none; }
.frame .corner { position: absolute; width: 16px; height: 16px; border: 1px solid var(--line); }
.frame .tl { top: 14px; left: 14px; border-right: 0; border-bottom: 0; }
.frame .tr { top: 14px; right: 14px; border-left: 0; border-bottom: 0; }
.frame .bl { bottom: 14px; left: 14px; border-right: 0; border-top: 0; }
.frame .br { bottom: 14px; right: 14px; border-left: 0; border-top: 0; }

.top {
  position: fixed; top: 0; left: 0; right: 0; z-index: 32;
  display: flex; justify-content: space-between; align-items: center;
  padding: 1.1rem clamp(1.6rem, 4vw, 3rem); pointer-events: none;
  background: linear-gradient(180deg, var(--ground) 35%, transparent);
}
.top .grp { display: flex; align-items: center; gap: 0.7rem; pointer-events: auto; }
.top a.home { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.14em; color: var(--ink-mute); text-transform: uppercase; transition: color var(--fast); }
.top a.home:hover { color: var(--sun); }
.top .dot { width: 7px; height: 7px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 10px 1px var(--sun-glow); animation: breathe 5.2s var(--ease-in-out) infinite; }
@keyframes breathe { 0%,100% { opacity: .55; transform: scale(.85);} 50% { opacity: 1; transform: scale(1.12);} }
.top b { font-family: var(--serif); font-weight: 500; font-size: 0.96rem; }

/* .eixo (visual) vive em shared/base.css; aqui só o breakpoint da tecnologia */
@media (max-width: 980px) { .eixo { display: none; } }

main { position: relative; z-index: 10; }
.act { max-width: var(--max); margin: 0 auto; padding-inline: clamp(1.6rem, 5vw, 4.5rem); }
.reveal { opacity: 1; }
.reveal.in { animation: riseIn .9s var(--ease) both; }
.reveal.d1.in { animation-delay: .08s; } .reveal.d2.in { animation-delay: .16s; } .reveal.d3.in { animation-delay: .24s; }
@keyframes riseIn { from { opacity: 0; transform: translateY(26px); } to { opacity: 1; transform: none; } }

/* ---------- capa ---------- */
.capa { min-height: 96vh; display: flex; flex-direction: column; justify-content: center; padding-block: 7rem 3rem; }
.capa .eyebrow { display: flex; align-items: center; gap: 1.1rem; margin-bottom: 2rem; flex-wrap: wrap; }
.capa .eyebrow .tick { width: 3rem; height: 1px; background: var(--line-soft); }
.verbete { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.2em; text-transform: uppercase; color: var(--ice-soft); }
.capa h1 { font-family: var(--serif); font-weight: 300; letter-spacing: -0.025em; font-size: clamp(3rem, 8.5vw, 7.6rem); line-height: 0.92; }
.capa h1 em { font-style: italic; color: var(--sun); }
.capa .verb2 { margin-top: 1.6rem; font-family: var(--serif); font-style: italic; font-size: clamp(1.3rem, 2.6vw, 2.2rem); color: var(--ink); line-height: 1.2; max-width: 28ch; }
.capa .lead { margin-top: 2.2rem; max-width: 60ch; display: grid; gap: 1.4rem; }
.capa .lead p { color: var(--ink-soft); font-size: clamp(1.05rem, 1.5vw, 1.22rem); line-height: 1.65; }
.capa .lead p b { color: var(--ink); font-weight: 500; }
.capa .lead p em { color: var(--ink); font-style: italic; }

/* trilho de metadados do atelier */
.meta-rail { margin-top: 2.8rem; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; background: var(--line-faint); border: 1px solid var(--line-faint); max-width: 62rem; }
@media (max-width: 760px) { .meta-rail { grid-template-columns: 1fr 1fr; } }
.meta-rail .cell { background: oklch(0.2 0.013 256 / 0.7); padding: 1rem 1.1rem; display: grid; gap: 0.4rem; align-content: start; }
.meta-rail .cell .k { font-family: var(--mono); font-size: var(--meta-size); letter-spacing: 0.16em; text-transform: uppercase; color: var(--sun-soft); }
.meta-rail .cell .v { font-family: var(--serif); font-size: 0.98rem; color: var(--ink-soft); line-height: 1.3; }
.meta-rail .cell .v em { font-style: italic; color: var(--ink); }
.cue { margin-top: 2.6rem; display: inline-flex; align-items: center; gap: 0.7rem; font-family: var(--mono); font-size: var(--meta-size); letter-spacing: 0.16em; text-transform: uppercase; color: var(--ink-mute); }
.cue .dotp { width: 8px; height: 8px; border-radius: 50%; background: var(--sun); animation: recPulse 2.2s var(--ease-in-out) infinite; }
@keyframes recPulse { 0%,100% { box-shadow: 0 0 0 0 oklch(0.86 0.15 75 / 0.4); opacity: .6; } 50% { box-shadow: 0 0 0 7px oklch(0.86 0.15 75 / 0); opacity: 1; } }

/* ---------- rótulo de seção ---------- */
.actlabel { display: flex; align-items: baseline; gap: 1.2rem; margin-bottom: 1.6rem; }
.actlabel .ix { font-family: var(--mono); font-size: 0.78rem; color: var(--sun-soft); letter-spacing: 0.08em; }
.actlabel h2 { font-family: var(--serif); font-weight: 400; font-size: clamp(1.6rem, 2.6vw, 2.3rem); letter-spacing: -0.01em; }
.actlabel .rule { flex: 1; height: 1px; background: var(--line-soft); align-self: center; }
.sec { padding-block: clamp(4rem, 12vw, 14rem); }
.sec__lead { max-width: 58ch; color: var(--ink-soft); font-size: clamp(1.02rem, 1.4vw, 1.18rem); line-height: 1.6; }
.sec__lead em { font-style: italic; color: var(--sun-soft); }

/* ====================== O CIRCUITO (painel interativo) ====================== */
.board-panel { position: relative; margin-top: 2rem; border: 1px solid var(--line-faint);
  background: linear-gradient(180deg, oklch(0.175 0.013 257) 0%, oklch(0.158 0.013 258) 100%);
  box-shadow: inset 0 1px 0 oklch(0.8 0.02 250 / 0.04), 0 40px 90px -60px oklch(0 0 0 / 0.8);
  overflow: hidden; }
.board-panel .pcorner { position: absolute; width: 10px; height: 10px; border: 1px solid var(--line); opacity: 0.7; z-index: 6; }
.board-panel .pcorner.tl { top: 8px; left: 8px; border-right: 0; border-bottom: 0; }
.board-panel .pcorner.tr { top: 8px; right: 8px; border-left: 0; border-bottom: 0; }
.board-panel .pcorner.bl { bottom: 8px; left: 8px; border-right: 0; border-top: 0; }
.board-panel .pcorner.br { bottom: 8px; right: 8px; border-left: 0; border-top: 0; }
.board-bar { display: flex; align-items: center; justify-content: space-between; gap: 1rem;
  padding: 0.85rem clamp(1rem, 2.4vw, 1.5rem); border-bottom: 1px solid var(--line-faint); flex-wrap: wrap; position: relative; z-index: 5; }
.board-bar .l { font-family: var(--mono); font-size: var(--meta-size); letter-spacing: 0.14em; color: var(--sun-soft); }
.board-bar .r { font-family: var(--mono); font-size: var(--meta-size); letter-spacing: 0.1em; color: var(--ink-mute); display: inline-flex; align-items: center; gap: 1.1rem; flex-wrap: wrap; }
.board-bar .r b { color: var(--ice-soft); font-weight: 400; }
.board-bar .r .live { display: inline-flex; align-items: center; gap: 0.45rem; }
.board-bar .r .live .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 8px var(--sun-glow); animation: breathe 5.2s var(--ease-in-out) infinite; }

.board-stage { position: relative; height: clamp(340px, 50vh, 500px); }
.board-stage .substrate { position: absolute; inset: 0; z-index: 0; pointer-events: none; opacity: 0.5;
  background-image:
    linear-gradient(var(--line-faint) 1px, transparent 1px),
    linear-gradient(90deg, var(--line-faint) 1px, transparent 1px);
  background-size: 34px 34px;
  -webkit-mask-image: radial-gradient(120% 100% at 50% 50%, #000 50%, transparent 92%);
          mask-image: radial-gradient(120% 100% at 50% 50%, #000 50%, transparent 92%); }
.board-stage svg { position: absolute; inset: 0; width: 100%; height: 100%; display: block; z-index: 1; }

.trace { fill: none; stroke: oklch(0.5 0.05 70 / 0.42); stroke-width: 1.4; }
.pulse-base { fill: none; stroke: oklch(0.62 0.10 60 / 0.5); stroke-width: 1.5; stroke-linecap: round;
              stroke-dasharray: 9 200; filter: drop-shadow(0 0 3px var(--sun-glow)); }
.pulse-hot { fill: none; stroke: var(--sun); stroke-width: 2.2; stroke-linecap: round;
             stroke-dasharray: 18 1000; filter: drop-shadow(0 0 6px var(--sun-glow)); opacity: 0; }
.via { fill: oklch(0.5 0.04 70 / 0.5); }

.node-hit { fill: var(--ground); opacity: 0.001; pointer-events: all; }
.pad { fill: var(--ground-deep); stroke: oklch(0.55 0.05 68 / 0.55); stroke-width: 1.3; }
.pad__ring { fill: none; stroke: var(--sun); stroke-width: 1.4; opacity: 0; transition: opacity var(--base); }
.node-g { cursor: pointer; }
.node-g:hover .pad, .node-g:focus-visible .pad { stroke: var(--sun); }
.node-g:hover .pad__ring { opacity: 0.5; }
.node-g.sel .pad { stroke: var(--sun); fill: oklch(0.83 0.135 72 / 0.10); }
.node-g.sel .pad__ring { opacity: 1; }
.node-num { font-family: var(--mono); font-size: 10px; letter-spacing: 0.06em; fill: var(--ink-faint); }
.node-lab { font-family: var(--serif); font-size: 18px; fill: var(--ink-soft); transition: fill var(--base); }
.node-sub { font-family: var(--mono); font-size: 9px; letter-spacing: 0.08em; fill: var(--ink-faint); text-transform: uppercase; }
.node-g:hover .node-lab, .node-g.sel .node-lab { fill: var(--ink); }
.node-g.sel .node-num { fill: var(--sun-soft); }

/* núcleo: cérebro de perfil no die do processador */
.core-g { cursor: pointer; }
.core-die { fill: oklch(0.205 0.014 256); stroke: oklch(0.55 0.05 68 / 0.5); stroke-width: 1.5; }
.core-pin { stroke: oklch(0.5 0.05 70 / 0.45); stroke-width: 1.3; }
.core-halo { fill: var(--sun); opacity: 0; }
.core-brain { fill: none; stroke: var(--sun); stroke-width: 1.7; opacity: 0.95; filter: drop-shadow(0 0 5px var(--sun-glow)); stroke-linecap: round; stroke-linejoin: round; }
.core-brain--soft { stroke: var(--sun); stroke-width: 1.1; opacity: 0.5; }
.core-g:hover .core-die, .core-g.sel .core-die { stroke: var(--sun); }
.core-lab { font-family: var(--mono); font-size: 9px; letter-spacing: 0.14em; fill: var(--sun-soft); text-transform: uppercase; }

.board-hint { position: absolute; left: clamp(0.9rem, 2vw, 1.4rem); bottom: clamp(0.8rem, 2vh, 1.2rem); z-index: 4;
  font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.1em; color: var(--ink-faint); text-transform: uppercase; pointer-events: none; }
.board-hint b { color: var(--ice-soft); font-weight: 400; }

/* dossiê — expande embaixo do circuito */
.dossier { position: relative; margin-top: 1px; border: 1px solid var(--line-faint); border-top: 0;
  background: linear-gradient(180deg, oklch(0.2 0.013 256) 0%, oklch(0.178 0.013 257) 100%); overflow: hidden; }
.dossier::before { content:""; position: absolute; top: 0; left: 0; width: 100%; height: 2px;
  background: linear-gradient(90deg, var(--sun), transparent 55%); opacity: 0.75; }
.dossier__inner { padding: clamp(1.6rem, 3vw, 2.6rem); animation: dossierIn .5s var(--ease) both; }
@keyframes dossierIn { from { transform: translateY(12px); } to { transform: none; } }
.dossier__head { display: flex; align-items: flex-start; justify-content: space-between; gap: 1.5rem; flex-wrap: wrap; }
.dossier__id { font-family: var(--mono); font-size: var(--meta-size); letter-spacing: 0.14em; text-transform: uppercase; color: var(--sun-soft); }
.dossier__kind { font-family: var(--mono); font-size: var(--meta-size); letter-spacing: 0.1em; text-transform: uppercase; color: var(--ice-soft); margin-top: 0.4rem; }
.dossier__status { font-family: var(--mono); font-size: var(--meta-size); letter-spacing: 0.08em; color: var(--ink-mute); border: 1px solid var(--line-faint); padding: 0.3rem 0.7rem; white-space: nowrap; }
.dossier__sum { margin-top: 1.1rem; max-width: 56ch; color: var(--ink-soft); font-size: 1.06rem; line-height: 1.62; }
.dossier__sum em { font-style: italic; color: var(--ink); }
.dossier__link { display: inline-flex; align-items: center; gap: 0.6rem; margin-top: 1.6rem;
  font-family: var(--mono); font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--sun); transition: gap var(--base) var(--ease); }
.dossier__link:hover { gap: 0.95rem; }

/* lista de posts (tema ou capa) dentro do dossiê */
.post-lista { display: flex; flex-direction: column; margin-top: 1.4rem; }
.post-item {
  display: grid; grid-template-columns: clamp(4rem, 8vw, 6rem) 1fr auto;
  gap: 0 clamp(1rem, 2.5vw, 1.8rem); align-items: baseline;
  padding: clamp(0.9rem, 2.2vh, 1.3rem) 0.2rem;
  border-top: 1px solid var(--line-faint); text-decoration: none; color: inherit;
  transition: background var(--fast) var(--ease);
}
.post-item:hover { background: oklch(0.24 0.014 255 / 0.4); }
.post-item__data { font-family: var(--mono); font-size: var(--meta-size); letter-spacing: 0.1em; color: var(--sun-soft); white-space: nowrap; }
.post-item__mid { display: flex; flex-direction: column; gap: 0.25rem; }
.post-item__k { font-family: var(--mono); font-size: 0.56rem; letter-spacing: 0.18em; text-transform: uppercase; color: var(--ice-soft); }
.post-item__t { font-family: var(--serif); font-style: italic; font-size: clamp(1.02rem, 1.6vw, 1.24rem); color: var(--ink); line-height: 1.25; }
.post-item__r { font-family: var(--serif); font-size: 0.92rem; color: var(--ink-mute); line-height: 1.4; }
.post-item__rd { font-family: var(--mono); font-size: var(--meta-size); color: var(--ink-faint); white-space: nowrap; }
.post-vazio { font-family: var(--serif); font-style: italic; color: var(--ink-mute); padding: 1.4rem 0.2rem; }
.post-vazio em { color: var(--sun-soft); }
@media (max-width: 600px) {
  .post-item { grid-template-columns: 1fr auto; }
  .post-item__data { grid-column: 1 / -1; }
}

/* ====================== OFICINA / git log ====================== */
.term { margin-top: 2rem; border: 1px solid var(--line-faint); background: oklch(0.16 0.013 257 / 0.85); overflow: hidden; max-width: 56rem; }
.term__bar { display: flex; align-items: center; gap: 0.5rem; padding: 0.7rem 1rem; border-bottom: 1px solid var(--line-faint); font-family: var(--mono); font-size: var(--meta-size); letter-spacing: 0.08em; color: var(--ink-mute); }
.term__bar .d { width: 8px; height: 8px; border-radius: 50%; background: var(--line); }
.term__bar .d.sun { background: var(--sun-soft); }
.term__bar .t { margin-left: auto; color: var(--ink-faint); }
.term__body { padding: 1.2rem 1.2rem 1.4rem; font-family: var(--mono); font-size: 0.82rem; line-height: 1.85; }
.term__body .cmd { color: var(--ink-soft); } .term__body .cmd .pp { color: var(--sun); }
.term__body .log { color: var(--ink-mute); display: grid; gap: 0.1rem; margin-top: 0.4rem; }
.term__body .log .h { color: var(--ice-soft); } .term__body .log .m { color: var(--ink-soft); }
.term__note { margin-top: 1.6rem; font-family: var(--serif); font-style: italic; font-size: clamp(1.05rem, 1.7vw, 1.35rem); color: var(--ink-soft); max-width: 44ch; line-height: 1.4; }
.term__note b { color: var(--sun); font-style: normal; font-weight: 400; }

/* ====================== colofão ====================== */
.colofao { min-height: 58vh; display: flex; flex-direction: column; justify-content: center; padding-block: 4rem 7rem; }
.colofao .statement { max-width: 50ch; font-family: var(--serif); font-weight: 300; font-size: clamp(1.4rem, 2.6vw, 2.05rem); line-height: 1.35; color: var(--ink-soft); }
.colofao .statement b { color: var(--ink); font-weight: 500; }
.colofao .statement em { color: var(--sun); font-style: italic; }
.colofao .sig { margin-top: 3rem; padding-top: 1.4rem; border-top: 1px solid var(--line-faint); display: flex; justify-content: space-between; flex-wrap: wrap; gap: 1rem; font-family: var(--mono); font-size: var(--meta-size); letter-spacing: 0.14em; color: var(--ink-faint); text-transform: uppercase; }
.colofao .sig a { color: var(--ink-mute); transition: color var(--fast); }
.colofao .sig a:hover { color: var(--sun); }

/* ---- logo de fundo (canto inferior esquerdo, fixo) ---- */
.logo-bg {
  position: fixed; bottom: 5%; left: 3%; right: auto;
  width: clamp(8vw, 9.6vw, 12.6vw);
  opacity: 0.045; pointer-events: none; z-index: 2;
  user-select: none; -webkit-user-select: none;
}
/* ---- nav global ---- */
.obs-top {
  position: fixed; top: 0; left: 0; right: 0; z-index: 32;
  display: flex; justify-content: space-between; align-items: center;
  padding: 0.7rem clamp(1.4rem, 3.5vw, 2.6rem);
  background: oklch(0.19 0.014 257 / 0.8);
  backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px);
  border-bottom: 1px solid var(--line-faint);
}
.obs-top .grp { display: flex; align-items: center; gap: 0.7rem; text-decoration: none; color: inherit; }
.obs-top { transition: background 0.5s var(--ease); }
.obs-top.scrolling { background: oklch(0.19 0.014 257 / 0.25); }
.logo-mark { height: 48px; width: auto; display: block; opacity: 0.9; flex-shrink: 0; }
.logo-mark--sm { height: 20px; width: auto; display: block; opacity: 0.5; flex-shrink: 0; }
.obs-top b { font-family: var(--serif); font-weight: 500; font-size: 0.96rem; text-transform: uppercase; letter-spacing: 0.06em; }
.obs-nav { display: flex; align-items: center; gap: clamp(0.6rem, 1.2vw, 1.2rem); }
.obs-nav__link { font-family: var(--mono); font-size: 0.62rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--ink-mute); transition: color var(--fast); white-space: nowrap; text-decoration: none; }
.obs-nav__link:hover { color: var(--ink-soft); text-decoration: underline; text-decoration-color: var(--sun); text-underline-offset: 4px; text-decoration-thickness: 1px; }
.obs-nav__link.active { color: var(--ink-soft); text-decoration: underline; text-decoration-color: var(--sun); text-underline-offset: 4px; text-decoration-thickness: 1px; }
.obs-nav__link[href="digital-artisan.html"] { color: var(--sun); }
@media (max-width: 860px) {
  .obs-top { flex-wrap: wrap; }
  .obs-nav { width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; padding-bottom: 0.4rem; scrollbar-width: none; }
  .obs-nav::-webkit-scrollbar { display: none; }
}
.obs-top .site-name { display: flex; flex-direction: column; justify-content: space-between; height: 48px; font-family: var(--mono); font-weight: 300; font-size: 0.60rem; letter-spacing: 0.15em; text-transform: uppercase; line-height: 1; gap: 0; }

/* ====================== ajustes v2: circuito sem moldura ====================== */
/* o diagrama deixa de ser um widget encaixotado e passa a viver no campo,
   junto do circuito de fundo que é a alma da página */
.board-panel--nu { border: 0; background: transparent; box-shadow: none; overflow: visible; margin-top: 1rem; }
.board-caption { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap;
  margin-top: 0.4rem; padding-top: 0.7rem; border-top: 1px solid var(--line-faint);
  font-family: var(--mono); font-size: var(--meta-size); letter-spacing: 0.1em; color: var(--ink-faint); }
.board-caption .live { display: inline-flex; align-items: center; gap: 0.5rem; color: var(--sun-soft); white-space: nowrap; }
.board-caption .dot { width: 6px; height: 6px; border-radius: 50%; background: var(--sun); box-shadow: 0 0 8px var(--sun-glow); animation: breathe 5.2s var(--ease-in-out) infinite; }

/* campo da lente sob o circuito */
#field { position: fixed; inset: 0; z-index: 0; pointer-events: none; }