/* GENERATED FILE - do not edit. Source: handoff.src.css
   Edit the .src.css and let .githooks/pre-commit rebuild this.
   Rebuild by hand: python3 scripts/gen_css.py --write */
:root{
  --mono:'JetBrains Mono','JetBrains Mono Fallback',ui-monospace,monospace;
  --display:'Archivo Black','Archivo Black Fallback',sans-serif;

  --o-conversion:var(--green-text);
  --o-subscription:var(--teal-text);
  --o-leadgen:var(--yellow);
  --o-install:var(--coral-text);
  --o-traffic:var(--dim);
  --o-retention:var(--coral-text);
  --o-awareness:var(--ink-soft);

  --h-continuous:var(--green-text);
  --h-partial:var(--yellow);
  --h-break:var(--coral-text);
  --h-none:var(--faint);

  --ease-out:cubic-bezier(.23,1,.32,1);
  --ease-surface:cubic-bezier(.32,.72,0,1);
  --dur-press:120ms;
  --dur-state:150ms;
  --dur-panel:190ms;
  --dur-drawer:340ms;
}

main,.hf-drawer{font-family:var(--body)}

.hf-wrap{max-width:var(--max);margin:0 auto;padding:0 var(--pad)}
.hf-mono{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase}

.hf-btn:focus-visible,
.hf-card:focus-visible,
.hf-chip:focus-visible,
.hf-clear:focus-visible,
.hf-dens button:focus-visible,
.hf-pill button:focus-visible,
.hf-search input:focus-visible,
.hf-axis-find:focus-visible,
.hf-var:focus-visible,
.hf-rel-item:focus-visible,
.hf-drawer:focus-visible{outline:2px solid var(--teal-text);outline-offset:2px}

.hf-hero{padding:clamp(46px,7vw,92px) 0 clamp(24px,3vw,34px)}
.hf-eyebrow{color:var(--faint);margin:0 0 clamp(16px,2.4vw,22px)}
.hf-hero h1{
  font-family:var(--display);text-transform:uppercase;letter-spacing:.005em;
  font-size:clamp(34px,6.4vw,74px);line-height:.96;margin:0;max-width:16ch;color:var(--ink);
}
.hf-hero h1 .hf-rule{color:var(--green-text)}
.hf-dek{margin:clamp(20px,2.6vw,28px) 0 0;max-width:66ch;color:var(--dim);font-size:clamp(15px,1.3vw,17px);line-height:1.6}
.hf-dek b{color:var(--ink);font-weight:600}

.hf-brandwall{margin-top:clamp(30px,4vw,44px);border-top:1px solid var(--ink-rule);padding-top:20px}
.hf-brandwall .hf-mono{color:var(--faint);display:block;margin-bottom:16px}
.hf-brands{display:flex;flex-wrap:wrap;list-style:none;margin:0;padding:0;row-gap:6px}
.hf-brands li{font-family:var(--mono);font-size:var(--fs-label);line-height:1.5;color:var(--dim)}

.hf-brands li::after{content:"·";color:var(--faint);margin:0 9px}
.hf-brands li:last-child::after{content:none}
.hf-brands .hf-more{color:var(--faint)}

.hf-disclaim{margin:14px 0 0;color:var(--dim);font-size:var(--fs-label);line-height:1.55;max-width:78ch}

.hf-controls{
  position:sticky;top:64px;z-index:90;background:rgba(66,66,79,0.94);
  backdrop-filter:saturate(150%) blur(10px);-webkit-backdrop-filter:saturate(150%) blur(10px);
  border-top:1px solid var(--ink-rule);border-bottom:1px solid var(--ink-rule);
}
.hf-crow{display:flex;align-items:center;gap:10px;padding:11px 0;flex-wrap:wrap}
.hf-search{position:relative;flex:1 1 260px;min-width:200px}
.hf-search input{
  width:100%;min-height:40px;padding:11px 13px 11px 34px;background:var(--deep);
  border:1px solid var(--ink-rule);border-radius:0;
  font-family:var(--body);font-size:14px;color:var(--ink);
}
.hf-search input::placeholder{color:var(--faint)}

