/* Plot Twist Loop motion card (2026-10-01). Part 1 retold in the site palette:
   a text thread that lands on the twist, a slim game strip underneath. Sizes are
   in cqw of the card, so the composition is identical at 340 and 420 px.
   Transform and opacity only. Without JS, or with reduced motion, the base
   styles below are the twist frame. Timeline lives in ptl-motion.js. */
.ptlm{--pc:var(--cream,#f1e9dc);--ps:var(--cream-muted,#a2988c);--pb:var(--brass,#dcae63);--pg:var(--ground,#14110f);--pu:var(--surface,#1c1815);--p2:var(--surface-2,#272119);--pe:var(--edge,rgba(241,233,220,.1));--pl:var(--edge-lit,rgba(241,233,220,.2));--fd:var(--ff-display,Archivo,Arial,sans-serif);--fs:var(--ff-sans,Archivo,Arial,sans-serif);--fm:var(--ff-mono,ui-monospace,monospace);margin:0 auto;width:min(100%,26.25rem)}
@media (min-width:860px){.brot__still.ptlm,.ptlm{width:min(100%,23.75rem)}
}
.ptlm .ptlm__card{position:relative;overflow:hidden;padding:0;border:0;border-radius:var(--r-md,10px);background:var(--pu);container-type:inline-size}
.ptlm__card::after{content:"";position:absolute;inset:0;border:1px solid var(--pe);border-radius:inherit;pointer-events:none;z-index:3}
.ptlm .ai{top:5.2cqw;right:5.6cqw}
.ptlm__stage{position:relative;aspect-ratio:9/16;color:var(--pc);font-family:var(--fs)}
.ptlm__stage p{margin:0}
.ptlm__stage i{font-style:normal}
.ptlm__in{position:absolute;inset:0;display:flex;flex-direction:column;padding:6.4cqw 5.6cqw 0}
.ptlm__lb{font:600 max(9px,2.7cqw)/1.3 var(--fm);font-stretch:87.5%;letter-spacing:.14em;text-transform:uppercase;color:var(--ps)}
.ptlm__lb b{color:var(--pb);font-weight:600}
.ptlm__t{margin-top:2.6cqw!important;font:800 9.4cqw/.94 var(--fd);font-stretch:80%;text-transform:uppercase;letter-spacing:-.005em;text-wrap:balance}
.ptlm__ph{position:relative;flex:1;margin-top:5.2cqw;border:1px solid var(--pe);border-radius:5.4cqw;background:var(--pg);overflow:hidden}
.ptlm__sc{position:absolute;inset:0;display:flex;flex-direction:column}
.ptlm__bar{display:flex;align-items:center;gap:2.6cqw;padding:3cqw 4cqw;border-bottom:1px solid var(--pe)}
.ptlm__av{display:grid;place-items:center;width:7.4cqw;height:7.4cqw;border-radius:50%;background:var(--p2);box-shadow:inset 0 0 0 1px var(--pl);font:700 3.4cqw/1 var(--fd);font-stretch:84%}
.ptlm__bar p{position:relative;display:grid;line-height:1.25}
.ptlm__bar b{font-weight:600;font-size:3.9cqw}
.ptlm__on,.ptlm__ty{grid-area:2/1;font:500 max(8.5px,2.5cqw)/1.4 var(--fm);letter-spacing:.06em;color:var(--ps)}
.ptlm__ty{opacity:0}
.ptlm__th{flex:1;display:flex;flex-direction:column;gap:2.2cqw;padding:4.4cqw 4cqw}
.ptlm__m{position:relative;display:flex}
.ptlm__m--me{justify-content:flex-end}
.ptlm__m p{max-width:86%;padding:2.3cqw 3.8cqw 2.5cqw;border-radius:5cqw 5cqw 5cqw 1.4cqw;background:var(--p2);font-size:4.3cqw;line-height:1.3;font-weight:450;transform-origin:0 100%}
.ptlm__m--me p{background:var(--pc);color:var(--pg);border-radius:5cqw 5cqw 1.4cqw 5cqw;transform-origin:100% 100%;font-weight:500}
.ptlm__dt{position:absolute;left:0;top:0;display:flex;gap:1.3cqw;padding:3.5cqw 4cqw;border-radius:5cqw 5cqw 5cqw 1.4cqw;background:var(--p2);opacity:0;transform-origin:0 100%}
.ptlm__dt i{width:1.6cqw;height:1.6cqw;border-radius:50%;background:var(--ps);animation:ptlm-dot 1.05s cubic-bezier(.45,0,.55,1) infinite paused}
.ptlm__dt i:nth-child(2){animation-delay:.15s}
.ptlm__dt i:nth-child(3){animation-delay:.3s}
.ptlm__iv{display:grid;gap:1.4cqw;padding:3.4cqw 4.4cqw 3.6cqw;border:1px solid var(--pl);border-radius:3cqw 3cqw 3cqw 1.2cqw;background:var(--pu);transform-origin:0 100%}
.ptlm__iv small{font:500 max(8.5px,2.5cqw)/1.3 var(--fm);letter-spacing:.12em;text-transform:uppercase;color:var(--ps)}
.ptlm__iv b{font:800 6.6cqw/.95 var(--fd);font-stretch:80%;text-transform:uppercase}
.ptlm__tw{position:absolute;left:4.4cqw;bottom:5cqw;width:fit-content;font:800 11.6cqw/.9 var(--fd);font-stretch:78%;text-transform:uppercase;letter-spacing:-.005em}
.ptlm__tw>span,.ptlm__end>span{display:block;overflow:hidden;padding-bottom:.04em}
.ptlm__tw>span>span,.ptlm__end>span>span{display:block}
.ptlm__tw>span+span{color:var(--pb)}
.ptlm__tw i{display:block;height:max(2px,.6cqw);margin-top:1.8cqw;background:var(--pb);transform-origin:0 50%}
.ptlm__cm{display:flex;align-items:center;gap:2cqw;padding:0 3.4cqw 3.6cqw;opacity:0}
.ptlm__fd{position:relative;flex:1;display:flex;align-items:center;height:8.8cqw;padding:0 3.6cqw;border:1px solid var(--pl);border-radius:4.4cqw;background:var(--pu);font-size:3.5cqw;white-space:nowrap}
.ptlm__p0{color:var(--ps)}
.ptlm__t0{position:absolute;left:3.6cqw;overflow:hidden;padding-right:.4cqw;opacity:0}
.ptlm__t0 i{position:absolute;top:0;bottom:0;left:0;width:100%;background:var(--pu)}
.ptlm__t0 i::before{content:"";position:absolute;left:0;top:8%;bottom:8%;width:max(1.5px,.45cqw);background:var(--pb)}
.ptlm__go{position:relative;flex:none;width:8.8cqw;height:8.8cqw;border-radius:50%;background:var(--pc)}
.ptlm__go::before,.ptlm__go::after{content:"";position:absolute;left:50%;background:var(--pg)}
.ptlm__go::before{top:28%;width:max(1.5px,.55cqw);height:44%;margin-left:max(-.75px,-.275cqw)}
.ptlm__go::after{top:30%;width:2.6cqw;height:2.6cqw;margin-left:-1.3cqw;background:none;border:solid var(--pg);border-width:max(1.5px,.55cqw) 0 0 max(1.5px,.55cqw);transform:rotate(45deg)}
.ptlm__end{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;padding:0 7cqw;font:800 14cqw/.88 var(--fd);font-stretch:78%;text-transform:uppercase;letter-spacing:-.01em}
.ptlm__end>span+span{color:var(--ps)}
.ptlm__end small{margin-top:5cqw;font:500 max(9px,2.6cqw)/1.3 var(--fm);letter-spacing:.12em;color:var(--pc);text-transform:none}
.ptlm__end>span>span,.ptlm__end small{opacity:0}
.ptlm__gm{position:relative;flex:none;height:25cqw;margin:4.6cqw -5.6cqw 0;border-top:1px solid var(--pe);background:var(--pg);overflow:hidden}
.ptlm__tk{position:absolute;inset:0;animation:ptlm-run 3s linear infinite paused}
.ptlm__tk i{position:absolute;left:-2cqw;bottom:4cqw;width:14cqw;height:1.8cqw;border-radius:.9cqw;background:rgba(241,233,220,.15);box-shadow:inset 0 1px 0 rgba(241,233,220,.3)}
.ptlm__tk i:nth-child(4n+1){bottom:10cqw}
.ptlm__tk i:nth-child(4n+3){bottom:8cqw}
.ptlm__tk i:nth-child(4n){bottom:5.5cqw}
.ptlm__tk i:nth-child(2){left:23cqw}
.ptlm__tk i:nth-child(3){left:48cqw}
.ptlm__tk i:nth-child(4){left:73cqw}
.ptlm__tk i:nth-child(5){left:98cqw}
.ptlm__tk i:nth-child(6){left:123cqw}
.ptlm__tk i:nth-child(7){left:148cqw}
.ptlm__tk i:nth-child(8){left:173cqw}
.ptlm__tk i:nth-child(9){left:198cqw}
.ptlm__bl{position:absolute;left:28cqw;bottom:0;width:4cqw;height:4cqw;transform:translateY(-5.8cqw);animation:ptlm-hop 3s linear infinite paused}
.ptlm__bl i{display:block;width:100%;height:100%;border-radius:50%;background:var(--pb);transform-origin:50% 100%;animation:ptlm-sq .75s linear infinite paused}
.ptlm__fl{position:absolute;inset:0;background:var(--pb);opacity:0;pointer-events:none}
@keyframes ptlm-dot{0%,60%,100%{transform:none;opacity:.5}
30%{transform:translateY(-.9cqw);opacity:1}
}
@keyframes ptlm-run{to{transform:translateX(-100cqw)}
}
@keyframes ptlm-hop{0%{transform:translateY(-5.8cqw);animation-timing-function:cubic-bezier(.33,.67,.67,1)}
12.5%{transform:translateY(-16.3cqw);animation-timing-function:cubic-bezier(.33,0,.67,.33)}
25%{transform:translateY(-9.8cqw);animation-timing-function:cubic-bezier(.33,.67,.67,1)}
37.5%{transform:translateY(-16.3cqw);animation-timing-function:cubic-bezier(.33,0,.67,.33)}
50%{transform:translateY(-7.3cqw);animation-timing-function:cubic-bezier(.33,.67,.67,1)}
62.5%{transform:translateY(-18.3cqw);animation-timing-function:cubic-bezier(.33,0,.67,.33)}
75%{transform:translateY(-11.8cqw);animation-timing-function:cubic-bezier(.33,.67,.67,1)}
87.5%{transform:translateY(-18.3cqw);animation-timing-function:cubic-bezier(.33,0,.67,.33)}
100%{transform:translateY(-5.8cqw)}
}
@keyframes ptlm-sq{0%{transform:scale(1.22,.78)}
9%{transform:scale(.94,1.07);animation-timing-function:cubic-bezier(.3,0,.2,1)}
22%,82%{transform:none}
96%{transform:scale(.95,1.06)}
100%{transform:scale(1.22,.78)}
}
@media (prefers-reduced-motion:reduce){.ptlm *{animation:none!important}
}