/* Match the existing tab panel typography and spacing. */
#jelly-cycle{--jc-paper:var(--paper);--jc-ink:var(--ink);--jc-peach:var(--clay-bright);width:100%;max-width:860px;margin-left:auto;margin-right:auto;color:var(--ink)}
#jelly-cycle *{box-sizing:border-box}
.illustration-toolbar{display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px;font:11px var(--mono);color:var(--ink-70)}
.illustration-toolbar button{font:11px var(--mono);color:var(--ink);border:0;background:none;padding:10px 0;min-height:44px;cursor:pointer}
.illustration-toolbar button:focus-visible{outline:2px solid var(--ink);outline-offset:5px}
#jelly-cycle .jc-diagram{position:relative;height:460px;margin:0 0 28px}
#jelly-cycle svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}
#jelly-cycle .jc-node,#jelly-cycle .jc-center{position:absolute;transform:translate(-50%,-50%);background:var(--paper);border:1px solid var(--rule);text-align:center;display:flex;flex-direction:column;justify-content:center;align-items:center;box-sizing:border-box}
#jelly-cycle .jc-node{width:184px;height:108px;padding:16px 12px;border-radius:12px;transition:background-color .5s}
#jelly-cycle .jc-node[data-active=true]{background:color-mix(in srgb,var(--clay-bright) 25%,var(--paper))}
#jelly-cycle .jc-node h3{font-size:17px;margin:0}
#jelly-cycle .jc-node p{font-size:13.5px;margin:8px 0 0}
#jelly-cycle .jc-center{left:50%;top:50%;width:184px;height:94px;padding:16px;background:var(--ink);color:var(--paper);border-radius:24px}
#jelly-cycle .jc-center strong{font:italic 500 23px/1.1 var(--serif)}
#jelly-cycle .jc-center span{font:14px/1.45 var(--disp);margin-top:8px;max-width:20ch;color:rgba(247,244,238,.8)}
#jelly-cycle .jc-caption{border-top:1px solid var(--rule);padding:24px 0 0;display:grid;grid-template-columns:30px 1fr;gap:14px;min-height:100px}
#jelly-cycle .jc-caption b{font:11px var(--mono);padding-top:4px}
#jelly-cycle .jc-caption p{margin:0}
#jelly-cycle .jc-caption small{display:block;font:10px/1.5 var(--mono);letter-spacing:.05em;margin-top:8px;color:var(--ink-70)}
.approach-timeline{list-style:none;margin:0;padding:0}
#approach-animation{position:relative}
#approach-animation .illustration-toolbar{position:absolute;right:0;bottom:0;margin:0}
#approach-animation .illustration-toolbar>span{display:none}
.approach-timeline li{position:relative;display:grid;grid-template-columns:46px 1fr;gap:52px;padding-bottom:24px}
.approach-timeline li:last-child{padding-bottom:16px}
.approach-timeline .at-number{position:relative;z-index:1;display:grid;place-items:center;width:46px;height:46px;background:var(--paper);border:1px solid var(--rule);border-radius:50%;font:13px var(--mono);overflow:hidden}
.approach-timeline .at-number:before{content:'';position:absolute;inset:0;background:var(--clay-bright);transform:translateY(var(--at-fill,100%));transition:transform .6s ease}
.approach-timeline .at-number span{position:relative}
.approach-timeline .at-rail{position:absolute;top:23px;left:22px;height:100%;width:1px;background:var(--rule)}
.approach-timeline .at-rail i{display:block;height:100%;width:100%;background:var(--clay-bright);transform:scaleY(var(--at-progress,0));transform-origin:top}
.approach-timeline h3{margin:4px 0 8px}
.approach-timeline p{max-width:85ch;margin:0}
@media(max-width:650px){
 #jelly-cycle .jc-diagram{height:480px;margin-bottom:28px}
 #jelly-cycle .jc-node{width:43%;height:132px;padding:12px 8px}
 #jelly-cycle .jc-center{width:58%;max-width:184px;height:94px;padding:12px}
 #jelly-cycle .jc-center strong{font-size:20px;max-width:none}
 #jelly-cycle .jc-center span{font-size:12px;margin-top:7px}
 .illustration-toolbar{gap:16px;align-items:flex-start}
 .approach-timeline li{grid-template-columns:40px 1fr;gap:18px;padding-bottom:24px}
 .approach-timeline .at-number{width:40px;height:40px}
 .approach-timeline .at-rail{left:19px;top:20px}
 .approach-timeline h3{margin-top:5px}
 .approach-timeline p{font-size:15px}
}
@media(prefers-reduced-motion:reduce){#jelly-cycle .jc-node,.approach-timeline .at-number:before{transition:none}}


#jelly-cycle .jc-node:nth-of-type(1){left:22%!important;top:18%!important}
#jelly-cycle .jc-node:nth-of-type(2){left:78%!important;top:18%!important}
#jelly-cycle .jc-node:nth-of-type(3){left:78%!important;top:82%!important}
#jelly-cycle .jc-node:nth-of-type(4){left:22%!important;top:82%!important}
@media(max-width:650px){#jelly-cycle .jc-node h3{font-size:15px}#jelly-cycle .jc-node p{font-size:12px;line-height:1.5;margin-top:6px}}

/* Compact tab labels with separate editorial captions. */
#jelly-cycle .jc-node{width:176px;height:52px;padding:14px;border-radius:var(--r);justify-content:center}
#jelly-cycle .jc-node h3{font-size:14.5px;font-weight:400;letter-spacing:-.02em;line-height:1.15}
#jelly-cycle .jc-node p{position:absolute;top:100%;left:-1px;width:calc(100% + 2px);margin:0;padding:10px 2px 2px;background:var(--paper);font:10px/1.65 var(--mono);letter-spacing:.035em;color:var(--ink-70)}
#jelly-cycle .jc-center{width:184px;height:64px;border-radius:var(--r);padding:12px}
#jelly-cycle .jc-center strong{font-size:21px}
#jelly-cycle .jc-center span{position:absolute;top:100%;left:0;width:100%;max-width:none;margin:0;padding:10px 2px;background:var(--paper);color:var(--ink-70);font:10px/1.65 var(--mono);letter-spacing:.035em}
@media(max-width:650px){
 #jelly-cycle .jc-diagram{height:420px}
 #jelly-cycle .jc-node{width:43%;height:52px;padding:8px}
 #jelly-cycle .jc-node h3{font-size:14px}
 #jelly-cycle .jc-node p{font-size:9px}
 #jelly-cycle .jc-center{width:58%;height:60px}
 #jelly-cycle .jc-center strong{font-size:20px}
}

/* Smaller diagram titles on all screen sizes. */
#jelly-cycle .jc-node h3{font-size:12px}

/* Keep captions clear of the complete card outline. */
#jelly-cycle .jc-node p{top:calc(100% + 8px);left:0;width:100%;padding:0 2px 2px}

#jelly-cycle .jc-node p,#jelly-cycle .jc-center span{background:transparent}