.cpt-hybrid{--mono:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-family:var(--sans)}
    .cpt-hybrid .hb-grid{display:grid;grid-template-columns:minmax(210px,280px) 1fr;gap:clamp(30px,6vw,80px);align-items:start}
    .cpt-hybrid .hb-aside{position:sticky;top:40px;align-self:start}
    .cpt-hybrid .hb-kicker{font-family:var(--mono);font-size:11px;letter-spacing:.3em;text-transform:uppercase;color:var(--teal);display:flex;align-items:center;gap:12px;margin:0 0 20px}
    .cpt-hybrid .hb-kicker::after{content:"";flex:1;height:1px;background:var(--line)}
    .cpt-hybrid .hb-h{font-family:var(--serif);font-weight:400;font-size:clamp(30px,3vw,42px);line-height:1.02;margin:0}
    .cpt-hybrid .hb-h em{font-style:italic;color:var(--teal)}
    .cpt-hybrid .hb-intro{color:var(--dim);font-weight:300;font-size:15px;line-height:1.6;margin:18px 0 0;max-width:34ch}
    .cpt-hybrid .hb-hint{font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--dim);margin:24px 0 0;padding-top:18px;border-top:1px solid var(--line)}
    .cpt-hybrid .hb-hint b{color:var(--amber);font-weight:500}
    .cpt-hybrid .hb-list{margin:0;padding:0;list-style:none;border-bottom:1px solid var(--line)}
    .cpt-hybrid .hb-list li{margin:0}
    .cpt-hybrid .hb-row{width:100%;text-align:left;background:none;border:0;border-top:1px solid var(--line);cursor:pointer;color:inherit;font:inherit;display:grid;grid-template-columns:auto 1fr auto;column-gap:clamp(16px,3vw,34px);align-items:start;padding:19px 2px 19px 0;position:relative;transition:padding-left .35s cubic-bezier(.22,1,.36,1)}
    .cpt-hybrid .hb-row::before{content:"";position:absolute;left:0;top:-1px;height:1px;width:0;background:var(--teal);transition:width .4s cubic-bezier(.22,1,.36,1)}
    .cpt-hybrid .hb-idx{font-family:var(--mono);font-size:12px;font-weight:500;color:var(--amber);letter-spacing:.06em;line-height:1.95;min-width:2ch;transition:color .3s}
    .cpt-hybrid .hb-main{display:block;min-width:0}
    .cpt-hybrid .hb-title{display:block;font-family:var(--serif);font-weight:400;font-size:clamp(20px,2.1vw,25px);line-height:1.16;color:var(--bone);transition:color .3s}
    .cpt-hybrid .hb-descwrap{display:grid;grid-template-rows:0fr;transition:grid-template-rows .42s cubic-bezier(.22,1,.36,1)}
    .cpt-hybrid .hb-clip{overflow:hidden;min-height:0}
    .cpt-hybrid .hb-desc{display:block;color:var(--dim);font-weight:300;font-size:14.5px;line-height:1.55;max-width:60ch;opacity:0;transform:translateY(-4px);transition:opacity .35s ease .03s,transform .35s ease .03s;padding-top:9px}
    .cpt-hybrid .hb-chev{position:relative;width:22px;height:22px;flex:none;margin-top:4px}
    .cpt-hybrid .hb-chev::before,.cpt-hybrid .hb-chev::after{content:"";position:absolute;top:50%;left:50%;background:var(--dim);transition:background .3s,transform .35s cubic-bezier(.22,1,.36,1)}
    .cpt-hybrid .hb-chev::before{width:13px;height:1.5px;transform:translate(-50%,-50%)}
    .cpt-hybrid .hb-chev::after{width:1.5px;height:13px;transform:translate(-50%,-50%)}
    @media(hover:hover){
      .cpt-hybrid .hb-row:hover{padding-left:16px}
      .cpt-hybrid .hb-row:hover::before{width:8px}
      .cpt-hybrid .hb-row:hover .hb-title,.cpt-hybrid .hb-row:hover .hb-idx{color:var(--teal)}
      .cpt-hybrid .hb-row:hover .hb-descwrap{grid-template-rows:1fr}
      .cpt-hybrid .hb-row:hover .hb-desc{opacity:1;transform:none}
      .cpt-hybrid .hb-row:hover .hb-chev::before,.cpt-hybrid .hb-row:hover .hb-chev::after{background:var(--teal)}
    }
    .cpt-hybrid .hb-row.open{padding-left:16px}
    .cpt-hybrid .hb-row.open::before{width:8px}
    .cpt-hybrid .hb-row.open .hb-title,.cpt-hybrid .hb-row.open .hb-idx{color:var(--teal)}
    .cpt-hybrid .hb-row.open .hb-descwrap{grid-template-rows:1fr}
    .cpt-hybrid .hb-row.open .hb-desc{opacity:1;transform:none}
    .cpt-hybrid .hb-row.open .hb-chev::before,.cpt-hybrid .hb-row.open .hb-chev::after{background:var(--teal)}
    .cpt-hybrid .hb-row.open .hb-chev::after{transform:translate(-50%,-50%) rotate(90deg)}
    .cpt-hybrid .hb-row:focus-visible{outline:2px solid var(--teal);outline-offset:3px;border-radius:6px}
    @media(prefers-reduced-motion:reduce){.cpt-hybrid *{transition:none!important}}
    @media(max-width:820px){
      .cpt-hybrid .hb-grid{grid-template-columns:1fr;gap:26px}
      .cpt-hybrid .hb-aside{position:static;top:auto}
      .cpt-hybrid .hb-intro{max-width:54ch}
    }
    @media(max-width:520px){.cpt-hybrid .hb-row{column-gap:14px}}