/* Page styling for /brett/work: Brett's artifact home page (its shell and #m-home rules), plus the employer additions at the bottom. */

:root{box-sizing:border-box;padding-top:env(safe-area-inset-top,0px);padding-bottom:env(safe-area-inset-bottom,0px)}
html{scroll-padding-top:env(safe-area-inset-top,0px)}
body{margin:0;padding:0}
img{max-width:100%}
/* The demos rely on the hidden attribute winning. */
[hidden]:not([hidden=until-found i]){display:none!important}

/* ============ Portfolio shell ============ */
:root{
  --ground:#EBF0EB;
  --paper:#F8FAF7;
  --ink:#14201A;
  --ink-2:#33423A;
  --muted:#5A6A61;
  --rule:#C3D2C6;
  --rule-strong:#93AE9C;
  --accent:#1B5A43;
  --accent-soft:#D6E6DC;
  --accent-ink:#F3FAF6;
  --tick:#B23F33;
  --display:'Archivo','Arial Narrow',system-ui,sans-serif;
  --body:'IBM Plex Sans','Segoe UI',system-ui,-apple-system,sans-serif;
  --mono:'IBM Plex Mono',ui-monospace,'Cascadia Mono',Consolas,monospace;
  --wrap:1180px;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --ground:#0B110E; --paper:#111915; --ink:#E1EAE4; --ink-2:#BCCBC2; --muted:#8C9E94;
    --rule:#223029; --rule-strong:#3A5146; --accent:#62C79F; --accent-soft:#17291F; --accent-ink:#06120D; --tick:#EA7a6c;
    color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --ground:#0B110E; --paper:#111915; --ink:#E1EAE4; --ink-2:#BCCBC2; --muted:#8C9E94;
  --rule:#223029; --rule-strong:#3A5146; --accent:#62C79F; --accent-soft:#17291F; --accent-ink:#06120D; --tick:#EA7a6c;
  color-scheme:dark;
}
html,body{height:100%}
body{background:var(--ground);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.6;-webkit-font-smoothing:antialiased}
body.demo-open{overflow:hidden}
a{color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px}
.wrap{max-width:var(--wrap);margin:0 auto;padding-inline:clamp(16px,4vw,40px)}

