.hd-panel{border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--paper-2);position:relative;overflow:hidden;box-shadow:0 40px 120px -40px #000000e6;container-type:inline-size}.hd-stage{--u:calc(100cqw / 640);grid-template-columns:calc(288 * var(--u)) calc(100 * var(--u)) calc(196 * var(--u));padding:calc(26 * var(--u)) calc(28 * var(--u)) calc(22 * var(--u));background:var(--dots);justify-content:center;align-items:center;display:grid;position:relative}.hd-target{flex-direction:column;align-items:center;gap:10px;display:flex}.hd-target-box{width:calc(288 * var(--u));height:calc(252 * var(--u));position:relative}.hd-layer{color:var(--ink);opacity:0;transition:opacity .6s var(--ease);place-items:center;display:grid;position:absolute;inset:0}.hd-layer[data-on=true]{opacity:1}.hd-base{transition:opacity .6s var(--ease), transform .8s var(--ease);transform:translateY(6px)}.hd-base[data-on=true]{transform:none}.hd-target-label{text-align:center;opacity:0;min-height:46px;transition:opacity .6s var(--ease)}.hd-target-label[data-on=true]{opacity:1}.hd-target-name{white-space:nowrap;font-family:var(--font-serif);letter-spacing:-.01em;color:var(--ink);font-size:19px;line-height:1.25;display:block}.hd-target-blurb{white-space:nowrap;color:color-mix(in srgb, var(--ink) 56%, var(--paper-2));margin-top:3px;font-size:12.5px;line-height:1.4;display:block}.hd-arrow{opacity:0;transition:opacity .5s var(--ease);flex-direction:column;justify-content:center;align-items:center;gap:8px;margin-bottom:56px;display:flex;position:relative}.hd-arrow[data-on=true]{opacity:1}.hd-reaction{text-align:center;width:128px;min-height:2.6em;color:var(--ink);text-wrap:balance;justify-content:center;align-items:flex-end;font-size:12.5px;font-weight:500;line-height:1.3;display:flex}.hd-bond-label{font-family:var(--font-mono);letter-spacing:.02em;color:color-mix(in srgb, var(--ink) 56%, var(--paper-2));font-size:11px}.hd-arrow-svg{color:var(--ink-2);display:block;overflow:visible}.hd-arrow-svg path{stroke-dasharray:1;stroke-dashoffset:1px;transition:stroke-dashoffset .7s var(--ease)}.hd-arrow[data-on=true] .hd-arrow-svg path{stroke-dashoffset:0}.hd-arrow-down{display:none}.hd-pres{gap:calc(14 * var(--u));flex-direction:column;display:flex}.hd-pre{opacity:0;transition:opacity .6s var(--ease), transform .8s var(--ease);flex-direction:column;align-items:center;gap:8px;display:flex;transform:translate(10px)}.hd-pre[data-on=true]{opacity:1;transform:none}.hd-pre-box{width:calc(196 * var(--u));height:calc(112 * var(--u));color:var(--ink);place-items:center;display:grid}.hd-pre-label{text-align:center;flex-direction:column;align-items:center;gap:6px;min-height:47px;display:flex}.hd-pre-name{color:var(--ink);font-size:13px;line-height:1.45}.hd-bar{border-top:1px solid var(--line);background:var(--paper-2);justify-content:space-between;align-items:center;gap:20px;min-height:64px;padding:12px 14px 12px 20px;display:flex}.hd-rationale{min-width:0;min-height:3em;color:var(--ink-2);opacity:0;transition:opacity .5s var(--ease);flex:1;align-items:center;font-size:13px;line-height:1.5;display:flex}.hd-rationale[data-on=true]{opacity:1}.hd-controls{flex-shrink:0;align-items:center;gap:2px;display:flex}.hd-dot{cursor:pointer;border-radius:6px;place-items:center;width:22px;height:28px;display:grid}.hd-dot:before{content:"";background:var(--ink-4);width:6px;height:6px;transition:background .3s var(--ease), transform .3s var(--ease);border-radius:50%}.hd-dot:hover:before{background:var(--ink-2)}.hd-dot[aria-current=true]:before{background:var(--ink);transform:scale(1.15)}.hd-pause{border:1px solid var(--line-2);width:30px;height:30px;color:var(--ink-2);cursor:pointer;transition:color .2s var(--ease), border-color .2s var(--ease), background .2s var(--ease);border-radius:999px;place-items:center;margin-left:6px;display:grid}.hd-pause:hover{color:var(--ink);border-color:var(--ink-3);background:#ffffff0d}.hd-sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@container (max-width:519px){.hd-stage{--u:calc(100cqw / 424);grid-template-columns:repeat(2, calc(196 * var(--u)));column-gap:calc(12 * var(--u));padding:calc(18 * var(--u)) calc(10 * var(--u)) calc(16 * var(--u));row-gap:4px}.hd-target{grid-column:1/-1}.hd-target-box{width:calc(404 * var(--u))}.hd-arrow{flex-direction:row;grid-column:1/-1;gap:14px;min-height:52px;margin:0 0 6px}.hd-arrow .hd-bond-label{text-align:right;flex:1;order:1}.hd-arrow-right{display:none}.hd-arrow-down{order:2;display:block}.hd-reaction{text-align:left;flex:1;order:3;justify-content:flex-start;align-items:center;width:auto;min-height:0}.hd-pres{display:contents}.hd-pre{transform:translateY(8px)}.hd-pre-label{min-height:66px}.hd-bar{flex-direction:column;align-items:stretch;gap:6px;padding:12px 12px 8px 16px}.hd-rationale{align-items:flex-start;min-height:4.5em}.hd-controls{justify-content:flex-end}}