.hf-search input:focus{border-color:var(--green)}
.hf-search svg{position:absolute;left:11px;top:50%;transform:translateY(-50%);color:var(--faint)}

.hf-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:7px;
  min-height:40px;padding:10px 14px;
  border:1px solid var(--ink-rule);background:var(--deep);color:var(--ink);
  font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;
  cursor:pointer;white-space:nowrap;transition:border-color var(--dur-state) var(--ease-out),background var(--dur-state) var(--ease-out),color var(--dur-state) var(--ease-out);
}
.hf-btn:hover{border-color:var(--green);color:var(--green-text)}
.hf-btn[aria-expanded="true"],.hf-btn.on{background:var(--green);border-color:var(--green);color:#10231a}
.hf-btn[disabled]{opacity:.4;cursor:not-allowed}
.hf-count{margin-left:auto;color:var(--faint);font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;white-space:nowrap}
.hf-count b{color:var(--ink);font-weight:400}

.hf-hbar{display:flex;align-items:center;border:1px solid var(--ink-rule)}
.hf-hbar-label{
  align-self:stretch;display:flex;align-items:center;padding:0 11px;
  background:var(--mid);color:var(--faint);
  font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;
  white-space:nowrap;border-right:1px solid var(--ink-rule);
}
.hf-hseg{
  min-height:40px;padding:10px 13px;background:var(--deep);border:none;cursor:pointer;
  color:var(--ink);font-family:var(--mono);font-size:var(--fs-label);
  letter-spacing:.12em;text-transform:uppercase;white-space:nowrap;
  display:inline-flex;align-items:center;gap:7px;
  transition:background var(--dur-state) var(--ease-out),color var(--dur-state) var(--ease-out);
}
.hf-hseg+.hf-hseg{border-left:1px solid var(--ink-rule)}
.hf-hseg .n{color:var(--faint);font-size:var(--fs-micro)}
.hf-hseg:hover{color:var(--hc)}

.hf-hseg[aria-pressed="true"]{background:var(--hc);color:var(--deep)}
.hf-hseg[aria-pressed="true"] .n{color:var(--deep);opacity:.72}
.hf-hseg:focus-visible{outline:2px solid var(--hc);outline-offset:-2px}

.hf-hseg-off{opacity:.42;cursor:not-allowed}
.hf-hseg-off:hover{color:var(--ink)}
@media (prefers-reduced-motion:no-preference){
  .hf-hseg:active{transform:translateY(1px)}
}

@media (max-width:560px){
  .hf-hbar{flex:1 1 100%}
  .hf-hbar-label{display:none}
  .hf-hseg{flex:1;justify-content:center;padding:10px 8px}
}

.hf-dens{display:flex;border:1px solid var(--ink-rule)}
.hf-dens button{
  background:var(--deep);border:none;min-height:40px;padding:10px 13px;cursor:pointer;color:var(--faint);
  display:flex;align-items:center;justify-content:center;
}
.hf-dens button+button{border-left:1px solid var(--ink-rule)}
.hf-dens button[aria-pressed="true"]{background:var(--mid);color:var(--ink)}

.hf-tray{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:0 0 11px}
.hf-tray:empty{display:none}
.hf-pill{display:inline-flex;align-items:center;gap:8px;padding:5px 6px 5px 10px;background:var(--green);color:#10231a;font-size:var(--fs-label)}

.hf-pill b{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;font-weight:400}
.hf-pill button{
  position:relative;background:none;border:none;cursor:pointer;color:inherit;
  font-size:15px;line-height:1;padding:0;
  width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;
}

.hf-pill button::after{
  content:"";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);
  width:40px;height:36px;
}
.hf-clear{
  display:inline-flex;align-items:center;min-height:36px;padding:6px 4px;
  background:none;border:none;cursor:pointer;color:var(--faint);font-size:var(--fs-label);
  text-decoration:underline;text-underline-offset:3px;font-family:var(--body);
}
.hf-clear:hover{color:var(--ink)}

.hf-panel{
  position:absolute;left:0;right:0;top:100%;z-index:2;
  background:var(--chrome);border-bottom:1px solid var(--ink-rule);
  box-shadow:0 18px 40px rgba(0,0,0,.36);
  max-height:min(70vh,620px);overflow-y:auto;display:none;
  transform-origin:top left;transform:none;opacity:1;
}
.hf-panel.open{display:block}

@media (prefers-reduced-motion:no-preference){
  .hf-panel{transition:transform var(--dur-panel) var(--ease-surface),opacity 140ms var(--ease-out)}
  @starting-style{
    .hf-panel.open{transform:scaleY(.98) translateY(-4px);opacity:0}
  }
}
@media (prefers-reduced-motion:reduce){
  .hf-panel{transition:opacity 140ms var(--ease-out)}
  @starting-style{
    .hf-panel.open{opacity:0}
  }
}
.hf-axes{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:22px 30px;padding:24px 0 28px}
.hf-axis-label{display:block;margin:0 0 10px;color:var(--faint);font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;font-weight:400}

.hf-chips{display:flex;flex-wrap:wrap;gap:10px 8px}
.hf-chip{
  position:relative;display:inline-flex;align-items:center;min-height:34px;
  padding:7px 12px;border:1px solid var(--ink-rule);background:var(--deep);color:var(--ink-soft);
  font-family:var(--body);font-size:var(--fs-label);line-height:1.3;cursor:pointer;
  transition:border-color var(--dur-state) var(--ease-out),background var(--dur-state) var(--ease-out),color var(--dur-state) var(--ease-out);
}

.hf-chip::after{content:"";position:absolute;left:0;right:0;top:50%;transform:translateY(-50%);height:44px}
.hf-chip:hover{border-color:var(--green)}
.hf-chip[aria-pressed="true"]{background:var(--green);border-color:var(--green);color:#10231a}

.hf-chip .n{font-family:var(--mono);font-size:var(--fs-label);opacity:.72;margin-left:6px}
.hf-chip[aria-pressed="true"] .n{opacity:1}
.hf-chip[disabled]{opacity:.3;cursor:not-allowed}
.hf-panel-foot{display:flex;justify-content:flex-end;gap:9px;padding:0 0 22px}

.hf-axis-find{
  width:100%;min-height:36px;margin:0 0 9px;padding:8px 10px;
  background:var(--deep);border:1px solid var(--ink-rule);border-radius:0;
  font-family:var(--body);font-size:var(--fs-label);color:var(--ink);
}
.hf-axis-find::placeholder{color:var(--faint)}
.hf-axis-find:focus{border-color:var(--green)}
.hf-axis .hf-chips{max-height:240px;overflow-y:auto}

.hf-results{padding:clamp(24px,3.4vw,38px) 0 90px;min-height:60vh}
.hf-grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fill,minmax(min(100%,268px),1fr))}
[data-density="cozy"] .hf-grid{grid-template-columns:repeat(auto-fill,minmax(min(100%,380px),1fr));gap:20px}

