:root{--bg:#181818;--surface:#1F1F1F;--line:#2E2E2E;--text:#F2F2F2;--muted:#9A9A9A;--accent:#FF4949;--accent-text:#181818;--term-bg:#0E0E0E;--term-text:#ECECEC;--term-muted:#8A8A8A;--term-line:#262626;color-scheme:dark}
:root[data-theme="light"]{--bg:#F4F3F0;--surface:#ECEBE7;--line:#D6D4CF;--text:#181818;--muted:#5C5C5C;--accent:#D92B2B;--accent-text:#FFFFFF;color-scheme:light}
html{scroll-behavior:smooth;scroll-padding-top:16px}
@media (prefers-reduced-motion: reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--bg);color:var(--text)}
a{color:inherit}
.h2m .tab{height:40px;padding:0 16px;border-radius:999px;font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;cursor:pointer;border:1px solid var(--line);background:transparent;color:var(--muted)}
.h2m .tab[aria-selected="true"]{border-color:var(--text);background:var(--text);color:var(--bg)}
.h2m .panel[hidden]{display:none}
.h2m .doc h2{font-size:34px;line-height:1.08;letter-spacing:-0.03em;font-weight:500;margin:0 0 24px}
.h2m .doc h3{font-size:22px;letter-spacing:-0.02em;font-weight:500;margin:40px 0 12px}
.h2m .doc p,.h2m .doc li{font-size:16px;color:var(--muted);line-height:1.6}
.h2m .doc p strong{color:var(--text);font-weight:500}
.h2m .doc .term{background:var(--term-bg);color:var(--term-text);border:1px solid var(--term-line);border-radius:10px;padding:20px 24px;margin:16px 0}
.h2m .doc .term pre{font-size:13px}
.h2m .doc-nav a{display:block;padding:10px 0;border-bottom:1px solid var(--line);text-decoration:none;font-size:15px}
.h2m .doc-nav a:hover{color:var(--accent)}
.h2m .doc td code,.h2m .doc th code{white-space:nowrap}

.h2m a:focus-visible,.h2m button:focus-visible{outline:2px solid var(--accent);outline-offset:4px}
.h2m pre{margin:0;font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px;line-height:1.65;white-space:pre;overflow-x:auto}
.h2m code{font-family:"JetBrains Mono",ui-monospace,SFMono-Regular,Menlo,monospace;font-size:0.9em}
.h2m .lbl{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.h2m table{border-collapse:collapse;width:100%}
.h2m th,.h2m td{text-align:left;vertical-align:top;padding:22px 0;border-top:1px solid var(--line);font-size:16px;line-height:1.5}
.h2m th{font-family:"JetBrains Mono",monospace;font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);font-weight:500;border-top:0;padding-top:0}
.h2m td+td,.h2m th+th{padding-left:32px}
.h2m .link:hover{color:var(--accent)}
.h2m .pos{display:none}
.h2m .stripe{background-image:repeating-linear-gradient(180deg,var(--accent) 0 3px,transparent 3px 6px);-webkit-background-clip:text;background-clip:text;color:transparent}
.h2m .stripe-muted{background-image:repeating-linear-gradient(180deg,var(--muted) 0 3px,transparent 3px 6px);-webkit-background-clip:text;background-clip:text;color:transparent}
.h2m .fringe{-webkit-mask-image:linear-gradient(to right,#000 0,#000 70%,transparent 100%);mask-image:linear-gradient(to right,#000 0,#000 70%,transparent 100%)}
.h2m .dissolve{-webkit-mask-image:linear-gradient(to bottom,#000 80%,transparent 100%);mask-image:linear-gradient(to bottom,#000 80%,transparent 100%)}
.h2m .band{display:block;overflow:hidden;line-height:0}
.h2m .bars{display:block;width:100%;--wf-grid:var(--line)}
.h2m .bars.red{--wf-wait:var(--line);--wf-dl:var(--accent)}
.h2m .bars.grey{--wf-wait:var(--line);--wf-dl:var(--muted)}
.h2m .bars-up{transform:none}
/* ---- motion ---- */
@keyframes rx-up{from{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}
@keyframes rx-fade{from{opacity:0}to{opacity:1}}
@keyframes rx-wipe{from{clip-path:inset(0 100% 0 0)}to{clip-path:inset(0 -2% 0 0)}}
@keyframes rx-print{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
@keyframes rx-blink{0%,49%{opacity:1}50%,100%{opacity:0}}
.h2m .a-up{animation:rx-up .9s cubic-bezier(.2,.7,.2,1) both}
.h2m .a-fade{animation:rx-fade .9s ease both}
.h2m .a-wipe{animation:rx-wipe 1.1s steps(36) .55s both}
.h2m .a-print{animation:rx-print 1.8s steps(26) .9s both}
.h2m .d1{animation-delay:.12s}.h2m .d2{animation-delay:.24s}.h2m .d3{animation-delay:.36s}.h2m .d4{animation-delay:.48s}.h2m .d5{animation-delay:.6s}.h2m .d6{animation-delay:.72s}
.h2m .cursor{animation:rx-blink 1.1s step-end infinite}
.h2m .link{background-image:linear-gradient(currentColor,currentColor);background-size:0 1px;background-repeat:no-repeat;background-position:0 100%;transition:background-size .35s cubic-bezier(.2,.7,.2,1),color .25s}
.h2m .link:hover{background-size:100% 1px}
.h2m .pill{transition:background-color .25s,color .25s,border-color .25s,transform .15s}
.h2m .pill:active{transform:scale(.96)}
.h2m .tab{transition:background-color .25s,color .25s,border-color .25s}
.h2m .row-title{transition:transform .45s cubic-bezier(.2,.7,.2,1),color .3s}
.h2m .row:hover .row-title{transform:translateX(10px)}
.h2m .row > span:first-child{transition:color .3s}
.h2m .row:hover > span:first-child{color:var(--accent)}
.h2m .feat-card{transition:border-color .3s}
.h2m .feat-card:hover{border-bottom-color:var(--text)}
.h2m figure{transition:transform .6s cubic-bezier(.2,.7,.2,1),border-color .4s}
.h2m figure:hover{transform:translateY(-3px);border-color:#3A3A3A}
@supports (animation-timeline: view()){
  .h2m .rv{animation:rx-up 1s cubic-bezier(.2,.7,.2,1) both;animation-timeline:view();animation-range:entry 0% entry 35%}
  .h2m .band{animation:rx-fade 1s linear both;animation-timeline:view();animation-range:entry 0% entry 70%}
  .h2m .band .bars{transform-origin:50% 100%}
}
@media (prefers-reduced-motion: reduce){
  .h2m .a-up,.h2m .a-fade,.h2m .a-wipe,.h2m .a-print,.h2m .rv,.h2m .band,.h2m .cursor{animation:none !important;opacity:1;transform:none;clip-path:none}
  .h2m .row:hover .row-title,.h2m figure:hover{transform:none}
}
/* !important: pills carry inline color/background that would otherwise win on hover. */
.h2m .pill:hover{background:var(--text) !important;color:var(--bg) !important}
.h2m .row:hover .row-title{color:var(--accent)}
.h2m .marquee-track{display:flex;gap:0;width:max-content;animation:h2m-marquee 40s linear infinite}
@keyframes h2m-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (prefers-reduced-motion: reduce){.h2m .marquee-track{animation:none}}
@media (max-width: 1000px){
  .h2m .g2,.h2m .g3,.h2m .g4{grid-template-columns:minmax(0,1fr) !important}
  .h2m .feat-grid{display:flex !important;gap:16px !important;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:24px 0 12px;scrollbar-width:none;margin-right:-40px;padding-right:40px}
  .h2m .feat-grid::-webkit-scrollbar{display:none}
  .h2m .feat-card{display:flex !important;flex-direction:column;flex:0 0 78%;max-width:420px;scroll-snap-align:start;gap:28px !important;padding:28px !important;border:1px solid var(--line) !important;border-radius:16px;background:var(--surface)}
  .h2m .feat-num{font-size:64px !important;line-height:1 !important;letter-spacing:-0.04em;color:var(--accent) !important;padding-top:0 !important}
  .h2m .feat-card h3{font-size:26px !important}
  .h2m .pos{display:inline !important}
  .h2m .uc-grid,.h2m .pain-grid{flex-direction:row !important;gap:16px;overflow-x:auto;scroll-snap-type:x mandatory;-webkit-overflow-scrolling:touch;padding:24px 0 12px;scrollbar-width:none;margin-right:-40px;padding-right:40px}
  .h2m .uc-grid::-webkit-scrollbar,.h2m .pain-grid::-webkit-scrollbar{display:none}
  .h2m .uc-grid .idx-row,.h2m .pain-grid .idx-row{display:flex !important;flex-direction:column;flex:0 0 78%;max-width:440px;scroll-snap-align:start;gap:20px !important;padding:28px !important;border:1px solid var(--line) !important;border-radius:16px;background:var(--surface)}
  .h2m .uc-grid .idx-row > span:first-child,.h2m .pain-grid .idx-row > span:first-child{font-size:64px !important;line-height:1 !important;letter-spacing:-0.04em;color:var(--accent) !important;padding-top:0 !important}
  .h2m .uc-grid .idx-row h3{font-size:24px !important}
  .h2m .pain-grid .idx-row h3{font-size:28px !important}
  .h2m .uc-grid .idx-row pre{white-space:pre-wrap;word-break:break-all;font-size:12px !important}
  .h2m .hero-h{font-size:88px !important}
  .h2m .big{font-size:48px !important}
  .h2m .nav-links{display:none !important}
  .h2m .idx-row{grid-template-columns:48px minmax(0,1fr) !important}
  .h2m .idx-row .idx-aside{grid-column:2 !important}
}
@media (max-width: 640px){
  .h2m .hero-h{font-size:56px !important}
  .h2m .big{font-size:34px !important}
  .h2m .sec{padding-left:20px !important;padding-right:20px !important}
  .h2m .cmd-line{font-size:16px !important}
  .h2m .meta{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
  .h2m .nav-ver{display:none !important}
  .h2m nav{padding-left:20px !important;padding-right:20px !important}
  .h2m .idx-row{grid-template-columns:minmax(0,1fr) !important}
  .h2m .idx-row .idx-aside{grid-column:1 !important}
  .h2m .idx-row h3,.h2m .row-title{font-size:26px !important}
  .h2m .marquee-track{font-size:28px !important}
  .h2m pre{font-size:12px !important}
  .h2m td,.h2m th{font-size:14px !important}
  .h2m footer.sec{padding-left:20px !important;padding-right:20px !important}
  .h2m .feat-grid{margin-right:-20px;padding-right:20px}
  .h2m .feat-card{flex:0 0 84%}
  .h2m .uc-grid,.h2m .pain-grid{margin-right:-20px;padding-right:20px}
  .h2m .uc-grid .idx-row,.h2m .pain-grid .idx-row{flex:0 0 84%}
  .h2m .sub{display:none !important}
  .h2m .bars{height:120px !important}
}
