/* frankvitetta.net | dark field journal theme. Self-hosted IBM Plex. Written mobile first:
   the base rules target a phone, wider layouts are added with min-width queries. */
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:400;font-display:swap;src:url(/theme/fonts/ibm-plex-mono-latin-400-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Mono";font-style:normal;font-weight:500;font-display:swap;src:url(/theme/fonts/ibm-plex-mono-latin-500-normal.woff2) format("woff2")}
@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:100 700;font-display:swap;src:url(/theme/fonts/ibm-plex-sans-latin-wght-normal.woff2) format("woff2")}

:root{
--fj-bg:#060a13;--fj-deep:#080d19;--fj-panel:#0e1526;
--fj-line:rgba(255,255,255,.09);--fj-line2:rgba(255,255,255,.17);
--fj-ink:#f2f5fc;--fj-text:#c9d1e3;--fj-soft:#98a5c0;
--fj-blue:#6f9dff;--fj-violet:#a78fff;--fj-cyan:#5fdcf0;--fj-warm:#ffb86b;
--fj-grad:linear-gradient(100deg,#7aa5ff,#a993ff 52%,#62dcf0);
--fj-card:linear-gradient(180deg,rgba(255,255,255,.055),rgba(255,255,255,.015));
--fj-mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
--fj-sans:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
--fj-pad:1.25rem;--fj-col:44rem;--fj-r:18px;--fj-ease:cubic-bezier(.16,1,.3,1);
color-scheme:dark}

*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%;scroll-padding-top:1.25rem;background:var(--fj-bg)}
body{margin:0;min-height:100vh;background:radial-gradient(46rem 26rem at 88% -9rem,rgba(130,95,255,.17),transparent 70%) no-repeat,radial-gradient(44rem 26rem at 4% -11rem,rgba(60,110,255,.2),transparent 70%) no-repeat,var(--fj-bg);color:var(--fj-text);font:400 1.0625rem/1.7 var(--fj-sans);-webkit-font-smoothing:antialiased;overflow-wrap:break-word;padding-bottom:calc(4.2rem + env(safe-area-inset-bottom,0px))}
a{color:var(--fj-ink);text-decoration-line:underline;text-decoration-color:rgba(111,157,255,.75);text-decoration-thickness:1px;text-underline-offset:.22em}
a:hover{color:var(--fj-cyan);text-decoration-color:currentColor}
:focus-visible{outline:2px solid var(--fj-cyan);outline-offset:3px;border-radius:4px}
h1,h2,h3{font-family:var(--fj-sans);font-weight:600;color:var(--fj-ink);margin:0;text-wrap:balance}
h1{font-size:clamp(1.9rem,1.25rem + 3vw,3.05rem);line-height:1.12;letter-spacing:-.034em}
h2{font-size:1.42rem;line-height:1.24;letter-spacing:-.024em;margin:0 0 1rem}
h3{font-size:1.1rem;line-height:1.35;letter-spacing:-.014em;margin:2rem 0 .5rem}
p,ul,ol,dl{margin:0 0 1.15rem}
ul,ol{padding-left:1.25rem}
li{margin-bottom:.45rem}
li::marker{color:var(--fj-blue)}
ol>li::marker{font-family:var(--fj-mono);font-size:.82em}
strong,b{font-weight:600;color:var(--fj-ink)}
time{white-space:nowrap}
::selection{background:rgba(111,157,255,.4);color:#fff}

.fj-skip{position:absolute;left:1rem;top:-6rem;z-index:60;background:var(--fj-ink);color:var(--fj-bg);padding:.85rem 1.1rem;border-radius:.6rem;font:500 .84rem var(--fj-mono);text-decoration:none}
.fj-skip:focus{top:1rem;color:var(--fj-bg)}
.fj-wrap{max-width:72rem;margin-inline:auto;padding-inline:var(--fj-pad)}

/* top line. On a phone the brand sits at the top and the navigation is a thumb bar fixed to the bottom. */
.fj-top{position:relative;z-index:30}
.fj-top-in{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:3.75rem}
.fj-name{display:inline-flex;align-items:center;gap:.65rem;min-height:2.75rem;font:500 .98rem/1 var(--fj-mono);letter-spacing:-.02em;color:var(--fj-ink);text-decoration:none;white-space:nowrap}
.fj-name::before{content:"";flex:none;width:1.7rem;height:1.7rem;border-radius:.5rem;background:url(/logo.svg) center/cover no-repeat;box-shadow:0 0 0 1px rgba(255,255,255,.14),0 0 18px rgba(111,157,255,.35)}
.fj-name:hover{color:var(--fj-ink)}
.fj-nav{position:fixed;left:0;right:0;bottom:0;background:rgba(7,11,21,.9);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);border-top:1px solid var(--fj-line2);padding:.45rem .5rem calc(.45rem + env(safe-area-inset-bottom,0px))}
.fj-nav ul{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.3rem;list-style:none;margin:0;padding:0}
.fj-nav li{margin:0}
.fj-nav a{display:flex;align-items:center;justify-content:center;min-height:3rem;padding:0 .2rem;border-radius:.85rem;font:500 .8rem/1.15 var(--fj-sans);color:var(--fj-text);text-align:center;text-decoration:none}
.fj-nav a:hover{color:var(--fj-ink)}
.fj-nav a[aria-current]{color:var(--fj-ink);background:rgba(255,255,255,.08);box-shadow:inset 0 0 0 1px var(--fj-line)}
.fj-nav .fj-hire,.fj-nav .fj-hire[aria-current]{color:#050913;font-weight:600;background:var(--fj-grad);box-shadow:0 6px 22px -8px rgba(111,157,255,.8),inset 0 1px 0 rgba(255,255,255,.45)}
.fj-nav .fj-hire:hover{color:#050913}
.fj-progress{position:fixed;top:0;left:0;right:0;height:3px;z-index:50;pointer-events:none;background:rgba(255,255,255,.05)}
.fj-progress span{display:block;height:100%;background:var(--fj-grad);transform:scaleX(0);transform-origin:0 50%;box-shadow:0 0 12px rgba(111,157,255,.8)}

/* labels, chips, buttons */
.fj-tag{display:block;font:500 .72rem/1.5 var(--fj-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--fj-soft);margin:0 0 .8rem}
h2.fj-tag{text-wrap:wrap}
.fj-tag b{display:block;font-weight:500;color:var(--fj-ink)}
.fj-num{display:inline-block;font:500 .72rem/1.3 var(--fj-mono);letter-spacing:.02em;color:var(--fj-cyan);border:1px solid rgba(95,220,240,.3);background:rgba(95,220,240,.07);border-radius:.45rem;padding:.2rem .5rem;margin:0 .7rem .25rem 0;vertical-align:middle}
.fj-spec{display:inline-block;font:500 .8rem/1.3 var(--fj-mono);letter-spacing:.02em;text-transform:none;color:var(--fj-cyan);border:1px solid rgba(95,220,240,.3);background:rgba(95,220,240,.07);border-radius:.5rem;padding:.25rem .6rem;justify-self:start}
.fj-kicker{font:400 .78rem/1.4 var(--fj-mono);letter-spacing:.03em;color:var(--fj-soft);margin:0 0 .9rem}
.fj-keys{display:flex;flex-wrap:wrap;gap:.45rem;list-style:none;margin:1.5rem 0 0;padding:0}
.fj-keys li,.fj-cat-meta span{display:inline-flex;align-items:center;margin:0;padding:.3rem .6rem;border:1px solid var(--fj-line2);border-bottom-width:2px;border-radius:.5rem;background:rgba(255,255,255,.035);font:400 .72rem/1.3 var(--fj-mono);color:var(--fj-text);white-space:nowrap}
.fj-actions{display:flex;flex-wrap:wrap;gap:.7rem;margin:1.6rem 0 0}
.fj-cta,.fj-ghost,.fj-send{display:inline-flex;align-items:center;justify-content:center;flex:1 1 auto;min-height:3rem;padding:.4rem 1.35rem;border-radius:999px;border:1px solid transparent;font:600 .96rem/1.2 var(--fj-sans);text-align:center;text-decoration:none;cursor:pointer}
.fj-cta,.fj-send{color:#050913;background:var(--fj-grad);background-size:170% 100%;box-shadow:0 12px 32px -12px rgba(111,157,255,.85),inset 0 1px 0 rgba(255,255,255,.5)}
.fj-cta:hover,.fj-send:hover{color:#050913;background-position:100% 0;box-shadow:0 16px 40px -12px rgba(95,220,240,.8),inset 0 1px 0 rgba(255,255,255,.5)}
.fj-ghost{color:var(--fj-ink);border-color:var(--fj-line2);background:rgba(255,255,255,.04)}
.fj-ghost:hover{color:var(--fj-ink);border-color:rgba(140,170,255,.6);background:rgba(111,157,255,.1)}
p>.fj-cta:only-child{flex:none;margin-top:.4rem}
.fj-big{font-size:1.18rem;line-height:1.58;color:var(--fj-ink)}
.fj-more{font:400 .86rem/1.7 var(--fj-mono);margin-top:1.4rem}
.fj-hl{background:var(--fj-grad);-webkit-background-clip:text;background-clip:text;color:transparent;-webkit-text-fill-color:transparent}

/* animation stages. Every container reserves its own box, so nothing moves when the drawing arrives. */
.fj-anim{display:block;width:100%;aspect-ratio:4/3;overflow:hidden}
.fj-anim svg{display:block;width:100%;height:100%}
.fj-anim-hero{aspect-ratio:720/560}
.fj-anim-layers{aspect-ratio:480/420;max-width:17rem;margin:1.5rem auto 0}
.fj-anim-loop{aspect-ratio:480/400}
.fj-anim-sq{aspect-ratio:1}
.fj-anim-wide{aspect-ratio:3/2}
.fj-anim-signal{aspect-ratio:400/280}
.fj-anim-icon{aspect-ratio:1;width:6rem}
.fj-anim-rule{aspect-ratio:18/1;max-width:72rem;margin-inline:auto}
.fj-window{position:relative;border:1px solid var(--fj-line);border-radius:var(--fj-r);background:var(--fj-card),var(--fj-deep);box-shadow:0 34px 80px -36px rgba(50,90,255,.6),inset 0 1px 0 rgba(255,255,255,.07);overflow:hidden}
.fj-window-bar,.fj-plate-head{display:flex;align-items:center;gap:.4rem 1rem;margin:0;padding:.65rem .9rem;border-bottom:1px solid var(--fj-line);background:rgba(255,255,255,.03);font:400 .68rem/1.4 var(--fj-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fj-soft)}
.fj-window-bar::before,.fj-plate-head::before{content:"";flex:none;width:2.3rem;height:.55rem;background:radial-gradient(circle at .275rem 50%,rgba(255,255,255,.3) .25rem,transparent .28rem),radial-gradient(circle at 1.15rem 50%,rgba(255,255,255,.2) .25rem,transparent .28rem),radial-gradient(circle at 2.025rem 50%,rgba(255,255,255,.12) .25rem,transparent .28rem)}

/* home: hero */
.fj-hero{position:relative;padding:.75rem 0 1rem}
.fj-sky{position:absolute;inset:-3.75rem 0 0;overflow:hidden;pointer-events:none;-webkit-mask-image:linear-gradient(#000 62%,transparent);mask-image:linear-gradient(#000 62%,transparent)}
.fj-drift{position:absolute;inset:0;display:block}
.fj-glow{position:absolute;display:block;border-radius:50%}
.fj-glow-a{width:30rem;height:30rem;left:-15rem;top:-13rem;background:radial-gradient(circle,rgba(70,110,255,.42),transparent 68%)}
.fj-glow-b{width:28rem;height:28rem;right:-16rem;top:2rem;background:radial-gradient(circle,rgba(150,100,255,.3),transparent 68%)}
.fj-lattice{position:absolute;inset:0;display:block;background-image:linear-gradient(rgba(255,255,255,.05) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.05) 1px,transparent 1px);background-size:44px 44px;background-position:50% 0;-webkit-mask-image:radial-gradient(120% 85% at 50% 0%,#000 25%,transparent 78%);mask-image:radial-gradient(120% 85% at 50% 0%,#000 25%,transparent 78%)}
.fj-lattice::after{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(95,220,240,.3) 1px,transparent 1px),linear-gradient(90deg,rgba(95,220,240,.3) 1px,transparent 1px);background-size:44px 44px;background-position:50% 0;-webkit-mask-image:linear-gradient(110deg,transparent 40%,#000 50%,transparent 60%);mask-image:linear-gradient(110deg,transparent 40%,#000 50%,transparent 60%);-webkit-mask-size:300% 100%;mask-size:300% 100%;-webkit-mask-position:130% 0;mask-position:130% 0}
.fj-hero-in{position:relative;display:grid;gap:1.75rem}
.fj-hero h1{font-size:clamp(1.95rem,1.05rem + 4.4vw,3.6rem);line-height:1.08;letter-spacing:-.04em}
.fj-who{display:grid;grid-template-columns:auto 1fr;column-gap:.8rem;align-items:center;font:400 .8rem/1.45 var(--fj-mono);letter-spacing:0;text-transform:none;margin-bottom:1.1rem}
.fj-who::before,.fj-post .fj-label::before{content:"FV";display:grid;place-items:center;flex:none;width:2.75rem;height:2.75rem;border-radius:50%;font:500 .84rem/1 var(--fj-mono);letter-spacing:0;color:#050913;background:var(--fj-grad);box-shadow:0 0 0 1px rgba(255,255,255,.25),0 0 26px rgba(111,157,255,.5)}
.fj-who::before{grid-row:span 2}
.fj-who b{font-size:.95rem}

/* the sheet */
.fj-sheet{padding-top:.25rem}
.fj-row{position:relative;max-width:var(--fj-col);margin:3rem auto 0;padding-top:2.25rem}
.fj-row::before{content:"";position:absolute;left:0;right:0;top:0;height:1px;background:linear-gradient(90deg,rgba(111,157,255,.55),rgba(167,143,255,.3) 35%,rgba(255,255,255,.05) 80%,transparent);transform-origin:0 50%}
.fj-wide{max-width:none}
.fj-wide>:where(p,ul,ol,dl,h2,h3,form,div){max-width:var(--fj-col);margin-inline:auto}
.fj-left .fj-wide>:where(p,ul,ol,dl,h2,h3,form,div){margin-inline:0}
.fj-home .fj-row>h2:not(.fj-tag){font-size:clamp(1.6rem,1.2rem + 1.6vw,2.1rem);letter-spacing:-.03em}
.fj-wide>.fj-window{max-width:none;margin:1.5rem 0}
code{font:400 .9em var(--fj-mono);color:var(--fj-cyan);background:rgba(95,220,240,.08);border:1px solid rgba(95,220,240,.2);border-radius:.35rem;padding:.08em .35em}
.fj-row.fj-first,.fj-crumbs+.fj-row,.fj-crumbs+article>.fj-row:first-child{margin-top:0;padding-top:0}
.fj-row.fj-first::before,.fj-crumbs+.fj-row::before,.fj-crumbs+article>.fj-row:first-child::before{display:none}
.fj-crumbs{font:400 .74rem/1.5 var(--fj-mono);color:var(--fj-soft);margin:0 0 .75rem}
.fj-crumbs ol{list-style:none;display:flex;flex-wrap:wrap;gap:0 .55rem;margin:0;padding:0}
.fj-crumbs li{display:flex;align-items:center;min-height:2.75rem;margin:0}
.fj-crumbs li+li::before{content:"/";margin-right:.55rem;color:var(--fj-soft)}
.fj-crumbs a{display:inline-flex;align-items:center;min-height:2.75rem;color:var(--fj-text);text-decoration-color:transparent}
.fj-crumbs a:hover{text-decoration-color:currentColor}

/* page heads */
.fj-head{display:grid;max-width:none}
.fj-head>*{min-width:0}
.fj-head h1{max-width:46rem}
.fj-lede{font-size:1.14rem;line-height:1.58;color:var(--fj-text);margin:1.1rem 0 0;max-width:40rem}
.fj-head .fj-anim{max-width:19rem;margin:1.5rem auto 0;background:radial-gradient(closest-side,rgba(80,120,255,.2),transparent)}
.fj-head .fj-anim-icon{margin:0 0 1rem}
.fj-label{display:flex;flex-wrap:wrap;align-items:center;gap:.7rem 1.5rem;margin:1.6rem 0 0;padding:1.1rem 0 0;border-top:1px solid var(--fj-line);max-width:46rem}
.fj-label div{min-width:0}
.fj-post .fj-label{position:relative;min-height:3.85rem;padding-left:3.6rem}
.fj-post .fj-label::before{position:absolute;left:0;top:1.1rem}
.fj-label dt{font:400 .64rem/1.4 var(--fj-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--fj-soft)}
.fj-label dd{margin:.12rem 0 0;font:400 .84rem/1.4 var(--fj-mono);color:var(--fj-ink)}
.fj-statement h1{font-size:clamp(1.95rem,1.1rem + 3.8vw,3.3rem);line-height:1.1;letter-spacing:-.038em;max-width:54rem}
.fj-centre{text-align:center;justify-items:center;padding-top:1.5rem}
.fj-centre .fj-anim{margin:0 auto 1.25rem;max-width:11rem;background:none}
.fj-centre .fj-anim-signal{max-width:19rem}
.fj-centre .fj-lede{margin-inline:auto}
.fj-centre .fj-spec{justify-self:center}
.fj-head .fj-spec{margin-bottom:.9rem}

/* contents list */
.fj-row.fj-contents{border:1px solid var(--fj-line);border-radius:var(--fj-r);background:var(--fj-card);padding:1.1rem 1.1rem .5rem}
.fj-contents::before{display:none}
.fj-contents .fj-tag{margin-bottom:.4rem}
.fj-contents ol{list-style:none;counter-reset:fj-c;margin:0;padding:0}
.fj-contents li{counter-increment:fj-c;margin:0;border-top:1px solid var(--fj-line);break-inside:avoid}
.fj-contents a{display:flex;align-items:center;gap:.8rem;min-height:2.9rem;padding:.4rem 0;font-size:.97rem;line-height:1.3;color:var(--fj-text);text-decoration:none}
.fj-contents a::before{content:counter(fj-c,decimal-leading-zero);flex:none;min-width:1.9rem;padding:.18rem .3rem;border:1px solid var(--fj-line2);border-bottom-width:2px;border-radius:.4rem;font:400 .7rem/1.3 var(--fj-mono);text-align:center;color:var(--fj-soft)}
.fj-contents a:hover{color:var(--fj-cyan)}

/* plates: the diagrams, restyled as schematic windows */
.fj-plate{margin:2.2rem 0;border:1px solid var(--fj-line);border-radius:var(--fj-r);background:var(--fj-deep);box-shadow:0 34px 70px -44px rgba(50,90,255,.75);overflow:hidden}
.fj-plate-head span:first-child{color:var(--fj-ink);font-weight:500;margin-right:auto}
.fj-wide-only{display:none}
.fj-plate-frame{background-color:var(--fj-deep);background-image:radial-gradient(60% 80% at 50% 0%,rgba(80,120,255,.14),transparent 70%),radial-gradient(rgba(255,255,255,.1) .8px,transparent 1.1px);background-size:auto,16px 16px;background-position:0 0,7px 7px;padding:1.1rem;overflow-x:auto}
.fj-plate svg{display:block;width:100%;min-width:35rem;max-width:50rem;height:auto;margin-inline:auto;color:#b6c4e6;font-family:var(--fj-mono);font-size:13px}
.fj-plate figcaption{font-size:.9rem;line-height:1.55;color:var(--fj-soft);margin:0;padding:.95rem 1.1rem 1.1rem;border-top:1px solid var(--fj-line)}
.fj-plate figcaption b{display:block;font:500 .7rem/1.5 var(--fj-mono);letter-spacing:.07em;text-transform:uppercase;color:var(--fj-ink);margin-bottom:.25rem}
.fj-d-box{fill:#0d1528;stroke:#7d9df2;stroke-width:1;filter:drop-shadow(0 0 5px rgba(111,157,255,.4))}
.fj-d-acc{fill:rgba(255,184,107,.1);stroke:var(--fj-warm);stroke-width:1.3;filter:drop-shadow(0 0 7px rgba(255,184,107,.5))}
.fj-d-soft{fill:none;stroke:#8795b4;stroke-width:1;stroke-dasharray:4 4}
.fj-d-line{fill:none;stroke:currentColor;stroke-width:1}
.fj-d-hint{fill:none;stroke:var(--fj-warm);stroke-width:1.3;stroke-dasharray:5 4;filter:drop-shadow(0 0 5px rgba(255,184,107,.6))}
.fj-d-t{fill:#e8edf8}
.fj-d-b{fill:#fff;font-weight:500}
.fj-d-m{fill:#a3afca;font-size:11.5px}
.fj-d-a{fill:var(--fj-warm);font-weight:500}
.fj-d-af{fill:var(--fj-warm)}
.fj-d-mf{fill:#8795b4}

/* tables */
.fj-table-wrap{overflow-x:auto;margin:2rem 0 .9rem;border:1px solid var(--fj-line);border-radius:var(--fj-r);background:rgba(255,255,255,.02)}
.fj-table{border-collapse:collapse;width:100%;min-width:36rem;font-size:.92rem;line-height:1.5}
.fj-table caption{caption-side:top;text-align:left;font:400 .74rem/1.5 var(--fj-mono);color:var(--fj-soft);padding:.85rem 1rem}
.fj-table th,.fj-table td{text-align:left;vertical-align:top;padding:.8rem 1rem;border-top:1px solid var(--fj-line)}
.fj-table thead th{font:500 .66rem/1.45 var(--fj-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fj-soft);background:rgba(255,255,255,.035)}
.fj-table tbody th{font-weight:600;color:var(--fj-ink);min-width:7.5rem}
.fj-table tbody tr:hover{background:rgba(111,157,255,.06)}
.fj-note{font-size:.88rem;line-height:1.55;color:var(--fj-soft);margin-bottom:1.5rem}
.fj-ref{font:500 .7em var(--fj-mono);color:var(--fj-cyan);text-decoration:none;white-space:nowrap;vertical-align:.35em;padding:0 .12em}
.fj-ref:hover{text-decoration:underline}

/* notes, summary, sources */
.fj-aside{border:1px solid rgba(255,184,107,.26);border-left:3px solid var(--fj-warm);border-radius:12px;background:rgba(255,184,107,.05);padding:.9rem 1.1rem;margin:1.8rem 0 0;font-size:.95rem;line-height:1.6}
.fj-aside p{margin:0}
.fj-aside strong{font:500 .72rem var(--fj-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fj-warm);margin-right:.3rem}
.fj-plain{border:1px solid rgba(111,157,255,.32);border-radius:var(--fj-r);background:linear-gradient(180deg,rgba(111,157,255,.12),rgba(167,143,255,.04));box-shadow:0 30px 70px -44px rgba(80,120,255,.9);padding:1.5rem 1.25rem .7rem}
.fj-plain h2{font-size:1.2rem;margin-bottom:.8rem}
.fj-plain ul{list-style:none;padding:0;margin:0}
.fj-plain li{position:relative;padding:.7rem 0 .7rem 1.6rem;margin:0;border-top:1px solid var(--fj-line);color:var(--fj-ink)}
.fj-plain li::before{content:"";position:absolute;left:.1rem;top:1.28rem;width:.5rem;height:.5rem;border-radius:.16rem;background:var(--fj-grad)}
.fj-sources ol{list-style:none;counter-reset:fj-s;padding:0;font-size:.9rem;line-height:1.5;overflow-wrap:anywhere}
.fj-sources li{counter-increment:fj-s;position:relative;padding:.6rem 0 .6rem 2.7rem;margin:0;border-top:1px solid var(--fj-line);scroll-margin-top:5rem}
.fj-sources li::before{content:"[" counter(fj-s) "]";position:absolute;left:0;top:.72rem;font:500 .74rem/1.5 var(--fj-mono);color:var(--fj-cyan)}
.fj-sources li:target{background:rgba(255,184,107,.1);box-shadow:0 0 0 .5rem rgba(255,184,107,.1);border-radius:2px}
.fj-sources a{color:var(--fj-text)}

/* cards: field notes, offers */
.fj-cat{list-style:none;display:grid;gap:1rem;margin:1.5rem 0 0;padding:0;max-width:none}
.fj-cat>li{position:relative;margin:0;padding:1.25rem;border:1px solid var(--fj-line);border-radius:var(--fj-r);background:var(--fj-card);overflow:hidden;transition:border-color .25s ease,box-shadow .25s ease}
.fj-cat>li::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(20rem circle at var(--fj-mx,50%) var(--fj-my,0%),rgba(111,157,255,.16),transparent 62%);opacity:0;transition:opacity .3s ease;pointer-events:none}
.fj-cat .fj-anim{width:auto;aspect-ratio:16/9;margin:-1.25rem -1.25rem 1.1rem;border-bottom:1px solid var(--fj-line);background:radial-gradient(70% 90% at 50% 0%,rgba(80,120,255,.16),transparent 70%),var(--fj-deep)}
.fj-cat-no{display:block;font:500 .76rem/1.5 var(--fj-mono);color:var(--fj-cyan);margin:0 0 .45rem}
.fj-cat h2,.fj-cat h3{font-size:1.22rem;line-height:1.28;letter-spacing:-.02em;margin:0 0 .5rem}
.fj-cat h2 a,.fj-cat h3 a{color:var(--fj-ink);text-decoration:none}
.fj-cat a.fj-cover::after{content:"";position:absolute;inset:0;z-index:1}
.fj-cat p{margin:0;color:var(--fj-text);font-size:.98rem;line-height:1.58}
.fj-cat .fj-cat-meta{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:1rem}
.fj-offers .fj-anim{width:7.5rem;aspect-ratio:1;margin:-.5rem 0 .4rem -.6rem;border:0;background:none}
.fj-feature{display:grid;gap:1.25rem;padding:1.5rem 1.25rem;border:1px solid var(--fj-line);border-radius:calc(var(--fj-r) + 4px);background:radial-gradient(90% 120% at 100% 0%,rgba(95,220,240,.12),transparent 60%),radial-gradient(90% 120% at 0% 100%,rgba(167,143,255,.14),transparent 60%),var(--fj-deep);box-shadow:0 40px 90px -50px rgba(80,120,255,.9),inset 0 1px 0 rgba(255,255,255,.07)}
.fj-feature::before{display:none}
.fj-feature>*{min-width:0}
.fj-feature h2{font-size:clamp(1.5rem,1.1rem + 1.8vw,2.1rem);letter-spacing:-.03em}
.fj-feature .fj-anim{max-width:21rem;margin-inline:auto}
.fj-feature p:last-child{margin-bottom:0}
.fj-feature>div{max-width:none}
.fj-quiet{background:var(--fj-card);box-shadow:inset 0 1px 0 rgba(255,255,255,.06)}

/* Code Scout page */
.fj-steps{list-style:none;counter-reset:fj-st;display:grid;gap:.6rem;margin:0;padding:1rem}
.fj-steps li{counter-increment:fj-st;display:grid;align-content:start;grid-template-columns:auto 1fr;gap:.1rem .9rem;margin:0;padding:.8rem .9rem;border:1px solid var(--fj-line);border-radius:12px;background:rgba(255,255,255,.025)}
.fj-steps li::before{content:counter(fj-st,decimal-leading-zero);grid-row:span 2;align-self:start;padding:.2rem .45rem;border:1px solid rgba(95,220,240,.3);border-bottom-width:2px;border-radius:.45rem;background:rgba(95,220,240,.07);font:500 .72rem/1.3 var(--fj-mono);color:var(--fj-cyan)}
.fj-steps b{font:500 .95rem/1.3 var(--fj-mono);color:var(--fj-ink)}
.fj-steps span{grid-column:2;font-size:.94rem;line-height:1.5;color:var(--fj-text)}
.fj-tiles{list-style:none;display:grid;gap:1rem;margin:1.5rem 0 0;padding:0;max-width:none}
.fj-tiles li{margin:0;padding:1.25rem;border:1px solid var(--fj-line);border-radius:var(--fj-r);background:var(--fj-card)}
.fj-tiles h3{margin:0 0 .45rem;font-size:1.08rem}
.fj-tiles p{margin:0;font-size:.97rem;line-height:1.58}
.fj-facts{display:grid;gap:0;margin:1.25rem 0 0;border:1px solid var(--fj-line);border-radius:var(--fj-r);background:var(--fj-card);overflow:hidden}
.fj-facts div{padding:.9rem 1.1rem;border-top:1px solid var(--fj-line)}
.fj-facts div:first-child{border-top:0}
.fj-facts dt{font:500 .68rem/1.4 var(--fj-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--fj-soft)}
.fj-facts dd{margin:.25rem 0 0;color:var(--fj-ink)}
.fj-status{display:inline-flex;align-items:center;gap:.5rem;padding:.3rem .7rem;border:1px solid rgba(255,184,107,.4);border-radius:999px;background:rgba(255,184,107,.07);font:500 .72rem/1.3 var(--fj-mono);letter-spacing:.06em;text-transform:uppercase;color:var(--fj-warm)}
.fj-status::before{content:"";width:.45rem;height:.45rem;border-radius:50%;background:var(--fj-warm);box-shadow:0 0 10px var(--fj-warm)}

/* index of terms, link lists */
.fj-defs{display:grid;gap:1rem;max-width:none;margin:0}
.fj-term{position:relative;min-width:0;padding:1.25rem;border:1px solid var(--fj-line);border-radius:var(--fj-r);background:var(--fj-card);overflow:hidden;transition:border-color .25s ease,box-shadow .25s ease}
.fj-term-note{position:absolute;top:1.42rem;right:1.25rem;font:400 .66rem/1.5 var(--fj-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--fj-soft)}
.fj-term::after{content:"";position:absolute;inset:0;border-radius:inherit;background:radial-gradient(20rem circle at var(--fj-mx,50%) var(--fj-my,0%),rgba(111,157,255,.16),transparent 62%);opacity:0;transition:opacity .3s ease;pointer-events:none}
.fj-defs dt{font:600 1.2rem/1.3 var(--fj-sans);letter-spacing:-.018em;color:var(--fj-ink);scroll-margin-top:6.5rem}
.fj-defs dt:focus{outline:none}
.fj-defs dt .fj-num{display:block;width:max-content;margin:0 0 .75rem}
.fj-defs dt a{display:inline-flex;align-items:center;justify-content:center;min-width:2.75rem;min-height:2.75rem;margin:-.8rem 0 -.8rem .1rem;font:400 .8rem var(--fj-mono);color:var(--fj-soft);text-decoration:none;vertical-align:middle}
.fj-defs dt a:hover{color:var(--fj-cyan)}
.fj-defs dd{margin:.45rem 0 0}
.fj-defs dd p{margin:0}
.fj-defs .fj-see{margin-top:.95rem;padding-top:.8rem;border-top:1px solid var(--fj-line);font-size:.88rem;line-height:1.55;color:var(--fj-soft)}
.fj-term.fj-hit{border-color:rgba(95,220,240,.75);box-shadow:0 0 0 1px rgba(95,220,240,.4),0 30px 70px -40px rgba(95,220,240,.9)}
.fj-term:has(>dt:target){border-color:rgba(95,220,240,.75);box-shadow:0 0 0 1px rgba(95,220,240,.4),0 30px 70px -40px rgba(95,220,240,.9)}
.fj-term:focus-within{border-color:rgba(140,170,255,.5)}
.fj-links{list-style:none;display:grid;gap:.6rem;padding:0;margin:1rem 0 1.15rem}
.fj-links li{position:relative;margin:0;padding:.85rem 1rem;border:1px solid var(--fj-line);border-radius:14px;background:rgba(255,255,255,.028);transition:border-color .25s ease,background-color .25s ease;overflow-wrap:anywhere}
.fj-links li:hover{border-color:rgba(140,170,255,.5);background:rgba(111,157,255,.07)}
.fj-links a{font-weight:600;color:var(--fj-ink);text-decoration:none}
.fj-links a::after{content:"";position:absolute;inset:0}
.fj-links span{display:block;font-size:.9rem;line-height:1.5;color:var(--fj-soft);margin-top:.15rem}

/* enquiry form */
.fj-form{display:grid;gap:1.15rem;margin-top:1.25rem;padding:1.25rem;border:1px solid var(--fj-line);border-radius:var(--fj-r);background:var(--fj-card);box-shadow:0 34px 80px -50px rgba(80,120,255,.9)}
.fj-pair{display:grid;gap:1.15rem}
.fj-field label{display:block;font:500 .7rem/1.4 var(--fj-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fj-soft);margin-bottom:.45rem}
.fj-field input,.fj-field select,.fj-field textarea{display:block;width:100%;min-height:3rem;font:400 1rem/1.4 var(--fj-sans);color:var(--fj-ink);background:var(--fj-deep);border:1px solid var(--fj-line2);border-radius:.7rem;padding:.75rem .85rem;margin:0}
.fj-field textarea{min-height:10rem;resize:vertical;line-height:1.55}
.fj-field input:focus-visible,.fj-field select:focus-visible,.fj-field textarea:focus-visible{outline:2px solid var(--fj-cyan);outline-offset:1px;border-color:var(--fj-cyan);box-shadow:0 0 0 5px rgba(95,220,240,.14)}
.fj-send{width:100%;font-size:1rem}
.fj-trap{display:none}
.fj-small{font-size:.88rem;line-height:1.55;color:var(--fj-soft);margin:0}

/* end matter */
.fj-end{margin-top:4rem;border-top:1px solid var(--fj-line);background:linear-gradient(180deg,rgba(111,157,255,.05),transparent 60%);padding:0 0 2.25rem;font-size:.9rem;line-height:1.6;color:var(--fj-soft)}
.fj-end .fj-anim-rule{margin-bottom:1.6rem}
.fj-end-in{position:relative}
.fj-end ul{list-style:none;display:grid;grid-template-columns:1fr 1fr;gap:0 1rem;padding:0;margin:0 0 1.3rem}
.fj-end li{margin:0}
.fj-end ul a{display:flex;align-items:center;min-height:2.75rem;font:400 .86rem/1.3 var(--fj-mono);color:var(--fj-text);text-decoration-color:transparent}
.fj-end ul a:hover{color:var(--fj-cyan)}
.fj-end p{margin:0 0 .3rem;max-width:var(--fj-col)}
.fj-end .fj-tag{margin-bottom:.6rem;color:var(--fj-ink)}

/* ---------- wider screens ---------- */
@media (min-width:30em){
.fj-actions .fj-cta,.fj-actions .fj-ghost{flex:0 0 auto}
.fj-send{width:auto;justify-self:start}
.fj-end ul{grid-template-columns:repeat(4,auto);justify-content:start;gap:0 1.6rem}
}
@media (min-width:36em){
:root{--fj-pad:1.75rem}
.fj-pair{grid-template-columns:1fr 1fr}
.fj-wide-only{display:inline}
.fj-narrow-only{display:none}
.fj-contents ol{columns:2;column-gap:2rem}
.fj-plate-frame{padding:1.75rem}
.fj-form,.fj-feature{padding:1.75rem}
.fj-tiles{grid-template-columns:1fr 1fr}
.fj-cat.fj-list>li{display:grid;grid-template-columns:13rem minmax(0,1fr);column-gap:1.4rem;align-items:start}
.fj-cat.fj-list .fj-anim{grid-row:1 / span 3;aspect-ratio:4/3;margin:-1.25rem 0 -1.25rem -1.25rem;border-bottom:0;border-right:1px solid var(--fj-line);align-self:stretch;height:calc(100% + 2.5rem)}
.fj-cat.fj-list>li>*{grid-column:2}
.fj-cat.fj-list>li>.fj-anim{grid-column:1}
}
@media (min-width:48em){
:root{--fj-pad:clamp(1.75rem,4.5vw,3.5rem)}
html{scroll-padding-top:5rem}
body{padding-bottom:0;font-size:1.09rem}
.fj-top{position:sticky;top:-1.2rem}
.fj-top::before{content:"";position:absolute;inset:0;background:rgba(6,10,19,.74);-webkit-backdrop-filter:blur(16px) saturate(1.5);backdrop-filter:blur(16px) saturate(1.5);border-bottom:1px solid var(--fj-line);opacity:0;transition:opacity .35s ease}
.fj-scrolled .fj-top::before{opacity:1}
.fj-top-in{position:relative;min-height:4.7rem;transition:transform .35s var(--fj-ease)}
.fj-scrolled .fj-top-in{transform:translateY(.6rem)}
.fj-nav{position:static;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border:0;padding:0}
.fj-nav ul{display:flex;align-items:center;gap:.2rem}
.fj-nav a{min-height:2.75rem;padding:0 .9rem;border-radius:999px;font:400 .84rem/1.2 var(--fj-mono)}
.fj-nav .fj-hire{margin-left:.6rem;padding:0 1.25rem;font:500 .84rem/1.2 var(--fj-mono);transition:transform .35s var(--fj-ease),box-shadow .25s ease}
.fj-scrolled .fj-nav .fj-hire{transform:scale(.94)}
.fj-hero{padding:2rem 0 2.5rem}
.fj-sky{inset:-4.7rem 0 0}
.fj-row{margin-top:4.25rem;padding-top:2.75rem}
.fj-crumbs{margin-bottom:1.5rem}
.fj-plain{padding:1.9rem 2rem 1rem}
.fj-steps{grid-template-columns:repeat(5,1fr);padding:1.25rem}
.fj-steps li{grid-template-columns:1fr;gap:.5rem}
.fj-steps li::before{justify-self:start}
.fj-steps span{grid-column:1}
.fj-facts{grid-template-columns:1fr 1fr}
.fj-facts div:nth-child(2){border-top:0}
.fj-facts div:nth-child(odd){border-right:1px solid var(--fj-line)}
.fj-feature{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:center;gap:2.5rem;padding:2.75rem}
.fj-feature.fj-one{grid-template-columns:minmax(0,1fr)}
.fj-feature .fj-anim{max-width:none}
/* field note cards while only one note is out: one feature card, drawing on the left, text centred beside it */
.fj-cat.fj-cards>li:only-child{display:flex;flex-direction:column;justify-content:center;min-height:15rem;padding-left:calc(42% + 1.5rem)}
.fj-cat.fj-cards>li:only-child .fj-anim{position:absolute;left:0;top:0;width:42%;height:100%;margin:0;aspect-ratio:auto;border-bottom:0;border-right:1px solid var(--fj-line)}
.fj-end{margin-top:6rem}
.fj-end .fj-anim-rule{margin-bottom:2.2rem}
.fj-end ul{display:flex;flex-wrap:wrap;gap:0 1.7rem}
}
@media (min-width:60em){
.fj-hero{padding:3.5rem 0 3.5rem}
.fj-hero-in{grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);align-items:center;gap:3.5rem}
.fj-head{grid-template-columns:minmax(0,1fr) minmax(15rem,23rem);column-gap:3.5rem}
.fj-head>*{grid-column:1}
.fj-head>.fj-anim{grid-column:2;grid-row:1 / span 7;align-self:center;max-width:none;margin:0}
.fj-solo{grid-template-columns:minmax(0,1fr)}
.fj-feature.fj-one{grid-template-columns:minmax(0,1fr)}
.fj-centre{grid-template-columns:minmax(0,1fr)}
.fj-centre>.fj-anim{grid-column:1;grid-row:auto;align-self:auto;max-width:13rem;margin:0 auto 1.5rem}
.fj-centre>.fj-anim-signal{max-width:22rem}
.fj-split{display:grid;grid-template-columns:minmax(0,var(--fj-col)) minmax(0,1fr);column-gap:3.5rem;align-items:center}
.fj-split .fj-anim-layers{max-width:23rem;margin:0 0 0 auto}
.fj-cat.fj-offers{grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem}
/* field note cards sit on six tracks: three notes take two tracks each, two notes take three each, one note takes the full row */
.fj-cat.fj-cards{grid-template-columns:repeat(6,minmax(0,1fr));gap:1.25rem}
.fj-cat.fj-cards>li{grid-column:span 2}
.fj-cat.fj-cards .fj-anim{aspect-ratio:4/3}
.fj-cat.fj-cards>li:first-child:nth-last-child(2),.fj-cat.fj-cards>li:nth-child(2):last-child{grid-column:span 3}
.fj-cat.fj-cards>li:first-child:nth-last-child(2) .fj-anim,.fj-cat.fj-cards>li:nth-child(2):last-child .fj-anim{aspect-ratio:16/9}
.fj-cat.fj-cards>li:only-child{grid-column:1 / -1;min-height:18rem;padding-left:calc(40% + 2.25rem)}
.fj-cat.fj-cards>li:only-child .fj-anim{width:40%}
.fj-cat.fj-list>li{grid-template-columns:17rem minmax(0,1fr)}
.fj-tiles{grid-template-columns:repeat(3,minmax(0,1fr))}
.fj-cat>li{padding:1.5rem}
.fj-cat .fj-anim{margin:-1.5rem -1.5rem 1.25rem}
.fj-cat.fj-list .fj-anim{margin:-1.5rem 0 -1.5rem -1.5rem;height:calc(100% + 3rem)}
.fj-offers .fj-anim{margin:-.5rem 0 .4rem -.6rem}
.fj-form{padding:2.25rem}
}
@supports (width:1cqw){
@media (min-width:60em){
.fj-post{container-type:inline-size}
.fj-post .fj-plate,.fj-post .fj-table-wrap{--fj-w:min(60rem,100cqw);width:var(--fj-w);margin-left:calc((100% - var(--fj-w)) / 2)}
}
}

/* ---------- motion ---------- */
@media (hover:hover){
.fj-cat>li:hover{border-color:rgba(140,170,255,.5);box-shadow:0 30px 70px -40px rgba(70,110,255,.95)}
.fj-cat>li:hover::after{opacity:1}
.fj-term:hover{border-color:rgba(140,170,255,.5);box-shadow:0 30px 70px -40px rgba(70,110,255,.95)}
.fj-term:hover::after{opacity:1}
}
@keyframes fj-rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes fj-float{from{transform:translate3d(0,0,0) scale(1)}to{transform:translate3d(2.5rem,1.5rem,0) scale(1.12)}}
@keyframes fj-sweep{from{-webkit-mask-position:130% 0;mask-position:130% 0}to{-webkit-mask-position:-30% 0;mask-position:-30% 0}}
@media (prefers-reduced-motion:no-preference){
html{scroll-behavior:smooth}
a,.fj-send,.fj-cta,.fj-ghost{transition:color .18s ease,background-color .18s ease,border-color .18s ease,background-position .5s ease,box-shadow .25s ease}
.fj-hero-copy>*,.fj-stage,.fj-head>*{animation:fj-rise .95s var(--fj-ease) both}
.fj-hero-copy>:nth-child(2),.fj-head>:nth-child(2){animation-delay:.07s}
.fj-hero-copy>:nth-child(3),.fj-head>:nth-child(3){animation-delay:.14s}
.fj-hero-copy>:nth-child(4),.fj-head>:nth-child(4){animation-delay:.21s}
.fj-hero-copy>:nth-child(n+5),.fj-head>:nth-child(n+5){animation-delay:.28s}
.fj-stage,.fj-head>.fj-anim{animation-delay:.3s}
.fj-glow-a{animation:fj-float 17s ease-in-out infinite alternate}
.fj-glow-b{animation:fj-float 23s ease-in-out infinite alternate-reverse}
.fj-lattice::after{animation:fj-sweep 9s linear infinite}
/* reveal on scroll: only under the class the script adds, and only for elements the script tagged */
.fj-motion .fj-rv{transition:opacity .8s var(--fj-ease),transform .8s var(--fj-ease),border-color .25s ease,box-shadow .25s ease}
.fj-motion .fj-rv:not(.fj-in){opacity:0;transform:translateY(22px)}
.fj-motion .fj-rv::before{transition:transform 1.2s var(--fj-ease) .1s}
.fj-motion .fj-row.fj-rv:not(.fj-in)::before{transform:scaleX(0)}
.fj-motion .fj-cat>.fj-rv:nth-child(2),.fj-motion .fj-tiles>.fj-rv:nth-child(3n+2){transition-delay:.09s}
.fj-motion .fj-cat>.fj-rv:nth-child(3),.fj-motion .fj-tiles>.fj-rv:nth-child(3n){transition-delay:.18s}
}
@media print{
.fj-top,.fj-skip,.fj-contents,.fj-form,.fj-anim,.fj-sky,.fj-progress,.fj-find,.fj-find-none,.fj-az-row{display:none}
body{background:#fff;color:#000;padding:0}
h1,h2,h3,a,strong,b,.fj-big,.fj-plain li{color:#000}
.fj-hl{-webkit-text-fill-color:#000;color:#000;background:none}
.fj-motion .fj-rv:not(.fj-in){opacity:1;transform:none}
.fj-plate-frame{background:none}
}

/* Larger name, and a mobile menu at the top in place of the bottom bar */
.fj-name{font-size:1.14rem}
.fj-name::before{width:2rem;height:2rem}
.fj-burger{display:none}
@media (max-width:47.99em){
body{padding-bottom:0}
.fj-top-in{flex-wrap:wrap;align-content:flex-start;min-height:0;padding-top:.5rem;padding-bottom:.5rem}
.fj-burger{display:inline-flex;align-items:center;justify-content:center;width:2.75rem;height:2.75rem;margin-right:-.3rem;padding:0;border:1px solid var(--fj-line);border-radius:.8rem;background:rgba(255,255,255,.04);color:var(--fj-ink);cursor:pointer}
.fj-burger-bars{position:relative;display:block;width:1.25rem;height:2px;background:currentColor;transition:background .2s}
.fj-burger-bars::before,.fj-burger-bars::after{content:"";position:absolute;left:0;width:1.25rem;height:2px;background:currentColor;transition:transform .25s}
.fj-burger-bars::before{top:-6px}
.fj-burger-bars::after{top:6px}
.fj-burger[aria-expanded="true"] .fj-burger-bars{background:transparent}
.fj-burger[aria-expanded="true"] .fj-burger-bars::before{transform:translateY(6px) rotate(45deg)}
.fj-burger[aria-expanded="true"] .fj-burger-bars::after{transform:translateY(-6px) rotate(-45deg)}
.fj-nav{display:none;position:static;flex:1 0 100%;margin:.3rem 0 0;padding:.7rem 0 1rem;background:none;-webkit-backdrop-filter:none;backdrop-filter:none;border-top:1px solid var(--fj-line)}
.fj-nav.fj-open{display:block}
.fj-nav ul{grid-template-columns:1fr;gap:.4rem}
.fj-nav a{justify-content:flex-start;min-height:3.25rem;padding:0 1rem;font-size:1.05rem}
.fj-nav .fj-hire{justify-content:center;margin-top:.35rem}
}
@media (max-width:47.99em) and (scripting:none){.fj-nav{display:block}.fj-burger{display:none}}
@media print{.fj-burger{display:none}}

/* hire page: what each service delivers, and the questions list */
.fj-cat .fj-get{margin-top:1rem;padding-top:.9rem;border-top:1px solid var(--fj-line);font-size:.94rem;color:var(--fj-ink)}
.fj-get b{display:block;font:500 .68rem/1.5 var(--fj-mono);letter-spacing:.09em;text-transform:uppercase;color:var(--fj-cyan);margin-bottom:.2rem}
.fj-wide>.fj-aside{margin-top:1.25rem}
.fj-qa h3{margin:0;padding-top:1.35rem;border-top:1px solid var(--fj-line);font-size:1.1rem}
.fj-qa h3:first-child{padding-top:.4rem;border-top:0}
.fj-qa p{margin:.5rem 0 1.35rem}
.fj-qa p:last-child{margin-bottom:0}
.fj-form+.fj-aside{margin-top:1.25rem}

/* index of terms: search with suggestions, A to Z row, alphabetical list */
.fj-find[hidden],.fj-find-list[hidden],.fj-find-clear[hidden],.fj-find-none[hidden],.fj-az[hidden],.fj-term[hidden]{display:none}
.fj-find{position:relative;z-index:5;max-width:var(--fj-col);margin:0 0 1.75rem}
.fj-find-label{display:block;font:500 .7rem/1.4 var(--fj-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--fj-soft);margin-bottom:.5rem}
.fj-find-box{position:relative}
.fj-find-box::before{content:"";position:absolute;z-index:1;left:1.05rem;top:1.18rem;width:.95rem;height:.95rem;border:2px solid var(--fj-cyan);border-radius:50%;pointer-events:none}
.fj-find-box::after{content:"";position:absolute;z-index:1;left:1.85rem;top:1.98rem;width:.48rem;height:2px;border-radius:2px;background:var(--fj-cyan);transform:rotate(45deg);transform-origin:0 50%;pointer-events:none}
.fj-find-q{display:block;width:100%;min-height:3.5rem;margin:0;padding:.8rem 1rem .8rem 3rem;font:400 1.06rem/1.4 var(--fj-sans);color:var(--fj-ink);background:var(--fj-deep);border:1px solid var(--fj-line2);border-radius:1rem;box-shadow:0 24px 60px -34px rgba(80,120,255,.9),inset 0 1px 0 rgba(255,255,255,.05);-webkit-appearance:none;appearance:none}
.fj-find-q:not(:placeholder-shown){padding-right:5.4rem}
.fj-find-q::placeholder{color:var(--fj-soft);opacity:1}
.fj-find-q:focus-visible{outline:2px solid var(--fj-cyan);outline-offset:1px;border-color:var(--fj-cyan);box-shadow:0 0 0 5px rgba(95,220,240,.14),0 24px 60px -30px rgba(95,220,240,.7)}
.fj-find-clear{position:absolute;z-index:1;right:.375rem;top:.375rem;min-width:2.75rem;height:2.75rem;padding:0 .8rem;border:1px solid var(--fj-line2);border-radius:.7rem;background:rgba(255,255,255,.05);color:var(--fj-text);font:500 .7rem/1 var(--fj-mono);letter-spacing:.07em;text-transform:uppercase;cursor:pointer}
.fj-find-clear:hover{color:var(--fj-ink);border-color:rgba(140,170,255,.6);background:rgba(111,157,255,.12)}
.fj-find-list{position:absolute;z-index:20;left:0;right:0;top:calc(100% + .45rem);list-style:none;margin:0;padding:.35rem;max-height:min(24rem,58vh);overflow-y:auto;overscroll-behavior:contain;border:1px solid var(--fj-line2);border-radius:1rem;background:#0b1222;box-shadow:0 34px 80px -18px rgba(0,0,0,.85),0 0 0 1px rgba(111,157,255,.12)}
.fj-find-opt{display:grid;grid-template-columns:auto minmax(0,1fr);gap:.1rem .8rem;align-items:start;min-height:3rem;margin:0;padding:.6rem .7rem;border-radius:.7rem;cursor:pointer;box-shadow:inset 0 0 0 0 var(--fj-cyan)}
.fj-find-opt+.fj-find-opt{margin-top:.1rem}
.fj-find-no{grid-row:span 2;margin-top:.12rem;padding:.2rem .45rem;border:1px solid rgba(95,220,240,.3);border-radius:.45rem;background:rgba(95,220,240,.07);font:500 .72rem/1.3 var(--fj-mono);color:var(--fj-cyan)}
.fj-find-name{font-weight:600;line-height:1.35;color:var(--fj-ink)}
.fj-find-ctx{grid-column:2;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden;font-size:.86rem;line-height:1.45;color:var(--fj-soft)}
.fj-find-list mark{background:rgba(95,220,240,.18);color:var(--fj-ink);border-radius:.2rem;box-shadow:0 0 0 1px rgba(95,220,240,.18)}
.fj-find-opt:hover{background:rgba(255,255,255,.05)}
.fj-find-opt[aria-selected="true"]{background:rgba(111,157,255,.16);box-shadow:inset 3px 0 0 0 var(--fj-cyan)}
.fj-find-meta{display:flex;flex-wrap:wrap;justify-content:space-between;gap:.2rem 1.25rem;margin:.65rem 0 0;font:400 .74rem/1.5 var(--fj-mono);color:var(--fj-soft)}
.fj-find-count{color:var(--fj-ink)}
.fj-find-none{max-width:var(--fj-col);margin:0 0 1rem;padding:1.25rem;border:1px dashed var(--fj-line2);border-radius:var(--fj-r);background:rgba(255,255,255,.02)}
.fj-find-none p{margin:0 0 1rem}
.fj-find-none .fj-ghost{font-family:var(--fj-sans)}
.fj-az-row{list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(2.75rem,1fr));gap:3px;max-width:40rem;margin:0 0 1.6rem;padding:0;font:500 .9rem/1 var(--fj-mono)}
.fj-az-row li{margin:0}
.fj-az-row a,.fj-az-row span{display:grid;place-items:center;min-height:2.75rem;border-radius:.6rem}
.fj-az-row a{border:1px solid var(--fj-line2);border-bottom-width:2px;background:rgba(255,255,255,.045);color:var(--fj-ink);text-decoration:none}
.fj-az-row a:hover{color:#050913;background:var(--fj-grad);border-color:transparent}
.fj-az-row span{border:1px dashed var(--fj-line);color:rgba(152,165,192,.42)}
.fj-az-list{list-style:none;columns:15rem 3;column-gap:2.25rem;margin:0;padding:0;font:400 .86rem/1.35 var(--fj-mono)}
.fj-az-list>li{display:grid;grid-template-columns:2.1rem minmax(0,1fr);break-inside:avoid;margin:0 0 .5rem;border-top:1px solid var(--fj-line);border-radius:2px;scroll-margin-top:6rem}
.fj-az-key{font:500 1.02rem/2.75rem var(--fj-mono);color:var(--fj-cyan)}
.fj-az-list ul{list-style:none;margin:0;padding:0}
.fj-az-list ul li{margin:0}
.fj-az-list ul li+li{border-top:1px solid rgba(255,255,255,.05)}
.fj-az-list a{display:flex;align-items:center;justify-content:space-between;gap:.8rem;min-height:2.75rem;padding:.3rem 0;color:var(--fj-text);text-decoration:none}
.fj-az-list a span{flex:none;font-size:.72rem;color:var(--fj-soft)}
.fj-az-list a:hover,.fj-az-list a:hover span{color:var(--fj-cyan)}
.fj-az-list>li:target{background:rgba(95,220,240,.07);box-shadow:0 0 0 .45rem rgba(95,220,240,.07)}
@media (hover:none){.fj-find-hint{display:none}}
@media (min-width:60em){
.fj-defs{grid-template-columns:repeat(2,minmax(0,1fr));gap:1.25rem}
.fj-term{padding:1.5rem}
.fj-term-note{top:1.67rem;right:1.5rem}
}
@keyframes fj-ping{0%{background-color:rgba(95,220,240,.2);box-shadow:0 0 0 0 rgba(95,220,240,.6),0 30px 70px -40px rgba(95,220,240,.9)}55%{box-shadow:0 0 0 14px rgba(95,220,240,0),0 30px 70px -40px rgba(95,220,240,.9)}100%{background-color:rgba(95,220,240,0);box-shadow:0 0 0 1px rgba(95,220,240,.4),0 30px 70px -40px rgba(95,220,240,.9)}}
@keyframes fj-flash{from{background-color:rgba(95,220,240,.3);box-shadow:0 0 0 .45rem rgba(95,220,240,.3)}}
@keyframes fj-drop{from{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:no-preference){
.fj-term.fj-hit{animation:fj-ping 1.5s var(--fj-ease) 1}
.fj-term:has(>dt:target){animation:fj-ping 1.5s var(--fj-ease) 1}
.fj-az-list>li:target{animation:fj-flash 1.4s ease-out 1}
.fj-find-list{animation:fj-drop .22s var(--fj-ease)}
.fj-find-opt{transition:background-color .15s ease,box-shadow .15s ease}
.fj-find-q{transition:border-color .2s ease,box-shadow .3s ease}
.fj-az-row a{transition:color .18s ease,background-color .18s ease,border-color .18s ease,transform .25s var(--fj-ease)}
.fj-az-row a:hover{transform:translateY(-2px)}
.fj-motion .fj-defs>.fj-rv:nth-child(even){transition-delay:.09s}
}

/* Drawings stretch on phones and tablets: service cards get a full-width panel, page drawings fill the column */
@media (max-width:59.99em){
.fj-offers .fj-anim{width:auto;aspect-ratio:16/10;margin:-1.25rem -1.25rem 1.1rem;border-bottom:1px solid var(--fj-line);background:radial-gradient(70% 90% at 50% 0%,rgba(80,120,255,.16),transparent 70%),var(--fj-deep)}
.fj-offers .fj-anim{max-height:15rem}
.fj-head .fj-anim,.fj-anim-layers,.fj-feature .fj-anim{max-width:none;max-height:17rem}
}

/* Home: four field note cards sit two by two on the six-track grid */
@media (min-width:60em){
.fj-cat.fj-cards>li:first-child:nth-last-child(4),.fj-cat.fj-cards>li:first-child:nth-last-child(4)~li{grid-column:span 3}
.fj-cat.fj-cards>li:first-child:nth-last-child(4) .fj-anim,.fj-cat.fj-cards>li:first-child:nth-last-child(4)~li .fj-anim{aspect-ratio:16/9}
}

/* Data notes: number columns, a totals row, a code block */
.fj-table .fj-fig{text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.fj-table td.fj-fig{font-family:var(--fj-mono);font-size:.86rem}
.fj-table-tight{min-width:27rem}
.fj-table tfoot th,.fj-table tfoot td{border-top:1px solid var(--fj-line2);background:rgba(255,255,255,.035);font-weight:600;color:var(--fj-ink)}
.fj-code{margin:1.8rem 0;border:1px solid var(--fj-line);border-radius:var(--fj-r);background:var(--fj-deep);box-shadow:0 34px 70px -48px rgba(50,90,255,.75);overflow:hidden}
.fj-code pre{margin:0;padding:1rem 1.1rem 1.15rem;overflow-x:auto;font:400 .78rem/1.7 var(--fj-mono);color:var(--fj-text);tab-size:2}
.fj-code code{font:inherit;color:inherit;background:none;border:0;border-radius:0;padding:0}
.fj-code-c{color:var(--fj-soft)}
.fj-code-k{color:var(--fj-cyan)}

/* Bar chart with interval whiskers. Rows on a phone, columns from 48em. The scale runs from 0 to 60%.
   Four zones: one boundary-sensitive bucket (dashed outline), two plateau, two step-down, one cliff.
   Each bucket's rate and interval are set here as custom properties, because the site's content
   security policy does not allow inline styles. The same figures are in the table beside the chart. */
.fj-chart-c1{--fj-v:30.7;--fj-lo:23.4;--fj-hi:39.2}
.fj-chart-c2{--fj-v:44.1;--fj-lo:41.6;--fj-hi:46.7;--fj-d:.07s}
.fj-chart-c3{--fj-v:46.7;--fj-lo:44.9;--fj-hi:48.5;--fj-d:.14s}
.fj-chart-c4{--fj-v:35.4;--fj-lo:33.2;--fj-hi:37.6;--fj-d:.21s}
.fj-chart-c5{--fj-v:28.1;--fj-lo:25.4;--fj-hi:30.9;--fj-d:.28s}
.fj-chart-c6{--fj-v:6.5;--fj-lo:5.2;--fj-hi:8.1;--fj-d:.35s}
.fj-chart{--fj-a:90deg;overflow:visible}
.fj-chart-title{margin:0;font:600 1rem/1.35 var(--fj-sans);letter-spacing:-.01em;color:var(--fj-ink)}
.fj-chart-sub{margin:.3rem 0 1.2rem;font:400 .68rem/1.55 var(--fj-mono);color:var(--fj-soft)}
.fj-chart-plot{position:relative;padding-top:1.5rem}
.fj-chart-scale{position:absolute;left:0;right:0;top:0;height:1rem;font:400 .64rem/1 var(--fj-mono);color:var(--fj-soft)}
.fj-chart-scale span{position:absolute;top:0;transform:translateX(-50%)}
.fj-chart-scale span:nth-child(1){left:0;transform:none}
.fj-chart-scale span:nth-child(2){left:33.333%}
.fj-chart-scale span:nth-child(3){left:66.667%}
.fj-chart-scale span:nth-child(4){left:100%;transform:translateX(-100%)}
.fj-chart-zone+.fj-chart-zone{margin-top:1.4rem}
.fj-chart-zone-h{display:flex;align-items:baseline;gap:.6rem;margin:0;padding:0 0 .35rem;border-bottom:1px solid var(--fj-line2);font:400 .68rem/1.4 var(--fj-mono);color:var(--fj-soft)}
.fj-chart-zone-h b{font-weight:500;letter-spacing:.09em;text-transform:uppercase}
.fj-chart-zone ol{list-style:none;display:grid;gap:1rem;margin:.75rem 0 0;padding:0}
.fj-chart-col{display:grid;gap:.35rem;margin:0}
.fj-chart-key,.fj-chart-val{display:flex;align-items:baseline;justify-content:space-between;gap:.75rem;margin:0;font:400 .7rem/1.4 var(--fj-mono);color:var(--fj-soft)}
.fj-chart-key b{font:500 .9rem/1.3 var(--fj-sans);color:var(--fj-ink)}
.fj-chart-val b{font:500 1.02rem/1.2 var(--fj-mono);color:var(--fj-ink)}
.fj-chart-track{position:relative;height:1.6rem;background:linear-gradient(90deg,var(--fj-line2) 1px,transparent 1px) 0 0/33.333% 100%;box-shadow:1px 0 0 var(--fj-line2)}
.fj-chart-track::after{content:"";position:absolute;z-index:2;left:calc(36 / 60 * 100%);top:-.3rem;bottom:-.3rem;width:0;border-left:1px dashed var(--fj-ink);box-shadow:-1px 0 0 rgba(6,10,19,.5)}
.fj-chart-bar{position:absolute;left:0;top:.2rem;bottom:.2rem;width:calc(var(--fj-v) / 60 * 100%);border-radius:0 .3rem .3rem 0;background:linear-gradient(var(--fj-a),rgba(111,157,255,.5),#6f9dff 55%,#5fdcf0);box-shadow:0 0 22px -6px rgba(111,157,255,.9);transform-origin:0 50%}
.fj-chart-z2 .fj-chart-bar{background:repeating-linear-gradient(135deg,rgba(6,10,19,.2) 0 2px,transparent 2px 8px),linear-gradient(var(--fj-a),rgba(167,143,255,.5),#a78fff);box-shadow:0 0 22px -6px rgba(167,143,255,.9)}
.fj-chart-zb .fj-chart-bar{background:repeating-linear-gradient(45deg,rgba(242,245,252,.3) 0 2px,transparent 2px 7px),rgba(111,157,255,.2);border:1px dashed rgba(242,245,252,.8);border-left:0;box-shadow:none}
.fj-chart-z3 .fj-chart-bar{background:repeating-linear-gradient(135deg,rgba(6,10,19,.34) 0 2px,transparent 2px 5px),linear-gradient(var(--fj-a),rgba(255,184,107,.6),#ffb86b);box-shadow:0 0 22px -6px rgba(255,184,107,.9)}
.fj-chart-ci{position:absolute;z-index:3;left:calc(var(--fj-lo) / 60 * 100%);top:50%;width:calc((var(--fj-hi) - var(--fj-lo)) / 60 * 100%);height:2px;margin:-1px 0 0;background:#fff;box-shadow:0 0 0 1px rgba(6,10,19,.65)}
.fj-chart-ci::before,.fj-chart-ci::after{content:"";position:absolute;top:-.3rem;width:2px;height:calc(.6rem + 2px);background:#fff;box-shadow:0 0 0 1px rgba(6,10,19,.65)}
.fj-chart-ci::before{left:0}
.fj-chart-ci::after{right:0}
.fj-chart-legend{list-style:none;display:grid;gap:.45rem;margin:1.5rem 0 0;padding:.95rem 0 0;border-top:1px solid var(--fj-line);font:400 .7rem/1.5 var(--fj-mono);color:var(--fj-soft)}
.fj-chart-legend li{display:flex;align-items:center;gap:.6rem;margin:0}
.fj-chart-sw{position:relative;flex:none;display:block;width:1.6rem;height:.7rem}
.fj-chart-sw-bar{border-radius:0 .2rem .2rem 0;background:linear-gradient(90deg,rgba(111,157,255,.5),#6f9dff 55%,#5fdcf0)}
.fj-chart-sw-ci{height:2px;background:#fff}
.fj-chart-sw-ci::before,.fj-chart-sw-ci::after{content:"";position:absolute;top:-.25rem;width:2px;height:calc(.5rem + 2px);background:#fff}
.fj-chart-sw-ci::before{left:0}
.fj-chart-sw-ci::after{right:0}
.fj-chart-sw-ref{height:0;border-top:1px dashed var(--fj-ink)}
.fj-chart-sw-zb{background:repeating-linear-gradient(45deg,rgba(242,245,252,.3) 0 2px,transparent 2px 7px),rgba(111,157,255,.2);border:1px dashed rgba(242,245,252,.8)}
@media (min-width:48em){
.fj-chart{--fj-a:0deg;--fj-h:17rem;--fj-zh:3.9rem;--fj-zg:1.6rem}
.fj-chart-plot{display:flex;padding:0 0 0 2.4rem}
.fj-chart-scale{right:auto;top:calc(var(--fj-zh) + var(--fj-zg));width:1.9rem;height:var(--fj-h)}
.fj-chart-scale span:nth-child(n){left:auto;right:0;top:auto;transform:translateY(50%)}
.fj-chart-scale span:nth-child(1){bottom:0}
.fj-chart-scale span:nth-child(2){bottom:33.333%}
.fj-chart-scale span:nth-child(3){bottom:66.667%}
.fj-chart-scale span:nth-child(4){bottom:100%}
.fj-chart-zone{flex:2 1 0;min-width:0}
.fj-chart-zone+.fj-chart-zone{margin-top:0}
.fj-chart-zb,.fj-chart-z3{flex-grow:1}
.fj-chart-zone-h{position:relative;display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;gap:0;height:var(--fj-zh);margin:0 .35rem var(--fj-zg);padding:0 0 .75rem;border-bottom:0;text-align:center;line-height:1.35}
.fj-chart-zone-h b,.fj-chart-zone-h span{display:block}
.fj-chart-zone-h::after{content:"";position:absolute;left:0;right:0;bottom:0;height:.4rem;border:1px solid var(--fj-line2);border-bottom:0;border-radius:.25rem .25rem 0 0}
.fj-chart-zone ol{grid-auto-flow:column;grid-auto-columns:minmax(0,1fr);gap:0;margin:0}
.fj-chart-col{grid-template-columns:minmax(0,1fr);grid-template-rows:var(--fj-h) auto;gap:0}
.fj-chart-track{grid-area:1/1;height:auto;background:linear-gradient(0deg,var(--fj-line2) 1px,transparent 1px) 0 100%/100% 33.333%;box-shadow:0 -1px 0 var(--fj-line2),0 1px 0 rgba(255,255,255,.34)}
.fj-chart-track::after{left:0;right:0;top:auto;bottom:calc(36 / 60 * 100%);width:auto;height:0;border-left:0;border-top:1px dashed var(--fj-ink);box-shadow:0 1px 0 rgba(6,10,19,.5)}
.fj-chart-bar{right:0;top:auto;bottom:0;width:min(58%,4.75rem);height:calc(var(--fj-v) / 60 * 100%);margin:0 auto;border-radius:.35rem .35rem 0 0;transform-origin:50% 100%}
.fj-chart-zb .fj-chart-bar{border:1px dashed rgba(242,245,252,.8);border-bottom:0}
.fj-chart-ci{left:50%;top:auto;bottom:calc(var(--fj-lo) / 60 * 100%);width:2px;height:calc((var(--fj-hi) - var(--fj-lo)) / 60 * 100%);margin:0 0 0 -1px}
.fj-chart-ci::before,.fj-chart-ci::after{left:-.3rem;right:auto;width:calc(.6rem + 2px);height:2px}
.fj-chart-ci::before{top:0}
.fj-chart-ci::after{top:auto;bottom:0}
.fj-chart-val{grid-area:1/1;position:relative;z-index:4;display:block;align-self:end;justify-self:center;margin:0 0 calc(var(--fj-hi) / 60 * var(--fj-h) + .4rem);padding:.1rem .35rem;border-radius:.35rem;background:rgba(8,13,25,.84);font-size:.64rem;text-align:center;white-space:nowrap}
.fj-chart-val b,.fj-chart-val>span{display:block}
.fj-chart-val b{font-size:1.05rem;margin-bottom:.1rem}
.fj-chart-long{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.fj-chart-key{grid-area:2/1;display:block;padding:.7rem .2rem 0;text-align:center}
.fj-chart-key b,.fj-chart-key span{display:block}
.fj-chart-legend{display:flex;flex-wrap:wrap;gap:.45rem 1.6rem}
}
@media (min-width:60em){
.fj-chart{--fj-h:19rem}
}
/* The chart draws itself on scroll. Each bucket's label is tagged by the reveal script: in rows it sits
   above its bar, in columns below it, so a bar grows only once it is on screen. Without the script, under
   reduced motion, or if the observer never reports, nothing is held back. */
.fj-motion .fj-chart-key.fj-rv:not(.fj-in)~.fj-chart-track .fj-chart-bar{transform:scaleX(0)}
.fj-motion .fj-chart-key.fj-rv:not(.fj-in)~.fj-chart-track .fj-chart-ci,.fj-motion .fj-chart-key.fj-rv:not(.fj-in)~.fj-chart-val{opacity:0}
@media (min-width:48em){
.fj-motion .fj-chart-key.fj-rv:not(.fj-in)~.fj-chart-track .fj-chart-bar{transform:scaleY(0)}
}
@media (prefers-reduced-motion:no-preference){
.fj-chart-bar{transition:transform 1.15s var(--fj-ease) var(--fj-d,0s)}
.fj-chart-ci,.fj-chart-val{transition:opacity .55s ease calc(var(--fj-d,0s) + .7s)}
}
@media print{
.fj-motion .fj-chart-key.fj-rv:not(.fj-in)~.fj-chart-track .fj-chart-bar{transform:none}
.fj-motion .fj-chart-key.fj-rv:not(.fj-in)~.fj-chart-track .fj-chart-ci,.fj-motion .fj-chart-key.fj-rv:not(.fj-in)~.fj-chart-val{opacity:1}
}