.hf-card{
  display:flex;flex-direction:column;text-align:left;cursor:pointer;text-decoration:none;
  background:var(--deep);border:1px solid var(--ink-rule);padding:0;
  transition:border-color var(--dur-state) var(--ease-out),transform 140ms var(--ease-out);
}
.hf-card:hover{border-color:var(--green)}

@media (prefers-reduced-motion:no-preference){
  .hf-card:hover{transform:translateY(-2px)}
  .hf-card:active{transform:translateY(-2px) scale(.985)}
  .hf-btn:active,.hf-chip:active,.hf-dens button:active{transform:translateY(1px)}

  .hf-btn,.hf-chip,.hf-dens button{transition:border-color var(--dur-state) var(--ease-out),background var(--dur-state) var(--ease-out),color var(--dur-state) var(--ease-out),transform var(--dur-press) var(--ease-out)}
  .hf-btn:active,.hf-chip:active,.hf-dens button:active{transition-duration:0s}
}

.hf-shot{position:relative;width:100%;aspect-ratio:4/5;overflow:hidden;background:var(--chrome);display:block}

.hf-shot img,.hf-shot video{width:100%;height:100%;object-fit:cover;display:block}
.hf-shot video{position:absolute;inset:0;opacity:0;transition:opacity var(--dur-panel) var(--ease-out)}
.hf-card:hover .hf-shot video.ready{opacity:1}
@media (prefers-reduced-motion:reduce){ .hf-shot video{display:none} }

