@font-face{font-family:"Literata";font-style:normal;font-weight:700 800;font-display:swap;src:url(fonts/literata-var.woff2) format("woff2")}
@font-face{font-family:"Sofia Sans";font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/sofiasans-var.woff2) format("woff2")}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/jbm-var-cyrillic.woff2) format("woff2");unicode-range:U+301,U+400-45F,U+490-491,U+4B0-4B1,U+2116}
@font-face{font-family:"JetBrains Mono";font-style:normal;font-weight:400 800;font-display:swap;src:url(fonts/jbm-var-latin.woff2) format("woff2");unicode-range:U+0-FF,U+131,U+152-153,U+2BB-2BC,U+2C6,U+2DA,U+2DC,U+304,U+308,U+329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Literata Fallback";src:local("Times New Roman Bold"),local("TimesNewRomanPS-BoldMT"),local("Liberation Serif Bold"),local("LiberationSerif-Bold");font-weight:700 800;size-adjust:120.15%;ascent-override:97.96%;descent-override:25.63%;line-gap-override:0%}
@font-face{font-family:"Sofia Sans Fallback";src:local("Arial"),local("ArialMT"),local("Liberation Sans"),local("LiberationSans");size-adjust:96.91%;ascent-override:92.87%;descent-override:30.96%;line-gap-override:0%}
body.op-d3 .site-header{--font-display:"Sofia Sans","Sofia Sans Fallback",system-ui,sans-serif;--r-l:32px;--wrap:1240px;--spring:cubic-bezier(.34,1.56,.64,1);--ease:cubic-bezier(.22,.8,.24,1);--gutter:clamp(16px,4vw,40px);font-family:"Sofia Sans","Sofia Sans Fallback",system-ui,sans-serif}
html[data-theme="light"] body.op-d3 .site-header{--surface:#FFFFFF;--soft:#E5F0E2;--soft-2:#D4E8D0;--line:#DCE5D9;--ink:#132019;--muted:#4B5A51;--accent:#1D7A4B;--accent-hover:#16643D;--accent-ink:#FFFFFF;
  --shadow-1:0 1px 2px rgba(19,41,29,.06),0 2px 6px rgba(19,41,29,.04);--shadow-2:0 2px 4px rgba(19,41,29,.04),0 18px 40px -16px rgba(19,41,29,.22);--shadow-3:0 4px 8px rgba(19,41,29,.05),0 32px 64px -24px rgba(19,41,29,.32);--rim:inset 0 1px 0 rgba(255,255,255,.9)}
html[data-theme="dark"] body.op-d3 .site-header{--surface:#171F1A;--soft:#1C2A21;--soft-2:#223428;--line:#2A372F;--ink:#EEF3EF;--muted:#A9B8AE;--accent:#6FDB9D;--accent-hover:#8FE6B4;--accent-ink:#07130C;
  --shadow-1:0 1px 2px rgba(0,0,0,.4);--shadow-2:0 2px 4px rgba(0,0,0,.3),0 18px 40px -16px rgba(0,0,0,.7);--shadow-3:0 4px 8px rgba(0,0,0,.3),0 32px 64px -24px rgba(0,0,0,.8);--rim:inset 0 1px 0 rgba(255,255,255,.06)}
body.op-d3 .site-header{position:fixed;left:0;right:0;top:12px;z-index:50;padding-inline:var(--gutter)}
body.op-d3 .header-pill{max-width:var(--wrap);margin:0 auto;display:flex;align-items:center;gap:16px;height:64px;padding:0 10px 0 12px;border-radius:999px;background:color-mix(in srgb,var(--surface) 86%,transparent);backdrop-filter:blur(16px) saturate(1.4);-webkit-backdrop-filter:blur(16px) saturate(1.4);box-shadow:var(--shadow-2),var(--rim);border:1px solid var(--line)}
body.op-d3 .brand{display:flex;align-items:center;gap:10px;color:var(--ink);text-decoration:none;font:700 1.0625rem/1 "Literata","Literata Fallback",Georgia,serif;letter-spacing:-.015em;white-space:nowrap}
body.op-d3 .brand-av{width:36px;height:36px;border-radius:50%;object-fit:cover;object-position:50% 8%;background:var(--soft)}
body.op-d3 .nav{margin-left:auto}
body.op-d3 .nav ul{display:flex;gap:2px;list-style:none;margin:0;padding:0}
body.op-d3 .nav a{display:block;padding:10px 12px;border-radius:999px;color:var(--muted);text-decoration:none;font-weight:500;font-size:.95rem;transition:background-color .2s,color .2s}
body.op-d3 .nav a:hover{background:var(--soft);color:var(--ink)}
body.op-d3 .header-actions{display:flex;align-items:center;gap:8px}
body.op-d3 .theme-toggle{position:relative;width:60px;height:34px;border-radius:999px;border:0;background:var(--soft-2);cursor:pointer;padding:0;box-shadow:inset 0 1px 3px rgba(0,0,0,.12)}
body.op-d3 .theme-toggle::before{content:"";position:absolute;inset:-5px 0}
body.op-d3 .knob{position:absolute;top:4px;left:4px;width:26px;height:26px;border-radius:50%;background:var(--surface);box-shadow:var(--shadow-1);transition:transform .55s var(--spring);display:grid;place-items:center}
body.op-d3 .knob::after{content:"";width:12px;height:12px;border-radius:50%;background:#E9B949;transition:all .4s var(--ease)}
html[data-theme="dark"] body.op-d3 .knob{transform:translateX(26px)}
html[data-theme="dark"] body.op-d3 .knob::after{background:transparent;box-shadow:inset -4px -2px 0 0 #CFE3D6}
body.op-d3 .menu-toggle{display:none;width:44px;height:44px;border-radius:50%;border:0;background:var(--soft);color:var(--ink);cursor:pointer;place-items:center}
body.op-d3 .burger,body.op-d3 .burger::before,body.op-d3 .burger::after{display:block;width:18px;height:2px;background:currentColor;border-radius:2px;position:relative;transition:transform .3s var(--ease)}
body.op-d3 .burger::before,body.op-d3 .burger::after{content:"";position:absolute;left:0}
body.op-d3 .burger::before{top:-6px}
body.op-d3 .burger::after{top:6px}
body.op-d3 .menu-toggle[aria-expanded="true"] .burger{background:transparent}
body.op-d3 .menu-toggle[aria-expanded="true"] .burger::before{transform:translateY(6px) rotate(45deg)}
body.op-d3 .menu-toggle[aria-expanded="true"] .burger::after{transform:translateY(-6px) rotate(-45deg)}
body.op-d3 .site-header .btn{display:inline-flex;align-items:center;justify-content:center;min-height:48px;padding:0 24px;border-radius:999px;font:700 1rem/1.2 var(--font-display);letter-spacing:-.01em;text-decoration:none;border:0;cursor:pointer;transition:transform .5s var(--spring),box-shadow .4s var(--ease),background-color .25s,color .25s;will-change:transform}
body.op-d3 .site-header .btn span{display:inline-block;transition:transform .5s var(--spring)}
body.op-d3 .site-header .btn-lg{min-height:56px;padding:0 30px;font-size:1.05rem}
body.op-d3 .site-header .btn-sm{min-height:44px;padding:0 18px;font-size:.92rem}
body.op-d3 .site-header .btn-primary{background:var(--accent);color:var(--accent-ink);box-shadow:var(--rim),0 10px 24px -10px color-mix(in srgb,var(--accent) 70%,transparent)}
body.op-d3 .site-header .btn-primary:hover{background:var(--accent-hover);color:var(--accent-ink);box-shadow:var(--rim),0 18px 34px -12px color-mix(in srgb,var(--accent) 80%,transparent)}
body.op-d3 .site-header a:focus-visible,body.op-d3 .site-header button:focus-visible{outline:3px solid var(--accent);outline-offset:3px;border-radius:999px}
@media (max-width:1100px){body.op-d3 .site-header .menu-toggle{display:grid}
body.op-d3 .site-header .nav{position:absolute;left:var(--gutter);right:var(--gutter);top:72px;display:none;padding:10px;border-radius:var(--r-l);background:var(--surface);box-shadow:var(--shadow-3);border:1px solid var(--line)}
body.op-d3 .site-header .nav.open{display:block}
body.op-d3 .site-header .nav ul{flex-direction:column}
body.op-d3 .site-header .nav a{padding:14px 16px;font-size:1.05rem}
body.op-d3 .site-header .header-actions{margin-left:auto}}
@media (max-width:640px){body.op-d3 .site-header .header-cta{display:none}
body.op-d3 .site-header .header-pill{height:60px}}
body.op-d3 .sr-only{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
body.op-d3 .skip{position:absolute;left:12px;top:-60px;z-index:100;background:#1D7A4B;color:#fff;padding:10px 16px;border-radius:14px;font-weight:600}
body.op-d3 .skip:focus{top:12px}
body.op-d3{
  --f-mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --f-disp:"Literata","Literata Fallback",Georgia,serif;
  --f-body:"Sofia Sans","Sofia Sans Fallback",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-ui:var(--f-body);
  --g:clamp(16px,4vw,48px);--sy:clamp(32px,4.4vw,56px);--max:1440px;
  --r1:8px;--r2:12px;--r3:20px;
  --ease:cubic-bezier(.22,.8,.24,1);--spring:cubic-bezier(.34,1.56,.64,1);--out:cubic-bezier(.16,1,.3,1);--sp:cubic-bezier(.34,1.4,.64,1);
}
html[data-theme="dark"] body.op-d3{
  --bg:#0B0C0E;--bg-2:#121418;--panel:#14171B;--ink:#ECEEF0;--ink-2:#C9CED5;--muted:#A3A9B1;--dim:#7E858E;--line:#262A30;--line-2:#3B414A;
  --accent:#5ED493;--accent-ink:#06140C;--link:#86E6AF;--str:#E2C792;--dot:#1D2126;
  color-scheme:dark;
}
html[data-theme="light"] body.op-d3{
  --bg:#F3F2EE;--bg-2:#EAE8E2;--panel:#FFFFFF;--ink:#131416;--ink-2:#30343A;--muted:#4F545B;--dim:#61666E;--line:#DDDAD2;--line-2:#B9B5AB;
  --accent:#1D7A4B;--accent-ink:#FFFFFF;--link:#17663F;--str:#7A4E0E;--dot:#DCD9D0;
  color-scheme:light;
}
body.op-d3 *,body.op-d3 *::before,body.op-d3 *::after{box-sizing:border-box}
body.op-d3{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
body.op-d3{margin:0;background:var(--bg);color:var(--ink);font:400 1.125rem/1.6 var(--f-body);-webkit-font-smoothing:antialiased;overflow-x:clip;transition:background-color .5s var(--ease),color .5s var(--ease)}
body.op-d3 img{max-width:100%;height:auto;display:block}
body.op-d3 h1,body.op-d3 h2,body.op-d3 h3,body.op-d3 p{margin:0}
body.op-d3 a{color:var(--link)}
body.op-d3 :focus-visible{outline:3px solid var(--accent);outline-offset:4px;border-radius:4px}
body.op-d3 .nav a[aria-current="true"]{background:var(--soft);color:var(--ink)}
body.op-d3 .h2{font:800 clamp(2.375rem,5.2vw,4.75rem)/1.02 var(--f-disp);letter-spacing:-.03em;font-variant-numeric:lining-nums}
body.op-d3 :where(h1,body.op-d3 h2,body.op-d3 h3){text-wrap:balance}
body.op-d3 .path{font:500 .875rem/1.4 var(--f-mono);color:var(--link)}
body.op-d3 .sec-head{display:flex;flex-wrap:wrap;align-items:end;gap:8px 32px;margin-bottom:40px}
body.op-d3 .sec-head .path{flex-basis:100%}
body.op-d3 .sec-head .d-link{margin-left:auto}
body.op-d3 .d-btn{display:inline-flex;align-items:center;gap:12px;min-height:56px;padding:0 28px;border-radius:var(--r2);border:2px solid transparent;font:800 1.0625rem/1 var(--f-ui);letter-spacing:-.01em;text-decoration:none;cursor:pointer;transition:transform .5s var(--spring),background-color .25s,color .25s,border-color .25s}
body.op-d3 .d-btn span{display:inline-block;transition:transform .5s var(--spring)}
body.op-d3 .d-btn svg{transition:transform .4s var(--spring)}
body.op-d3 .d-btn:hover svg{transform:translateX(4px)}
body.op-d3 .d-btn-primary{background:var(--accent);color:var(--accent-ink)}
body.op-d3 .d-btn-primary:hover{color:var(--accent-ink);background:color-mix(in srgb,var(--accent) 86%,var(--ink))}
body.op-d3 .d-btn-primary:active{transform:scale(.97)}
body.op-d3 .d-btn-ghost{border-color:var(--line-2);color:var(--ink)}
body.op-d3 .d-btn-ghost:hover{border-color:var(--ink);color:var(--ink)}
body.op-d3 .d-link{display:inline-flex;align-items:center;gap:8px;min-height:44px;font:700 1rem/1.3 var(--f-ui);color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:6px}
body.op-d3 .d-link::after{content:"→";content:"→"/"";transition:transform .4s var(--spring)}
body.op-d3 .d-link:hover{color:var(--ink)}
body.op-d3 .d-link:hover::after{transform:translateX(4px)}
body.op-d3 .badge{display:inline-flex;align-items:center;height:28px;padding:0 12px;border-radius:999px;border:1px solid var(--line-2);background:var(--panel);font:600 .8125rem/1 var(--f-mono);color:var(--ink);white-space:nowrap}
body.op-d3 .f-links a[target="_blank"]::after{content:" ↗";content:" ↗"/""}
@supports (transition-timing-function:linear(0,1)){body.op-d3{--sp:linear(0, .018, .065, .134, .218, .31, .406, .501, .593, .679, .757, .827, .887, .939, .981, 1.015, 1.041, 1.06, 1.072, 1.08, 1.083, 1.083, 1.08, 1.075, 1.068, 1.061, 1.053, 1.045, 1.037, 1.03, 1.023, 1.017, 1.011, 1.007, 1.003, 1, .998, .997, .997, .998, 1)}}
@property --beam{syntax:"<angle>";inherits:false;initial-value:0deg}
@keyframes beam{to{--beam:360deg}}
body.op-d3 .d-btn{position:relative;overflow:hidden;isolation:isolate}
body.op-d3 .d-btn-primary::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(105deg,transparent 30%,rgba(255,255,255,.38) 50%,transparent 70%);transform:translateX(-120%);transition:transform .8s var(--out)}
body.op-d3 .d-btn-primary:hover::before{transform:translateX(120%)}
body.op-d3 .hero{position:relative;isolation:isolate;min-height:100svh;padding:88px var(--g) 12px;display:flex;flex-direction:column;gap:12px;background-color:var(--bg);background-image:radial-gradient(var(--dot) 1.2px,transparent 1.3px);background-size:24px 24px;overflow:hidden}
body.op-d3 .hero::before,body.op-d3 .hero::after{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none}
body.op-d3 .hero::before{background:radial-gradient(720px circle at var(--hx,74%) var(--hy,22%),color-mix(in srgb,var(--accent) 12%,transparent),transparent 62%)}
body.op-d3 .hero::after{background-image:radial-gradient(color-mix(in srgb,var(--accent) 75%,transparent) 1.3px,transparent 1.5px);background-size:24px 24px;-webkit-mask-image:radial-gradient(280px circle at var(--hx,74%) var(--hy,22%),#000,transparent 72%);mask-image:radial-gradient(280px circle at var(--hx,74%) var(--hy,22%),#000,transparent 72%);opacity:.5}
body.op-d3 .ide-wrap{position:relative;flex:1 1 auto;display:flex;width:100%;max-width:var(--max);margin:0 auto;border-radius:var(--r3);transform:perspective(2400px) rotateX(var(--rx,0deg)) rotateY(var(--ry,0deg));transition:transform .7s var(--out);box-shadow:0 60px 120px -70px color-mix(in srgb,var(--accent) 55%,transparent)}
body.op-d3 .ide-wrap::before{content:"";position:absolute;inset:-1px;z-index:3;border-radius:calc(var(--r3) + 1px);padding:1.5px;pointer-events:none;background:conic-gradient(from var(--beam),transparent 0deg 270deg,color-mix(in srgb,var(--accent) 50%,transparent) 315deg,var(--accent) 342deg,var(--link) 352deg,var(--accent) 356deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);animation:beam 7s linear infinite}
@media (hover:none){body.op-d3 .js .ide-wrap::before{animation-play-state:paused}
body.op-d3 .js .hero.built .ide-wrap::before{animation-play-state:running}}
body.op-d3 .ide{flex:1;min-width:0;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r3);background:var(--panel);overflow:hidden}
body.op-d3 .ide-bar{display:flex;align-items:center;gap:16px;height:44px;flex:none;padding:0 8px 0 16px;border-bottom:1px solid var(--line);font:500 .8125rem/1 var(--f-mono);color:var(--muted)}
body.op-d3 .dots{display:flex;gap:8px}
body.op-d3 .dots i{width:12px;height:12px;border-radius:50%;background:var(--line-2)}
body.op-d3 .dots i:first-child{background:var(--accent)}
body.op-d3 .tabs{display:flex;height:100%}
body.op-d3 .tab{display:flex;align-items:center;padding:0 16px;white-space:nowrap;border-left:1px solid var(--line);font-weight:500;transition:background-color .3s,color .3s,box-shadow .3s}
body.op-d3 .tab.is-on{color:var(--ink);box-shadow:inset 0 -2px var(--accent);background:var(--bg-2)}
body.op-d3 .url{display:flex;align-items:center;gap:8px;margin-left:auto;padding:6px 12px;border-radius:var(--r1);background:var(--bg-2);color:var(--ink-2)}
body.op-d3 .replay{white-space:nowrap;flex:none;display:inline-flex;align-items:center;gap:8px;min-height:32px;padding:0 12px;border:1px solid var(--line-2);border-radius:var(--r1);background:transparent;color:var(--ink);font:600 .8125rem/1 var(--f-mono);cursor:pointer;transition:background-color .25s,color .25s,border-color .25s}
body.op-d3 .replay[hidden]{display:inline-flex;visibility:hidden}
body.op-d3 .replay svg{transition:transform .6s var(--sp)}
body.op-d3 .replay:hover{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
body.op-d3 .replay:hover svg{transform:rotate(-200deg)}
body.op-d3 .ide-body{flex:1;min-height:0;display:grid;grid-template-columns:184px minmax(0,1fr) minmax(0,1.06fr)}
body.op-d3 .ide-tree{list-style:none;margin:0;padding:16px 0;border-right:1px solid var(--line);font:500 .8125rem/2.1 var(--f-mono);color:var(--dim);overflow:hidden}
body.op-d3 .ide-tree li{padding-left:40px;padding-right:12px;white-space:nowrap;transition:background-color .3s,color .3s,box-shadow .3s}
body.op-d3 .ide-tree .dir{padding-left:16px;color:var(--muted)}
body.op-d3 .ide-tree .dir.sub{padding-left:28px}
body.op-d3 .ide-tree .dir::before{content:"▾ "}
body.op-d3 .ide-tree .is-on{background:var(--bg-2);color:var(--ink);box-shadow:inset 2px 0 var(--accent)}
body.op-d3 .ide-tree .mod::after{content:"M";float:right;color:var(--str);font-weight:700}
body.op-d3 .ide-code{position:relative;overflow:hidden;border-right:1px solid var(--line);counter-reset:ln}
body.op-d3 .ide-code pre{position:absolute;left:0;right:0;top:0;margin:0;padding:16px 0;white-space:normal;font:500 .8125rem/1.6 var(--f-mono);color:var(--ink-2)}
body.op-d3 .ide-code code{display:block;transition:transform .45s var(--out)}
body.op-d3 .cl{display:block;white-space:pre;padding-right:16px;min-height:1.6em}
body.op-d3 .cl::before{counter-increment:ln;content:counter(ln);display:inline-block;width:44px;padding-right:16px;text-align:right;color:var(--dim)}
body.op-d3 .cl.cur,body.op-d3 .cl.typing{background:var(--bg-2);box-shadow:inset 2px 0 var(--accent)}
body.op-d3 .cl.cur::after{content:"";display:inline-block;width:.6em;height:1.2em;vertical-align:-.25em;background:var(--accent);animation:caret 1s steps(1) infinite}
body.op-d3 .cl.flash{animation:lineFlash 1s var(--out)}
@keyframes lineFlash{from{background-color:color-mix(in srgb,var(--accent) 24%,transparent)}}
body.op-d3 .cr{color:var(--accent)}
@keyframes caret{50%{opacity:0}}
body.op-d3 .ide-code i,body.op-d3 .cfg i{font-style:normal}
body.op-d3 .ide-code .t,body.op-d3 .ide-code .k{color:var(--link);font-weight:600}
body.op-d3 .ide-code .a{color:var(--ink);font-weight:500}
body.op-d3 .ide-code .f{color:var(--ink);font-weight:700}
body.op-d3 .ide-code .s,body.op-d3 .cfg .s{color:var(--str)}
body.op-d3 .ide-code .c,body.op-d3 .cfg .c{color:var(--dim)}
body.op-d3 .ide-preview{position:relative;overflow:hidden;background:var(--bg);container-type:inline-size}
body.op-d3 .pv{position:relative;height:100%;padding:72px clamp(24px,5cqi,56px) 32px;display:flex;flex-direction:column;justify-content:center;gap:clamp(14px,2.4svh,24px)}
body.op-d3 .pv-nav{position:absolute;top:20px;left:clamp(24px,5cqi,56px);right:clamp(24px,5cqi,56px);display:flex;gap:12px;align-items:center;height:28px}
body.op-d3 .pv-nav i{width:44px;height:8px;border-radius:4px;background:var(--line-2)}
body.op-d3 .pv-nav i:first-child{width:28px;height:28px;border-radius:50%;margin-right:auto;background:var(--line-2)}
body.op-d3 .pv-nav span{width:96px;height:28px;border-radius:999px;background:var(--accent);margin-left:8px}
body.op-d3 .pv-handle{font:500 .8125rem/1.5 var(--f-mono);color:var(--muted)}
body.op-d3 .pv-handle em{font-style:normal;color:var(--link);margin-left:8px}
body.op-d3 .pv-top{display:flex;align-items:center;gap:clamp(16px,3.6cqi,32px)}
body.op-d3 .pv-av{flex:none;width:min(25cqi,19svh,176px);aspect-ratio:1;object-fit:cover;object-position:50% 12%;border-radius:50%;background:var(--accent);box-shadow:0 0 0 4px var(--bg),0 0 0 5px var(--line-2);transition:box-shadow .6s var(--out)}
body.op-d3 .pv-h1{flex:1;min-width:0;font-weight:inherit}
body.op-d3 .pv-name{display:block;width:max-content;font:800 min(16cqi,12.5svh,8rem)/.92 var(--f-disp);letter-spacing:-.035em;color:var(--ink);white-space:nowrap;transition:color .6s var(--out),outline-color .5s}
body.op-d3 .pv-role{display:block;margin-top:clamp(12px,2svh,20px);font:700 clamp(1.0625rem,3.2cqi,1.5rem)/1.25 var(--f-ui);color:var(--ink);max-width:30ch}
body.op-d3 .pv-lead{color:var(--muted);max-width:54ch;font-size:clamp(1rem,2.8cqi,1.1875rem);line-height:1.55}
body.op-d3 .pv-cta{display:flex;flex-wrap:wrap;gap:8px 24px;align-items:center}
body.op-d3 .inspect{position:absolute;left:0;top:0;width:0;height:0;z-index:4;pointer-events:none;border:1px solid var(--accent);background:color-mix(in srgb,var(--accent) 8%,transparent);border-radius:6px;opacity:0;transition:transform .45s var(--out),opacity .4s var(--ease)}
body.op-d3 .inspect.show{opacity:1}
body.op-d3 .inspect span{position:absolute;left:-1px;bottom:100%;margin-bottom:4px;padding:3px 8px;border-radius:4px;background:var(--accent);color:var(--accent-ink);font:600 .75rem/1.2 var(--f-mono);white-space:nowrap}
body.op-d3 .ide-foot{display:flex;align-items:center;gap:24px;height:56px;flex:none;padding:0 16px;border-top:1px solid var(--line);font:500 .75rem/1 var(--f-mono);color:var(--muted)}
body.op-d3 .st{display:flex;align-items:center;gap:20px}
body.op-d3 .st-ok{color:var(--link);display:inline-block;min-width:14ch;font-weight:600}
body.op-d3 .st-l{display:inline-block;min-width:2ch;text-align:right;font-weight:500;color:var(--ink)}
body.op-d3 .lh{margin-left:auto;display:flex;align-items:center;gap:18px}
body.op-d3 .g{position:relative;display:flex;align-items:center;height:36px;padding-left:44px}
body.op-d3 .g svg{position:absolute;left:0;top:0;width:36px;height:36px;transform:rotate(-90deg)}
body.op-d3 .g circle{fill:none;stroke:var(--line);stroke-width:3}
body.op-d3 .g .gv{stroke:var(--accent);stroke-linecap:round;stroke-dasharray:94.3 94.3;transition:stroke-dashoffset 1.4s var(--out)}
body.op-d3 .g b{position:absolute;left:0;top:0;width:36px;line-height:36px;text-align:center;font:700 .75rem/36px var(--f-mono);color:var(--ink)}
body.op-d3 .g small{font:600 .75rem/1 var(--f-mono);color:var(--ink-2)}
body.op-d3 .lh-cap{padding-left:16px;border-left:1px solid var(--line)}
body.op-d3 .credits{display:flex;flex:none;list-style:none;margin:0 auto;padding:0;width:100%;max-width:var(--max)}
body.op-d3 .credits li{flex:1}
body.op-d3 .credits a{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 16px;color:var(--ink);text-decoration:none;font:600 .9375rem/1.3 var(--f-ui);border-left:1px solid var(--line);transition:color .25s}
body.op-d3 .credits li:first-child a{border-left:0;padding-left:4px}
body.op-d3 .credits a:hover{color:var(--link)}
body.op-d3 .credits span{font:600 .75rem/1 var(--f-mono);text-transform:uppercase;letter-spacing:.06em;color:var(--link)}
@media (prefers-reduced-motion:no-preference){body.op-d3 .js .pv-m{transition:clip-path .6s var(--out),transform .9s var(--sp),filter .7s var(--out),outline-color .5s,box-shadow .6s var(--out)}
body.op-d3 .js .pv-m:not(.on){clip-path:inset(0 0 100% 0);transform:translate3d(0,18px,0) scale(.95);filter:blur(12px)}
body.op-d3 .js .pv-m.on{clip-path:inset(-24px)}
body.op-d3 .js .pv:not(.styled) :is(.pv-m,body.op-d3 .pv-name){outline:1px dashed color-mix(in srgb,var(--accent) 55%,transparent);outline-offset:6px}
body.op-d3 .js .pv:not(.inked) .pv-name{color:var(--dim)}
body.op-d3 .js .pv-name.pop{animation:namePop .9s var(--sp)}
body.op-d3 .js .lh:not(.done) .gv{stroke-dashoffset:94.3}
body.op-d3 .js .pv-m:not(.on),body.op-d3 .js .pv:not(.inked) .pv-name,body.op-d3 .js .lh:not(.done) .gv{animation:pvSafe 0s linear 9s forwards}}
@keyframes namePop{from{transform:translate3d(0,10px,0) scale(.97);filter:blur(8px)}}
@keyframes pvSafe{to{clip-path:inset(-24px);transform:none;filter:none;color:var(--ink);stroke-dashoffset:0}}
body.op-d3 .pv.styled .pv-av{box-shadow:0 0 0 4px var(--bg),0 0 0 6px var(--accent)}
body.op-d3 .js .pv:not(.inked) .pv-name.pop{animation:namePop .9s var(--sp),pvSafe 0s linear 9s forwards}
body.op-d3 .dash,body.op-d3 .pipe-stage,body.op-d3 .price,body.op-d3 .reviews,body.op-d3 .tl,body.op-d3 .log2,body.op-d3 .cmd{max-width:var(--max);margin:0 auto;padding:var(--sy) var(--g)}
body.op-d3 .dash{padding-top:calc(var(--sy) + 16px)}
body.op-d3 .bento{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));grid-auto-rows:auto;gap:16px;grid-template-areas:
  "wp wp wp wp wp wp wp ai ai ai ai ai"
  "wp wp wp wp wp wp wp yr yr dv dv dv"
  "dw dw dw dw dw dw dw dw sc sc sc sc"
  "am am am am am pl pl pl sc sc sc sc"}
body.op-d3 .bento-p{display:contents}
body.op-d3 .tile{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r3);background:var(--panel);padding:24px;transition:border-color .3s,transform .6s var(--out),box-shadow .6s var(--out)}
body.op-d3 .tile::before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(380px circle at var(--mx,50%) var(--my,50%),color-mix(in srgb,var(--accent) 14%,transparent),transparent 65%);opacity:0;transition:opacity .4s}
body.op-d3 .tile::after{content:"";position:absolute;inset:0;z-index:2;border-radius:inherit;padding:1.5px;pointer-events:none;background:conic-gradient(from var(--beam),transparent 0deg 250deg,var(--accent) 330deg,var(--link) 350deg,transparent 360deg);-webkit-mask:linear-gradient(#000 0 0) content-box,linear-gradient(#000 0 0);-webkit-mask-composite:xor;mask:linear-gradient(#000 0 0) content-box exclude,linear-gradient(#000 0 0);opacity:0;transition:opacity .4s;animation:beam 3.2s linear infinite paused}
body.op-d3 .tile:hover{border-color:var(--line-2);transform:translate3d(0,-4px,0);box-shadow:0 30px 60px -40px color-mix(in srgb,var(--accent) 50%,transparent)}
body.op-d3 .tile:hover::before,body.op-d3 .tile:hover::after{opacity:1}
body.op-d3 .tile:hover::after{animation-play-state:running}
body.op-d3 .tile-bar{display:flex;align-items:center;gap:8px;margin:-4px 0 20px;font:500 .8125rem/1 var(--f-mono);color:var(--muted)}
body.op-d3 .tb-dot{width:8px;height:8px;border-radius:50%;background:var(--accent);box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 60%,transparent)}
body.op-d3 .tile:hover .tb-dot{animation:ping 1.2s var(--out) infinite}
@keyframes ping{to{box-shadow:0 0 0 8px transparent}}
body.op-d3 .tile h3{font:700 clamp(1.625rem,2.4vw,2.25rem)/1.08 var(--f-disp);letter-spacing:-.02em;margin-bottom:12px}
body.op-d3 .tile p{color:var(--muted);font-size:1.0625rem}
body.op-d3 .tile>.d-link{margin-top:auto;padding-top:16px}
body.op-d3 .t-wp{grid-area:wp}
body.op-d3 .t-wp-body{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,.75fr);gap:32px}
body.op-d3 .stats{margin:0;display:grid;align-content:start}
body.op-d3 .stats div{display:flex;flex-direction:column-reverse;padding:12px 0;border-top:1px solid var(--line)}
body.op-d3 .stats dt{font:500 .8125rem var(--f-mono);color:var(--muted)}
body.op-d3 .stats dd{margin:0;font:800 clamp(2.375rem,3.8vw,3.5rem)/1 var(--f-disp);letter-spacing:-.03em;font-variant-numeric:lining-nums tabular-nums}
body.op-d3 .t-wp-img{flex:1 1 220px;min-height:220px;width:100%;height:auto;aspect-ratio:auto;margin-top:24px;object-fit:cover;object-position:50% 35%;border-radius:var(--r2);filter:grayscale(1) contrast(1.05);transition:filter .6s,transform .9s var(--out)}
body.op-d3 .t-wp:hover .t-wp-img{filter:none}
body.op-d3 .t-ai{grid-area:ai}
body.op-d3 .agent{list-style:none;margin:16px 0 0;padding:12px 16px;border-radius:var(--r2);background:var(--bg-2);font:500 .8125rem/1.9 var(--f-mono);color:var(--ink-2)}
body.op-d3 .agent b{color:var(--link);margin-right:8px}
body.op-d3 .agent li{transition:opacity .4s,transform .5s var(--sp)}
body.op-d3 .t-yrs{grid-area:yr;background:var(--accent);border-color:var(--accent);color:var(--accent-ink);justify-content:flex-end}
body.op-d3 .t-yrs::before{display:none}
body.op-d3 .tile .yrs{font:800 clamp(3.75rem,6.4vw,6.5rem)/.85 var(--f-disp);letter-spacing:-.04em;font-variant-numeric:lining-nums tabular-nums;color:var(--accent-ink)!important}
body.op-d3 .tile .yrs-l{font:700 1rem/1.3 var(--f-ui);color:var(--accent-ink)!important;margin-top:8px}
body.op-d3 .t-dev{grid-area:dv}
body.op-d3 .stack{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:auto 0 0;padding:16px 0 0}
body.op-d3 .stack li{padding:6px 12px;border:1px solid var(--line-2);border-radius:var(--r1);font:600 .8125rem/1.3 var(--f-mono);transition:transform .5s var(--sp),background-color .3s,color .3s}
body.op-d3 .t-dev:hover .stack li:nth-child(odd){transform:translateY(-6px) rotate(-4deg)}
body.op-d3 .t-dev:hover .stack li:nth-child(even){transform:translateY(4px) rotate(3deg)}
body.op-d3 .t-dev:hover .stack li:nth-child(2){background:var(--ink);color:var(--bg)}
body.op-d3 .tp{gap:16px;padding:16px}
body.op-d3 .tp>img{flex:1 1 180px;min-height:180px;width:100%;height:auto;aspect-ratio:auto;object-fit:cover;object-position:50% 0;border-radius:var(--r2);background:var(--bg-2);transition:transform .9s var(--out)}
body.op-d3 .tp:hover>img{transform:scale(1.03)}
body.op-d3 .tp-body{flex:none;padding:0 8px 8px}
body.op-d3 .tp h3 a{color:var(--ink);text-decoration:none}
body.op-d3 .tp h3 a::after{content:"";position:absolute;inset:0;z-index:1}
body.op-d3 .tp h3 a:focus-visible{outline:none}
body.op-d3 .tp:has(a:focus-visible){outline:3px solid var(--accent);outline-offset:3px}
body.op-d3 .tp h3 a::before{content:"↗";content:"↗"/"";float:right;font-family:var(--f-body);font-size:.7em;color:var(--muted);transition:transform .4s var(--sp)}
body.op-d3 .tp:hover h3 a::before{transform:translate(3px,-3px);color:var(--link)}
body.op-d3 .meta{font:500 .8125rem/1.4 var(--f-mono)!important;color:var(--link)!important;margin-bottom:8px}
body.op-d3 .tp .badge{position:absolute;top:28px;left:28px}
body.op-d3 .t-dive{grid-area:dw;display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);align-items:stretch}
body.op-d3 .t-dive>img{height:100%;min-height:240px}
body.op-d3 .t-dive .tp-body{align-self:center}
body.op-d3 .t-sci{grid-area:sc}
body.op-d3 .t-aim{grid-area:am}
body.op-d3 .t-plv{grid-area:pl}
body.op-d3 .pipe-stage{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:6vw;align-items:center}
body.op-d3 .pipe-copy .h2{margin:16px 0 24px}
body.op-d3 .pipe-copy p:not(.path){color:var(--muted);font-size:1.125rem;max-width:46ch;margin-bottom:16px}
body.op-d3 .pipe-copy p a{color:var(--ink);text-decoration-color:var(--accent);text-underline-offset:4px}
body.op-d3 .term{border:1px solid var(--line);border-radius:var(--r3);background:var(--panel);overflow:hidden}
body.op-d3 .term-bar{display:flex;align-items:center;gap:16px;height:44px;padding:0 16px;border-bottom:1px solid var(--line);font:500 .8125rem/1 var(--f-mono);color:var(--muted)}
body.op-d3 .term-count{margin-left:auto;color:var(--ink)}
body.op-d3 .stages{position:relative;list-style:none;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));margin:0;padding:32px 16px 24px;--pp:1}
body.op-d3 .stages::before,body.op-d3 .stages::after{content:"";position:absolute;left:calc(16px + 10%);right:calc(16px + 10%);top:55px;height:2px;background:var(--line)}
body.op-d3 .stages::after{background:linear-gradient(90deg,var(--accent),var(--link));transform-origin:left;transform:scaleX(var(--pp));transition:transform .7s var(--out)}
body.op-d3 .stg{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center}
body.op-d3 .sn{width:48px;height:48px;border-radius:50%;display:grid;place-items:center;border:2px solid var(--line-2);background:var(--panel);font:700 1rem/1 var(--f-mono);color:var(--muted);transition:background-color .35s,border-color .35s,color .35s,box-shadow .35s,transform .6s var(--sp)}
body.op-d3 .sl{font:700 .9375rem/1.2 var(--f-ui);color:var(--muted);transition:color .3s}
body.op-d3 .sd{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
body.op-d3 .stg.done .sn,body.op-d3 .pipe:not(.live) .sn{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}
body.op-d3 .stg.done .sn{transform:scale(1.06)}
body.op-d3 .stg.done .sl,body.op-d3 .stg.cur .sl,body.op-d3 .pipe:not(.live) .sl{color:var(--ink)}
body.op-d3 .stg.cur .sn{border-color:var(--accent);color:var(--ink);box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 22%,transparent)}
body.op-d3 .log{list-style:none;margin:0;padding:16px 24px 24px;border-top:1px solid var(--line);font:500 .875rem/2.1 var(--f-mono);color:var(--ink-2)}
body.op-d3 .log i{font-style:normal}
body.op-d3 .log b{color:var(--link);margin:0 8px 0 4px}
body.op-d3 .log .lt,body.op-d3 .log .lc{color:var(--dim)}
body.op-d3 .log .lk{color:var(--ink);font-weight:700}
body.op-d3 .log .lp{color:var(--muted)}
body.op-d3 .log .ls{color:var(--str)}
body.op-d3 .log .deploy .lk{color:var(--link)}
body.op-d3 .live .log li{opacity:0;transform:translate3d(-12px,0,0);transition:opacity .35s,transform .6s var(--sp)}
body.op-d3 .live .log li.on{opacity:1;transform:none}
body.op-d3 .price{display:grid;grid-template-columns:minmax(0,5fr) minmax(0,7fr);gap:6vw;align-items:center}
body.op-d3 .price-copy .h2{margin:16px 0 24px}
body.op-d3 .price-copy p:not(.path){color:var(--muted);font-size:1.125rem;max-width:48ch}
body.op-d3 .actions{display:flex;flex-wrap:wrap;gap:16px;margin-top:32px}
body.op-d3 .cfg{border:1px solid var(--line);border-radius:var(--r3);background:var(--panel);overflow:hidden;rotate:-1.5deg;transition:rotate .8s var(--sp),box-shadow .6s var(--out)}
body.op-d3 .cfg:hover{rotate:0deg;box-shadow:0 40px 80px -50px color-mix(in srgb,var(--accent) 60%,transparent)}
body.op-d3 .cfg-bar{display:flex;align-items:center;height:44px;padding:0 24px;border-bottom:1px solid var(--line);font:500 .8125rem/1 var(--f-mono);color:var(--muted)}
body.op-d3 .cfg pre{margin:0;padding:24px;font:500 clamp(.8125rem,1.15vw,1.0625rem)/1.95 var(--f-mono);color:var(--ink-2);overflow-x:auto}
body.op-d3 .cfg .k{color:var(--link)}
body.op-d3 .cfg .f{color:var(--ink);font-weight:800}
body.op-d3 .rv-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:16px}
body.op-d3 .r-main{grid-row:1/3;justify-content:space-between}
body.op-d3 .review{margin:0;display:flex;flex-direction:column;gap:24px;padding:24px;border:1px solid var(--line);border-radius:var(--r3);background:var(--panel);transition:border-color .3s,transform .6s var(--out)}
body.op-d3 .review:hover{border-color:var(--line-2);transform:translate3d(0,-4px,0)}
body.op-d3 .review figcaption{display:flex;align-items:center;gap:12px;font:500 .875rem/1.4 var(--f-ui);color:var(--muted)}
body.op-d3 .review figcaption img{width:48px;height:48px;border-radius:50%;object-fit:cover;flex:none}
body.op-d3 .review figcaption strong{display:block;color:var(--ink);font-size:1rem}
body.op-d3 .review .badge{margin-left:auto}
body.op-d3 .review blockquote{margin:0;padding-left:20px;border-left:3px solid var(--accent)}
body.op-d3 .review blockquote p{font:500 1.25rem/1.5 var(--f-body);color:var(--ink)}
body.op-d3 .r-main blockquote p{font-family:var(--f-disp);font-weight:700;font-size:clamp(1.5rem,2.55vw,2.375rem);line-height:1.3;letter-spacing:-.015em}
body.op-d3 .more{margin-top:24px;color:var(--muted)}
body.op-d3 .more a{color:var(--ink);text-decoration-color:var(--accent);text-underline-offset:4px}
body.op-d3 .tl-list{position:relative;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:96px repeat(3,minmax(0,1fr));gap:24px}
body.op-d3 .tl-list::before,body.op-d3 .tl-list::after{content:"";position:absolute;left:0;right:0;top:11px;height:2px;background:var(--line)}
body.op-d3 .tl-list::after{background:linear-gradient(90deg,var(--accent),var(--link));transform-origin:left}
body.op-d3 .tl-dot{position:relative;z-index:1;display:block;width:24px;height:24px;border-radius:50%;background:var(--accent);border:2px solid var(--accent);margin-bottom:16px;transition:background-color .5s,box-shadow .6s var(--out),transform .6s var(--sp)}
body.op-d3 .tl-now .tl-dot{box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 25%,transparent)}
body.op-d3 .tl-ev.arm:not(.in) .tl-dot{background:var(--bg);transform:scale(.7)}
body.op-d3 .tl-ev.in .tl-dot{animation:dotOn 1.2s var(--out) var(--d,0s) both}
@keyframes dotOn{0%{background:var(--bg);transform:scale(.7)}35%{background:var(--accent);transform:scale(1.15);box-shadow:0 0 0 0 color-mix(in srgb,var(--accent) 55%,transparent)}100%{background:var(--accent);transform:none;box-shadow:0 0 0 12px transparent}}
body.op-d3 .tl-date{display:block;font:700 1rem/1.3 var(--f-mono);color:var(--ink);margin-bottom:12px}
body.op-d3 .tl-now .tl-date{color:var(--link)}
body.op-d3 .tl-card{position:relative;padding:20px;border:1px solid var(--line);border-radius:16px;background:var(--panel);transition:border-color .3s,transform .5s var(--out)}
body.op-d3 .tl-ev:hover .tl-card{border-color:var(--accent);transform:translateY(-4px)}
body.op-d3 .tl-card h3{font:700 1.375rem/1.2 var(--f-disp);letter-spacing:-.015em;margin:12px 0 8px}
body.op-d3 .tl-card h3 a{color:var(--ink);text-decoration:none}
body.op-d3 .tl-card h3 a::after{content:"";position:absolute;inset:0}
body.op-d3 .tl-card p{color:var(--muted);font-size:.9375rem}
body.op-d3 .tl-card p a{position:relative;z-index:1;color:var(--ink);text-decoration-color:var(--accent);text-underline-offset:3px}
body.op-d3 .blog-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:16px}
body.op-d3 .feat{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r3);overflow:hidden;background:var(--panel);color:var(--ink);text-decoration:none;transition:border-color .3s,transform .6s var(--out)}
body.op-d3 .feat:hover{border-color:var(--line-2);transform:translate3d(0,-4px,0)}
body.op-d3 .feat img{width:100%;aspect-ratio:16/9;object-fit:cover;transition:transform .9s var(--out)}
body.op-d3 .feat:hover img{transform:scale(1.04)}
body.op-d3 .feat-body{display:flex;flex-direction:column;gap:12px;padding:24px}
body.op-d3 .feat strong{font:700 clamp(1.625rem,2.5vw,2.375rem)/1.12 var(--f-disp);letter-spacing:-.02em}
body.op-d3 .feat time,body.op-d3 .clog time{font:500 .875rem var(--f-mono);color:var(--muted)}
body.op-d3 .clog{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--r3);background:var(--panel);overflow:hidden}
body.op-d3 .clog li{flex:1;display:flex}
body.op-d3 .clog li+li{border-top:1px solid var(--line)}
body.op-d3 .clog a{position:relative;flex:1;display:flex;flex-direction:column;justify-content:center;gap:8px;padding:24px;color:var(--ink);text-decoration:none;transition:background-color .3s}
body.op-d3 .clog a::before{content:"";position:absolute;left:0;top:16px;bottom:16px;width:3px;border-radius:2px;background:var(--accent);transform:scaleY(0);transition:transform .5s var(--sp)}
body.op-d3 .clog a:hover::before{transform:none}
body.op-d3 .clog time::before{content:"## ";color:var(--link)}
body.op-d3 .clog strong{font:700 1.1875rem/1.35 var(--f-ui);transition:color .3s,transform .5s var(--sp)}
body.op-d3 .clog a:hover{background:var(--bg-2)}
body.op-d3 .clog a:hover strong{transform:translateX(6px)}
body.op-d3 .clog a:hover strong,body.op-d3 .feat:hover strong{color:var(--link)}
body.op-d3 .media-h{font:800 clamp(1.625rem,2.5vw,2.125rem)/1.1 var(--f-disp);letter-spacing:-.025em;margin:48px 0 16px}
body.op-d3 .press{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:48px;border-bottom:1px solid var(--line)}
body.op-d3 .press a{display:grid;grid-template-columns:128px minmax(0,1fr);gap:16px;align-items:center;padding:16px 0;border-top:1px solid var(--line);color:var(--ink);text-decoration:none;font-size:1rem}
body.op-d3 .press a:hover span:not(.chip){text-decoration:underline;text-decoration-color:var(--accent)}
body.op-d3 .chip{display:flex;align-items:center;justify-content:center;height:56px;padding:8px 12px;background:#fff;border-radius:var(--r1);border:1px solid var(--line);transition:transform .5s var(--sp)}
body.op-d3 .press a:hover .chip{transform:rotate(-3deg) scale(1.04)}
body.op-d3 .chip img{max-height:32px;width:auto}
body.op-d3 .cmd{max-width:1200px}
body.op-d3 .cmd .h2{font-size:clamp(2.5rem,5.6vw,5.25rem)}
body.op-d3 .cmd-lead{color:var(--muted);font-size:1.25rem;margin:24px 0 40px;max-width:40ch}
body.op-d3 .palette{position:relative;isolation:isolate;overflow:hidden;display:flex;align-items:center;gap:16px;min-height:96px;padding:0 24px;border:2px solid var(--accent);border-radius:var(--r3);background:var(--panel);color:var(--ink);text-decoration:none;font:800 clamp(1.25rem,3.4vw,2.5rem)/1.1 var(--f-mono);letter-spacing:-.05em;transition:color .3s,transform .5s var(--sp)}
body.op-d3 .palette::before{content:"";position:absolute;inset:0;z-index:-1;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .6s var(--out)}
body.op-d3 .pal-k{color:var(--link);transition:color .3s}
body.op-d3 .caret{width:.5em;height:1.1em;background:var(--accent);animation:caret 1s steps(1) infinite}
body.op-d3 .palette kbd{margin-left:auto;padding:8px 14px;border:1px solid var(--line-2);border-radius:10px;font:600 1rem/1 var(--f-mono);color:var(--muted)}
body.op-d3 .palette:hover{color:var(--accent-ink);transform:translateY(-4px)}
body.op-d3 .palette:hover::before{transform:none}
body.op-d3 .palette:hover .pal-k,body.op-d3 .palette:hover kbd{color:var(--accent-ink);border-color:var(--accent-ink)}
body.op-d3 .palette:hover .caret{background:var(--accent-ink)}
body.op-d3 .ct{display:grid;grid-template-columns:repeat(3,auto);justify-content:start;gap:24px 64px;margin:40px 0 0}
body.op-d3 .ct div{display:flex;flex-direction:column;gap:4px}
body.op-d3 .ct dt{font:500 .8125rem var(--f-mono);color:var(--muted)}
body.op-d3 .ct dt::before{content:"// "}
body.op-d3 .ct dd{margin:0;font:700 1.125rem/1.4 var(--f-ui)}
body.op-d3 .ct a{color:var(--ink);text-decoration-color:var(--accent);text-underline-offset:5px}
body.op-d3 .site-footer{max-width:var(--max);margin:0 auto;padding:32px var(--g) 48px;display:flex;flex-wrap:wrap;gap:16px 32px;align-items:center;border-top:1px solid var(--line);color:var(--muted);font-size:.875rem}
body.op-d3 .f-links{display:flex;flex-wrap:wrap;gap:8px 24px;list-style:none;margin:0;padding:0}
body.op-d3 .f-links a{color:var(--ink);display:inline-flex;min-height:44px;align-items:center}
body.op-d3 .f-note{margin-left:auto!important}
body.op-d3 .tk{display:inline-flex;align-items:flex-start}
body.op-d3 .tk-c{display:inline-block;height:1em;overflow:hidden}
body.op-d3 .tk-s{display:flex;flex-direction:column;transition:transform 1.6s var(--sp);transition-delay:calc(var(--k,0) * 90ms + var(--d,0s))}
body.op-d3 .tk-s span{height:1em;line-height:1}
body.op-d3 .in .tk-s,body.op-d3 .tk.go .tk-s{transform:translate3d(0,calc(var(--n) * -1em),0)}
@media (prefers-reduced-motion:no-preference){body.op-d3 .arm{transition:opacity .7s var(--ease) var(--d,0s),transform 1s var(--sp) var(--d,0s),filter .8s var(--out) var(--d,0s)}
body.op-d3 .arm:not(.in){opacity:0;transform:translate3d(0,40px,0) scale(.97);filter:blur(10px)}
body.op-d3 .tile.arm.in{transition:opacity .7s var(--ease) var(--d,0s),transform .6s var(--out),filter .8s var(--out) var(--d,0s),border-color .3s,box-shadow .6s var(--out)}
body.op-d3 .agent li{opacity:1}
body.op-d3 .t-ai.arm:not(.in) .agent li{opacity:0;transform:translate3d(-10px,0,0)}
body.op-d3 .t-ai.in .agent li:nth-child(2){transition-delay:.5s}
body.op-d3 .t-ai.in .agent li:nth-child(3){transition-delay:.8s}
body.op-d3 .t-ai.in .agent li:nth-child(1){transition-delay:.2s}
@supports (animation-timeline: view()){body.op-d3 .tl-list::after{animation:grow linear both;animation-timeline:view();animation-range:entry 20% cover 50%}}}
@keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@media print{body.op-d3 .arm{opacity:1!important;transform:none!important;filter:none!important}}
@media (max-width:1180px){body.op-d3 .ide-body{grid-template-columns:minmax(0,1fr) minmax(0,1.1fr)}
body.op-d3 .ide-tree{display:none}
body.op-d3 .tabs .tab:nth-child(3){display:none}
body.op-d3 .lh-cap{display:none}
body.op-d3 .pv{padding-top:64px;padding-bottom:20px;gap:clamp(12px,1.8svh,20px)}
body.op-d3 .pv-cta{gap:4px 20px}}
@media (max-width:980px){body.op-d3 .bento{grid-template-columns:repeat(6,minmax(0,1fr));grid-template-areas:"wp wp wp wp wp wp" "yr yr ai ai ai ai" "dv dv dv dv dv dv"}
body.op-d3 .bento-p{grid-column:1/-1;display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 calc(-1*var(--g));padding:8px var(--g) 12px;scroll-padding:0 var(--g)}
body.op-d3 .bento-p .tile{flex:0 0 min(82%,420px);scroll-snap-align:start;display:flex;grid-template-columns:none}
body.op-d3 .t-dive{flex-direction:column}
body.op-d3 .t-dive>img,body.op-d3 .tp>img{flex:none;height:auto;min-height:0;aspect-ratio:16/10}
body.op-d3 .pipe-stage,body.op-d3 .price,body.op-d3 .rv-grid,body.op-d3 .blog-grid{grid-template-columns:1fr}
body.op-d3 .pipe-stage,body.op-d3 .price{gap:40px}
body.op-d3 .r-main{grid-row:auto}
body.op-d3 .cfg{rotate:0deg}
body.op-d3 .tl-list{grid-template-columns:1fr;gap:16px;padding-left:40px}
body.op-d3 .tl-list::before,body.op-d3 .tl-list::after{left:11px;right:auto;top:0;bottom:0;width:2px;height:auto}
body.op-d3 .tl-list::after{transform-origin:top;animation-name:growY!important}
body.op-d3 .tl-list li{position:relative}
body.op-d3 .tl-dot{position:absolute;left:-40px;top:0}
body.op-d3 .tl-date{padding-top:1px}
body.op-d3 .press{grid-template-columns:1fr}
body.op-d3 .ct{grid-template-columns:1fr}
body.op-d3 .f-note{margin-left:0!important}}
@keyframes growY{from{transform:scaleY(0)}to{transform:scaleY(1)}}
@media (max-width:760px){body.op-d3 .hero{padding-top:84px}
body.op-d3 .ide-wrap{transform:none}
body.op-d3 .tabs .tab:nth-child(n/**/+2),body.op-d3 .url{display:none}
body.op-d3 .replay{margin-left:auto}
body.op-d3 .replay .rp-w{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
body.op-d3 .ide-body{display:flex;flex-direction:column}
body.op-d3 .ide-preview{order:1}
body.op-d3 .ide-code{order:2;height:148px;flex:none;border-right:0;border-top:1px solid var(--line);-webkit-mask-image:linear-gradient(transparent,#000 22%,#000 80%,transparent);mask-image:linear-gradient(transparent,#000 22%,#000 80%,transparent)}
body.op-d3 .ide-code pre{padding:10px 0;font-size:.75rem}
body.op-d3 .cl::before{width:36px;padding-right:12px}
body.op-d3 .pv{display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"av hd" "h1 h1" "ld ld" "ct ct";align-items:center;column-gap:16px;row-gap:16px;padding:60px 20px 24px}
body.op-d3 .pv-top{display:contents}
body.op-d3 .pv-av{grid-area:av;width:92px}
body.op-d3 .pv-handle{grid-area:hd;line-height:1.6}
body.op-d3 .pv-handle em{display:block;margin-left:0}
body.op-d3 .pv-h1{grid-area:h1}
body.op-d3 .pv-name{font-size:min(21cqi,6rem)}
body.op-d3 .pv-role{max-width:none}
body.op-d3 .pv-lead{grid-area:ld}
body.op-d3 .pv-cta{grid-area:ct}
body.op-d3 .pv-nav{left:20px;right:20px;top:16px}
body.op-d3 .ide-foot{height:auto;flex-wrap:wrap;padding:12px 16px;gap:12px 16px}
body.op-d3 .lh{margin-left:0;flex-wrap:wrap;gap:12px 16px}
body.op-d3 .credits{overflow-x:auto;scroll-snap-type:x mandatory}
body.op-d3 .credits li{flex:0 0 78%;scroll-snap-align:start}
body.op-d3 .credits a{flex-direction:column;align-items:flex-start;gap:6px;padding:12px 16px}
body.op-d3 .credits li:first-child a{padding-left:4px}}
@media (max-width:640px){body.op-d3 .bento{grid-template-columns:1fr;grid-template-areas:"wp" "yr" "ai" "dv"}
body.op-d3 .t-wp-body{grid-template-columns:1fr;gap:16px}
body.op-d3 .stats{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:12px}
body.op-d3 .stats dd{font-size:1.75rem}
body.op-d3 .t-wp-img{flex:none;height:200px;min-height:0}
body.op-d3 .t-yrs{flex-direction:row;align-items:baseline;gap:16px;padding:20px 24px}
body.op-d3 .stages{grid-template-columns:1fr;padding:24px;gap:0}
body.op-d3 .stages::before,body.op-d3 .stages::after{left:47px;right:auto;top:48px;bottom:48px;width:2px;height:auto}
body.op-d3 .stages::after{transform-origin:top;transform:scaleY(var(--pp))}
body.op-d3 .stg{flex-direction:row;align-items:center;text-align:left;gap:16px;padding:8px 0;flex-wrap:wrap}
body.op-d3 .stg .sl{flex:1}
body.op-d3 .sd{position:static!important;width:auto;height:auto;clip:auto;white-space:normal;flex-basis:100%;padding-left:64px;margin-top:-12px;font:500 .875rem/1.5 var(--f-mono);color:var(--muted)}
body.op-d3 .log{display:none}
body.op-d3 .palette{min-height:80px;padding:0 16px;gap:10px}
body.op-d3 .palette kbd{display:none}
body.op-d3 .sec-head{margin-bottom:32px}}
@media (prefers-reduced-motion:reduce){body.op-d3 *,body.op-d3 *::before,body.op-d3 *::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
body.op-d3 .ide-wrap{transform:none!important}}
/* ===== v3 native layer (page 311329 only) ===== */
html body.op-d3.op-d3{background-color:var(--bg)!important;color:var(--ink);font-family:var(--f-body)}
body.op-d3{--soft:color-mix(in srgb,var(--accent) 12%,var(--panel));--accent-hover:color-mix(in srgb,var(--accent) 85%,#000)}
html[data-theme="dark"] body.op-d3{--accent-hover:color-mix(in srgb,var(--accent) 85%,#fff)}
body.op-d3 #page-container{padding-top:0!important;margin-top:0!important;overflow:visible!important}
body.op-d3 #main-content,body.op-d3 .et-l--post,body.op-d3 .et_builder_inner_content{background:transparent!important}
body.op-d3 :where(.op-d3-s) :where(h1,h2,h3,h4,h5,h6,p,li){padding-bottom:0}
/* hero: custom block keeps its own geometry */
body.op-d3 .et_pb_section.op-hero-s{padding:0!important;background:transparent!important;overflow:visible}
body.op-d3 .op-hero-s .et_pb_module,body.op-d3 .op-hero-s .et_pb_code_inner{margin:0!important;padding:0!important;width:100%!important;max-width:none!important;overflow:visible!important}
/* pill nav (fixed, floating) */
/* links + lists */
body.op-d3 .op-link{color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-decoration-thickness:2px;text-underline-offset:6px;display:inline-flex;min-height:44px;align-items:center}
body.op-d3 .op-card .op-linkwrap{margin-top:auto}
body.op-d3 .op-d3-s .et_pb_text a:not(.op-link){color:var(--ink);text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:4px}
body.op-d3 .op-agent ul{list-style:none;margin:0;padding:14px 16px;border-radius:12px;background:var(--bg-2)}
body.op-d3 .op-agent li::before{content:"› ";color:var(--accent)}
body.op-d3 .op-chips ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:8px}
body.op-d3 .op-chips li{padding:6px 12px;border:1px solid var(--line-2);border-radius:999px}
body.op-d3 .op-list ul{list-style:none;margin:0;padding:0}
body.op-d3 .op-list li{padding:10px 0;border-bottom:1px dashed var(--line)}
/* cards */
body.op-d3 .op-card{transition:transform .5s cubic-bezier(.22,.8,.24,1),box-shadow .5s,border-color .3s}
body.op-d3 .op-card:hover{transform:translate3d(0,-3px,0);box-shadow:0 30px 60px -40px color-mix(in srgb,var(--accent) 50%,transparent);border-color:var(--line-2)!important}
body.op-d3 .op-card .op-fill{flex:1 1 auto;display:flex;min-height:220px}
body.op-d3 .op-card .op-fill .et_pb_image_wrap{display:block;width:100%;height:100%}
body.op-d3 .op-card .op-fill img{width:100%;height:100%;object-fit:cover;object-position:50% 30%}
body.op-d3 .op-proj .op-img img{aspect-ratio:16/10;object-fit:cover;width:100%}
body.op-d3 .op-yrs{font-variant-numeric:lining-nums}
/* process steps */
/* testimonials */
body.op-d3 .op-testi .et_pb_testimonial_portrait{width:56px!important;height:56px!important;border-radius:50%;margin-bottom:16px}
body.op-d3 .op-testi .et_pb_testimonial_description,body.op-d3 .op-testi .et_pb_testimonial_description_inner{margin:0!important;width:auto!important}
body.op-d3 .op-testi:before{display:none!important}
body.op-d3 .op-testi-main{height:100%;border-left:4px solid var(--accent)!important}
/* blog modules */
body.op-d3 .op-blog .et_pb_post{margin-bottom:0!important;padding:0 0 16px;border-bottom:1px solid var(--line)}
body.op-d3 .op-blog-list .et_pb_post{padding:16px 0}
body.op-d3 .op-blog-list .et_pb_post:first-child{padding-top:0}
body.op-d3 .op-blog .et_pb_post:last-child{border-bottom:0;padding-bottom:0}
body.op-d3 .op-blog .entry-title a{color:var(--ink)!important}
body.op-d3 .op-blog .post-meta{order:-1}
body.op-d3 .op-blog .et_pb_image_container{margin-bottom:16px}
/* press + contact blurbs */
body.op-d3 .op-blurb .et_pb_main_blurb_image img{background:#fff;border-radius:10px;padding:8px;width:112px;height:auto}
body.op-d3 .op-blurb .et_pb_module_header a{color:var(--ink)}
body.op-d3 .op-ct{padding:18px 20px!important;border:1px solid var(--line);border-radius:16px;background:var(--panel);margin-bottom:12px!important}
body.op-d3 .op-ct .et_pb_module_header{font:500 13px/1.2 var(--f-mono)!important;color:var(--muted)!important}
body.op-d3 .op-ct .et_pb_module_header:before{content:"// "}
body.op-d3 .op-ct .et_pb_blurb_description{font:700 18px/1.4 var(--f-body);color:var(--ink)}
body.op-d3 .op-palette .et_pb_button{border:1.5px solid var(--accent)!important}
/* events shortcode */
body.op-d3 .op-events-sc{color:var(--ink)}
@media(max-width:980px){body.op-d3 .op-d3-s .et_pb_row>.et_pb_column{margin-bottom:16px}}
body.op-d3 .op-proj .op-side{flex:0 0 52%!important;max-width:52%;min-height:260px}
@media(max-width:767px){body.op-d3 .op-proj .op-side{flex:0 0 auto!important;max-width:none;min-height:0}body.op-d3 .op-proj .op-side img{aspect-ratio:16/10;height:auto}}
body.op-d3 .op-blurb .et_pb_main_blurb_image{width:112px!important;max-width:112px!important;flex:0 0 112px}
body.op-d3 .op-blurb .et_pb_main_blurb_image .et_pb_image_wrap{width:112px!important}
body.op-d3 .op-proj .op-fill{min-height:180px}
/* events shortcode re-skin to page tokens (both modes) */
body.op-d3 .op-ev-c__item{background:var(--panel)!important;border-color:var(--line)!important;color:var(--ink)!important}
body.op-d3 .op-ev-c__title,body.op-d3 .op-ev-c__title a,body.op-d3 .op-ev-c__link{color:var(--ink)!important}
body.op-d3 .op-ev-c__date,body.op-d3 .op-ev-c__role{color:var(--muted)!important}
body.op-d3 .op-ev-c__badge,body.op-d3 .op-ev-badge{background:var(--soft)!important;color:var(--ink)!important}
body.op-d3 .op-ev-c-all{color:var(--ink)!important;border-color:var(--accent)!important;background:transparent!important}
body.op-d3 .op-blog .et_pb_post,body.op-d3 .op-blog .et_pb_ajax_pagination_container{background:transparent!important}
body.op-d3 .op-blog .post-meta,body.op-d3 .op-blog .post-meta span{color:var(--muted)!important}
body.op-d3 .op-blog .post-content,body.op-d3 .op-blog .post-content p{color:var(--muted)!important}
/* ===== Services v2 (concept 2) ===== */
body.op-d3 .op-svc .op-acc{color:var(--accent);font-weight:600}
body.op-d3 .op-band .op-acc{color:#5ED493}
body.op-d3 .op-band{background:radial-gradient(700px circle at 85% 30%,rgba(94,212,147,.16),transparent 60%),#0F1412!important}
body.op-d3 .op-band-txt{flex:0 0 44%;min-width:0;justify-content:center}
body.op-d3 .op-band .op-link{color:#ECEEF0!important;text-decoration-color:#5ED493;background:none!important}
body.op-d3 .op-orbit{flex:1;display:flex;align-items:center;justify-content:center;margin:0!important}
body.op-d3 .op-orbit .et_pb_image_wrap{max-width:520px;width:100%}
body.op-d3 .op-orbit img{width:100%;height:auto}
body.op-d3 .op-wp-txt{flex:1 1 50%;min-width:0}
body.op-d3 .op-portrait-row{margin-top:auto;flex-wrap:nowrap}
body.op-d3 .op-portrait{width:56px!important;flex:0 0 56px;margin:0!important}
body.op-d3 .op-portrait img{width:56px;height:56px;object-fit:cover;border:2px solid var(--accent);border-radius:50%}
body.op-d3 .op-browser{flex:1 1 50%;min-width:0;position:relative;overflow:hidden;min-height:300px}
body.op-d3 .op-bar{padding:10px 12px;border-bottom:1px solid var(--line);margin:0!important}
body.op-d3 .op-bar .et_pb_text_inner,body.op-d3 .op-bar p{display:flex;align-items:center;gap:6px;margin:0;padding:0;width:100%}
body.op-d3 .op-dots{display:inline-flex;gap:6px;margin-right:6px}
body.op-d3 .op-dots i{width:9px;height:9px;border-radius:50%;background:var(--line-2);display:block}
body.op-d3 .op-prog{margin-left:auto;width:70px;height:4px;border-radius:4px;background:var(--line);overflow:hidden;display:block}
body.op-d3 .op-prog b{display:block;height:100%;width:0;background:var(--accent);animation:opProg 6s var(--ease,ease) infinite}
@keyframes opProg{0%{width:0}55%,100%{width:100%}}
body.op-d3 .op-build{flex:1;position:relative;margin:0!important;background:linear-gradient(90deg,var(--line) 0,var(--bg-2) 50%,var(--line) 100%) 0 0/200% 100%;animation:opShim 1.6s linear infinite}
body.op-d3 .op-build .et_pb_image_wrap{position:absolute!important;inset:0;width:100%;height:100%}
body.op-d3 .op-build img{width:100%;height:100%;object-fit:cover;clip-path:circle(0% at 50% 50%);animation:opBuild 6s var(--ease,ease) infinite}
@keyframes opShim{to{background-position:-200% 0}}
@keyframes opBuild{0%,15%{clip-path:circle(0% at 50% 50%)}35%,95%{clip-path:circle(75% at 50% 50%)}100%{clip-path:circle(0% at 50% 50%)}}
body.op-d3 .op-badge{position:absolute!important;right:12px;bottom:12px;z-index:2;margin:0!important}
body.op-d3 .op-chip{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 12px;border-radius:999px;border:1px solid var(--line-2);background:var(--panel);color:var(--ink);white-space:nowrap;margin:0 4px 6px 0}
body.op-d3 .op-chip i{width:7px;height:7px;border-radius:50%;background:var(--accent);display:inline-block}
@property --opx{syntax:"<percentage>";inherits:true;initial-value:50%}
body.op-d3 .op-split{position:relative;aspect-ratio:16/10;overflow:hidden;--opx:50%;animation:opSlide 6s var(--ease,ease) infinite}
body.op-d3 .op-split:hover{animation-play-state:paused}
@keyframes opSlide{0%,100%{--opx:85%}50%{--opx:15%}}
body.op-d3 .op-split-code{position:absolute!important;inset:0;padding:16px;margin:0!important}
body.op-d3 .op-split-code pre{margin:0;padding:0;background:none;font:inherit;color:inherit;white-space:pre;overflow:hidden}
body.op-d3 .op-split-code .k{color:#86E6AF}body.op-d3 .op-split-code .s{color:#E2C792}
body.op-d3 .op-split-ui{position:absolute!important;inset:0;margin:0!important;clip-path:inset(0 0 0 var(--opx))}
body.op-d3 .op-split-ui .et_pb_image_wrap,body.op-d3 .op-split-ui img{width:100%;height:100%;object-fit:cover}
body.op-d3 .op-split::after{content:"⇆";position:absolute;top:50%;left:var(--opx);transform:translate(-50%,-50%);width:30px;height:30px;border-radius:50%;background:var(--accent);color:var(--accent-ink);display:grid;place-items:center;font-size:14px;z-index:3;box-shadow:0 0 0 999px transparent}
body.op-d3 .op-split::before{content:"";position:absolute;top:0;bottom:0;left:var(--opx);width:2px;background:var(--accent);box-shadow:0 0 12px var(--accent);z-index:2}
body.op-d3 .op-wp2,body.op-d3 .op-cu2,body.op-d3 .op-band{transition:transform .6s var(--ease,ease),box-shadow .6s var(--ease,ease)}
body.op-d3 .op-wp2:hover,body.op-d3 .op-cu2:hover{box-shadow:0 24px 60px -24px rgba(29,122,75,.25)}
body.op-d3 .op-wp2:hover .op-build img{transform:scale(1.03);transition:transform .6s}
/* press new */
body.op-d3 .op-pdate{font:500 12.5px/1.3 var(--f-mono);color:var(--dim);margin-bottom:6px!important}
@media (max-width:980px){body.op-d3 .op-band-txt,body.op-d3 .op-wp-txt,body.op-d3 .op-browser{flex:1 1 auto}body.op-d3 .op-orbit .et_pb_image_wrap{max-width:440px}}
@media (max-width:640px){body.op-d3 .op-browser{min-height:240px}}
@media (prefers-reduced-motion:reduce){body.op-d3 .op-prog b,body.op-d3 .op-build,body.op-d3 .op-build img,body.op-d3 .op-split{animation:none!important}body.op-d3 .op-build img{clip-path:none}body.op-d3 .op-prog b{width:100%}body.op-d3 .op-split{--opx:50%}body.op-d3 .et_animated{opacity:1!important;animation:none!important}}

body.op-d3 .et_pb_section.op-svc,body.op-d3 .et_pb_section.op-blogs{row-gap:0!important;gap:0!important}
body.op-d3 .op-press-new .et_pb_main_blurb_image{margin:0 0 14px!important}body.op-d3 .op-press-new .et_pb_blurb_content{text-align:left}
body.op-d3 .op-press-new .et_pb_main_blurb_image{flex:0 0 auto!important;width:140px!important;max-width:140px!important}
body.op-d3 .op-press-new .et_pb_main_blurb_image .et_pb_image_wrap{width:140px!important}
body.op-d3 .op-press-new .et_pb_main_blurb_image img{width:140px}
body.op-d3 .op-press-new .et_pb_main_blurb_image{height:48px!important;display:flex!important;align-items:flex-start;margin:0 0 12px!important;overflow:visible}
body.op-d3 .op-press-new .et_pb_main_blurb_image img{max-height:48px;width:auto;max-width:140px}
body.op-d3 .op-press-new .et_pb_blurb_container{padding:0!important;margin:0!important}
body.op-d3 .op-press-new .et_pb_module_header{margin-top:0!important;padding-top:0!important}

/* D3 global footer (Theme Builder) */
body.op-d3 .et-l--footer{background:var(--bg)}
body.op-d3 .op-foot .op-soc a,body.op-d3 .op-foot a{color:var(--ink)}
body.op-d3 .op-jh-logo img{width:150px;height:auto;display:block}
body.op-d3 .op-sp-txt{flex:1 1 220px;min-width:0}
body.op-d3 .op-jh-logo img{height:60px!important;object-fit:cover}

/* ===== Process pipeline (interactive) ===== */
body.op-d3 .op-pipe-card{min-width:0}
body.op-d3 .op-ps-wrap{display:grid!important;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);grid-template-rows:repeat(5,minmax(56px,1fr));align-items:center;column-gap:24px;position:relative}
body.op-d3 .op-ps{display:contents!important}
body.op-d3 .op-ps-h{grid-column:1;position:relative;margin:0!important;padding:14px 12px 14px 52px!important;border-radius:14px;cursor:pointer;transition:background .3s,color .3s;outline:none}
body.op-d3 .op-ps-1 .op-ps-h{grid-row:1}body.op-d3 .op-ps-2 .op-ps-h{grid-row:2}body.op-d3 .op-ps-3 .op-ps-h{grid-row:3}body.op-d3 .op-ps-4 .op-ps-h{grid-row:4}body.op-d3 .op-ps-5 .op-ps-h{grid-row:5}
body.op-d3 .op-ps-h .et_pb_heading_container>*{color:var(--muted)!important;transition:color .3s}
body.op-d3 .op-ps-h::before{content:attr(data-n);position:absolute;left:8px;top:50%;transform:translateY(-50%);width:32px;height:32px;border-radius:50%;display:grid;place-items:center;font:700 12px/1 var(--f-mono);background:var(--panel);color:var(--muted);border:2px solid var(--line-2);z-index:2;transition:all .35s var(--ease,ease)}
body.op-d3 .op-ps-h:hover,body.op-d3 .op-ps-h:focus-visible{background:var(--bg-2)}
body.op-d3 .op-ps-h:focus-visible{box-shadow:0 0 0 2px var(--accent)}
body.op-d3 .op-ps-h.is-on{background:var(--bg-2)}
body.op-d3 .op-ps-h.is-on .et_pb_heading_container>*{color:var(--ink)!important}
body.op-d3 .op-ps-h.is-on::before{background:var(--accent);border-color:var(--accent);color:var(--accent-ink);box-shadow:0 0 0 6px color-mix(in srgb,var(--accent) 22%,transparent)}
body.op-d3 .op-ps-h.is-done::before{border-color:var(--accent);color:var(--ink)}
body.op-d3 .op-ps-rail{position:absolute;left:23px;top:30px;width:2px;height:200px;background:var(--line);z-index:1;pointer-events:none}
body.op-d3 .op-ps-rail i{position:absolute;left:0;top:0;width:100%;height:100%;background:var(--accent);box-shadow:0 0 10px var(--accent);transform-origin:top;transform:scaleY(var(--p,0));transition:transform .6s var(--ease,ease)}
body.op-d3 .op-ps-d{grid-column:2;grid-row:1/6;align-self:start;margin:0!important;padding:8px 0 244px!important;opacity:0;transform:translateY(8px);transition:opacity .4s,transform .4s;pointer-events:none;visibility:hidden}
body.op-d3 .op-ps-d.is-on{opacity:1;transform:none;visibility:visible;pointer-events:auto}
body.op-d3 .op-ps-d.is-on::before{content:attr(data-k);display:block;margin-bottom:8px;font:600 12px/1.3 var(--f-mono);color:var(--dim)}
body.op-d3 .op-ps-vis{grid-column:2;grid-row:1/6;align-self:end;height:224px;border:1px solid var(--line);border-radius:16px;background:var(--bg);background-image:radial-gradient(var(--dot) 1px,transparent 1px);background-size:16px 16px;position:relative;overflow:hidden}
body.op-d3 .op-ps-v{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;gap:10px;padding:20px;opacity:0;transition:opacity .4s;font:600 13px/1.3 var(--f-mono);color:var(--ink)}
body.op-d3 .op-ps-v.is-on{opacity:1}
body.op-d3 .op-ps-v .ck{display:flex;align-items:center;gap:10px;padding:8px 12px;border-radius:10px;background:var(--panel);border:1px solid var(--line)}
body.op-d3 .op-ps-v .ck b{width:18px;height:18px;border-radius:50%;border:2px solid var(--line-2);display:grid;place-items:center;font-size:11px;color:transparent;transition:all .3s}
body.op-d3 .op-ps-v.is-on .ck b{animation:opTick .4s forwards}
body.op-d3 .op-ps-v.is-on .ck:nth-child(2) b{animation-delay:.5s}body.op-d3 .op-ps-v.is-on .ck:nth-child(3) b{animation-delay:1s}
@keyframes opTick{to{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}}
body.op-d3 .op-ps-v .bar{display:grid;grid-template-columns:110px 1fr;align-items:center;gap:10px}
body.op-d3 .op-ps-v .bar span{height:10px;border-radius:6px;background:var(--line);overflow:hidden}
body.op-d3 .op-ps-v .bar span i{display:block;height:100%;width:0;background:var(--accent);border-radius:6px;transition:width 1s var(--ease,ease)}
body.op-d3 .op-ps-v.is-on .bar span i{width:var(--w)}
body.op-d3 .op-ps-v.is-on .bar:nth-child(2) span i{transition-delay:.2s}body.op-d3 .op-ps-v.is-on .bar:nth-child(3) span i{transition-delay:.4s}body.op-d3 .op-ps-v.is-on .bar:nth-child(4) span i{transition-delay:.6s}
body.op-d3 .op-ps-v svg{width:min(240px,80%);height:auto;align-self:center;overflow:visible}
body.op-d3 .op-ps-v .needle{transform-origin:100px 100px;transform:rotate(-80deg);transition:transform 1.4s cubic-bezier(.34,1.3,.64,1)}
body.op-d3 .op-ps-v.is-on .needle{transform:rotate(62deg)}
body.op-d3 .op-ps-v .arc{fill:none;stroke:var(--line);stroke-width:14;stroke-linecap:round}
body.op-d3 .op-ps-v .arcf{fill:none;stroke:var(--accent);stroke-width:14;stroke-linecap:round;stroke-dasharray:252;stroke-dashoffset:252;transition:stroke-dashoffset 1.4s var(--ease,ease)}
body.op-d3 .op-ps-v.is-on .arcf{stroke-dashoffset:40}
body.op-d3 .op-ps-v .cap{align-self:center;color:var(--muted)}
body.op-d3 .op-ps-v .sp{display:flex;gap:10px;justify-content:center}
body.op-d3 .op-ps-v .sp div{flex:1;max-width:120px;padding:12px;border-radius:12px;background:var(--panel);border:1px solid var(--line);display:flex;flex-direction:column;gap:6px}
body.op-d3 .op-ps-v .sp em{font-style:normal;color:var(--dim);font-size:11px}
body.op-d3 .op-ps-v.is-on .sp div{animation:opSprint 3s infinite}
body.op-d3 .op-ps-v.is-on .sp div:nth-child(2){animation-delay:1s}body.op-d3 .op-ps-v.is-on .sp div:nth-child(3){animation-delay:2s}
@keyframes opSprint{0%,30%{border-color:var(--accent);transform:translateY(-6px);box-shadow:0 10px 20px -12px var(--accent)}40%,100%{transform:none}}
body.op-d3 .op-ps-v .shield{fill:none;stroke:var(--accent);stroke-width:4;stroke-dasharray:300;stroke-dashoffset:300}
body.op-d3 .op-ps-v.is-on .shield{animation:opDraw 1.2s forwards}
body.op-d3 .op-ps-v .lock{transform-origin:100px 70px;opacity:0}
body.op-d3 .op-ps-v.is-on .lock{animation:opPop .5s 1s forwards}
@keyframes opDraw{to{stroke-dashoffset:0}}@keyframes opPop{0%{opacity:0;transform:scale(.6)}100%{opacity:1;transform:scale(1)}}
@media (max-width:980px){body.op-d3 .op-ps-wrap{display:flex!important;flex-direction:column;gap:6px;padding-left:0}
body.op-d3 .op-ps{display:flex!important;flex-direction:column}
body.op-d3 .op-ps-d{opacity:1;transform:none;visibility:visible;pointer-events:auto;padding:0 0 10px 52px!important;font-size:15px}body.op-d3 .op-ps-vis{height:200px;align-self:stretch}
body.op-d3 .op-ps-d.is-on::before{display:none}
body.op-d3 .op-ps-vis{min-height:180px;margin:8px 0 0}}
@media (prefers-reduced-motion:reduce){body.op-d3 .op-ps-wrap *{transition:none!important;animation:none!important}body.op-d3 .op-ps-v.is-on .ck b{background:var(--accent);border-color:var(--accent);color:var(--accent-ink)}}
body.op-d3 .op-ps-d p{margin:0!important;padding:0!important}