/* ===== spoiler gates (article-spoilers.js, 4_1_225) ===== */
.tr-spz{margin:2.2rem 0 2.8rem;--p:#7F77DD;--t:#5DCAA5;--r:#E0707A;--r2:#f0a3aa;--am:#F2C46B;--pn:rgba(18,17,24,.78);--ln:rgba(127,119,221,.28);--fg:#e9e9f2;--mu:#9a98b0}
html[data-theme="light"] .tr-spz{--p:#5b52b8;--t:#2f8a69;--r:#b23a36;--r2:#8f2f33;--am:#d99a1e;--pn:#fff;--ln:rgba(91,82,184,.22);--fg:#2a2722;--mu:#6a6456}
.tr-spz-in{display:none}
.tr-spz.open .tr-spz-in{display:block;animation:trSpIn .5s ease both}
.tr-spz.open .tr-spz-gate{display:none}
@keyframes trSpIn{from{opacity:0;transform:translateY(10px);filter:blur(5px)}to{opacity:1;transform:none;filter:none}}
.tr-spz-gate{position:relative;display:flex;align-items:center;gap:22px;padding:20px 24px;border-radius:16px;overflow:hidden;font-family:'JetBrains Mono',ui-monospace,monospace;color:var(--fg);
  border:1px solid var(--ln);
  background:radial-gradient(rgba(127,119,221,.10) 1px,transparent 1px) 0 0/18px 18px,
             radial-gradient(120% 140% at 0% 50%,color-mix(in srgb,var(--p) 16%,transparent),transparent 55%),var(--pn);
  box-shadow:0 0 0 1px color-mix(in srgb,var(--p) 8%,transparent),0 0 28px color-mix(in srgb,var(--p) 12%,transparent),0 12px 32px rgba(0,0,0,.25)}
html[data-theme="light"] .tr-spz-gate{background:radial-gradient(rgba(91,82,184,.09) 1px,transparent 1px) 0 0/18px 18px,radial-gradient(120% 140% at 0% 50%,rgba(91,82,184,.08),transparent 55%),#fff;box-shadow:0 8px 22px rgba(40,30,80,.07)}
.tr-spz-gate::before{content:"// SPOILER_GATE";position:absolute;top:8px;right:14px;font-size:9px;letter-spacing:.2em;color:var(--mu);opacity:.55}
.tr-spz-gate::after{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(100deg,transparent 35%,color-mix(in srgb,var(--p) 9%,transparent) 50%,transparent 65%);transform:translateX(-100%);animation:trSpSheen 6s ease-in-out 1.5s infinite}
@keyframes trSpSheen{0%,72%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.tr-spz.opening .tr-spz-gate{animation:trGateOut .45s ease forwards}
@keyframes trGateOut{to{opacity:0;transform:scale(.985);filter:blur(4px)}}
/* ---- bot ---- */
.tr-spz-bot{position:relative;flex-shrink:0;width:104px;height:104px;border-radius:50%;
  background:radial-gradient(circle at 50% 38%,color-mix(in srgb,var(--p) 26%,#1b1926) 0,#15141c 70%);border:1px solid color-mix(in srgb,var(--p) 45%,transparent);
  box-shadow:0 0 0 5px color-mix(in srgb,var(--p) 7%,transparent),0 0 22px color-mix(in srgb,var(--p) 28%,transparent),inset 0 -8px 18px rgba(0,0,0,.35)}
html[data-theme="light"] .tr-spz-bot{background:radial-gradient(circle at 50% 38%,#f1eefc 0,#e3def7 75%);box-shadow:0 0 0 5px rgba(91,82,184,.06),0 0 18px rgba(91,82,184,.16)}
.tr-spz-bot::after{content:"";position:absolute;inset:-7px;border-radius:50%;border:1px dashed color-mix(in srgb,var(--t) 45%,transparent);animation:trOrbit 18s linear infinite}
@keyframes trOrbit{to{transform:rotate(360deg)}}
.tr-bot{width:100%;height:100%;overflow:visible;position:relative;z-index:1}
.tr-bot .head,.tr-bot .body{fill:#262338;stroke:#9a93ec;stroke-width:1.8}
html[data-theme="light"] .tr-bot .head,html[data-theme="light"] .tr-bot .body{fill:#fbfaff;stroke:#5b52b8}
.tr-bot .head{filter:drop-shadow(0 2px 0 rgba(0,0,0,.25))}
.tr-bot .visor{fill:#0b0b12;stroke:color-mix(in srgb,var(--t) 40%,transparent);stroke-width:1}
html[data-theme="light"] .tr-bot .visor{fill:#221f36}
.tr-bot .eyes circle:not(.gl),.tr-bot .eyes path{fill:#6ee0b8;stroke:none;filter:drop-shadow(0 0 3px rgba(93,202,165,.95))}
.tr-bot .eyes path{fill:none;stroke:#6ee0b8;stroke-width:2.2;stroke-linecap:round}
.tr-bot .eyes .gl{fill:#e9fff6}
.tr-bot .eo circle{transform-box:fill-box;transform-origin:center;animation:trBlink 4.4s infinite}
.tr-bot .eyes{animation:trLook 7s ease-in-out infinite}
.tr-bot .ew,.tr-bot .eh,.tr-bot .ex{opacity:0}
.tr-bot .mouth{fill:none;stroke:#9a93ec;stroke-width:1.8;stroke-linecap:round}
html[data-theme="light"] .tr-bot .mouth{stroke:#5b52b8}
.tr-bot .m-o{opacity:0;fill:#9a93ec;stroke:none}
.tr-bot .cheek{fill:#E0707A;opacity:.28}
.tr-bot .ant{stroke:#9a93ec;stroke-width:2;stroke-linecap:round}
html[data-theme="light"] .tr-bot .ant{stroke:#5b52b8}
.tr-bot .ant-tip{fill:#E0707A;filter:drop-shadow(0 0 4px rgba(224,112,122,.9));animation:trPing 1.8s ease-in-out infinite}
.tr-bot .core{fill:#5DCAA5;filter:drop-shadow(0 0 4px rgba(93,202,165,.9));animation:trPing 2.4s ease-in-out .4s infinite}
.tr-bot .cover{opacity:0}
.tr-bot .mitt{fill:#262338;stroke:#9a93ec;stroke-width:1.8}
html[data-theme="light"] .tr-bot .mitt{fill:#fbfaff;stroke:#5b52b8}
.tr-bot .tri{fill:var(--am);stroke:#2b2030;stroke-width:1.8;stroke-linejoin:round;filter:drop-shadow(0 0 5px color-mix(in srgb,var(--am) 55%,transparent))}
.tr-bot .bang{fill:#2b2030}
@keyframes trBob{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-2.6px) rotate(-1.5deg)}}
@keyframes trBlink{0%,93%,100%{transform:scaleY(1)}95.5%{transform:scaleY(.1)}}
@keyframes trLook{0%,38%,100%{transform:translateX(0)}48%,62%{transform:translateX(2.6px)}72%,88%{transform:translateX(-1.8px)}}
@keyframes trPing{0%,100%{opacity:1}50%{opacity:.35}}
/* moods */
.tr-spz-gate.m-tempt .tr-bot .eo,.tr-spz-gate.m-reveal .tr-bot .eo,.tr-spz-gate.m-safe .tr-bot .eo{opacity:0}
.tr-spz-gate.m-tempt .tr-bot .ew{opacity:1}
.tr-spz-gate.m-tempt .tr-bot .m-smile{opacity:0}
.tr-spz-gate.m-tempt .tr-bot .m-o{opacity:1}
.tr-spz-gate.m-tempt .tr-bot .ant-tip{animation-duration:.5s}
.tr-spz-gate.m-safe .tr-bot .eh{opacity:1}
.tr-spz-gate.m-safe .tr-bot .cheek{opacity:.6}
.tr-spz-gate.m-safe .tr-bot .bot{animation:trHop .7s ease-in-out infinite}
@keyframes trHop{0%,100%{transform:translateY(0)}40%{transform:translateY(-5px)}}
.tr-spz-gate.m-reveal .tr-bot .cover{opacity:1;animation:trCover .35s ease-out .15s both}
@keyframes trCover{from{transform:translateY(18px);opacity:0}to{transform:none;opacity:1}}
@keyframes trShake{0%,100%{transform:translateX(0)}50%{transform:translateX(1.4px)}}
/* ---- speech + text ---- */
.tr-spz-txt{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.tr-spz-say{position:relative;align-self:flex-start;display:inline-flex;align-items:center;gap:2px;max-width:100%;margin-bottom:4px;padding:5px 11px;border-radius:10px 10px 10px 3px;
  font-size:11.5px;letter-spacing:.03em;color:var(--t);background:color-mix(in srgb,var(--t) 10%,transparent);border:1px solid color-mix(in srgb,var(--t) 32%,transparent);min-height:26px}
.tr-spz-say .w::before{content:"> ";opacity:.6}
.tr-spz-say i{display:inline-block;width:7px;height:13px;background:var(--t);opacity:.8;animation:trCur 1s steps(1) infinite;margin-left:2px}
@keyframes trCur{50%{opacity:0}}
.tr-spz-gate.m-tempt .tr-spz-say{color:var(--am);background:color-mix(in srgb,var(--am) 10%,transparent);border-color:color-mix(in srgb,var(--am) 38%,transparent)}
.tr-spz-gate.m-tempt .tr-spz-say i{background:var(--am)}
.tr-spz-gate.m-reveal .tr-spz-say{color:var(--r2);background:color-mix(in srgb,var(--r) 10%,transparent);border-color:color-mix(in srgb,var(--r) 38%,transparent)}
.tr-spz-gate.m-reveal .tr-spz-say i{background:var(--r)}
.tr-spz-txt b{font-size:12px;letter-spacing:.18em;text-transform:uppercase;color:var(--p)}
.tr-spz-txt b::before{content:"\25B2  ";color:var(--am);font-size:10px}
.tr-spz-txt > span:not(.tr-spz-say){font-size:13px;line-height:1.55;color:var(--mu)}
.tr-spz-txt em{font-style:normal;font-weight:700;color:var(--fg)}
.tr-spz-acts{display:flex;flex-direction:column;gap:8px;flex-shrink:0}
.tr-spz-acts button,.tr-spz-hide{font-family:'JetBrains Mono',ui-monospace,monospace;font-size:11px;letter-spacing:.08em;text-transform:uppercase;padding:9px 16px;border-radius:999px;cursor:pointer;transition:background .15s,box-shadow .15s,border-color .15s,color .15s;white-space:nowrap}
.tr-spz-open{background:color-mix(in srgb,var(--p) 16%,transparent);border:1px solid color-mix(in srgb,var(--p) 60%,transparent);color:color-mix(in srgb,var(--p) 55%,var(--fg))}
.tr-spz-open:hover,.tr-spz-open:focus-visible{background:color-mix(in srgb,var(--am) 14%,transparent);border-color:color-mix(in srgb,var(--am) 65%,transparent);color:color-mix(in srgb,var(--am) 70%,var(--fg));box-shadow:0 0 16px color-mix(in srgb,var(--am) 25%,transparent)}
.tr-spz-skip,.tr-spz-hide{background:transparent;border:1px solid color-mix(in srgb,var(--t) 40%,var(--ln));color:color-mix(in srgb,var(--t) 70%,var(--fg))}
.tr-spz-skip:hover,.tr-spz-hide:hover,.tr-spz-skip:focus-visible{background:color-mix(in srgb,var(--t) 10%,transparent);border-color:var(--t);box-shadow:0 0 14px color-mix(in srgb,var(--t) 22%,transparent)}
.tr-spz-hide{display:block;margin:1.8rem 0 0}
/* inline */
.tr-sp{filter:blur(5px);background:rgba(127,119,221,.14);border-radius:4px;padding:0 2px;cursor:pointer;transition:filter .3s;user-select:none}
.tr-sp.on{filter:none;background:rgba(127,119,221,.08);cursor:text;user-select:auto}
.tr-sp:focus-visible{outline:2px solid #7F77DD;outline-offset:2px}
@media (max-width:760px){
  .tr-spz-gate{flex-wrap:wrap;gap:14px;padding:18px 16px 16px}
  .tr-spz-gate::before{display:none}
  .tr-spz-bot{width:80px;height:80px}
  .tr-spz-txt{flex:1 1 calc(100% - 100px)}
  .tr-spz-acts{flex-direction:row;width:100%}
  .tr-spz-acts button{flex:1}
}
@media (prefers-reduced-motion:reduce){
  .tr-bot *,.tr-spz-bot::after,.tr-spz-gate::after,.tr-spz.open .tr-spz-in,.tr-spz.opening .tr-spz-gate,.tr-spz-say i{animation:none !important}
}
/* 4_1_225 v3: centred bot holding the sign in front like a placard */
.tr-bot .arm,.tr-bot .arm-c,.tr-bot .leg{fill:none;stroke:#9a93ec;stroke-width:3.4;stroke-linecap:round}
html[data-theme="light"] .tr-bot .arm,html[data-theme="light"] .tr-bot .arm-c,html[data-theme="light"] .tr-bot .leg{stroke:#5b52b8}
.tr-bot .hand{fill:#262338;stroke:#9a93ec;stroke-width:1.8}
html[data-theme="light"] .tr-bot .hand{fill:#fbfaff;stroke:#5b52b8}
.tr-bot .bot{transform-box:view-box;transform-origin:60px 100px;animation:trBob 2.8s ease-in-out infinite}
.tr-bot .headg{transform-box:view-box;transform-origin:60px 52px;animation:trTilt 5.6s ease-in-out infinite}
.tr-bot .signg{transform-box:view-box;transform-origin:60px 96px;animation:trHold 2.8s ease-in-out infinite}
@keyframes trTilt{0%,30%,100%{transform:rotate(0)}40%,55%{transform:rotate(-6deg)}65%,85%{transform:rotate(5deg)}}
@keyframes trHold{0%,100%{transform:translateY(0) rotate(0)}25%{transform:translateY(-3px) rotate(-4deg)}50%{transform:translateY(-4px) rotate(0)}75%{transform:translateY(-3px) rotate(4deg)}}
@keyframes trShakeSign{0%,100%{transform:translateY(-4px) rotate(0)}25%{transform:translateY(-6px) rotate(-7deg)}75%{transform:translateY(-6px) rotate(7deg)}}
.tr-spz-gate.m-tempt .tr-bot .signg{animation:trShakeSign .4s ease-in-out infinite}
.tr-spz-gate.m-tempt .tr-bot .headg{animation:none}
.tr-spz-gate.m-reveal .tr-bot .signg{animation:trLower .5s ease-in forwards}
@keyframes trLower{to{transform:translateY(26px);opacity:0}}
.tr-spz-gate.m-reveal .tr-bot .bot{animation:trShake .12s linear .5s 5}
.tr-spz-mk{margin-top:2.4rem}

.tr-bot .fing{fill:none;stroke:#9a93ec;stroke-width:1.1;stroke-linecap:round;opacity:.7}
html[data-theme="light"] .tr-bot .fing{stroke:#5b52b8}
.tr-spz-gate.m-reveal .tr-bot .headg{animation:none}

/* 4_1_226 refined bot */
.tr-spz{--bf:#1e1c2b;--bf2:#2a2740;--bs:#a49df0;--glow:rgba(127,119,221,.55)}
html[data-theme="light"] .tr-spz{--bf:#ffffff;--bf2:#f1effc;--bs:#5b52b8;--glow:rgba(91,82,184,.25)}
.tr-bot .head,.tr-bot .body,.tr-bot .mitt,.tr-bot .hand{fill:var(--bf2);stroke:var(--bs);stroke-width:1.5}
.tr-bot .head{filter:drop-shadow(0 0 4px var(--glow))}
.tr-bot .ear,.tr-bot .neck{fill:var(--bf);stroke:var(--bs);stroke-width:1.3}
.tr-bot .shine{fill:none;stroke:rgba(255,255,255,.35);stroke-width:1.3;stroke-linecap:round}
html[data-theme="light"] .tr-bot .shine{stroke:rgba(91,82,184,.25)}
.tr-bot .visor{fill:#0c0b14;stroke:color-mix(in srgb,var(--t) 45%,transparent);stroke-width:.9}
html[data-theme="light"] .tr-bot .visor{fill:#1f1c33}
.tr-bot .scan{fill:#6ee0b8;opacity:.0;animation:trScan 3.6s ease-in-out infinite}
@keyframes trScan{0%,55%{opacity:0;transform:translateY(0)}62%{opacity:.35}85%{opacity:.25;transform:translateY(9.5px)}90%,100%{opacity:0;transform:translateY(9.5px)}}
.tr-bot .eo rect{fill:#6ee0b8;filter:drop-shadow(0 0 3px rgba(93,202,165,.95));transform-box:fill-box;transform-origin:center;animation:trBlink 4.4s infinite}
.tr-bot .seam{fill:none;stroke:var(--bs);stroke-width:1;opacity:.45;stroke-linecap:round}
.tr-bot .core{display:none}
.tr-bot .arm,.tr-bot .arm-c,.tr-bot .leg,.tr-bot .ant{stroke:var(--bs);stroke-width:2.6}
.tr-bot .foot{fill:var(--bs)}
.tr-bot .ant-tip{fill:#E0707A}
.tr-bot .board{fill:var(--bf);filter:drop-shadow(0 0 6px color-mix(in srgb,var(--am) 35%,transparent))}
.tr-bot .board-ln{fill:none;stroke:var(--am);stroke-width:1.4}
.tr-bot .hz{fill:var(--am);opacity:.85}
.tr-bot .ico{fill:color-mix(in srgb,var(--am) 18%,transparent);stroke:var(--am);stroke-width:1.4;stroke-linejoin:round;animation:trIco 2.4s ease-in-out infinite}
.tr-bot .bang{fill:var(--am)}
@keyframes trIco{0%,100%{filter:drop-shadow(0 0 0 transparent)}50%{filter:drop-shadow(0 0 3px var(--am))}}
.tr-spz-gate.m-tempt .tr-bot .ico{animation-duration:.5s}
.tr-bot .fing{stroke:var(--bs)}
.tr-bot .cheek{fill:#E0707A;opacity:.35}
.tr-spz-bot{background:radial-gradient(circle at 50% 36%,color-mix(in srgb,var(--p) 22%,#17151f) 0,#121119 72%)}
html[data-theme="light"] .tr-spz-bot{background:radial-gradient(circle at 50% 36%,#f6f4ff 0,#e7e3f8 75%)}
.tr-spz-gate::before{opacity:.8}
.tr-spz-txt > span:not(.tr-spz-say){line-height:1.7}
@media (prefers-reduced-motion:reduce){.tr-bot .scan,.tr-bot .ico{animation:none !important}}

.tr-bot .shadow{fill:#000;opacity:.35;filter:blur(1.2px)}
html[data-theme="light"] .tr-bot .shadow{fill:#5b52b8;opacity:.14}
.tr-bot .wrist{fill:none;stroke:var(--bs);stroke-width:2.6;stroke-linecap:round}

.tr-spz{--bf:#2b2842;--bf2:#3b3660}
html[data-theme="light"] .tr-spz{--bf:#ffffff;--bf2:#f1effc}
.tr-bot .head,.tr-bot .body,.tr-bot .mitt,.tr-bot .hand{stroke-width:1.8}
.tr-bot .arm,.tr-bot .arm-c,.tr-bot .leg,.tr-bot .ant{stroke-width:3}
.tr-bot .body{fill:url(#trBodyG)}
.tr-bot .head{fill:url(#trHeadG)}
html[data-theme="light"] .tr-bot .body,html[data-theme="light"] .tr-bot .head{fill:var(--bf2)}
.tr-bot .board{filter:drop-shadow(0 2px 2px rgba(0,0,0,.35)) drop-shadow(0 0 6px color-mix(in srgb,var(--am) 30%,transparent))}