.hf-shot-ph{
  position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;
  padding:16px;background:
    repeating-linear-gradient(135deg,rgba(242,242,240,.028) 0 2px,transparent 2px 9px),var(--chrome);
}
.hf-shot-ph q{font-family:var(--body);font-size:15px;line-height:1.34;color:var(--ink-soft);quotes:"“" "”"}
.hf-shot-ph .hf-ph-tag{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;color:var(--faint)}

.hf-vbadge{
  position:absolute;top:9px;right:9px;z-index:2;
  font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;
  background:rgba(31,25,27,.82);color:var(--ink);padding:3px 7px;
}

.hf-hbadge{
  position:absolute;left:9px;bottom:9px;z-index:2;display:inline-flex;align-items:center;gap:5px;
  font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;
  background:rgba(31,25,27,.82);color:var(--hc);padding:3px 8px;
}

.hf-hbadge::before{content:"";width:5px;height:5px;background:var(--hc)}

.hf-meta{padding:13px 14px 15px;display:flex;flex-direction:column;gap:9px;flex:1}
.hf-brandrow{display:flex;align-items:center;gap:8px}
.hf-brandrow img{height:16px;width:60px;object-fit:contain;background:var(--ink);padding:2px 4px}
.hf-brandrow .hf-bn{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;color:var(--ink)}
.hf-obj{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;color:var(--oc);display:inline-flex;align-items:center;gap:5px;margin-left:auto}
.hf-obj::before{content:"";width:5px;height:5px;background:var(--oc);flex:none}
.hf-card h2{margin:0;font-family:var(--body);font-weight:500;font-size:var(--fs-tool-body);line-height:1.45;color:var(--ink-soft)}
.hf-tags{display:flex;flex-wrap:wrap;gap:4px;margin-top:auto}
.hf-tag{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.06em;text-transform:uppercase;padding:3px 7px;border:1px solid var(--ink-rule);color:var(--faint)}

.hf-empty{border:1px dashed var(--ink-rule);padding:64px 26px;text-align:center;color:var(--faint)}
.hf-empty strong{display:block;font-family:var(--display);text-transform:uppercase;font-size:19px;color:var(--ink);margin-bottom:10px}