/* ============ Home page: mob.* (#m-home) at every width ============ */
body{background:#05060a}
@media (prefers-color-scheme: light){:root:not([data-theme="dark"]) body{background:#f3f2ee}}
:root[data-theme="light"] body{background:#f3f2ee}

/* Mobile home page (phones only; every rule is scoped to #m-home) */
#m-home{--bg:#f3f2ee; --bg2:#e6e4dd; --tx:#0c0e13; --mu:#4a505d; --ln:rgba(12,14,19,.16);
  --fc:#003399;--band:#cfe0ff;--ul:#003399;--focus:#003399;--hl:#cfe0ff; --glow:0;
  --tile:#0a0d14; --mono:'IBM Plex Mono',ui-monospace,'Cascadia Mono',Consolas,monospace; --disp:'Archivo','DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;
  color-scheme:light; background:var(--bg); color:var(--tx);
  font:400 16px/1.5 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif; -webkit-font-smoothing:antialiased;
  position:relative; overflow-x:clip; -webkit-text-size-adjust:100%;}
@media (prefers-color-scheme:dark){
:root:not([data-theme="light"]) #m-home{--bg:#05060a;--bg2:#10131b;--tx:#f1f3f8;--mu:#a3abbb;--ln:rgba(255,255,255,.14);--fc:#7fb0ff;--band:transparent;--ul:#7fb0ff;--focus:#7fb0ff;--glow:1;color-scheme:dark}
:root:not([data-theme="light"]) #m-home .m-scene{--tc:var(--c)}

}
:root[data-theme="dark"] #m-home{--bg:#05060a;--bg2:#10131b;--tx:#f1f3f8;--mu:#a3abbb;--ln:rgba(255,255,255,.14);--fc:#7fb0ff;--band:transparent;--ul:#7fb0ff;--focus:#7fb0ff;--glow:1;color-scheme:dark}
:root[data-theme="dark"] #m-home .m-scene{--tc:var(--c)}
#m-home *,#m-home *::before,#m-home *::after{box-sizing:border-box}
#m-home > :not(main),#m-home > main > *{max-width:560px;margin-left:auto;margin-right:auto}
#m-home .m-main{display:block}
#m-home a,#m-home button{-webkit-tap-highlight-color:transparent}
#m-home :focus-visible{outline:2.5px solid var(--focus);outline-offset:3px;border-radius:10px}
#m-home .m-defs{position:absolute;width:0;height:0;overflow:hidden}
#m-home svg{overflow:visible}
#m-home .m-stage svg,#m-home .m-ring{overflow:hidden}
#m-home .m-top{display:flex;align-items:center;justify-content:space-between;padding:calc(8px + env(safe-area-inset-top)) 16px 4px}
#m-home .m-brand{display:inline-flex;align-items:center;gap:10px;min-height:44px;color:var(--tx);text-decoration:none;font:700 16px var(--disp);font-stretch:95%}
#m-home .m-mono{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;background:#07090e;color:#7fb0ff;font:800 13px var(--disp);box-shadow:0 0 0 1px rgba(255,255,255,.08) inset}
#m-home .m-toplink{min-height:44px;display:inline-flex;align-items:center;padding:0 18px;border-radius:999px;border:1px solid var(--ln);color:var(--tx);text-decoration:none;font:600 14px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif}
#m-home .m-hero{padding:14px 16px 0;position:relative;isolation:isolate}
#m-home .m-hero::before{content:"";position:absolute;z-index:-1;left:0;right:0;top:200px;height:520px;pointer-events:none;background:radial-gradient(40% 40% at 30% 40%,rgba(141,123,255,calc(.14 + var(--glow)*.16)),transparent 70%),radial-gradient(35% 35% at 75% 65%,rgba(95,150,255,calc(.1 + var(--glow)*.08)),transparent 70%)}
html.wk-js #m-home .m-hero::before{animation:m-aur 14s ease-in-out infinite alternate}
#m-home .m-hero:not(.m-live)::before{animation-play-state:paused!important}
@keyframes m-aur{to{transform:translate3d(6%,-4%,0) scale(1.12)}}
#m-home .m-role{font:500 11px/1.7 var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--mu);margin:0}
#m-home .m-role span{display:block}
#m-home .m-h1{word-spacing:.04em;font-family:var(--disp);font-weight:800;font-stretch:76%;font-size:clamp(44px,16.4vw,90px);line-height:.9;letter-spacing:-.028em;margin:12px 0 20px}
#m-home .m-w{display:inline-block;transform-origin:0 70%}
#m-home .m-field{font-style:normal;white-space:nowrap;position:relative;color:var(--fc);isolation:isolate;text-shadow:0 0 calc(var(--glow)*26px) rgba(95,150,255,.45)}
#m-home .m-field::before{content:"";position:absolute;left:-.06em;right:-.06em;top:.2em;bottom:.02em;background:var(--band);z-index:-1;transform-origin:0 50%;border-radius:.06em}
#m-home .m-ul{position:absolute;left:0;bottom:-.17em;width:100%;height:.22em;overflow:visible}
#m-home .m-ul path{fill:none;stroke:var(--ul);stroke-width:5;stroke-linecap:round;vector-effect:non-scaling-stroke}
#m-home.m-enter .m-w{animation:m-word .9s cubic-bezier(.2,.8,.2,1) both;animation-delay:calc(var(--i,0)*65ms + 80ms)}
#m-home.m-enter .m-ul{animation:m-ulwipe 1s cubic-bezier(.6,0,.2,1) 1s both}
@keyframes m-ulwipe{from{clip-path:inset(-60% 100% -60% -2%)}to{clip-path:inset(-60% -2% -60% -2%)}}
#m-home.m-enter .m-field::before{animation:m-band .7s cubic-bezier(.6,0,.2,1) .9s both}
@keyframes m-word{from{opacity:0;transform:translateY(.3em) scaleX(1.5);filter:blur(12px)}}
@keyframes m-draw{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
@keyframes m-band{from{transform:scaleX(0)}}
#m-home .m-stage{position:relative;border-radius:24px;overflow:hidden;isolation:isolate;color:#eef2f8;
  background:radial-gradient(130% 75% at 50% -12%,var(--b1,#10243a) 0%,transparent 72%),var(--b2,#05070b);
  border:1px solid rgba(255,255,255,.09);
  box-shadow:0 28px 60px -34px color-mix(in srgb,var(--c,#7fb0ff) 70%,transparent),0 1px 0 rgba(255,255,255,.06) inset}
#m-home .m-stage::after{content:"";position:absolute;inset:0;pointer-events:none;z-index:3;opacity:.55;
  background:repeating-linear-gradient(0deg,rgba(255,255,255,.028) 0 1px,transparent 1px 3px),
  url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix values='0 0 0 0 1 0 0 0 0 1 0 0 0 0 1 0 0 0 .09 0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E")}
#m-home .m-stage svg{display:block;width:100%;height:auto;position:relative;z-index:1}
#m-home .m-hstage{--b1:#1a2140;--b2:#05060a;--c:#8d7bff}
#m-home .m-lede{font:500 19px/1.35 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;margin:20px 0 12px;max-width:27ch;text-wrap:balance}
#m-home .m-chips{display:flex;flex-wrap:wrap;gap:8px;margin:0}
#m-home .m-chips span{padding:8px 13px;border-radius:999px;border:1px solid var(--ln);font-size:13px;line-height:1.2;color:var(--mu)}
#m-home .m-chips b{color:var(--tx)}
#m-home .m-pb{fill:none;stroke:var(--k);stroke-width:1.4;opacity:.3;stroke-dasharray:100}
#m-home .m-pf{fill:none;stroke:var(--k);stroke-width:2.6;stroke-linecap:round;stroke-dasharray:.4 7.6;opacity:.85}
#m-home .m-pf{animation:m-flow 1.2s linear infinite,m-fi .8s 1.3s both}
#m-home .m-hstage:not(.m-live) .m-pf{animation-play-state:paused}
#m-home.m-enter .m-sl{animation:m-fi .6s .7s both}
@keyframes m-fi{from{opacity:0}}
#m-home .m-pc{fill:none;stroke:var(--k);stroke-width:4.5;stroke-linecap:round;stroke-dasharray:18 82;stroke-dashoffset:18;opacity:0;filter:drop-shadow(0 0 5px var(--k))}
#m-home .m-pc.m-go{animation:m-comet .55s cubic-bezier(.45,0,.55,1) forwards}
@keyframes m-flow{from{stroke-dashoffset:8}to{stroke-dashoffset:0}}
@keyframes m-comet{0%{stroke-dashoffset:18;opacity:1}88%{opacity:1}100%{stroke-dashoffset:-82;opacity:0}}
#m-home .m-src,#m-home .m-halo,#m-home .m-lck,#m-home svg [data-at],#m-home .m-pr,#m-home .m-flagring,#m-home .m-core-h,#m-home .m-env,#m-home .m-scan{transform-box:fill-box;transform-origin:50% 50%}
#m-home .m-sc{fill:#0b0f17;stroke:var(--k);stroke-width:1.6}
#m-home .m-src use{color:var(--k)}
#m-home .m-halo{fill:var(--k);opacity:.22;filter:blur(7px)}
#m-home .m-src.m-go .m-halo{animation:m-halo .9s ease-out}
#m-home .m-src.m-go .m-sc{animation:m-flash2 .9s ease-out}
@keyframes m-halo{0%{opacity:.95;transform:scale(1.1)}100%{opacity:.22;transform:scale(1.6)}}
@keyframes m-flash2{0%{filter:brightness(2.2)}100%{filter:none}}
#m-home.m-enter .m-src{animation:m-popin .7s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(var(--i,0)*90ms + 350ms)}
#m-home.m-enter .m-pb{animation:m-draw 1s ease both;animation-delay:.9s}
@keyframes m-popin{from{opacity:0;transform:scale(.2)}}
#m-home .m-sl{font:600 10px var(--mono);fill:#8f9aad;text-anchor:middle;letter-spacing:.14em}
#m-home .m-lbox{fill:#090d14;stroke:rgba(255,255,255,.13)}
#m-home .m-port{fill:#7fb0ff;filter:drop-shadow(0 0 5px #7fb0ff)}
#m-home .m-lh{font:600 10.5px var(--mono);letter-spacing:.14em;fill:#8f9aad}
#m-home .m-tie{fill:#7fb0ff}
#m-home .m-lrb{fill:rgba(255,255,255,.04)}
#m-home .m-lrk{fill:var(--k);transform-box:fill-box;transform-origin:0 50%}
#m-home .m-lt{font:500 11.5px 'IBM Plex Sans','Segoe UI',system-ui,sans-serif;fill:#e3e9f1;transition:opacity .3s}
#m-home .m-lv{font:600 11px var(--mono);fill:var(--k);transition:opacity .3s}
#m-home .m-lck circle{fill:var(--k)}
#m-home .m-lck path{fill:none;stroke:#05070a;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#m-home .m-lck{transition:opacity .25s,transform .5s cubic-bezier(.3,1.6,.5,1)}
html.wk-js #m-home .m-lrow:not(.m-hit) .m-lv{opacity:0}
html.wk-js #m-home .m-lrow:not(.m-hit) .m-lck{opacity:0;transform:scale(.1)}
html.wk-js #m-home .m-lrow:not(.m-hit) .m-lt{opacity:.62}
#m-home .m-lrow.m-hit .m-lrk{animation:m-wipe 1s cubic-bezier(.6,0,.3,1)}
@keyframes m-wipe{0%{transform:scaleX(1);opacity:1}35%{transform:scaleX(97);opacity:.2}100%{transform:scaleX(1);opacity:1}}
#m-home .m-ltrack{fill:rgba(255,255,255,.08)}
#m-home .m-lfill{fill:#7fb0ff;transform-box:fill-box;transform-origin:0 50%;transition:transform .5s cubic-bezier(.3,1.3,.5,1);filter:drop-shadow(0 0 4px #7fb0ff)}
#m-home .m-closed .m-port{animation:m-ping 1s ease-out 2}
#m-home .m-lglow{fill:none;stroke:#7fb0ff;stroke-width:2;opacity:0;transition:opacity .5s;filter:drop-shadow(0 0 8px #7fb0ff)}
#m-home .m-closed .m-lglow{opacity:1}
#m-home .m-edges .m-pk{fill:none;stroke:#fff;stroke-width:4;stroke-linecap:round;stroke-dasharray:.1 99.9;opacity:0}
#m-home .m-live.m-done .m-pk{opacity:1;animation:m-run 2.8s linear infinite;filter:drop-shadow(0 0 4px #ff9f0a)}
#m-home .m-live.m-done .m-pk2{animation-duration:3.6s;animation-delay:-1.2s;filter:drop-shadow(0 0 4px #bf5af2)}
#m-home .m-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:26px 16px 0}
#m-home .m-stat{background:var(--tile);border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:14px 14px 15px;color:#eef2f8;display:grid;grid-template-columns:46px minmax(0,1fr);column-gap:10px;align-items:center}
#m-home .m-ring{width:46px;height:46px}
#m-home .m-num{font:800 29px/1 var(--disp);font-stretch:74%;letter-spacing:-.01em;font-variant-numeric:tabular-nums;white-space:nowrap}
#m-home .m-num small{font-size:.6em;font-weight:700;margin-left:.08em}
#m-home .m-stat span{grid-column:1/-1;font-size:13px;line-height:1.3;color:#aab3c4;margin-top:11px}
#m-home .m-rt{fill:none;stroke:rgba(255,255,255,.1);stroke-width:5}
#m-home .m-rf{fill:none;stroke:var(--c);stroke-width:5;stroke-dasharray:100;stroke-dashoffset:0;transition:stroke-dashoffset 1.8s cubic-bezier(.3,0,.2,1);filter:drop-shadow(0 0 3px var(--c))}
html.wk-js #m-home .m-stats:not(.m-on) .m-rf{stroke-dashoffset:100}
#m-home .m-rc{fill:none;stroke:var(--tile);stroke-width:7}
#m-home .m-hand{stroke:#fff;stroke-width:2.2;stroke-linecap:round;transform-box:view-box;transform-origin:32px 32px}
#m-home .m-hub{fill:#fff}
#m-home .m-stats.m-live.m-on .m-hand{animation:m-spin 6s linear infinite}
#m-home .m-stats.m-live.m-on .m-clock .m-rf{animation:m-sweep 6s linear infinite}
@keyframes m-spin{to{transform:rotate(360deg)}}
@keyframes m-sweep{from{stroke-dashoffset:100}to{stroke-dashoffset:0}}
#m-home .m-tools{padding-top:56px}
#m-home .m-tools .m-scene:first-of-type{padding-top:128px}
#m-home .m-intro{padding:0 16px}
#m-home .m-kick{font:600 12px var(--mono);letter-spacing:.2em;text-transform:uppercase;color:var(--mu);margin:0 0 10px}
#m-home .m-h2{font:800 clamp(42px,12vw,60px)/.9 var(--disp);font-stretch:76%;letter-spacing:-.028em;margin:0 0 18px}
#m-home .m-h2 span{color:transparent;-webkit-text-stroke:1.4px var(--tx)}
#m-home .m-tag{display:inline-flex;align-items:center;gap:10px;padding:10px 15px;border-radius:999px;background:var(--bg2);font-size:14px;line-height:1.3;margin:0 0 18px}
#m-home .m-tag i{flex:none;width:8px;height:8px;border-radius:50%;background:#1fbf7a;box-shadow:0 0 0 4px rgba(31,191,122,.22)}
#m-home .m-index{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:6px}
#m-home .m-index a{position:relative;min-height:78px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;border-radius:16px;background:var(--tile);color:var(--c);font:700 12px var(--mono);letter-spacing:.08em;text-decoration:none;border:1px solid color-mix(in srgb,var(--c) 34%,transparent);overflow:hidden}
#m-home .m-index a::after{content:"";position:absolute;left:26%;right:26%;bottom:6px;height:2px;border-radius:2px;background:var(--c);box-shadow:0 0 8px var(--c);opacity:.8}
#m-home .m-index .m-ico{--s:34px}
#m-home .m-index b{font-weight:700}
#m-home .m-scene{--tc:var(--ci);position:relative;padding:104px 16px 6px;overflow-x:clip;scroll-margin-top:8px;isolation:isolate}
#m-home .m-scene::before{content:"";position:absolute;left:0;right:0;top:260px;height:640px;z-index:-1;pointer-events:none;background:radial-gradient(60% 50% at 50% 50%,color-mix(in srgb,var(--c) calc(8% + var(--glow)*10%),transparent),transparent 72%)}
#m-home .m-scene:focus{outline:none}
#m-home .m-sh{position:relative}
#m-home .m-big{position:absolute;right:0;top:-114px;font:800 132px/1 var(--disp);font-stretch:116%;letter-spacing:-.05em;color:transparent;background:linear-gradient(180deg,color-mix(in srgb,var(--tc) calc(12% + var(--glow)*10%),transparent) 10%,transparent 80%);-webkit-background-clip:text;background-clip:text;-webkit-text-stroke:1.2px color-mix(in srgb,var(--tc) calc(34% + var(--glow)*16%),transparent);pointer-events:none;user-select:none;z-index:0;transition:opacity .9s ease,transform 1.1s cubic-bezier(.2,.8,.2,1)}
html.wk-js #m-home .m-scene:not(.m-in) .m-big{opacity:0;transform:translateY(46px)}
#m-home .m-sh > :not(.m-big){position:relative;z-index:1}
#m-home .m-ref{display:flex;align-items:center;gap:10px;margin:0;font:700 12.5px var(--mono);letter-spacing:.14em;color:var(--tc)}
#m-home .m-ref span{color:var(--mu);font-weight:500;letter-spacing:.04em}
#m-home .m-name{word-spacing:.04em;font:800 clamp(34px,10vw,48px)/.95 var(--disp);font-stretch:82%;letter-spacing:-.025em;margin:14px 0 10px}
#m-home .m-q{font:400 16.5px/1.42 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--mu);margin:0 0 22px;max-width:33ch}
#m-home .m-prog{position:absolute;left:0;top:0;height:3px;width:100%;background:var(--c);transform-origin:0 50%;transform:scaleX(0);z-index:4;box-shadow:0 0 12px var(--c)}
#m-home .m-cap{font:700 19px/1.25 var(--disp);font-stretch:90%;letter-spacing:-.005em;margin:18px 2px 14px}
#m-home .m-act{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
#m-home .m-act>*{flex:1 1 auto}
#m-home .m-btn{--bc:var(--c,#7fb0ff);display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 20px;border-radius:999px;background:var(--bc);color:#05070a;font:700 16px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;text-decoration:none;border:0;cursor:pointer;box-shadow:0 12px 28px -14px var(--bc)}
#m-home .m-btn svg{width:18px;height:18px;flex:none}
#m-home .m-mbtn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:50px;padding:0 16px;border-radius:999px;border:1px solid var(--ln);background:transparent;color:var(--tx);font:600 15px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;cursor:pointer}
#m-home .m-mbtn::after{content:"+";font:500 20px/1 var(--mono);color:var(--tc);transition:transform .3s}
#m-home .m-mbtn[aria-expanded="true"]::after{transform:rotate(45deg)}
#m-home .m-more{margin:12px 0 0;padding:14px 16px 14px 34px;border-radius:18px;background:var(--bg2);font-size:15px;line-height:1.45}
#m-home .m-more li+li{margin-top:6px}
#m-home .m-more li::marker{color:var(--tc)}
#m-home .m-more[hidden]{display:none}
html.wk-js #m-home [data-at]{transition:opacity .45s ease,transform .7s cubic-bezier(.2,.9,.25,1.12),stroke-dashoffset .9s cubic-bezier(.4,0,.2,1)}
html.wk-js #m-home .m-fade:not(.m-on){opacity:0}
html.wk-js #m-home .m-pop:not(.m-on){opacity:0;transform:scale(.15)}
html.wk-js #m-home .m-up:not(.m-on){opacity:0;transform:translateY(16px)}
html.wk-js #m-home .m-dn:not(.m-on){opacity:0;transform:translateY(-44px) rotate(-8deg)}
html.wk-js #m-home .m-l:not(.m-on){opacity:0;transform:translateX(-36px)}
html.wk-js #m-home .m-r:not(.m-on){opacity:0;transform:translateX(36px)}
html.wk-js #m-home .m-sx:not(.m-on){opacity:0;transform:scaleX(0)}
#m-home .m-sx{transform-origin:0 50%!important}
#m-home .m-draw{stroke-dasharray:100}
html.wk-js #m-home .m-draw:not(.m-on){stroke-dashoffset:100}
html.wk-js #m-home .m-stamp:not(.m-on){opacity:0;transform:scale(2.4) rotate(-12deg)}
#m-home .m-scrub{stroke-dasharray:100}
#m-home .m-t{font-family:var(--mono);font-size:11px;fill:#c9d1dd;letter-spacing:.02em}
#m-home .m-tm{fill:#97a2b5}
#m-home .m-wt{fill:#eef2f8}
#m-home .m-dk{fill:#06080c;font-weight:700}
#m-home .m-b{font-weight:600}
#m-home .m-s{font-family:'IBM Plex Sans','Segoe UI',system-ui,sans-serif;font-size:12px;letter-spacing:0}
#m-home .m-lab{font-size:10.5px;letter-spacing:.12em;font-weight:600}
#m-home .m-big2{font-family:'IBM Plex Sans','Segoe UI',system-ui,sans-serif;font-size:13.5px;letter-spacing:0}
#m-home .m-or{fill:#ffb44a;font-size:12.5px;font-weight:700}
#m-home .m-rd{fill:#ff8aa0}
#m-home .m-rd2{fill:#ff97a3}
#m-home .m-am{fill:#ffc86e}
#m-home .m-gr{fill:#5ef0a8}
#m-home .m-vi{fill:#c9c0ff}
#m-home .m-bl{fill:#86ccf6}
#m-home .m-ob{fill:#8db6ff}
#m-home .m-ot{fill:#ffa566}
#m-home .m-orb circle{fill:none;stroke:rgba(100,210,255,.24);stroke-dasharray:2 5}
#m-home .m-live .m-orb.m-on{animation:m-spin 50s linear infinite}
#m-home .m-edges path{fill:none;stroke:rgba(100,210,255,.4);stroke-width:1.2}
#m-home .m-edges .m-edar{stroke:rgba(255,159,10,.75);stroke-width:2}
#m-home .m-po{fill:#bf5af2;filter:drop-shadow(0 0 6px rgba(191,90,242,.7))}
#m-home .m-ve{fill:#ffd60a;filter:drop-shadow(0 0 6px rgba(255,214,10,.5))}
#m-home .m-ap{fill:#0b1d2a;stroke:#ffd60a;stroke-width:2.4}
#m-home .m-em{fill:#dfe8f2}
#m-home .m-ar{fill:#ff9f0a;filter:drop-shadow(0 0 12px rgba(255,159,10,.65))}
#m-home .m-flagring{fill:none;stroke:#ff453a;stroke-width:2;stroke-dasharray:4 4}
#m-home .m-live .m-flagring{animation:m-ping2 1.8s ease-out infinite}
#m-home .m-flag{fill:#ff453a}
#m-home .m-core{fill:#07324b;stroke:#64d2ff;stroke-width:2}
#m-home .m-core-h{fill:#64d2ff;opacity:.35;filter:blur(9px)}
#m-home .m-live .m-core-h{animation:m-breath 2.6s ease-in-out infinite}
#m-home .m-core-n{font-size:14px;font-weight:700;fill:#fff}
#m-home .m-chip{fill:rgba(100,210,255,.1);stroke:rgba(100,210,255,.55)}
#m-home .m-legend text{font:500 10.5px var(--mono);fill:#97a2b5}
@keyframes m-ping{0%{opacity:.9;transform:scale(1)}100%{opacity:0;transform:scale(2.2)}}
@keyframes m-ping2{0%{opacity:1;transform:scale(1)}100%{opacity:0;transform:scale(1.4)}}
@keyframes m-breath{50%{opacity:.7;transform:scale(1.25)}}
#m-home .m-road{fill:none;stroke:rgba(255,255,255,.07);stroke-width:7;stroke-linecap:round}
#m-home .m-route{fill:none;stroke:#ff4f6d;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
#m-home .m-phline{fill:none;stroke:#b69cff;stroke-width:10;stroke-linecap:round;stroke-linejoin:round;stroke-opacity:.55}
#m-home .m-route-glow{fill:none;stroke:#ff4f6d;stroke-width:9;opacity:.35;filter:blur(4px)}
#m-home .m-car,#m-home .m-flow,#m-home .m-mdot{fill:none;stroke:#fff;stroke-width:5;stroke-linecap:round;stroke-dasharray:.1 99.9;opacity:0}
#m-home .m-live.m-done .m-car{opacity:1;animation:m-run 7s linear infinite;filter:drop-shadow(0 0 5px #ff4f6d)}
@keyframes m-run{from{stroke-dashoffset:0}to{stroke-dashoffset:-100}}
#m-home .m-endp{fill:#fff;stroke:#ff4f6d;stroke-width:2}
#m-home .m-fuelln{stroke:#ffc86e;stroke-width:1.4;stroke-dasharray:3 3;fill:none}
#m-home .m-fuel{fill:#ffc86e}
#m-home .m-pings text{font:700 10.5px var(--mono);text-anchor:middle}
#m-home .m-pg circle{fill:#b69cff;stroke:#fff;stroke-width:1.3}
#m-home .m-pg .m-pr{fill:none;stroke:#34d399;stroke-width:1.5;opacity:0}
#m-home .m-live .m-pg.m-on .m-pr{animation:m-ping 2.4s ease-out infinite}
#m-home .m-pn circle{fill:#b69cff;stroke:#ff8f6b;stroke-width:1.5;stroke-dasharray:2.5 2}
#m-home .m-panel{fill:rgba(255,255,255,.035);stroke:rgba(255,255,255,.09)}
#m-home .m-axis text{font:500 10.5px var(--mono);fill:#97a2b5;text-anchor:middle}
#m-home .m-gl{stroke:rgba(255,255,255,.2);stroke-dasharray:2 3}
#m-home .m-veh{fill:rgba(255,79,109,.16);stroke:#ff4f6d;stroke-width:1.6;stroke-dasharray:4 3}
#m-home .m-pay{fill:#3b82f6;filter:drop-shadow(0 0 7px rgba(59,130,246,.7))}
#m-home .m-prv{fill:#34d399;filter:drop-shadow(0 0 6px rgba(52,211,153,.5))}
#m-home .m-gap{fill:url(#m-hatch);stroke:#f6f0f3;stroke-width:1;stroke-dasharray:3 2}
#m-home .m-barnote{font:700 9.5px var(--mono);letter-spacing:0}
#m-home .m-stampr{fill:rgba(12,40,30,.92);stroke:#34d399;stroke-width:2}
#m-home .m-stampr.m-warn{fill:rgba(46,34,10,.92);stroke:#ffc86e}
#m-home .m-stampt{font-size:12px;font-weight:700;letter-spacing:.1em}
#m-home .m-tray{fill:rgba(162,147,255,.14);stroke:#a293ff;stroke-width:1.6;stroke-linejoin:round}
#m-home .m-tray2{fill:none;stroke:#a293ff;stroke-width:1.6;opacity:.55}
#m-home .m-env rect{fill:#ebe7ff}
#m-home .m-env path{fill:none;stroke:#6d5fd6;stroke-width:1.4}
#m-home .m-live .m-env.e1{animation:m-drop 3.2s cubic-bezier(.5,0,.8,.4) infinite}
#m-home .m-live .m-env.e2{animation:m-drop 3.2s cubic-bezier(.5,0,.8,.4) 1.6s infinite}
@keyframes m-drop{0%{transform:translateY(-30px);opacity:0}15%{opacity:1}45%,80%{transform:none;opacity:1}100%{transform:translateY(8px);opacity:0}}
#m-home .m-nr{fill:rgba(255,200,110,.08);stroke:#ffc86e;stroke-width:1.4;stroke-dasharray:4 3}
#m-home .m-nrl{fill:none;stroke:#ffc86e;stroke-width:1.4;stroke-dasharray:3 3}
#m-home .m-pipe,#m-home .m-bus{fill:none;stroke:rgba(162,147,255,.6);stroke-width:1.8}
#m-home .m-sn{fill:#a293ff;stroke:#d9d2ff;stroke-width:2;filter:drop-shadow(0 0 6px rgba(162,147,255,.8))}
#m-home .m-gate{fill:#ffc86e;stroke:#ffe2ae;filter:drop-shadow(0 0 6px rgba(255,200,110,.7))}
#m-home .m-live.m-done .m-flow{opacity:1;animation:m-run 3.4s linear infinite;filter:drop-shadow(0 0 5px #a293ff)}
#m-home .m-fd{color:#8f82e6}
#m-home .m-fd1{color:#e2dcff;filter:drop-shadow(0 0 7px #a293ff)}
#m-home .m-plus{fill:#a293ff}
#m-home .m-wo{fill:#1a1b21;stroke:rgba(162,147,255,.55)}
#m-home .m-aitag{fill:rgba(162,147,255,.14);stroke:rgba(162,147,255,.5)}
#m-home .m-div{stroke:rgba(255,255,255,.12)}
#m-home .m-conf{fill:#a293ff}
#m-home .m-reader{fill:#0e1620;stroke:#2f8cc4}
#m-home .m-scan{fill:rgba(126,200,244,.28);filter:blur(3px)}
#m-home .m-live .m-scan{animation:m-scan 2.2s ease-in-out infinite alternate}
@keyframes m-scan{to{transform:translateX(272px)}}
#m-home .m-qrow{fill:#0f1720;stroke:#2b3948}
#m-home .m-qready{stroke:#65d59a;fill:#0f2219}
#m-home .m-st{fill:color-mix(in srgb,var(--s) 15%,#0f1720);stroke:var(--s);stroke-width:1.4}
#m-home .m-stt{fill:var(--s);font-weight:700;font-size:11px;letter-spacing:.08em}
#m-home .m-save{fill:rgba(101,213,154,.12);stroke:#65d59a}
#m-home .m-lockc{fill:rgba(255,255,255,.05);stroke:rgba(255,255,255,.16)}
#m-home .m-oc{fill:rgba(91,149,255,.1);stroke:rgba(91,149,255,.5)}
#m-home .m-ok{fill:#5b95ff}
#m-home .m-tc{fill:rgba(255,133,52,.1);stroke:rgba(255,133,52,.5)}
#m-home .m-tk{fill:#ff8534}
#m-home .m-ghost{fill:none;stroke-width:1.2;stroke-dasharray:4 4}
#m-home .m-gt{stroke:rgba(255,133,52,.5)}
#m-home .m-gou{stroke:rgba(91,149,255,.5)}
#m-home .m-match{fill:none;stroke:#34d399;stroke-width:2.2}
#m-home .m-live.m-done .m-mdot{opacity:1;stroke-dasharray:.1 49.9;animation:m-run 2.6s linear infinite;filter:drop-shadow(0 0 4px #34d399)}
#m-home .m-mc{fill:#0b1a18;stroke:#34d399;stroke-width:1.6}
#m-home .m-mck{fill:none;stroke:#34d399;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
#m-home .m-diffl{stroke:#ffc86e;stroke-width:2.2;stroke-dasharray:5 4;fill:none}
#m-home .m-lg1{stroke:#34d399;stroke-width:2.2}
#m-home .m-lg2{stroke:#ffc86e;stroke-width:2.2;stroke-dasharray:5 4}
#m-home .m-how{padding:72px 16px 20px}
#m-home .m-habits{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:10px}
#m-home .m-habits li{background:var(--tile);color:#eef2f8;border:1px solid rgba(255,255,255,.08);border-radius:20px;padding:16px;min-height:150px;display:flex;flex-direction:column;justify-content:space-between;gap:18px;position:relative;overflow:hidden}
#m-home .m-habits li::before{content:"";position:absolute;right:-30px;top:-30px;width:110px;height:110px;border-radius:50%;background:radial-gradient(closest-side,color-mix(in srgb,var(--c) 40%,transparent),transparent);opacity:.7}
#m-home .m-habits svg{width:56px;height:56px;fill:none;stroke:var(--c);stroke-width:2.2;stroke-linecap:round;stroke-linejoin:round;position:relative}
#m-home .m-habits span{font:700 18px/1.12 var(--disp);font-stretch:88%;position:relative}
#m-home .m-hq{font:700 17px var(--mono);fill:var(--c);stroke:none;letter-spacing:-.04em}
#m-home .m-hd{stroke-dasharray:100;transition:stroke-dashoffset 1.1s .35s cubic-bezier(.4,0,.2,1)}
html.wk-js #m-home .m-rv:not(.m-in) .m-hd{stroke-dashoffset:100}
#m-home .m-rv{transition:opacity .7s ease,transform .8s cubic-bezier(.2,.8,.2,1)}
html.wk-js #m-home .m-rv:not(.m-in){opacity:0;transform:translateY(28px)}
#m-home .m-habits li:nth-child(2){transition-delay:.08s}
#m-home .m-habits li:nth-child(3){transition-delay:.16s}
#m-home .m-habits li:nth-child(4){transition-delay:.24s}
#m-home .m-end{padding:40px 16px 12px}
#m-home .m-endcard{position:relative;overflow:hidden;border-radius:28px;padding:28px 20px 22px;color:#f1f3f8;
  background:radial-gradient(90% 55% at 100% 0%,rgba(95,150,255,.24),transparent 62%),radial-gradient(80% 60% at 0% 100%,rgba(162,147,255,.3),transparent 62%),#07090e;border:1px solid rgba(255,255,255,.08)}
#m-home .m-endcard .m-kick{color:#aab3c4}
#m-home .m-endh{font:800 clamp(34px,10vw,48px)/.95 var(--disp);font-stretch:80%;letter-spacing:-.025em;margin:0 0 22px}
#m-home .m-endh em{font-style:normal;color:#7fb0ff;text-shadow:0 0 24px rgba(95,150,255,.4)}
#m-home .m-email{font:600 clamp(17px,5.4vw,22px)/1.3 var(--mono);margin:0 0 16px;overflow-wrap:anywhere;-webkit-user-select:all;user-select:all}
#m-home .m-endbtns{display:flex;gap:10px;flex-wrap:wrap}
#m-home .m-endcard .m-btn{--bc:#7fb0ff}
#m-home .m-endcard .m-ghost{background:transparent;color:#f1f3f8;border:1px solid rgba(255,255,255,.3);box-shadow:none}
#m-home .m-endcard :focus-visible{outline-color:#7fb0ff}
#m-home .m-copied{min-height:22px;margin:12px 0 0;font:600 13px var(--mono);color:#7fb0ff}
#m-home .m-foot{padding:18px 16px calc(36px + env(safe-area-inset-bottom));font-size:13px;line-height:1.5;color:var(--mu)}
#m-home .m-foot p{margin:0 0 8px}
#m-home .m-foot .m-sig{font-weight:600;color:var(--tx)}
#m-home .m-hud{position:fixed;z-index:60;top:calc(10px + env(safe-area-inset-top));left:50%;display:flex;align-items:center;gap:6px;height:50px;padding:0 6px 0 14px;border-radius:999px;
  background:rgba(9,11,16,.96);border:1px solid rgba(255,255,255,.14);color:#f1f3f8;text-decoration:none;
  transform:translate(-50%,-170%);opacity:0;transition:transform .55s cubic-bezier(.2,.9,.2,1.1),opacity .3s;box-shadow:0 14px 32px -14px rgba(0,0,0,.7);max-width:calc(100vw - 24px);margin:0}
#m-home .m-hud.m-show{transform:translate(-50%,0);opacity:1}
#m-home .m-hlink{display:inline-flex;align-items:center;min-height:44px;padding:0 10px 0 2px;color:#f1f3f8;font:600 13px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;text-decoration:none;white-space:nowrap}
#m-home .m-hlink:hover{text-decoration:underline}
#m-home .m-hlink + .m-hall{border-left:1px solid rgba(255,255,255,.18);padding-left:10px}
#m-home .m-hud:not(.m-intool) .m-hgo{display:none}
#m-home .m-hud:not(.m-intool) .m-hlab{width:74px}
#m-home .m-hud:not(.m-intool){padding-right:10px}
#m-home .m-hlive{color:#f1f3f8!important;font:600 13px/20px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif!important;letter-spacing:0!important}
@media (max-width:500px){#m-home .m-hud{gap:2px;padding:0 5px 0 12px}#m-home .m-hud .m-hlab,#m-home .m-hud:not(.m-intool) .m-hlab{width:auto}#m-home .m-hlab b:not(.m-hlive){display:none}#m-home .m-hlive{position:static;opacity:1!important;transform:none!important}#m-home .m-hud:not(.m-intool) .m-hdots{display:none}}
@media (max-width:359px){#m-home .m-hdots{display:none}}
#m-home .m-hdots{display:flex;gap:5px}
#m-home .m-hdots i{width:7px;height:7px;border-radius:50%;background:var(--c);opacity:.3;transition:transform .4s cubic-bezier(.3,1.6,.5,1),opacity .4s}
#m-home .m-hlab{position:relative;width:128px;height:20px;overflow:hidden}
#m-home .m-hlab b{position:absolute;left:0;top:0;white-space:nowrap;font:700 13px/20px var(--mono);color:var(--c);letter-spacing:.06em;opacity:0;transform:translateY(90%);transition:transform .45s cubic-bezier(.2,.9,.2,1),opacity .3s}
#m-home .m-hlab em{font:600 13px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;font-style:normal;color:#f1f3f8;letter-spacing:0;margin-left:3px}
#m-home .m-hall{display:flex;align-items:center;gap:10px;height:46px;padding:0 4px 0 0;background:none;border:0;color:inherit;font:inherit;cursor:pointer}
#m-home .m-hchev{width:8px;height:8px;border:solid #8f9aad;border-width:2px 0 0 2px;transform:translateY(2px) rotate(45deg);margin:0 4px 0 -2px}
#m-home .m-hgo{position:relative;display:inline-flex;align-items:center;gap:4px;height:38px;padding:0 13px;border-radius:999px;background:#f1f3f8;color:#05070a;font:700 13px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;text-decoration:none}
#m-home .m-hgo::after{content:"";position:absolute;inset:-5px -4px}
#m-home .m-hgo svg{width:13px;height:13px}
#m-home .m-hdots i.m-a{opacity:1;transform:scale(1.6)}
#m-home .m-hlab b.m-a{opacity:1;transform:none}
@media (min-width:600px){
#m-home .m-stats{grid-template-columns:repeat(4,1fr)}
#m-home .m-habits{grid-template-columns:repeat(4,1fr)}

}
#m-home .m-ico{--s:34px;flex:none;position:relative;display:inline-grid;place-items:center;width:var(--s);height:var(--s);border-radius:29%;background:var(--g);overflow:hidden;box-shadow:0 8px 18px -8px var(--gc,rgba(0,0,0,.6)),inset 0 1px 0 rgba(255,255,255,.35),inset 0 0 0 1px rgba(255,255,255,.12)}
#m-home .m-ico::after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(255,255,255,.34),rgba(255,255,255,0) 46%);pointer-events:none}
#m-home .m-ico::before{content:"";position:absolute;top:-20%;bottom:-20%;left:0;width:45%;z-index:2;background:linear-gradient(90deg,transparent,rgba(255,255,255,.55),transparent);transform:translateX(-160%) rotate(20deg);pointer-events:none}
#m-home .m-ico svg{width:calc(var(--s) * .64);height:calc(var(--s) * .64);position:relative;z-index:1;filter:drop-shadow(0 1px 1.5px rgba(0,0,0,.25))}
#m-home .m-t-jci{--g:linear-gradient(145deg,#7fe3ff 0%,#2f86e6 50%,#8e44e0 100%);--gc:#2f86e6}
#m-home .m-t-sig{--g:linear-gradient(145deg,#ff6f8f 0%,#d2224f 52%,#6a0c28 100%);--gc:#d2224f}
#m-home .m-t-rac{--g:linear-gradient(145deg,#c2b8ff 0%,#7b6cf2 50%,#3b2fa8 100%);--gc:#7b6cf2}
#m-home .m-t-qbi{--g:linear-gradient(145deg,#9af5c4 0%,#27a86c 52%,#0b4a33 100%);--gc:#27a86c}
#m-home .m-t-rcn{--g:linear-gradient(135deg,#4a8dff 0%,#2563eb 49.5%,#ff8534 50.5%,#e0621a 100%);--gc:#ff8534}
#m-home .m-ref .m-ico{--s:36px}
#m-home .m-scene.m-live .m-ref .m-ico::before{animation:m-shine 5s ease-in-out 1.2s infinite}
@keyframes m-shine{0%{transform:translateX(-160%) rotate(20deg)}28%,100%{transform:translateX(330%) rotate(20deg)}}
#m-home .m-herobtn{--bc:#7fb0ff;margin:18px 0 0;width:100%;justify-content:flex-start;gap:14px;min-height:58px;padding:0 20px 0 12px;font-size:17px}
#m-home .m-stack{display:inline-flex}
#m-home .m-stack .m-ico{--s:30px;margin-right:-9px;border:2px solid #7fb0ff;box-shadow:none}
#m-home .m-stack .m-ico:last-child{margin-right:0}
#m-home .m-herobtn::after{content:"";width:9px;height:9px;margin-left:auto;border:solid currentColor;border-width:2.4px 2.4px 0 0;transform:rotate(45deg)}
#m-home.m-enter .m-herobtn{animation:m-rise .7s cubic-bezier(.2,.9,.2,1) 1.1s both}
#m-home.m-enter .m-herobtn .m-ico{animation:m-popin .55s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(1.25s + var(--n,0) * 70ms)}
#m-home .m-stack .m-ico:nth-child(2){--n:1}
#m-home .m-stack .m-ico:nth-child(3){--n:2}
#m-home .m-stack .m-ico:nth-child(4){--n:3}
#m-home .m-stack .m-ico:nth-child(5){--n:4}
@keyframes m-rise{from{opacity:0;transform:translateY(18px)}}
#m-home .m-net a{cursor:pointer}
#m-home .m-net a:focus{outline:none}
#m-home .m-net a:focus-visible .m-lrb{stroke:#fff;stroke-width:1.6}
#m-home .m-net a:active .m-lrb{fill:rgba(255,255,255,.1)}
#m-home .m-btn{position:relative;overflow:hidden;isolation:isolate}
#m-home .m-btn::before{content:"";position:absolute;top:0;bottom:0;left:0;width:38%;z-index:-1;background:linear-gradient(90deg,transparent,rgba(255,255,255,.6),transparent);transform:translateX(-150%) skewX(-20deg);pointer-events:none}
#m-home .m-scene.m-live .m-btn::before{animation:m-sheen 3.6s ease-in-out 1s infinite}
@keyframes m-sheen{0%{transform:translateX(-150%) skewX(-20deg)}35%,100%{transform:translateX(330%) skewX(-20deg)}}
#m-home .m-btn,#m-home .m-mbtn,#m-home .m-index a,#m-home .m-toplink,#m-home .m-dlist a,#m-home .m-hall,#m-home .m-hgo,#m-home .m-x{transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
#m-home .m-btn:active,#m-home .m-mbtn:active,#m-home .m-index a:active,#m-home .m-toplink:active,#m-home .m-dlist a:active,#m-home .m-hall:active,#m-home .m-hgo:active,#m-home .m-x:active{transform:scale(.96);transition-duration:.08s}
#m-home .m-ct-ics{display:flex;margin:0 0 18px}
#m-home .m-ct-ics .m-ico{--s:36px;margin-right:-7px;border:2px solid #07090e;box-shadow:none}
#m-home .m-sheet{position:fixed;inset:auto 0 0 0;margin:0 auto;width:100%;max-width:560px;max-height:88vh;max-height:88dvh;padding:0;border:0;background:transparent;color:#f1f3f8;overflow:visible}
#m-home .m-sheet::backdrop{background:rgba(4,5,9,.62)}
#m-home .m-sheet-in{background:#0b0e15;border:1px solid rgba(255,255,255,.1);border-bottom:0;border-radius:26px 26px 0 0;padding:10px 14px calc(18px + env(safe-area-inset-bottom));transform:translateY(105%);transition:transform .42s cubic-bezier(.2,.9,.2,1.04);box-shadow:0 -24px 60px -20px rgba(0,0,0,.85);max-height:88dvh;overflow:auto}
#m-home .m-sheet.m-open .m-sheet-in{transform:none}
#m-home .m-grab{display:block;width:40px;height:5px;border-radius:3px;background:rgba(255,255,255,.22);margin:0 auto 10px}
#m-home .m-sheet-hd{display:flex;align-items:center;justify-content:space-between;padding:0 2px 10px}
#m-home .m-sheet-hd h2{font:800 30px/1 var(--disp);font-stretch:78%;letter-spacing:-.02em;margin:0}
#m-home .m-x{width:44px;height:44px;border-radius:50%;border:1px solid rgba(255,255,255,.16);background:transparent;color:#f1f3f8;font-size:17px;cursor:pointer}
#m-home .m-dlist{list-style:none;margin:0;padding:0;display:grid;gap:8px}
#m-home .m-dlist a{display:flex;align-items:center;gap:14px;min-height:68px;padding:10px 14px 10px 10px;border-radius:18px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07);color:#f1f3f8;text-decoration:none}
#m-home .m-dlist .m-ico{--s:46px}
#m-home .m-dlist a > span:not(.m-ico){flex:1;min-width:0}
#m-home .m-dlist b{display:block;font:700 18px/1.15 var(--disp);font-stretch:90%}
#m-home .m-dlist small{display:block;font-size:14px;line-height:1.3;color:#a3abbb;margin-top:2px}
#m-home .m-dlist .m-go{width:20px;height:20px;color:var(--c);flex:none}
#m-home .m-sheet.m-open .m-dlist li{animation:m-rise .5s cubic-bezier(.2,.9,.2,1) both;animation-delay:calc(var(--i,0) * 45ms + 90ms)}
#m-home .m-sheet-note{display:flex;align-items:center;gap:10px;margin:14px 4px 0;font-size:13.5px;color:#a3abbb}
#m-home .m-sheet-note i{flex:none;width:8px;height:8px;border-radius:50%;background:#1fbf7a;box-shadow:0 0 0 4px rgba(31,191,122,.22)}
/* ---------- shared: wide-screen-only parts hidden on phones; the systems strip; the ledger double rule ---------- */
#m-home .m-nav,#m-home .m-navdemo,#m-home .m-fx,#m-home .m-orbit,#m-home .m-cue,#m-home .m-win{display:none}
#m-home .m-hvis,#m-home .m-vis{position:relative}
#m-home .m-ledger{position:relative}
#m-home .m-dbl{position:absolute;left:0;bottom:-.2em;width:calc(100% - .2em);height:.15em;overflow:visible}
#m-home .m-dbl path{fill:none;stroke:var(--ul);stroke-width:3;vector-effect:non-scaling-stroke;stroke-dasharray:100}
html.wk-js #m-home .m-dbl path{animation:m-draw .8s cubic-bezier(.6,0,.2,1) 1.85s both}
#m-home .m-btn{transform:translate(var(--tx,0px),var(--ty,0px))}
#m-home .m-btn:active{transform:translate(var(--tx,0px),var(--ty,0px)) scale(.96)}
#m-home .m-mq{max-width:none;overflow:hidden;padding:24px 0 0;-webkit-mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent);mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)}
#m-home .m-mq-in{display:flex;width:max-content}
html.wk-js #m-home .m-mq-in{animation:m-mq 44s linear infinite}
#m-home .m-mq:not(.m-live) .m-mq-in{animation-play-state:paused}
#m-home .m-mq-set{display:flex;gap:10px;padding-right:10px}
#m-home .m-mq span{display:inline-flex;align-items:center;gap:9px;padding:10px 16px;border-radius:999px;background:var(--tile);border:1px solid rgba(255,255,255,.08);color:#dfe5ee;font:600 14px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;white-space:nowrap}
#m-home .m-mq span i{width:8px;height:8px;border-radius:50%;background:var(--c);box-shadow:0 0 10px var(--c)}
@keyframes m-mq{to{transform:translateX(-50%)}}
#m-home .m-osm{font-size:12px}
#m-home .m-osm a{color:inherit}

/* ---------- résumé: the real page, its app bullets marked in each tool's color ---------- */
#m-home .m-cv{padding:84px 16px 10px}
#m-home .m-cv .m-h2 em{font-style:normal;color:var(--fc);text-shadow:0 0 calc(var(--glow) * 24px) rgba(95,150,255,.4);background:linear-gradient(var(--band),var(--band)) 0 86%/100% 34% no-repeat}
#m-home .m-cvbtns{display:flex;gap:10px;flex-wrap:wrap}
#m-home .m-cv .m-ghost{background:transparent;color:var(--tx);border:1px solid var(--ln);box-shadow:none}
#m-home .m-cvnote{min-height:22px;margin:12px 0 0;font:600 13px var(--mono);color:var(--fc)}
#m-home .m-li{--inbg:var(--bg)}
#m-home .m-endcard .m-li{--inbg:#07090e}
#m-home .m-sig a{color:inherit}
#m-home .m-cv.m-live .m-btn:not(.m-ghost)::before{animation:m-sheen 3.6s ease-in-out 1.6s infinite}
#m-home .m-cvart{position:relative;width:calc(100% - 30px);max-width:400px;margin:40px auto 26px}
#m-home .m-cvart::before{content:"";position:absolute;inset:0;border-radius:6px;background:linear-gradient(160deg,#2a2f3d,#141821);border:1px solid rgba(255,255,255,.1);transform:rotate(4.5deg) translate(6px,4px)}
#m-home .m-paper{position:relative;display:block;aspect-ratio:1040/1346;border-radius:6px;background:#fff;transform:rotate(-2.5deg);transition:transform .8s cubic-bezier(.2,.8,.2,1);box-shadow:0 40px 80px -34px rgba(0,0,0,.75),0 0 90px -40px rgba(162,147,255,.8)}
#m-home .m-paper img{display:block;width:100%;height:100%;border-radius:inherit}
#m-home .m-mark{position:absolute;left:11.2%;width:79%;top:var(--y);height:3.2%;border-radius:2px;background:var(--c);mix-blend-mode:multiply;opacity:.6;transform-origin:0 50%;transition:transform .7s cubic-bezier(.6,0,.2,1);transition-delay:calc(.5s + var(--n) * .3s)}
html.wk-js #m-home .m-cvart:not(.m-in) .m-mark{transform:scaleX(0)}
#m-home .m-leads{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none}
#m-home .m-leads path{fill:none;stroke:var(--c);stroke-width:2;stroke-linecap:round;vector-effect:non-scaling-stroke;stroke-dasharray:100;transition:stroke-dashoffset .5s ease;transition-delay:calc(.95s + var(--n) * .3s)}
html.wk-js #m-home .m-cvart:not(.m-in) .m-leads path{stroke-dashoffset:100}
#m-home .m-tab{--s:34px;position:absolute;left:100%;top:var(--y);transform:translate(-50%,-50%) rotate(var(--r));transition:transform .55s cubic-bezier(.3,1.5,.5,1),opacity .3s;transition-delay:calc(1.2s + var(--n) * .3s)}
html.wk-js #m-home .m-cvart:not(.m-in) .m-tab{opacity:0;transform:translate(-50%,-50%) scale(.2)}
#m-home .m-cvscan{position:absolute;inset:0;overflow:hidden;border-radius:inherit;pointer-events:none}
#m-home .m-cvscan::after{content:"";position:absolute;left:0;right:0;top:-14%;height:14%;background:linear-gradient(180deg,rgba(95,150,255,0),rgba(95,150,255,.25) 78%,rgba(40,90,220,.95) 97%,rgba(95,150,255,0));mix-blend-mode:multiply}
html.wk-js #m-home .m-cv .m-cvscan::after{animation:m-cvscan 6s cubic-bezier(.45,0,.55,1) 2.6s infinite}
#m-home .m-cv:not(.m-live) .m-cvscan::after{animation-play-state:paused}
@keyframes m-cvscan{0%{transform:translateY(0)}55%,100%{transform:translateY(815%)}}
#m-home .m-cvbox{position:fixed;inset:0;width:100%;height:100%;max-width:none;max-height:none;margin:0;padding:0;border:0;background:transparent;overflow:auto;overscroll-behavior:contain;color:#f1f3f8}
#m-home .m-cvbox::backdrop{background:rgba(4,5,9,.84);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}
#m-home .m-cvbar{position:sticky;top:0;z-index:2;display:flex;justify-content:flex-end;align-items:center;gap:10px;padding:12px 14px}
#m-home .m-cvbox .m-btn{--bc:#7fb0ff;min-height:44px;padding:0 18px;font-size:15px}
#m-home .m-cvbox .m-x{background:rgba(11,14,21,.9);flex:none}
#m-home .m-cvpage{display:block;width:calc(100% - 24px);max-width:860px;height:auto;margin:0 auto 48px;border-radius:6px;background:#fff;box-shadow:0 50px 120px -40px rgba(0,0,0,.9);transform-origin:50% 0}
html.wk-js #m-home .m-cvbox[open] .m-cvpage{animation:m-cvin .6s cubic-bezier(.2,.9,.2,1) both}
@keyframes m-cvin{from{opacity:0;transform:perspective(1600px) rotateY(-16deg) rotateX(8deg) translateY(40px) scale(.86)}}

/* ---------- tablets: a wider single column ---------- */
@media (min-width:761px){
  #m-home > :not(main),#m-home > main > *{max-width:680px}
}

/* ---------- desktop: the same system, staged for a big screen ---------- */
@media (min-width:1000px){
  #m-home{--pad:clamp(32px,4.4vw,76px)}
  #m-home > :not(main),#m-home > main > *{max-width:1360px}
  #m-home .m-top,#m-home .m-hero,#m-home .m-stats,#m-home .m-intro,#m-home .m-scene,#m-home .m-how,#m-home .m-end,#m-home .m-foot{padding-left:var(--pad);padding-right:var(--pad)}

  /* top bar */
  #m-home .m-top{position:relative;z-index:6;gap:14px;padding-top:22px}
  #m-home .m-brand{font-size:18px}
  #m-home .m-mono{width:40px;height:40px;border-radius:12px;font-size:15px}
  #m-home .m-nav{display:flex;gap:2px;margin-left:auto}
  #m-home .m-nav a{min-height:44px;display:inline-flex;align-items:center;padding:0 16px;border-radius:999px;color:var(--mu);text-decoration:none;font:600 15px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;transition:color .2s,background .2s}
  #m-home .m-nav a:hover{color:var(--tx);background:var(--bg2)}
  #m-home .m-navdemo{display:inline-flex;align-items:center;gap:10px;min-height:46px;padding:0 22px 0 16px;border-radius:999px;border:0;background:#7fb0ff;color:#05070a;font:700 15px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;cursor:pointer;box-shadow:0 12px 34px -14px #7fb0ff;transform:translate(var(--tx,0px),var(--ty,0px));transition:transform .3s cubic-bezier(.34,1.56,.64,1)}
  #m-home .m-navdemo i{width:8px;height:8px;border-radius:50%;background:#05070a;box-shadow:0 0 0 4px rgba(5,7,10,.16)}
  html.wk-js #m-home .m-navdemo i{animation:m-pulse 1.8s ease-in-out infinite}
  @keyframes m-pulse{50%{transform:scale(.55)}}
  #m-home .m-toplink{display:none}

  /* hero: headline left, the field-to-ledger stage right, all of it alive */
  #m-home .m-hero{container-type:inline-size;max-width:1580px;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);grid-template-areas:". vis" "role vis" "h1 vis" "lede vis" "chips vis" "btn vis" "tour vis" ". vis";grid-template-rows:1fr auto auto auto auto auto auto 1fr;column-gap:clamp(40px,5vw,100px);min-height:max(680px,calc(100vh - 88px));min-height:max(680px,calc(100svh - 88px));padding-top:0;padding-bottom:84px}
  #m-home .m-hero::before{top:4%;height:92%;left:38%;right:-12%}
  #m-home .m-role{grid-area:role;font-size:12.5px}
  #m-home .m-h1{grid-area:h1;font-size:clamp(76px,8.7cqi,150px);margin:18px 0 34px}
  #m-home .m-lede{grid-area:lede;font-size:clamp(20px,1.55vw,25px);max-width:34ch;margin:0 0 20px}
  #m-home .m-chips{grid-area:chips}
  #m-home .m-herobtn{grid-area:btn;width:auto;justify-self:start;margin-top:28px;padding-right:30px}
  #m-home .m-hvis{grid-area:vis;align-self:center;justify-self:end;width:100%;max-width:640px;margin-right:clamp(20px,3.6vw,60px);perspective:1500px}
  #m-home .m-hstage{transform:rotateY(calc(var(--nx,0) * 13deg)) rotateX(calc(var(--ny,0) * -10deg));transition:transform .6s cubic-bezier(.2,.8,.2,1);box-shadow:0 70px 130px -60px rgba(141,123,255,.6),0 30px 60px -30px rgba(0,0,0,.6),0 1px 0 rgba(255,255,255,.06) inset}
  #m-home .m-orbit{display:block;position:absolute;z-index:3;border-radius:30%;transform:translate3d(calc(var(--nx,0) * var(--d) * 36px),calc(var(--ny,0) * var(--d) * 28px),0);transition:transform .7s cubic-bezier(.2,.8,.2,1)}
  #m-home.m-enter .m-orbit{animation:m-orbin .8s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(1.5s + var(--k) * .1s)}
  @keyframes m-orbin{from{opacity:0;scale:.2}}
  #m-home .m-orbit .m-ico{--s:clamp(56px,4.8vw,76px);box-shadow:0 24px 46px -14px var(--gc),inset 0 1px 0 rgba(255,255,255,.4)}
  html.wk-js #m-home .m-orbit .m-ico{animation:m-bob 5.6s ease-in-out infinite;animation-delay:calc(var(--k) * -1.1s)}
  #m-home .m-hero:not(.m-live) .m-orbit .m-ico,#m-home .m-hero:not(.m-live) .m-floor i{animation-play-state:paused}
  #m-home .m-orbit .m-ico::before{animation:m-shine 6s ease-in-out infinite;animation-delay:calc(2.4s + var(--k) * .5s)}
  #m-home .m-orbit:hover .m-ico{filter:brightness(1.15) saturate(1.1)}
  @keyframes m-bob{0%,100%{transform:translateY(0) rotate(var(--r))}50%{transform:translateY(-16px) rotate(calc(var(--r) * -.6))}}
  #m-home .m-o1{--d:1.2;--k:0;--r:-8deg;left:-9%;top:-8%}
  #m-home .m-o2{--d:.8;--k:1;--r:7deg;right:-10%;top:-8%}
  #m-home .m-o3{--d:1.4;--k:2;--r:-5deg;right:-14%;top:27%}
  #m-home .m-o4{--d:1;--k:3;--r:9deg;right:-11%;bottom:-10%}
  #m-home .m-o5{--d:1.3;--k:4;--r:-11deg;left:-9%;bottom:-12%}
  #m-home .m-fx{display:block;position:absolute;z-index:-2;top:-110px;bottom:0;left:50%;width:100vw;transform:translateX(-50%);overflow:hidden;pointer-events:none}
  #m-home .m-floor{position:absolute;left:-40%;right:-40%;bottom:-2%;height:78%;overflow:hidden;transform:perspective(760px) rotateX(58deg);transform-origin:50% 100%;-webkit-mask-image:linear-gradient(to top,#000 20%,transparent 92%);mask-image:linear-gradient(to top,#000 20%,transparent 92%);opacity:calc(.55 + var(--glow) * .35)}
  #m-home .m-floor i{position:absolute;inset:-80px 0 0;background-image:linear-gradient(color-mix(in srgb,#8d7bff 62%,transparent) 1.5px,transparent 1.5px),linear-gradient(90deg,color-mix(in srgb,#8d7bff 62%,transparent) 1.5px,transparent 1.5px);background-size:80px 80px}
  html.wk-js #m-home .m-floor i{animation:m-floor 3.4s linear infinite}
  @keyframes m-floor{to{transform:translateY(80px)}}
  #m-home .m-spot{position:absolute;inset:0;background:radial-gradient(560px circle at var(--mx,72%) var(--my,46%),rgba(95,150,255,calc(.06 + var(--glow) * .06)),transparent 62%)}
  #m-home .m-cue{display:block;position:absolute;left:50%;bottom:22px;width:28px;height:44px;margin-left:-14px;border:2px solid color-mix(in srgb,var(--tx) 38%,transparent);border-radius:16px}
  #m-home .m-cue i{position:absolute;left:50%;top:9px;width:4px;height:8px;margin-left:-2px;border-radius:2px;background:var(--tx)}
  html.wk-js #m-home .m-cue i{animation:m-cue 1.8s ease-in-out infinite}
  /* On laptop heights the next section already peeks in, and the cue would sit on an orbit icon. */
  @media (max-height:949px){#m-home .m-cue{display:none}}
  @keyframes m-cue{0%{transform:translateY(0);opacity:1}70%{transform:translateY(15px);opacity:0}100%{opacity:0}}

  @media (max-width:1180px){#m-home .m-o3{right:-9%}#m-home .m-o2{right:-6%}}
  @media (min-width:1760px){#m-home .m-o1{left:-12%;top:-11%}}
  /* numbers */
  #m-home .m-stats{gap:16px;padding-top:10px}
  #m-home .m-stat{grid-template-columns:68px minmax(0,1fr);column-gap:16px;padding:24px 24px 26px;border-radius:26px;transition:transform .4s cubic-bezier(.2,.8,.2,1),border-color .3s}
  #m-home .m-stat:hover{transform:translateY(-6px);border-color:color-mix(in srgb,var(--c) 55%,transparent)}
  #m-home .m-ring{width:68px;height:68px}
  #m-home .m-num{font-size:clamp(42px,3.8vw,60px)}
  #m-home .m-stat span{font-size:15px;margin-top:16px}
  #m-home .m-mq{padding-top:34px}
  #m-home .m-mq span{padding:12px 20px;font-size:15px}

  /* tools intro */
  #m-home .m-tools{padding-top:130px}
  #m-home .m-intro{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.95fr);grid-template-areas:"kick kick" "h2 tag" "h2 idx";column-gap:64px;align-items:end}
  #m-home .m-intro .m-kick{grid-area:kick}
  #m-home .m-intro .m-h2{grid-area:h2;font-size:clamp(66px,7.2vw,128px);margin:0}
  #m-home .m-intro .m-tag{grid-area:tag;justify-self:start}
  #m-home .m-index{grid-area:idx;gap:10px}
  #m-home .m-index a{min-height:104px;border-radius:22px;transition:transform .4s cubic-bezier(.34,1.56,.64,1),border-color .3s}
  #m-home .m-index a:hover{transform:translateY(-7px);border-color:var(--c)}
  #m-home .m-index .m-ico{--s:48px}

  /* tool chapters: copy on one side, a layered visual on the other, alternating */
  #m-home .m-scene{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);grid-template-areas:". vis" "sh vis" "cap vis" "act vis" "more vis" ". vis";grid-template-rows:1fr auto auto auto auto 1fr;column-gap:clamp(40px,6vw,120px);padding-top:clamp(170px,15vw,230px);padding-bottom:20px}
  #m-home .m-tools .m-scene:first-of-type{padding-top:clamp(190px,17vw,260px)}
  #m-home .m-scene:nth-of-type(even){grid-template-columns:minmax(0,1.14fr) minmax(0,.86fr);grid-template-areas:"vis ." "vis sh" "vis cap" "vis act" "vis more" "vis ."}
  #m-home .m-scene .m-sh{grid-area:sh}
  #m-home .m-scene .m-vis{grid-area:vis}
  #m-home .m-scene .m-cap{grid-area:cap;font-size:clamp(22px,1.9vw,30px);margin:4px 0 24px;max-width:22ch}
  #m-home .m-scene .m-act{grid-area:act}
  #m-home .m-scene .m-act > *{flex:0 0 auto}
  #m-home .m-scene .m-more{grid-area:more;align-self:start;max-width:46ch;margin-top:14px}
  #m-home .m-scene::before{top:10%;height:90%}
  #m-home .m-big{font-size:clamp(170px,17vw,290px);top:-.9em;right:auto;left:-.05em}
  #m-home .m-ref .m-ico{--s:46px}
  #m-home .m-ref{font-size:14px}
  #m-home .m-name{font-size:clamp(50px,4.9vw,86px);margin:18px 0 14px}
  #m-home .m-q{font-size:clamp(17px,1.3vw,21px);max-width:32ch;margin-bottom:26px}
  #m-home .m-vis{padding-top:clamp(120px,12vw,190px)}
  #m-home .m-vis .m-stage{width:68%;z-index:2;transform:translate3d(0,calc((.5 - var(--p,.5)) * 70px),0);box-shadow:0 60px 110px -50px color-mix(in srgb,var(--c) 75%,transparent),0 30px 60px -30px rgba(0,0,0,.75)}
  #m-home .m-scene:nth-of-type(even) .m-vis .m-stage{margin-left:auto}
  #m-home .m-win{display:block;position:absolute;z-index:1;top:0;right:0;width:86%;border-radius:14px;overflow:hidden;background:#0b0b0e;border:1px solid rgba(255,255,255,.14);color:#9a9ba3;text-decoration:none;box-shadow:0 60px 110px -50px rgba(0,0,0,.8),0 0 60px -30px color-mix(in srgb,var(--c) 60%,transparent);transform-origin:100% 0;transform:perspective(1900px) rotateY(-17deg) rotateX(7deg) rotateZ(1deg) translate3d(0,calc((var(--p,.5) - .5) * -100px),0);transition:transform .8s cubic-bezier(.2,.8,.2,1)}
  #m-home .m-scene:nth-of-type(even) .m-win{right:auto;left:0;transform-origin:0 0;transform:perspective(1900px) rotateY(17deg) rotateX(7deg) rotateZ(-1deg) translate3d(0,calc((var(--p,.5) - .5) * -100px),0)}
  #m-home .m-win:hover,#m-home .m-win:focus-visible{transform:perspective(1900px) rotateY(-5deg) rotateX(2deg) translate3d(0,-10px,0)}
  #m-home .m-scene:nth-of-type(even) .m-win:hover,#m-home .m-scene:nth-of-type(even) .m-win:focus-visible{transform:perspective(1900px) rotateY(5deg) rotateX(2deg) translate3d(0,-10px,0)}
  #m-home .m-winbar{display:flex;align-items:center;gap:7px;padding:9px 12px;background:#1a1b1f;border-bottom:1px solid #2a2b30;font:500 11.5px var(--mono)}
  #m-home .m-winbar i{width:10px;height:10px;border-radius:50%;background:#3a3b41}
  #m-home .m-winbar b{font-weight:500;margin-left:8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  #m-home .m-win svg{display:block;width:100%;height:auto;overflow:hidden}
  #m-home .m-wintag{position:absolute;left:14px;bottom:12px;display:inline-flex;align-items:center;padding:7px 14px;border-radius:999px;background:rgba(0,0,0,.7);border:1px solid rgba(255,255,255,.24);color:#fff;font:700 13px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;font-style:normal;opacity:.85;transition:opacity .3s,background .3s}
  #m-home .m-scene:nth-of-type(odd) .m-wintag{left:auto;right:14px}
  #m-home .m-win:hover .m-wintag{opacity:1;background:var(--c);color:#05070a;border-color:transparent}

  /* how I build */
  #m-home .m-how{padding-top:180px}
  #m-home .m-how .m-h2{font-size:clamp(58px,6.2vw,108px);margin-bottom:36px}
  #m-home .m-habits{gap:16px}
  #m-home .m-habits li{min-height:250px;padding:26px;border-radius:28px;transition:opacity .7s ease,transform .45s cubic-bezier(.2,.8,.2,1),border-color .3s}
  #m-home .m-habits li:hover{transform:translateY(-8px) rotate(-.6deg);border-color:color-mix(in srgb,var(--c) 55%,transparent)}
  #m-home .m-habits svg{width:76px;height:76px}
  #m-home .m-habits span{font-size:clamp(22px,1.9vw,27px)}

  /* résumé */
  #m-home .m-cv{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:clamp(40px,6vw,120px);align-items:center;padding:170px var(--pad) 0}
  #m-home .m-cv .m-h2{font-size:clamp(58px,6.2vw,108px);margin-bottom:34px}
  #m-home .m-cvart{justify-self:center;width:min(100% - 40px,470px);max-width:none;margin:0;perspective:1600px}
  #m-home .m-cvart::before{transform:rotateY(-18deg) rotateX(8deg) rotateZ(6deg) translate(18px,10px)}
  #m-home .m-paper{transform:rotateY(-18deg) rotateX(8deg) rotateZ(2deg)}
  #m-home .m-paper:hover{transform:rotateY(-5deg) rotateX(2deg) rotateZ(0deg) translateY(-10px)}
  #m-home .m-tab{--s:48px}

  /* contact */
  #m-home .m-end{padding-top:160px;padding-bottom:40px}
  #m-home .m-endcard{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);grid-template-areas:"ics ics" "kick kick" "h mail" "h btns" "h note";column-gap:72px;align-items:end;padding:64px 64px 52px;border-radius:44px}
  #m-home .m-ct-ics{grid-area:ics;margin-bottom:26px}
  #m-home .m-ct-ics .m-ico{--s:56px;margin-right:-11px}
  #m-home .m-endcard .m-kick{grid-area:kick}
  #m-home .m-endh{grid-area:h;font-size:clamp(52px,5.4vw,100px);margin:0}
  #m-home .m-email{grid-area:mail;font-size:clamp(20px,1.7vw,27px);margin:0 0 18px}
  #m-home .m-endbtns{grid-area:btns}
  #m-home .m-copied{grid-area:note}
  #m-home .m-foot{display:flex;justify-content:space-between;align-items:end;gap:40px;flex-wrap:wrap;padding-top:34px}
  #m-home .m-foot p{max-width:74ch}

  /* the live-demos sheet becomes a centered panel */
  #m-home .m-sheet{inset:0;margin:auto;height:fit-content;max-width:580px}
  #m-home .m-sheet-in{border-radius:30px;border-bottom:1px solid rgba(255,255,255,.1);padding:22px 20px 22px;transform:translateY(24px) scale(.96);opacity:0;transition:transform .4s cubic-bezier(.2,.9,.2,1.04),opacity .25s}
  #m-home .m-sheet.m-open .m-sheet-in{transform:none;opacity:1}
  #m-home .m-grab{display:none}
  #m-home .m-dlist a:hover{background:rgba(255,255,255,.08);border-color:color-mix(in srgb,var(--c) 45%,transparent)}
}
@media (prefers-reduced-motion:reduce){
#m-home *,#m-home *::before,#m-home *::after{animation:none!important;transition:none!important}
#m-home .m-rv,#m-home [data-at],#m-home .m-lck{opacity:1!important;transform:none!important}
#m-home [data-at],#m-home .m-scrub,#m-home .m-rf,#m-home .m-hd,#m-home .m-pb{stroke-dashoffset:0!important}
#m-home .m-lv,#m-home .m-lt{opacity:1!important}
#m-home .m-big{opacity:1!important;transform:none!important}
#m-home .m-pc,#m-home .m-car,#m-home .m-flow,#m-home .m-mdot,#m-home .m-edges .m-pk{display:none}
#m-home .m-hstage,#m-home .m-orbit,#m-home .m-vis .m-stage{transform:none!important}
#m-home .m-mark,#m-home .m-tab{opacity:1!important}
#m-home .m-mark{transform:none!important}
#m-home .m-tab{transform:translate(-50%,-50%) rotate(var(--r))!important}
#m-home .m-leads path{stroke-dashoffset:0!important}
#m-home .m-cvscan{display:none}
#m-home .m-mq-set:nth-child(2){display:none}
#m-home .m-mq-set{flex-wrap:wrap;justify-content:center;padding:0 16px}
#m-home .m-mq-in{width:auto}
#m-home .m-sheet-in{transform:none!important}
#m-home .m-ico::before,#m-home .m-btn::before{display:none}

}
#m-home .m-lk{color:#65d59a}

/* ---------- ?safe=1 and ?plain=1: the reduced-motion final state, no animation at all ---------- */
html[data-still] #m-home *,html[data-still] #m-home *::before,html[data-still] #m-home *::after{animation:none!important;transition:none!important}
html[data-still] #m-home *,html[data-still] #m-home *::before,html[data-still] #m-home *::after{animation:none!important;transition:none!important}
html[data-still] #m-home .m-rv,html[data-still] #m-home [data-at],html[data-still] #m-home .m-lck{opacity:1!important;transform:none!important}
html[data-still] #m-home [data-at],html[data-still] #m-home .m-scrub,html[data-still] #m-home .m-rf,html[data-still] #m-home .m-hd,html[data-still] #m-home .m-pb{stroke-dashoffset:0!important}
html[data-still] #m-home .m-lv,html[data-still] #m-home .m-lt{opacity:1!important}
html[data-still] #m-home .m-big{opacity:1!important;transform:none!important}
html[data-still] #m-home .m-pc,html[data-still] #m-home .m-car,html[data-still] #m-home .m-flow,html[data-still] #m-home .m-mdot,html[data-still] #m-home .m-edges .m-pk{display:none}
html[data-still] #m-home .m-hstage,html[data-still] #m-home .m-orbit,html[data-still] #m-home .m-vis .m-stage{transform:none!important}
html[data-still] #m-home .m-mark,html[data-still] #m-home .m-tab{opacity:1!important}
html[data-still] #m-home .m-mark{transform:none!important}
html[data-still] #m-home .m-tab{transform:translate(-50%,-50%) rotate(var(--r))!important}
html[data-still] #m-home .m-leads path{stroke-dashoffset:0!important}
html[data-still] #m-home .m-cvscan{display:none}
html[data-still] #m-home .m-mq-set:nth-child(2){display:none}
html[data-still] #m-home .m-mq-set{flex-wrap:wrap;justify-content:center;padding:0 16px}
html[data-still] #m-home .m-mq-in{width:auto}
html[data-still] #m-home .m-sheet-in{transform:none!important}
html[data-still] #m-home .m-ico::before,html[data-still] #m-home .m-btn::before{display:none}

/* EMPLOYER ADDITIONS */
/* First-visit build. preflight.js adds these only when the swarm will run. Clip-path keeps layout; the text stays in the DOM. */
html.wk-building [data-b]{clip-path:inset(0 100% 100% 0)}

/* The navy cover: same pieces and geometry as the swarm's first canvas frame (ring r=54 centered at min(40vh,360px), the 68px BS mark, the name 86px below center). */
html.wk-cover{background:#071123}
html.wk-parse{overflow-y:scroll}
html.wk-parse #portfolio{display:none}
/* First build only: everything below the first screen waits for the end of the show (js/work/page.js, FAR). Sizes are measured, so the page length stays close. */
html.wk-far :where(#wk-about,.m-mq,.m-intro,.m-scene,#wk-proof,#wk-tieout,#wk-how,#wk-resume,#wk-syspace,#wk-contact,.m-foot){content-visibility:auto;contain-intrinsic-size:auto 800px}
/* Content heights measured at 1280 and 375 wide; padding stays real. */
html.wk-far #wk-proof{contain-intrinsic-size:auto 560px}html.wk-far .m-mq{contain-intrinsic-size:auto 46px}html.wk-far .m-intro{contain-intrinsic-size:auto 208px}html.wk-far .m-scene{contain-intrinsic-size:auto 634px}html.wk-far #wk-tieout{contain-intrinsic-size:auto 652px}html.wk-far #wk-how{contain-intrinsic-size:auto 473px}html.wk-far #wk-resume{contain-intrinsic-size:auto 1360px}html.wk-far #wk-syspace{contain-intrinsic-size:auto 807px}html.wk-far #wk-contact{contain-intrinsic-size:auto 883px}html.wk-far .m-foot{contain-intrinsic-size:auto 128px}
@media (max-width:700px){html.wk-far #wk-proof{contain-intrinsic-size:auto 823px}html.wk-far .m-mq{contain-intrinsic-size:auto 40px}html.wk-far .m-intro{contain-intrinsic-size:auto 322px}html.wk-far .m-scene{contain-intrinsic-size:auto 700px}html.wk-far #wk-tieout{contain-intrinsic-size:auto 773px}html.wk-far #wk-how{contain-intrinsic-size:auto 967px}html.wk-far #wk-resume{contain-intrinsic-size:auto 1205px}html.wk-far #wk-syspace{contain-intrinsic-size:auto 1322px}html.wk-far #wk-contact{contain-intrinsic-size:auto 1143px}html.wk-far .m-foot{contain-intrinsic-size:auto 262px}}
html.wk-far:not(.wk-far-go) :where(.m-intro,.m-scene,#wk-tieout,#wk-how,#wk-resume,#wk-syspace,#wk-contact,.m-foot){content-visibility:hidden}
@media print{html.wk-far :is(#wk-about,.m-mq,.m-intro,.m-scene,#wk-proof,#wk-tieout,#wk-how,#wk-resume,#wk-syspace,#wk-contact,.m-foot){content-visibility:visible}}
html.wk-cover::before{content:"";position:fixed;inset:0;z-index:1150;background-color:#071123;background-image:linear-gradient(rgba(66,133,220,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(66,133,220,.08) 1px,transparent 1px);background-size:28px 28px;pointer-events:none}
html.wk-cover::after{content:"Brett Sybert";position:fixed;z-index:1151;left:0;width:100%;top:min(40vh,360px);transform:translateY(-54px);box-sizing:border-box;height:150px;padding-top:116px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 68 68'%3E%3Crect width='68' height='68' rx='18' fill='%23003399'/%3E%3Ctext x='34' y='44' text-anchor='middle' font-family='Arial,sans-serif' font-weight='800' font-size='28' fill='%23ffffff'%3EBS%3C/text%3E%3C/svg%3E"),radial-gradient(circle at 50% 54px,transparent 52.5px,#5686ff 53px,#5686ff 54px,transparent 54.5px);
  background-size:68px 68px,100% 110px;background-position:center 20px,center top;background-repeat:no-repeat;color:#fff;text-align:center;font:bold 23px/28px Verdana,Arial,sans-serif;pointer-events:none}
html.wk-cover[data-wk-prepared]::after{content:"Brett Sybert\A" attr(data-wk-prepared);white-space:pre}
@media (prefers-reduced-motion:reduce){html.wk-cover::before,html.wk-cover::after{display:none}}

/* Markup that says "needs JavaScript", or only makes sense with it. */
html.wk-js .wk-nojs{display:none!important}
html:not(.wk-js) .wk-jsonly{display:none!important}
/* The run buttons exist only when there is a swarm to run and the visit may animate. */
html:not([data-wk-swarm]) [data-swarm-mode],html[data-still] [data-swarm-mode]{display:none!important}

/* Preview builds only: make-work --release refuses while any of these is on the page. */
.wk-placeholder{box-sizing:border-box;width:calc(100% - 32px);max-width:1120px;margin:16px auto;padding:22px 24px;border:2px dashed currentColor;border-radius:14px;opacity:.72;font:500 14px/1.45 'IBM Plex Mono',ui-monospace,Consolas,monospace}
.wk-placeholder p{margin:0}
.wk-placeholder-detail{margin-top:6px!important;opacity:.8;overflow-wrap:anywhere}

#m-home section:focus,#m-home section:focus-visible{outline:none}
#m-home .wk-plainback{display:none}

/* ---------- hero ---------- */
#m-home .wk-answer-core{min-width:0}
#m-home .wk-prepared{display:inline-flex;align-items:center;margin:0 0 12px;padding:6px 13px;border-radius:999px;background:var(--tile);color:#7fb0ff;font:600 12.5px/1.2 var(--mono);letter-spacing:.04em;max-width:100%;overflow-wrap:anywhere}
#m-home .m-role span{display:block}
#m-home .m-h1{font-size:clamp(46px,16.2vw,90px);margin:12px 0 18px;min-width:0}
#m-home .wk-h1a{display:block;white-space:nowrap}
#m-home .wk-h1a{font-size:.62em;line-height:1.02;margin-bottom:.16em}
#m-home .m-field{display:block;line-height:.98;color:var(--tx);text-shadow:none;isolation:auto}
#m-home .m-field::before{display:none}
#m-home .wk-claim-a{display:block}
#m-home .wk-lime{display:inline-block;position:relative;isolation:isolate;color:var(--fc);text-shadow:0 0 calc(var(--glow)*26px) rgba(95,150,255,.45);padding:0 .05em}
#m-home .wk-lime::before{content:"";position:absolute;left:-.05em;right:-.05em;top:.08em;bottom:.02em;background:var(--band);z-index:-1;transform-origin:0 50%;border-radius:.06em}
#m-home.m-enter .wk-lime::before{animation:m-band .7s cubic-bezier(.6,0,.2,1) .9s both}
#m-home .wk-creds{margin:0 0 12px;max-width:62ch;font:600 13.5px/1.42 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--tx);text-wrap:pretty}
#m-home .m-h1{margin-bottom:.34em}
#m-home .wk-hero-after{display:none}
#m-home .m-ul{bottom:-.26em}
#m-home .m-lede{font:500 17px/1.38 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;margin:22px 0 12px;max-width:44ch;text-wrap:pretty}
#m-home .m-lede p{margin:0}
#m-home .wk-rest{display:none;margin-top:8px!important;font-size:.84em;font-weight:400;line-height:1.45;color:var(--mu)}
@media (min-width:560px){#m-home .wk-rest{display:block}}
#m-home .wk-cta2{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0 0}
#m-home .wk-cta2 .m-btn{flex:1 1 auto;min-height:48px;padding:0 12px;font-size:14px;white-space:nowrap}
#m-home .wk-cta2 .m-btn svg{width:16px;height:16px}
@media (max-width:999px){
  #m-home .m-herobtn{gap:10px;padding:0 14px 0 10px;font-size:16px;white-space:nowrap}
  #m-home .m-stack .m-ico{--s:26px;margin-right:-10px}
}
@media (max-width:359px){
  #m-home .m-herobtn{font-size:15px;gap:8px}
  #m-home .m-stack .m-ico{--s:22px;margin-right:-8px}
}
#m-home .wk-cta2 .m-ghost{background:transparent;color:var(--tx);border:1px solid var(--ln);box-shadow:none}
#m-home .wk-watch-wide{display:inline-flex;align-items:center}
#m-home .wk-watch-wide .wk-watch{font-size:13px;margin-left:6px}
#m-home .wk-watch{display:inline-flex;align-items:center;gap:9px;min-height:44px;margin:0 0 0 8px;padding:0;border:0;background:none;color:var(--tx);font:600 14.5px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;cursor:pointer;text-decoration:underline;text-decoration-color:var(--ln);text-underline-offset:4px}
#m-home .wk-watch:hover{text-decoration-color:currentColor}
#m-home .wk-watch i{width:0;height:0;border-left:8px solid currentColor;border-top:5px solid transparent;border-bottom:5px solid transparent}
#m-home .wk-proofhd .wk-lens{margin-top:18px}
#m-home .wk-lens{border:0;margin:8px 0 0;padding:0;min-width:0;max-width:100%}
#m-home .wk-lens legend{padding:0;margin:0 0 6px;font:500 11px var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--mu)}
#m-home .wk-lensrow{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;margin:0 -16px;padding:2px 16px}
#m-home .wk-lensrow::-webkit-scrollbar{display:none}
#m-home .wk-lenschip{position:relative;flex:none;cursor:pointer}
#m-home .wk-lenschip input{position:absolute;inset:0;width:100%;height:100%;margin:0;opacity:0;cursor:pointer}
#m-home .wk-lenschip span{display:inline-flex;align-items:center;min-height:44px;padding:0 13px;border-radius:999px;border:1px solid var(--ln);font:600 13px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;color:var(--mu);white-space:nowrap;transition:background .2s,color .2s,border-color .2s}
#m-home .wk-lenschip input:hover + span{color:var(--tx);border-color:var(--tx)}
#m-home .wk-lenschip input:checked + span{background:var(--tile);border-color:var(--tile);color:#7fb0ff}
#m-home .wk-lenschip input:focus-visible + span{outline:2.5px solid var(--focus);outline-offset:2px}
#m-home .wk-lensnote{margin:10px 0 0;font-size:13px;color:var(--mu)}
#m-home .m-herobtn{margin-top:16px}
#m-home a.m-herobtn{text-decoration:none}
#m-home .m-hvis{margin-top:26px}
#m-home .wk-fict{font:500 9.5px var(--mono);letter-spacing:.08em;fill:#8f9aad}
#m-home .m-stage svg.m-net{z-index:1}
/* A preview window waits for its drawing. */
#m-home .m-win:has(> svg:empty){display:none}

/* The page-build footing, the bottom row of the device panel. */
#m-home .wk-footing{position:relative;z-index:4;display:flex;flex-wrap:wrap;align-items:center;gap:4px 12px;margin:0 clamp(10px,4.1%,20px) clamp(10px,3%,16px);padding:7px 10px;min-height:36px;border-radius:10px;background:#090d14;border:1px solid rgba(255,255,255,.13);font:500 10.5px/1.3 var(--mono);letter-spacing:.06em;color:#8f9aad}
#m-home .wk-footing b{font-weight:600;color:#eef2f8}
#m-home .wk-ft-l{letter-spacing:.14em;font-weight:600}
#m-home .wk-ft-d b{color:#7fb0ff}
#m-home .wk-stamp{display:inline-block;margin-left:auto;padding:2px 7px;border:2px solid #ff6b5e;border-radius:4px;color:#ff6b5e;font:700 11px/1.2 var(--mono);letter-spacing:.1em;transform:rotate(-6deg)}
#wk-stamp[hidden]{display:inline-block!important;visibility:hidden}
#m-home .wk-stamp.wk-thunk{animation:wk-thunk .34s cubic-bezier(.2,1.5,.4,1) both}
#m-home .wks-pulse{animation:wk-foot-pulse 1.2s ease-out both}
@keyframes wk-foot-pulse{0%{box-shadow:0 0 0 0 rgba(95,150,255,0);border-color:rgba(255,255,255,.14)}18%{box-shadow:0 0 0 3px rgba(95,150,255,.75),0 0 26px rgba(95,150,255,.5);border-color:#7fb0ff}100%{box-shadow:0 0 0 0 rgba(95,150,255,0)}}
@keyframes wk-thunk{from{transform:rotate(-6deg) scale(2.5)}to{transform:rotate(-6deg) scale(1)}}

/* ---------- the numbers ---------- */
#m-home .wk-proof{padding-top:34px}
#m-home .wk-proofhd{padding:0 16px}
#m-home .wk-proofh{font:800 clamp(30px,8.4vw,44px)/.98 var(--disp);font-stretch:80%;letter-spacing:-.022em;margin:0 0 12px}
#m-home .wk-howto{margin:0 0 8px;font-size:15.5px;line-height:1.4;color:var(--mu);max-width:58ch}
#m-home .wk-skillline{margin:0;font:500 12px/1.65 var(--mono);color:var(--mu);max-width:92ch}
#m-home .m-stats{padding-top:20px;--tick:#ff8d7e}
#m-home .m-stats > .m-stat:nth-child(n+5){display:none}
#m-home .m-stat{position:relative;align-content:start}
#m-home .m-stat > span{margin-top:10px}
#m-home .wk-status{display:inline-block;font:600 10.5px/1 var(--mono);font-style:normal;letter-spacing:.09em;padding:4px 7px;border-radius:5px;border:1px solid currentColor}
#m-home .wk-st-RECORDED{color:#5ef0a8}
#m-home .wk-st-REPORTED{color:#ffc86e}
#m-home .wk-st-PROPOSED{color:#c9c0ff}
#m-home .wk-st-ONGOING{color:#86ccf6}
#m-home .m-stat > .wk-status{grid-column:1/-1;justify-self:start;margin-top:10px}
#m-home .wk-tick{grid-column:1/-1;min-width:0}
#m-home .wk-tick summary{position:absolute;top:2px;right:2px;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;cursor:pointer;list-style:none}
#m-home .wk-tick summary::-webkit-details-marker{display:none}
#m-home .wk-tick summary:hover{background:rgba(255,255,255,.08)}
#m-home .wk-tickmark{width:24px;height:24px;fill:none;stroke:var(--tick);stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round}
#m-home .wk-tick[open] summary{background:rgba(255,255,255,.1)}
#m-home .wk-note{margin-top:10px;padding-top:10px;border-top:1px dashed rgba(255,255,255,.2);font-size:13px;line-height:1.42;color:#cdd4e0}
#m-home .wk-note p{margin:0 0 6px}
#m-home .wk-note p:last-child{margin:0}
#m-home .wk-note-date{font:600 11.5px/1.4 var(--mono);color:#eef2f8}
#m-home .wk-note-limit b{color:#eef2f8;font-weight:600}
/* In the schedule the row already shows the date and the claim, so its tick opens the limit. */
#m-home .wk-table .wk-note p:not(.wk-note-limit){display:none}
#m-home .wk-counts{margin:14px 16px 0;font:500 12.5px/1.5 var(--mono);color:var(--mu)}
#m-home .wk-sched{margin:14px 16px 0}
#m-home .wk-schedbtn{display:inline-flex;align-items:center;gap:10px;min-height:48px;padding:0 20px;border-radius:999px;border:1px solid var(--ln);font:600 15px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;cursor:pointer;list-style:none}
#m-home .wk-schedbtn::-webkit-details-marker{display:none}
#m-home .wk-schedbtn::after{content:"+";font:500 20px/1 var(--mono);transition:transform .3s}
#m-home .wk-sched[open] .wk-schedbtn::after{transform:rotate(45deg)}
#m-home .wk-schedpanel{margin-top:14px;padding:18px 14px 16px;--b1:#14213a;--b2:#05060a;--c:#8d7bff;--tick:#ff8d7e}
#m-home .wk-table{position:relative;z-index:1;display:block;width:100%;border-collapse:collapse;font-size:14px;line-height:1.4}
#m-home .wk-table caption{display:block;text-align:left;font:600 12px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:#8f9aad;margin:0 0 8px}
#m-home .wk-table thead,#m-home .wk-table tbody,#m-home .wk-table tfoot{display:block}
#m-home .wk-table tr{position:relative;display:grid;grid-template-columns:auto minmax(0,1fr);grid-template-areas:"ref status" "item item" "date date" "tick tick";gap:4px 10px;padding:12px 2px 12px;border-top:1px solid rgba(255,255,255,.1)}
#m-home .wk-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
#m-home .wk-table td,#m-home .wk-table th{display:block;padding:0;text-align:left;min-width:0}
#m-home .wk-c-ref{grid-area:ref;font:600 13px/1.5 var(--mono);color:var(--tick)}
#m-home .wk-c-status{grid-area:status;padding-right:44px!important}
#m-home .wk-c-item{grid-area:item;color:#eef2f8;padding-right:4px!important}
#m-home .wk-c-date{grid-area:date;font:500 12px/1.45 var(--mono);color:#97a2b5}
#m-home .wk-c-tick{grid-area:tick;position:static}
#m-home .wk-table .wk-tick summary{top:0;right:0}
#m-home .wk-table .wk-tickmark{width:20px;height:20px}
#m-home .wk-table tfoot tr{display:block}
#m-home .wk-c-total{font:500 12.5px/1.5 var(--mono);color:#97a2b5}
#m-home .wk-statuskey{position:relative;z-index:1;display:grid;grid-template-columns:1fr;gap:6px 18px;margin:12px 0 0;padding-top:12px;border-top:1px solid rgba(255,255,255,.1);font-size:12.5px;line-height:1.35;color:#aab3c4}
#m-home .wk-statuskey div{display:flex;align-items:center;gap:8px}
#m-home .wk-statuskey dt{flex:none;width:86px}
#m-home .wk-statuskey dd{margin:0}
#m-home .wk-schedfoot{position:relative;z-index:4;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin:14px 0 0;font:500 12px/1.5 var(--mono);color:#97a2b5}
#m-home .wk-notesbtn{min-height:44px;padding:0 16px;border-radius:999px;border:1px solid rgba(255,255,255,.3);background:transparent;color:#eef2f8;font:600 13.5px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;cursor:pointer}
#m-home .wk-notesbtn:hover{border-color:#7fb0ff;color:#7fb0ff}
/* Phones and tablets: the tick sits on the status row, so it never lands on the number. An open note gets the whole row. */
@media (max-width:999px){
  #m-home .m-stat > .m-ring,#m-home .m-stat > .m-num{grid-row:1}
  #m-home .m-stat > span{grid-row:2}
  #m-home .m-stat > .wk-status{grid-row:3;align-self:start;position:relative;z-index:1;margin-top:12px}
  #m-home .m-stat > .wk-tick{grid-row:3;align-self:start}
  #m-home .m-stat > .wk-tick summary{position:relative;top:auto;right:auto;margin:0 -10px -8px auto}
  #m-home .m-stat:has(> .wk-tick[open]){grid-column:1/-1}
}
/* The narrowest phones: the HUD's label already names the tool, so its dots give way to the Demo button. */
@media (max-width:359px){
  #m-home .m-hdots{display:none}
}
/* Inside the panel the overlay must not swallow clicks: the base rule already sets pointer-events:none. */

/* ---------- tools ---------- */
#m-home .wk-tagwrap{margin:0 0 18px}
#m-home .wk-tagwrap .m-tag{margin:0 0 8px}
#m-home .wk-ailine{margin:0;font-size:13.5px;line-height:1.4;color:var(--mu)}
#m-home .m-more{padding:14px 16px}
#m-home .m-more ul{margin:0;padding:0 0 0 18px}
#m-home .wk-facts{margin:12px 0 0;padding:12px 0 0;border-top:1px solid var(--ln);display:grid;gap:9px}
#m-home .wk-facts dt{font:600 11px var(--mono);letter-spacing:.09em;text-transform:uppercase;color:var(--tc)}
#m-home .wk-facts dd{margin:2px 0 0;font-size:14px;line-height:1.4}
#m-home .wk-heldring{fill:none;stroke:#ffc86e;stroke-width:1.4;opacity:.8;transform-box:fill-box;transform-origin:50% 50%}
#m-home .m-live .wk-heldring{animation:m-ping2 1.8s ease-out infinite}
#m-home .wk-chorefill{fill:#65d59a;filter:drop-shadow(0 0 4px rgba(101,213,154,.6))}

/* ---------- how I build: the cards carry their small print ---------- */
#m-home .m-habits{grid-template-columns:1fr}
#m-home .m-habits li{min-height:0;justify-content:flex-start}
#m-home .m-habits li > svg{flex:none}
#m-home .m-habits p{position:relative;margin:8px 0 0;font-size:14px;line-height:1.42;color:#aab3c4}

/* ---------- contact and straight answers ---------- */
#m-home .m-endbtns .m-btn{min-height:48px}
#m-home .wk-straight{margin:0 0 32px}
#m-home .wk-straighth{font:800 clamp(30px,8.4vw,44px)/.98 var(--disp);font-stretch:80%;letter-spacing:-.022em;margin:0 0 16px}
#m-home .wk-qas{display:grid;grid-template-columns:1fr;gap:10px;margin:0}
#m-home .wk-qa{padding:16px 18px;border-radius:18px;background:var(--bg2)}
#m-home .wk-qa dt{font:700 18px/1.15 var(--disp);font-stretch:88%;margin:0 0 6px}
#m-home .wk-qa dd{margin:0;font-size:14.5px;line-height:1.45;color:var(--mu)}

/* ---------- footer dock ---------- */
#m-home .wk-dock{margin-top:14px;padding-top:12px;border-top:1px solid var(--ln);color:var(--mu)}
#m-home .wk-dock p{margin:0 0 6px}
#m-home .wk-dockbtns{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center}
#m-home .wk-dockbtns button,#m-home .wk-dockbtns a{display:inline-flex;align-items:center;min-height:44px;padding:0;border:0;background:none;color:var(--tx);font:600 13px 'DM Sans',system-ui,-apple-system,'Segoe UI',sans-serif;cursor:pointer;text-decoration:underline;text-decoration-color:var(--ln);text-underline-offset:3px}
#m-home .m-foot a{color:inherit}

/* ---------- tablets: one wider column ---------- */
@media (min-width:600px){
  #m-home .m-habits{grid-template-columns:1fr 1fr}
  #m-home .wk-qas{grid-template-columns:1fr 1fr}
  #m-home .wk-statuskey{grid-template-columns:1fr 1fr}
}
@media (min-width:600px) and (max-width:999px){
  #m-home .m-stats{grid-template-columns:1fr 1fr}
}
@media (min-width:700px){
  #m-home .wk-table thead{position:static;width:auto;height:auto;overflow:visible;clip-path:none}
  #m-home .wk-table tr{grid-template-columns:48px minmax(0,1fr) minmax(120px,170px) 92px 44px;grid-template-areas:"ref item date status mark" "tick tick tick tick tick";gap:0 12px;align-items:start}
  #m-home .wk-table thead tr{border-top:0;padding:0 2px 8px;font:600 11px var(--mono);letter-spacing:.09em;text-transform:uppercase;color:#8f9aad}
  #m-home .wk-table thead th{color:#8f9aad;font:inherit}
  #m-home .wk-c-mark{grid-area:mark;text-align:center!important}
  #m-home .wk-c-status{padding-right:0!important}
  #m-home .wk-table .wk-tick summary{top:2px}
  #m-home .wk-table .wk-note{margin-left:60px}
}

@media (max-width:500px){
  #m-home .m-h1{font-size:clamp(44px,13.6vw,68px);margin:8px 0 .3em}
  #m-home .m-role{font-size:10.5px;gap:0 10px}
  #m-home .m-lede{font-size:15.5px;line-height:1.36;margin:0 0 10px}
  #m-home .wk-creds{font-size:13px;margin-bottom:8px}
  #m-home .m-herobtn{margin-top:6px}
  #m-home .wk-cta2{margin-top:6px}
  #m-home .m-hvis{margin-top:12px}
  #m-home .wk-chips-wide,#m-home .wk-watch-wide{display:none}
  #m-home .wk-hero-after{display:block;margin-top:16px}
  #m-home .wk-hero-after .wk-watch{margin-top:8px}
}
/* ---------- desktop ---------- */
@media (min-width:1000px){
  /* the copy column keeps every hero piece, so it is one grid area */
  #m-home .m-hero{grid-template-areas:"copy vis";grid-template-rows:minmax(0,1fr);grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);padding-bottom:64px}
  #m-home .wk-answer-core{grid-area:copy;align-self:center;padding:8px 0}
  #m-home .m-h1{font-size:clamp(70px,min(7.4cqi,11vh),140px);margin:10px 0 .34em}
  #m-home .m-role{letter-spacing:.06em}
  #m-home .m-lede{font-size:clamp(17px,1.32vw,22px);max-width:50ch;margin:0 0 10px}
  #m-home .wk-rest{display:none}
  #m-home .m-chips{gap:8px}
  #m-home .m-herobtn{margin-top:16px;width:auto;display:inline-flex}
  #m-home .wk-cta2{margin-top:10px}
  #m-home .wk-cta2 .m-btn{flex:0 0 auto}
  #m-home .wk-lensrow{margin:0;padding:2px 0;overflow:visible;flex-wrap:wrap}
  #m-home .wk-lenschip span{min-height:36px}
  #m-home .m-hvis{margin-top:0}
  #m-home .m-role{font-size:12px}
  #m-home .wk-cta2 .m-btn{padding:0 18px;font-size:15px}
  #m-home .wk-footing{flex-wrap:nowrap;white-space:nowrap;gap:10px;letter-spacing:.02em;font-size:10.5px}
  #m-home .wk-ft-l{letter-spacing:.08em}
  #m-home .wk-proof{padding-top:18px;scroll-margin-top:66px}
  #m-home .wk-proofhd,#m-home .wk-counts,#m-home .wk-sched{margin-left:var(--pad);margin-right:var(--pad);padding-left:0;padding-right:0}
  #m-home .m-stats{padding-top:24px}
  #m-home .wk-proofh{font-size:clamp(44px,4.6vw,76px)}
  #m-home .wk-schedpanel{padding:24px 26px 22px}
  #m-home .wk-table{font-size:15px}
  #m-home .wk-table tr{grid-template-columns:56px minmax(0,1fr) minmax(170px,250px) 104px 44px;gap:0 16px}
  #m-home .wk-statuskey{grid-template-columns:repeat(4,minmax(0,1fr))}
  #m-home .wk-statuskey div{display:block}
  #m-home .wk-statuskey dd{margin-top:5px}
  #m-home .wk-intro,#m-home .m-intro{grid-template-areas:"kick kick" "h2 tag" "h2 idx"}
  /* "Five live demos." stays on one line at every desktop width. */
  #m-home .m-intro{grid-template-columns:max-content minmax(0,1fr)}
  #m-home .m-intro .m-h2 span{white-space:nowrap}
  #m-home .wk-tagwrap{grid-area:tag;margin:0 0 14px}
  #m-home .m-habits{grid-template-columns:repeat(4,1fr)}
  #m-home .m-habits li{gap:22px}
  #m-home .m-habits p{font-size:15px}
  #m-home .wk-straight{padding:0 0 0;margin:0 0 56px}
  #m-home .wk-straighth{font-size:clamp(44px,4.6vw,76px)}
  #m-home .wk-qas{grid-template-columns:repeat(2,1fr);gap:16px}
  #m-home .wk-qa{padding:24px 26px;border-radius:24px}
  #m-home .wk-qa dt{font-size:clamp(20px,1.7vw,26px)}
  #m-home .wk-qa dd{font-size:15.5px}
  #m-home .m-endbtns{grid-area:btns}
  #m-home .wk-dock{margin-top:0;padding-top:0;border-top:0;text-align:right;max-width:46ch}
  #m-home .wk-dockbtns{justify-content:flex-end}
  #m-home .wk-footcopy{max-width:74ch}
}
/* Tall enough for the rest of the summary. */
@media (min-width:1000px) and (min-height:880px){
  #m-home .wk-rest{display:block}
}
/* Short windows: everything that matters still fits above the fold. */
@media (min-width:1000px) and (max-height:760px){
  #m-home .m-hero{min-height:0;padding-bottom:56px}
  #m-home .m-h1{margin-top:6px}
  #m-home .m-herobtn{margin-top:12px;min-height:54px}
  #m-home .wk-cta2 .m-btn{min-height:44px}
  #m-home .m-cue{display:none}
  #m-home .m-hvis{max-width:min(640px,calc((100vh - 150px) * .9))}
}
/* A floating icon never crosses the nav, however short the window. */
@media (min-width:1000px) and (max-height:900px){
  #m-home .m-hvis{margin-top:44px;max-width:min(640px,calc((100vh - 190px) * .9))}
  #m-home .m-o1{top:0}
  #m-home .m-o2{top:0}
}

/* Tools list in the full record: the longest name wraps instead of running off a 320 px screen. */
#m-home .wkr-tools li{min-width:0;max-width:100%}
#m-home button.wkr-tool,#m-home span.wkr-tool{max-width:100%;white-space:normal;overflow-wrap:anywhere}
#m-home .wkr-tool small{white-space:normal}

/* ---------- ?plain=1: calm, white, printable, in reading order ---------- */
:root[data-plain]:not([data-theme="light"]) #m-home{--bg:#fff;--bg2:#fff;--tx:#111;--mu:#444;--ln:#bbb;--fc:#111;--band:transparent;--ul:transparent;--focus:#1a4fd0;--tile:#fff;--glow:0;color-scheme:light;display:flex;flex-direction:column}
:root[data-plain] body{background:#fff;color:#111}
:root[data-plain]{color-scheme:light}
:root[data-plain] #m-home > *{max-width:760px;width:100%}
:root[data-plain] #m-home .m-top{order:0}
:root[data-plain] #m-home #wk-answer{order:1}
:root[data-plain] #m-home #wk-resume{order:2}
:root[data-plain] #m-home #wk-proof{order:3}
:root[data-plain] #m-home #wk-tools{order:4}
:root[data-plain] #m-home #wk-contact{order:5}
:root[data-plain] #m-home .m-foot{order:6}
:root[data-plain] #m-home .m-defs{position:absolute}
:root[data-plain] #m-home .m-fx,:root[data-plain] #m-home .m-hvis,:root[data-plain] #m-home .m-cue,:root[data-plain] #m-home .m-hud,:root[data-plain] #m-home .m-mq,:root[data-plain] #m-home .m-stats,:root[data-plain] #m-home .wk-counts,:root[data-plain] #m-home #wk-how,:root[data-plain] #m-home #wk-tieout,:root[data-plain] #m-home #wk-syspace,:root[data-plain] #m-home .m-nav,:root[data-plain] #m-home .m-navdemo,:root[data-plain] #m-home .m-toplink,:root[data-plain] #m-home .wk-lens,:root[data-plain] #m-home .wk-watch,:root[data-plain] #m-home .m-chips,:root[data-plain] #m-home .m-herobtn,:root[data-plain] #m-home .m-big,:root[data-plain] #m-home .m-vis,:root[data-plain] #m-home .m-cap,:root[data-plain] #m-home .m-mbtn,:root[data-plain] #m-home .m-more,:root[data-plain] #m-home .m-index,:root[data-plain] #m-home .m-ref,:root[data-plain] #m-home .wk-schedbtn,:root[data-plain] #m-home .m-ct-ics,:root[data-plain] #m-home .wk-dock,:root[data-plain] #m-home .wk-proofhd .wk-skillline,:root[data-plain] #m-home .wk-tagwrap .wk-ailine{display:none!important}
:root[data-plain] #m-home .m-hero{display:block;min-height:0;padding:14px 16px 0}
:root[data-plain] #m-home .m-hero::before,:root[data-plain] #m-home .m-scene::before{display:none}
:root[data-plain] #m-home .m-h1{font:700 34px/1.1 Georgia,'Times New Roman',serif;font-stretch:normal;letter-spacing:0;margin:8px 0}
:root[data-plain] #m-home .m-field{font-size:.6em;color:#111;text-shadow:none;padding:0;margin:0}
:root[data-plain] #m-home .m-field::before,:root[data-plain] #m-home .m-ul{display:none}
:root[data-plain] #m-home .wk-lime{color:#111;text-shadow:none;padding:0}
:root[data-plain] #m-home .wk-lime::before{display:none}
:root[data-plain] #m-home .wk-claim-a{display:inline}
:root[data-plain] #m-home .wk-h1a{font-size:1em}
:root[data-plain] #m-home .m-lede{max-width:none;font-weight:400}
:root[data-plain] #m-home .wk-rest{display:block}
:root[data-plain] #m-home .m-btn{background:#fff;color:#111;border:1px solid #777;box-shadow:none;min-height:44px}
:root[data-plain] #m-home .m-btn::before{display:none}
:root[data-plain] #m-home .wk-proof{padding:24px 0 0}
:root[data-plain] #m-home .wk-proofhd,:root[data-plain] #m-home .wk-sched{margin:0;padding:0 16px}
:root[data-plain] #m-home .wk-proofh,:root[data-plain] #m-home .m-h2,:root[data-plain] #m-home .wk-straighth,:root[data-plain] #m-home .m-endh{font:700 24px/1.2 Georgia,'Times New Roman',serif;font-stretch:normal;letter-spacing:0;margin:0 0 8px;color:#111}
:root[data-plain] #m-home .m-h2 span{color:#111;-webkit-text-stroke:0}
:root[data-plain] #m-home .wk-schedpanel{background:#fff;border:0;box-shadow:none;border-radius:0;padding:0;color:#111;margin:0;overflow:visible;--tick:#8c2f25}
:root[data-plain] #m-home .wk-schedpanel::after{display:none}
:root[data-plain] #m-home .wk-table tr{border-top:1px solid #bbb}
:root[data-plain] #m-home .wk-table thead th,:root[data-plain] #m-home .wk-table caption,:root[data-plain] #m-home .wk-c-item,:root[data-plain] #m-home .wk-c-date,:root[data-plain] #m-home .wk-c-total,:root[data-plain] #m-home .wk-statuskey,:root[data-plain] #m-home .wk-schedfoot,:root[data-plain] #m-home .wk-note,:root[data-plain] #m-home .wk-note-date{color:#111}
:root[data-plain] #m-home .wk-statuskey,:root[data-plain] #m-home .wk-note{border-color:#bbb}
:root[data-plain] #m-home .wk-status{color:#111;border-color:#777}
:root[data-plain] #m-home .wk-tick summary,:root[data-plain] #m-home [data-notes]{display:none}
:root[data-plain] #m-home .wk-table thead{position:static;width:auto;height:auto;overflow:visible;clip-path:none}
:root[data-plain] #m-home .wk-table thead tr{padding:0 2px 6px;font:600 11px var(--mono);letter-spacing:.09em;text-transform:uppercase}
:root[data-plain] #m-home .wk-table thead th{font:inherit}
:root[data-plain] #m-home .wk-table thead .wk-c-mark{display:none}
:root[data-plain] #m-home .wk-table tr{grid-template-columns:48px minmax(0,1fr) 150px 92px;grid-template-areas:"ref item date status" "tick tick tick tick";gap:0 12px;align-items:start}
:root[data-plain] #m-home .wk-table tfoot tr{display:block}
:root[data-plain] #m-home .wk-c-status{padding-right:0!important}
:root[data-plain] #m-home .wk-table .wk-note{margin:6px 0 0 60px;padding-top:0;border-top:0}
@media (max-width:600px){
  :root[data-plain] #m-home .wk-table thead{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
  :root[data-plain] #m-home .wk-table tbody tr{grid-template-columns:auto minmax(0,1fr);grid-template-areas:"ref status" "item item" "date date" "tick tick";gap:4px 10px}
  :root[data-plain] #m-home .wk-table .wk-note{margin-left:0}
}
:root[data-plain] #m-home .m-tools{padding-top:24px}
:root[data-plain] #m-home .m-intro{display:block;padding:0 16px}
:root[data-plain] #m-home .m-tag{background:none;padding:0}
:root[data-plain] #m-home .m-tools .m-scene,:root[data-plain] #m-home .m-tools .m-scene:first-of-type{display:block;padding:12px 16px;overflow:visible}
:root[data-plain] #m-home .m-name{font:700 18px/1.25 Georgia,'Times New Roman',serif;font-stretch:normal;letter-spacing:0;margin:0 0 2px}
:root[data-plain] #m-home .m-q{margin:0 0 6px;max-width:none;font-size:15px;color:#333}
:root[data-plain] #m-home .m-act a{display:inline-flex;min-height:44px;background:none;border:0;padding:0;font-size:15px;text-decoration:underline}
:root[data-plain] #m-home .m-act svg{display:none}
:root[data-plain] #m-home .m-end{padding:24px 16px}
:root[data-plain] #m-home .m-endcard{display:block;background:#fff;color:#111;border:0;border-radius:0;padding:0}
:root[data-plain] #m-home .wkr-cv{display:block;max-width:none;padding:24px 16px 0}
:root[data-plain] #m-home .wkr-kick{color:#111}
:root[data-plain] #m-home .wkr-h2{font:700 24px/1.2 Georgia,'Times New Roman',serif;font-stretch:normal;letter-spacing:0;margin:0 0 8px;color:#111}
:root[data-plain] #m-home .wkr-h2 em{color:#111;background:none;text-shadow:none}
:root[data-plain] #m-home .wkr-btn{background:#fff;color:#111;border:1px solid #777;box-shadow:none;min-height:44px;font-size:15px}
:root[data-plain] #m-home .wkr-btn::before{display:none}
:root[data-plain] #m-home .wk-cta2 a[href="#wk-tieout"]{display:none}
:root[data-plain] #m-home .m-endcard .m-kick,:root[data-plain] #m-home .m-endh em{color:#111;text-shadow:none}
:root[data-plain] #m-home .m-endcard .m-ghost{color:#111;border-color:#777}
:root[data-plain] #m-home .m-copied{color:#111}
:root[data-plain] #m-home .wk-qa{padding:10px 0;border-radius:0;border-top:1px solid #bbb}
:root[data-plain] #m-home .wk-qa dt{font:700 16px/1.25 Georgia,'Times New Roman',serif;font-stretch:normal}
:root[data-plain] #m-home .wk-qas{grid-template-columns:1fr}
:root[data-plain] #m-home .m-foot{display:block}
:root[data-plain] #m-home .wk-plainback{display:block;margin:8px 0 0;font-weight:600}
:root[data-plain] #m-home .m-rv{opacity:1;transform:none}
@media print{
  :root[data-plain] #m-home .wk-plainback,:root[data-plain] #m-home .m-endbtns,:root[data-plain] #m-home .m-act,:root[data-plain] #m-home .m-copied,:root[data-plain] #m-home .wk-cta2{display:none!important}
  :root[data-plain] #m-home a{text-decoration:none;color:#111}
  :root[data-plain][data-print-target] #m-home .wkr-btns,:root[data-plain][data-print-target] #m-home .wkr-record,:root[data-plain][data-print-target] #m-home .wkr-note{display:none!important}
  :root[data-plain][data-print-target] #m-home > *{max-width:none}
  :root[data-plain][data-print-target] #m-home .wk-table tr,:root[data-plain][data-print-target] #m-home .wk-qa,:root[data-plain][data-print-target] #m-home .m-scene{break-inside:avoid}
  :root[data-plain][data-print-target] #m-home .wkr-paper{box-shadow:none}
}