/* the one dark page */
:root[data-lock="dark"] body{background:#0A0B0F}
:root[data-lock="dark"]{--panel:#15171E;--teal:#2BD9C2}
body.p3 .ch{padding:128px 0 clamp(40px,6vw,80px);position:relative}
.ch::before{content:"";position:absolute;inset:0;background:radial-gradient(40% 50% at 78% 30%,rgba(43,217,194,.12),transparent 70%),radial-gradient(35% 45% at 10% 0%,rgba(255,225,77,.1),transparent 70%);pointer-events:none}
.ch-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr);gap:clamp(28px,5vw,72px);align-items:center;position:relative}
.ch-t .kick{display:block;margin-bottom:16px;color:var(--teal)}
.ch-t h1{text-align:left;max-width:none;margin:0 0 18px;font-size:clamp(2.2rem,4.6vw,4.1rem)}
.ch-t .lede{text-align:left;margin:0 0 24px}.ch-t .ctas{justify-content:flex-start;margin:0}.ch-t .note{margin:14px 0 0;text-align:left;font-size:.84rem;color:var(--sub)}
:root[data-lock="dark"] .btn.yel{background:var(--hl);color:#111318;box-shadow:none}
.age{padding:clamp(22px,3vw,34px);background:var(--panel)!important;animation:up 1s .3s var(--ease) both}
.age-h{display:flex;justify-content:space-between;align-items:center;font:700 .78rem var(--f-b);letter-spacing:.12em;text-transform:uppercase;color:var(--sub)}
.age-h em{font:500 .74rem var(--f-b);font-style:normal;letter-spacing:0;text-transform:none;padding:.2em .7em;border-radius:99px;box-shadow:inset 0 0 0 1px var(--line)}
.age-tot{font:700 clamp(2.4rem,5vw,3.8rem)/1.05 var(--f-h);letter-spacing:-.04em;color:var(--ink);margin:14px 0 20px;font-variant-numeric:tabular-nums}
.age-bar{display:flex;height:26px;border-radius:99px;overflow:hidden;gap:3px;clip-path:inset(0 100% 0 0 round 99px);animation:fillbar 1.8s .6s var(--ease) forwards}
@keyframes fillbar{to{clip-path:inset(0 0 0 0 round 99px)}}
.age-bar i{display:block;width:calc(var(--w)*1%);min-width:6px}
.a1{--c:#2BD9C2}.a2{--c:#FFC23D}.a3{--c:#FF8A3D}.a4{--c:#FF6B70}
.age-bar i{background:var(--c)}
.age-l{list-style:none;margin:20px 0 0;padding:0;display:grid;grid-template-columns:1fr 1fr;gap:14px 18px}
.age-l li{font:600 1.15rem var(--f-h);color:var(--ink);font-variant-numeric:tabular-nums;position:relative;padding-left:16px}
.age-l li::before{content:"";position:absolute;left:0;top:.45em;width:9px;height:9px;border-radius:50%;background:var(--c)}
.age-l b{display:block;font:500 .78rem var(--f-b);color:var(--sub)}
.age-foot{display:flex;align-items:center;gap:10px;margin-top:20px;padding-top:16px;border-top:1px solid var(--line);font-size:.86rem;color:var(--sub)}
.dot{width:10px;height:10px;border-radius:50%;background:var(--red);animation:pulse 2s ease-out infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(255,107,112,.6)}100%{box-shadow:0 0 0 12px rgba(255,107,112,0)}}
/* bento */
.bgrid{display:grid;grid-template-columns:repeat(12,1fr);gap:16px;margin-top:44px}
.tile{padding:clamp(22px,2.6vw,32px);background:var(--panel)!important;overflow:hidden;position:relative;display:flex;flex-direction:column;text-align:left}
.tile .num{font:700 .74rem var(--f-m);letter-spacing:.14em;color:var(--teal);margin-bottom:10px}
.tile h3{font-size:clamp(1.25rem,2vw,1.7rem);line-height:1.1;letter-spacing:-.03em;margin-bottom:10px}
.tile p{color:var(--sub);font-size:.96rem;margin:0 0 16px}
.t-chase{grid-column:span 7;grid-row:span 2}.t-claim{grid-column:span 5}.t-ret{grid-column:span 5}
.t-pay,.t-soa,.t-owe{grid-column:span 4}
.shotbox{margin-top:auto;border-radius:16px;overflow:hidden;background:#0F1116;box-shadow:inset 0 0 0 1px var(--line);max-height:230px}
.shotbox img{display:block;width:100%;height:auto;transition:transform 1.2s var(--ease);transform-origin:0 0}
.tile:hover .shotbox img{transform:scale(1.06)}
.t-claim .shotbox{max-height:210px}.t-claim .shotbox img{width:150%;max-width:none}
.t-pay .shotbox img{width:170%;max-width:none}
/* chase demo */
.tones3{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:14px}
.tones3 button{font:600 .9rem var(--f-b);color:var(--ink);background:rgba(255,255,255,.06);border:0;border-radius:99px;padding:.6em 1.1em;cursor:pointer;box-shadow:inset 0 0 0 1px var(--line);transition:all .3s var(--ease);display:inline-flex;align-items:center;gap:8px}
.tones3 button small{font:500 .72rem var(--f-b);color:var(--sub)}
.tones3 button:hover{background:rgba(255,255,255,.1)}
.tones3 button[aria-pressed="true"]{background:var(--hl);color:#111318;box-shadow:none}.tones3 button[aria-pressed="true"] small{color:rgba(17,19,24,.6)}
.paper{background:#F7F4EE;border-radius:14px;padding:clamp(16px,2.4vw,26px);box-shadow:0 24px 50px rgba(0,0,0,.45)}
.lts{display:grid}.lt{grid-area:1/1;opacity:0;transform:translateY(10px);transition:opacity .45s var(--ease),transform .55s var(--ease);pointer-events:none}
.lt.on{opacity:1;transform:none;pointer-events:auto}
.lt pre{margin:0;white-space:pre-wrap;font:.76rem/1.55 'Times New Roman',Times,serif;color:#1c1c1c}
.chips{display:flex;gap:8px;margin-top:14px;flex-wrap:wrap}
.chips span{padding:.5em 1em;border-radius:99px;font:600 .8rem var(--f-b);color:var(--ink);background:rgba(255,255,255,.07);box-shadow:inset 0 0 0 1px var(--line)}
.chips .pr{background:var(--hl);color:#111318;box-shadow:none}
.cfine{font-size:.78rem!important;margin:10px 0 0!important}
/* timeline */
.tl{position:relative;display:grid;gap:18px;padding-left:26px;margin-top:6px}
.tl::before{content:"";position:absolute;left:6px;top:8px;bottom:8px;width:2px;background:var(--line)}
.tl::after{content:"";position:absolute;left:6px;top:8px;bottom:8px;width:2px;background:var(--teal);transform:scaleY(0);transform-origin:top;transition:transform 2.4s var(--ease)}
.tl.go::after{transform:none}
.tli{position:relative;opacity:.3;transition:opacity .6s var(--ease)}
.tli i{position:absolute;left:-26px;top:.3em;width:14px;height:14px;border-radius:50%;background:var(--panel);box-shadow:inset 0 0 0 2px var(--line);transition:all .5s var(--ease)}
.tli b{display:block;font:600 1rem var(--f-h);color:var(--ink)}.tli small{color:var(--sub);font-size:.84rem}
.tl.go .tli{opacity:1}.tl.go .tli i{background:var(--teal);box-shadow:0 0 0 5px rgba(43,217,194,.18)}
.tl.go .tli:nth-child(1),.tl.go .tli:nth-child(1) i{transition-delay:.2s}.tl.go .tli:nth-child(2),.tl.go .tli:nth-child(2) i{transition-delay:.9s}.tl.go .tli:nth-child(3),.tl.go .tli:nth-child(3) i{transition-delay:1.6s}.tl.go .tli:nth-child(4),.tl.go .tli:nth-child(4) i{transition-delay:2.3s}
/* dark tweaks for shared parts */
:root[data-lock="dark"] .dcard{background:var(--panel)}
:root[data-lock="dark"] .btn.pri{background:var(--hl);color:#111318}
:root[data-lock="dark"] .close{background:var(--hl)}
:root[data-lock="dark"] .close .btn.pri{background:#111318;color:#fff}
:root[data-lock="dark"] .stp li,:root[data-lock="dark"] .rel a{background:var(--panel)}
@media (max-width:900px){
 body.p3 .ch{padding-top:104px}.ch-in{grid-template-columns:1fr}
 .bgrid{grid-template-columns:1fr}.t-chase,.t-claim,.t-ret,.t-pay,.t-soa,.t-owe{grid-column:auto;grid-row:auto}
}
@media (prefers-reduced-motion:reduce){.age,.dot{animation:none!important}.age-bar{animation:none;clip-path:none}.lt,.tl::after,.tli,.tli i,.shotbox img{transition:none!important}.tl::after{transform:none}.tli{opacity:1}.tli i{background:var(--teal)}}
.t-owe .shotbox img{width:200%;max-width:none}