@media (prefers-reduced-motion:no-preference){
  .hf-empty{animation:hf-empty-in 220ms var(--ease-out)}
}
@keyframes hf-empty-in{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.hf-sentinel{height:1px}
.hf-loadmore{display:flex;justify-content:center;padding:28px 0 0}

.hf-scrim{position:fixed;inset:0;z-index:90;background:rgba(20,17,18,.62);opacity:0;pointer-events:none;transition:opacity var(--dur-panel) var(--ease-out)}
.hf-scrim.open{opacity:1;pointer-events:auto}
.hf-drawer{
  position:fixed;top:0;right:0;bottom:0;z-index:95;width:min(940px,100%);
  background:var(--bg);border-left:1px solid var(--ink-rule);
  transform:translateX(100%);transition:transform var(--dur-drawer) var(--ease-surface);
  overflow-y:auto;overscroll-behavior:contain;
}
.hf-drawer.open{transform:none}

@media (prefers-reduced-motion:reduce){
  .hf-drawer{opacity:0;transition:opacity 160ms var(--ease-out)}
  .hf-drawer.open{opacity:1}
  .hf-scrim{transition:opacity 160ms var(--ease-out)}
}
.hf-dhead{
  position:sticky;top:0;z-index:3;background:rgba(66,66,79,.96);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border-bottom:1px solid var(--ink-rule);
  display:flex;align-items:center;gap:10px;padding:13px 24px;
}
.hf-dhead .hf-nav{margin-left:auto;display:flex;gap:6px}
.hf-dbody{padding:26px 24px 80px}

@media (prefers-reduced-motion:no-preference){
  .hf-dbody-next{animation:hf-step-next 130ms var(--ease-out)}
  .hf-dbody-prev{animation:hf-step-prev 130ms var(--ease-out)}
}
@keyframes hf-step-next{from{opacity:0;transform:translateX(8px)}to{opacity:1;transform:none}}
@keyframes hf-step-prev{from{opacity:0;transform:translateX(-8px)}to{opacity:1;transform:none}}

.hf-pair{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:var(--ink-rule);border:1px solid var(--ink-rule)}
@media (max-width:720px){ .hf-pair{grid-template-columns:1fr} }
.hf-pane{background:var(--deep);display:flex;flex-direction:column}
.hf-pane-h{
  display:flex;align-items:center;justify-content:space-between;gap:8px;
  padding:9px 12px;border-bottom:1px solid var(--ink-rule);
  font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;color:var(--faint);
}
.hf-pane-h a{color:var(--green-text);text-decoration:none}
.hf-pane-h a:hover{text-decoration:underline}

.hf-pane-shot{position:relative;width:100%;aspect-ratio:var(--ar,4/5);overflow:hidden;background:var(--chrome)}
.hf-pane-shot img,.hf-pane-shot video{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.hf-pane:not(.hf-pane-lp) .hf-pane-shot img{object-fit:contain;object-position:center}

.hf-pane-lp .hf-pane-shot{aspect-ratio:var(--ar,4/3)}

.hf-pane-shot[data-zoom="on"]{cursor:zoom-in}
.hf-zoom{
  position:absolute;right:9px;bottom:9px;z-index:2;
  display:inline-flex;align-items:center;gap:6px;
  padding:6px 9px;min-height:32px;cursor:zoom-in;
  background:rgba(20,17,18,.78);border:1px solid var(--ink-rule);color:var(--ink);
  font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;
  opacity:0;transition:opacity var(--dur-state) var(--ease-out),border-color var(--dur-state) var(--ease-out);
}

@media (hover:hover) and (pointer:fine){
  .hf-pane-shot:hover .hf-zoom,.hf-zoom:focus-visible{opacity:1}
}

@media not all and (hover:hover){
  .hf-zoom{opacity:1;min-height:44px;padding:11px 13px}
}
@media (pointer:coarse){
  .hf-zoom{min-height:44px;padding:11px 13px}
}
.hf-zoom:focus-visible{opacity:1;outline:2px solid var(--teal-text);outline-offset:2px}
.hf-zoom:hover{border-color:var(--green)}

.hf-lb{
  padding:0;border:0;background:transparent;max-width:100vw;max-height:100vh;
  width:100%;height:100%;overflow:hidden;
}
.hf-lb::backdrop{background:rgba(20,17,18,.86)}
.hf-lb-fig{
  margin:0;height:100%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;gap:0;padding:clamp(12px,3vw,34px);
}

.hf-lb-stage{
  max-width:min(100%,900px);max-height:calc(100% - 46px);
  overflow:auto;overscroll-behavior:contain;background:var(--chrome);
  border:1px solid var(--ink-rule);
}
.hf-lb-stage img{display:block;width:100%;height:auto}
.hf-lb-cap{
  flex:0 0 auto;display:flex;align-items:center;gap:14px;
  width:min(100%,900px);padding:11px 2px 0;
  font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;
  text-transform:uppercase;color:var(--faint);
}
.hf-lb-cap span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.hf-lb-x{
  margin-left:auto;flex:0 0 auto;min-height:34px;padding:7px 11px;cursor:pointer;
  background:transparent;border:1px solid var(--ink-rule);color:var(--ink);
  font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;
  transition:border-color var(--dur-state) var(--ease-out),color var(--dur-state) var(--ease-out);
}
.hf-lb-x:hover{border-color:var(--green);color:var(--green-text)}
.hf-lb-x:focus-visible{outline:2px solid var(--teal-text);outline-offset:2px}

.hf-verdict{
  margin-top:16px;border:1px solid var(--hc);border-left-width:3px;padding:14px 16px;background:var(--deep);
}
.hf-verdict h3{
  margin:0 0 7px;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;
  color:var(--hc);font-weight:400;display:flex;align-items:center;gap:7px;
}
.hf-verdict p{margin:0;color:var(--ink-soft);font-size:var(--fs-tool-body);line-height:1.65}

.hf-drawer h2{
  font-family:var(--display);text-transform:uppercase;font-size:clamp(19px,2.4vw,26px);
  line-height:1.14;margin:22px 0 0;color:var(--ink);
}

.hf-hookline{
  margin:16px 0 0;padding:15px 17px;background:var(--deep);border-left:2px solid var(--oc);
  font-size:var(--fs-body);line-height:1.45;color:var(--ink);
}
.hf-hookline p{margin:0}
.hf-hookline footer{
  margin:8px 0 0;font-family:var(--mono);font-size:var(--fs-label);
  letter-spacing:.1em;text-transform:uppercase;color:var(--faint);
}
.hf-sec{margin-top:26px}
.hf-sec>h3{margin:0 0 11px;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;color:var(--faint);font-weight:400}
.hf-sec p{margin:0;color:var(--ink-soft);font-size:var(--fs-tool-body);line-height:1.7}
.hf-why{margin:0;padding:0;list-style:none;display:grid;gap:12px}
.hf-why li{position:relative;padding-left:24px;color:var(--ink-soft);font-size:var(--fs-tool-body);line-height:1.65}
.hf-why li::before{content:"";position:absolute;left:4px;top:.66em;width:8px;height:1px;background:var(--oc)}
.hf-why li b{color:var(--ink);font-weight:600}
.hf-kv{display:grid;grid-template-columns:auto 1fr;gap:8px 16px;align-items:baseline}
.hf-kv dt{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);white-space:nowrap}
.hf-kv dd{margin:0;display:flex;flex-wrap:wrap;gap:4px}

.hf-var-lede{margin:0 0 13px;color:var(--faint);font-size:var(--fs-tool-body);line-height:1.55}
.hf-vars,.hf-rel{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(116px,1fr));gap:10px;
}
.hf-var,.hf-rel-item{
  display:flex;flex-direction:column;gap:7px;text-decoration:none;text-align:left;
  background:none;border:none;padding:0;cursor:pointer;color:inherit;font:inherit;
}
.hf-var-shot{
  position:relative;display:block;width:100%;aspect-ratio:4/5;overflow:hidden;
  background:var(--chrome);border:1px solid var(--ink-rule);
  transition:border-color var(--dur-state) var(--ease-out);
}
.hf-var:hover .hf-var-shot,.hf-rel-item:hover .hf-var-shot{border-color:var(--green)}
.hf-var-shot img{width:100%;height:100%;object-fit:cover;object-position:top;display:block}
.hf-var-ph{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;
  padding:8px;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;
  color:var(--faint);line-height:1.5;
  background:repeating-linear-gradient(135deg,rgba(242,242,240,.028) 0 2px,transparent 2px 9px);
}
.hf-var-label{
  font-size:var(--fs-label);line-height:1.4;color:var(--ink-soft);
  display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;
}
.hf-var:hover .hf-var-label,.hf-rel-item:hover .hf-var-label{color:var(--ink)}

.hf-watch{margin-top:26px;border:1px solid var(--ink-rule);padding:15px 17px;background:var(--deep)}
.hf-watch h3{margin:0 0 7px;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;color:var(--coral-text);font-weight:400}
.hf-watch p{margin:0;color:var(--ink-soft);font-size:var(--fs-tool-body);line-height:1.65}
.hf-src{margin:0;padding:0;list-style:none;display:grid;gap:6px}
.hf-src a{color:var(--green-text);font-size:var(--fs-tool-body);text-decoration:none}
.hf-src a:hover{text-decoration:underline}

.hf-pending{
  position:absolute;inset:0;display:flex;align-items:center;justify-content:center;text-align:center;
  padding:20px;font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.12em;text-transform:uppercase;
  color:var(--faint);
  background:repeating-linear-gradient(135deg,rgba(242,242,240,.028) 0 2px,transparent 2px 9px),var(--chrome);
}

@media (max-width:640px){
  :root{--pad:20px}
  .hf-count{margin-left:0;order:9;width:100%}
  .hf-dbody{padding:22px 18px 70px}
  .hf-dhead{padding:12px 18px}
}

.hf-crumb{font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.09em;color:var(--faint);margin:0 0 18px}
.hf-crumb a{color:var(--faint);text-decoration:none;border-bottom:1px solid var(--ink-rule)}
.hf-crumb a:hover{color:var(--ink);border-color:var(--green)}
.hf-crumb span[aria-current]{color:var(--dim)}

.hf-chips-meta{display:flex;flex-wrap:wrap;gap:8px;margin:22px 0 0;padding:0;list-style:none}
.hf-chips-meta li{
  font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.08em;text-transform:uppercase;
  color:var(--dim);border:1px solid var(--ink-rule);padding:6px 10px;
}

.hf-cred{
  display:flex;align-items:baseline;gap:9px;margin:20px 0 0;max-width:78ch;
  color:var(--dim);font-size:var(--fs-tool-body);line-height:1.55;
}
.hf-cdot{flex:0 0 auto;width:7px;height:7px;background:var(--green);transform:translateY(-1px)}

.hf-coverage{
  margin:16px 0 0;max-width:78ch;padding:13px 15px;
  border:1px solid var(--ink-rule);border-left:3px solid var(--yellow);
  background:var(--deep);color:var(--dim);font-size:var(--fs-tool-body);line-height:1.6;
}
.hf-coverage b{color:var(--ink);font-weight:600}

.hf-faq{padding:clamp(40px,6vw,72px) 0 clamp(30px,4vw,48px);border-top:1px solid var(--ink-rule)}
.hf-faq h2{
  font-family:var(--display);text-transform:uppercase;font-size:clamp(20px,2.6vw,28px);
  margin:0 0 22px;color:var(--ink);letter-spacing:.005em;
}
.hf-faq-item{border-bottom:1px solid var(--ink-rule);padding:0}

@media (prefers-reduced-motion:no-preference){
  .hf-faq{interpolate-size:allow-keywords}
  .hf-faq-item::details-content{
    block-size:0;overflow:hidden;opacity:0;
    transition:block-size var(--dur-panel) var(--ease-out),
               content-visibility var(--dur-panel) allow-discrete,
               opacity 140ms var(--ease-out);
  }
  .hf-faq-item[open]::details-content{block-size:auto;opacity:1}
}
.hf-faq-item summary{
  cursor:pointer;padding:16px 0;color:var(--ink);font-size:var(--fs-body);line-height:1.45;
  list-style:none;display:flex;align-items:baseline;gap:12px;min-height:44px;
}
.hf-faq-item summary::-webkit-details-marker{display:none}
.hf-faq-item summary::before{content:"+";color:var(--green-text);font-family:var(--mono);flex:0 0 auto}
.hf-faq-item[open] summary::before{content:"\2212"}
.hf-faq-item summary:hover{color:var(--green-text)}
.hf-faq-item summary:focus-visible{outline:2px solid var(--teal-text);outline-offset:2px}
.hf-faq-item p{margin:0 0 18px;padding-left:24px;max-width:76ch;color:var(--dim);font-size:var(--fs-tool-body);line-height:1.65}

.hf-next{margin-top:30px;border:1px solid var(--ink-rule);border-top:3px solid var(--green);background:var(--deep);padding:20px}
.hf-next h3{margin:0 0 8px;font-family:var(--body);font-size:var(--fs-body);color:var(--ink);font-weight:600;line-height:1.35}
.hf-next p{margin:0 0 15px;color:var(--dim);font-size:var(--fs-tool-body);line-height:1.6}
.hf-next-cta{
  display:inline-flex;align-items:center;min-height:44px;padding:12px 18px;
  background:var(--green);color:#10231a;text-decoration:none;
  font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.1em;text-transform:uppercase;
}
.hf-next-cta:hover{background:var(--green-text)}
.hf-next-cta:focus-visible{outline:2px solid var(--teal-text);outline-offset:2px}
.hf-next-alt{margin-left:14px;color:var(--faint);font-size:var(--fs-tool-body)}
.hf-next-alt a{color:var(--green-text)}

.hf-results-h{
  font-family:var(--mono);font-size:var(--fs-label);letter-spacing:.14em;text-transform:uppercase;
  color:var(--faint);font-weight:400;margin:0 0 18px;
}