/* ==========================================================================
   Trusts, explained (12 Oct 2026, second pass). Laurence: no pastel, nothing
   "for kids"; clear, professional, and use animation so people see how a trust
   works and know how to set one up. Every trust is drawn on one diagram
   (tpd-*, driven by static/trusts.js); pages use tx-*.
   Loaded only on /trusts and the trust pages.
   ========================================================================== */
main.eg-page>.tx{max-width:none;padding:0}
.tx{
  --tx-display:"Inter Tight","Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --x-ink:#0E1B16;--x-ink-2:#46544E;--x-ink-3:#6F7C76;
  --x-bg:#FDFBF6;--x-bg-2:#F2EEE4;--x-bg-3:#E8E2D5;  /* ivory palette, matches eg6.css (13 Oct 2026) */
  --x-line:#E2DBCC;--x-line-2:#CBC2B0;--x-dot:rgba(14,27,22,.07);
  --x-green:#0F5A44;--x-green-2:#0A4434;--x-green-t:#E5F1EA;
  --x-gold:#99680E;--x-gold-2:#E6AA3C;--x-gold-t:#FBF0D8;
  --x-red:#B1402A;--x-red-t:#FBE7E1;
  --x-amber:#8F5B00;--x-amber-t:#FCF0D5;
  --x-shadow:0 1px 2px rgba(14,27,22,.05),0 20px 44px -28px rgba(14,27,22,.38);
  --eg-display:var(--tx-display);
  color:var(--x-ink)
}
[data-theme="dark"] .tx{
  --x-ink:#ECF0EE;--x-ink-2:#B5C2BC;--x-ink-3:#8D9B95;
  --x-bg:#111816;--x-bg-2:#151E1B;--x-bg-3:#1B2521;
  --x-line:#24302B;--x-line-2:#33433C;--x-dot:rgba(236,240,238,.06);
  --x-green:#5CC29C;--x-green-2:#7FD6B4;--x-green-t:#132E26;
  --x-gold:#E8B95E;--x-gold-2:#E8B95E;--x-gold-t:#2A2312;
  --x-red:#EE8B6F;--x-red-t:#33201A;
  --x-amber:#EEC36C;--x-amber-t:#2A2312;
  --x-shadow:0 1px 2px rgba(0,0,0,.3),0 20px 44px -26px rgba(0,0,0,.8)
}
body.eg .tx :is(h1,h2,h3){font-family:var(--tx-display);font-weight:700;letter-spacing:-.025em;color:var(--x-ink);text-wrap:balance}
.tx :is(.tx-hero,.tx-basics,.tx-guide,.tx-list,.tx-pro,.tx-after,.tx-thead,.tx-worked,.tx-work,.tx-name,.tx-pager,.tx-fine,.tx-more){padding-inline:var(--eg-inset);box-sizing:border-box}
.tx .eg-crumbs ol{margin-bottom:14px}
.tx-kicker{margin:0 0 10px;color:var(--x-green);font:700 .8rem var(--eg-text);letter-spacing:.08em;text-transform:uppercase}
.tx-h2{margin:0 0 6px;font-size:clamp(1.6rem,2.8vw,2.3rem);line-height:1.1}
.tx-sub{margin:0 0 22px;color:var(--x-ink-2);font-size:1.04rem;line-height:1.55;max-width:46em}
.tx-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:0 20px;border:1px solid var(--x-line-2);border-radius:12px;background:var(--x-bg);color:var(--x-ink)!important;font:650 .98rem var(--eg-text);text-decoration:none!important;cursor:pointer;transition:background .15s,border-color .15s,transform .15s}
.tx-btn:hover{border-color:var(--x-ink-3);transform:translateY(-1px)}
.tx-btn--main{background:var(--x-green);border-color:var(--x-green);color:#fff!important}
[data-theme="dark"] .tx-btn--main{color:#08130F!important}
.tx-btn--main:hover{background:var(--x-green-2);border-color:var(--x-green-2)}
.tx-actions{display:flex;flex-wrap:wrap;gap:10px}

/* ---------------------------------------------------------------- the diagram */
.tpd{display:grid;grid-template-columns:minmax(0,1fr);grid-template-areas:"bars" "stage" "cap" "ctrl";margin:0;border:1px solid var(--x-line);border-radius:20px;background:var(--x-bg);box-shadow:var(--x-shadow);overflow:hidden}
.tpd-bars{grid-area:bars;display:flex;gap:4px;padding:14px 16px 0}
.tpd-bar{position:relative;flex:1;height:4px;padding:0;border:0;border-radius:4px;background:var(--x-line);cursor:pointer;overflow:hidden}
.tpd-bar::after{content:"";position:absolute;inset:-8px 0}
.tpd-bar i{position:absolute;inset:0 auto 0 0;width:0;border-radius:4px;background:var(--x-green)}
.tpd-stage{grid-area:stage;position:relative;container-type:inline-size;min-height:280px;padding:12px 16px 10px;background:radial-gradient(circle at 1px 1px,var(--x-dot) 1px,transparent 0) 0 0/16px 16px}
.tpd:not(.is-live) .tpd-stage,.tpd:not(.is-live) .tpd-bars,.tpd:not(.is-live) .tpd-ctrl{display:none}
.tpd-top{display:flex;align-items:center;margin-bottom:6px}
.tpd-time{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px;border-radius:999px;background:var(--x-ink);color:var(--x-bg);font-size:.78rem;font-weight:650}
.tpd-board{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.3fr) minmax(0,1fr);grid-template-areas:"left trust right" "side side side";column-gap:clamp(26px,7cqi,72px);row-gap:16px;align-items:center;padding:6px 0 2px}
.tpd-board.no-bens{grid-template-columns:minmax(0,.9fr) minmax(0,1.4fr);grid-template-areas:"left trust" "side side"}
.tpd-board.no-bens .tpd-zone--right,.tpd-board.no-side .tpd-zone--side{display:none}
.tpd-wires{position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:0}
.tpd-wire{fill:none;stroke:var(--x-line-2);stroke-width:1.5;transition:stroke .3s}
.tpd-wire.is-dash{stroke-dasharray:3 5}
.tpd-wire.is-on{stroke:var(--x-gold-2);stroke-width:2.6;stroke-dasharray:7 7;animation:tpd-flow .7s linear infinite}
@keyframes tpd-flow{to{stroke-dashoffset:-28}}
.tpd-zone{position:relative;z-index:1;min-width:0}
.tpd-zone--left{grid-area:left;display:flex;flex-direction:column;align-items:center;gap:18px}
.tpd-zone--trust{grid-area:trust}
.tpd-zone--right{grid-area:right;display:flex;flex-direction:column;align-items:center;gap:14px}
.tpd-zone--side{grid-area:side;display:flex;flex-wrap:wrap;justify-content:center;gap:10px}
.tpd-group{display:flex;flex-wrap:wrap;justify-content:center;gap:14px}
.tpd-park{display:none}

.tpd-actor{display:grid;justify-items:center;gap:5px;max-width:150px;text-align:center}
.tpd-ava{position:relative;display:grid;place-items:center;width:46px;height:46px;border-radius:50%;background:var(--c);color:#fff;font:700 1.05rem/1 var(--tx-display);box-shadow:0 0 0 3px var(--x-bg),0 6px 14px -8px rgba(0,0,0,.5);transition:filter .5s,opacity .5s,transform .6s cubic-bezier(.3,1.4,.5,1)}
.tpd-ava b{font-weight:700}
.tpd-ava--org{border-radius:13px}
.tpd-ava--pair{width:58px;background:none;box-shadow:none}
.tpd-ava--pair i{position:absolute;top:6px;display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:var(--c);color:#fff;box-shadow:0 0 0 3px var(--x-bg)}
.tpd-ava--pair i:first-child{left:0}
.tpd-ava--pair i:nth-child(2){right:0}
.tpd-ava--kids i{width:30px;height:30px;top:8px}
.tpd-actor.is-kid .tpd-ava{transform:scale(.8)}
.tpd-actor.is-kid.is-grown .tpd-ava{transform:none}
.tpd-actor.is-out .tpd-ava{filter:grayscale(1);opacity:.42}
.tpd-actor.is-ill .tpd-ava{opacity:.7}
.tpd-actor__txt{display:grid;gap:1px}
.tpd-actor__txt b{font:650 .9rem/1.2 var(--tx-display);color:var(--x-ink)}
.tpd-actor.is-out .tpd-actor__txt b{color:var(--x-ink-3)}
.tpd-actor__txt small{color:var(--x-ink-3);font-size:.72rem;font-weight:600;line-height:1.25}
.tpd-flagtxt{color:var(--x-ink-3);font-size:.66rem;font-style:normal;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.tpd-flagtxt:empty{display:none}
.is-ill .tpd-flagtxt{color:var(--x-amber)}
.is-grown .tpd-flagtxt{color:var(--x-green)}
.tpd-drop{display:flex;flex-wrap:wrap;justify-content:center;gap:5px}
.tpd-drop:empty{display:none}
.tpd-keyspot{position:absolute;top:-9px;right:-12px;z-index:3}
.tpd-key{display:grid;place-items:center;width:25px;height:25px;border-radius:50%;background:var(--x-gold-2);color:#3B2800;box-shadow:0 0 0 2px var(--x-bg),0 4px 10px -4px rgba(0,0,0,.5)}

.tpd-trust{position:relative;display:grid;gap:9px;padding:13px 13px 12px;border:1.5px solid var(--x-green);border-radius:16px;background:var(--x-bg);box-shadow:0 0 0 5px var(--x-green-t),var(--x-shadow);transition:border-color .4s,box-shadow .4s,opacity .4s}
.tpd-trust.is-ghost{border-style:dashed;border-color:var(--x-line-2);box-shadow:none}
.tpd-trust.is-ghost .tpd-trust__doc{background:var(--x-bg-3);color:var(--x-ink-3)}
.tpd-trust__top{display:flex;align-items:center;gap:10px;min-width:0}
.tpd-trust__doc{display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:10px;background:var(--x-green);color:#fff;transition:background .4s}
[data-theme="dark"] .tpd-trust__doc{color:#08130F}
.tpd-trust__title{display:grid;min-width:0}
.tpd-trust__title b{font:700 .95rem/1.2 var(--tx-display);color:var(--x-ink)}
.tpd-trust__ghost{display:none;color:var(--x-ink-3);font-size:.74rem}
.tpd-trust.is-ghost .tpd-trust__ghost{display:block}
.tpd-trust.is-ghost .tpd-drop--trust,.tpd-trust.is-ghost .tpd-trust__trustee{display:none}
.tpd-trust.no-items .tpd-drop--trust,.tpd-pill[hidden]{display:none}
.tpd-trust__meta{display:flex;flex-wrap:wrap;gap:5px}
.tpd-pill{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:999px;background:var(--x-green-t);color:var(--x-green);font-size:.73rem;font-weight:650;white-space:nowrap}
.tpd-pill--lock.is-locked{background:var(--x-ink);color:var(--x-bg)}
.tpd-trust.is-ghost .tpd-pill--lock{background:var(--x-bg-3);color:var(--x-ink-3)}
.tpd-pill--signed,.tpd-pill--worth{display:none}
.tpd-trust.is-signed .tpd-pill--signed{display:inline-flex}
.tpd-trust.has-worth .tpd-pill--worth{display:inline-flex;background:var(--x-gold-t);color:var(--x-gold)}
.tpd-trust__trustee{display:flex;align-items:center;gap:6px;color:var(--x-ink-2);font-size:.8rem}
.tpd-trust__trustee svg{color:var(--x-gold)}
.tpd-trust__trustee b{color:var(--x-ink);font-weight:650}
.tpd-trust.no-trustee .tpd-trust__trustee{display:none}
.tpd-drop--trust{display:flex;justify-content:flex-start;align-content:flex-start;min-height:40px;padding:7px;border-radius:10px;background:var(--x-bg-2)}
.tpd-drop--trust:empty{display:flex}
.tpd-drop--trust:empty::before{content:attr(data-empty);margin:auto;color:var(--x-ink-3);font-size:.76rem}
.tpd-trust.has-blind .tpd-drop--trust .tpd-chip{filter:blur(3.5px)}
.tpd-trust__rule{display:none;align-items:flex-start;gap:6px;margin:0;color:var(--x-ink-2);font-size:.79rem;line-height:1.4}
.tpd-trust__rule svg{flex:none;margin-top:1px;color:var(--x-green)}
.tpd-trust.has-rule .tpd-trust__rule{display:flex}
.tpd-trust__flags{display:flex;flex-wrap:wrap;gap:5px}
.tpd-trust__flags:not(:has(.tpd-flag:not([style*="none"]))){margin:0}
.tpd-flag{display:none;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:999px;font-size:.73rem;font-weight:650}
.tpd-trust.has-shield .tpd-flag--shield{display:inline-flex;background:var(--x-green-t);color:var(--x-green)}
.tpd-trust.has-blind .tpd-flag--blind{display:inline-flex;background:var(--x-bg-3);color:var(--x-ink-2)}

.tpd-chip{position:relative;z-index:2;display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px 0 8px;border:1px solid var(--x-line-2);border-radius:9px;background:var(--x-bg);color:var(--x-ink);font-size:.78rem;font-weight:650;white-space:nowrap;box-shadow:0 3px 8px -5px rgba(14,27,22,.4)}
.tpd-chip svg{color:var(--x-green)}

.tpd-side{position:relative;display:flex;align-items:center;gap:8px;padding:6px 12px 6px 6px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-bg);animation:tpd-in .45s cubic-bezier(.3,1.3,.5,1)}
.tpd-side[hidden]{display:none}
.tpd-side__icon{position:relative;display:grid;place-items:center;flex:none;width:34px;height:34px;border-radius:9px;background:var(--x-bg-2);color:var(--x-ink-2);transition:background .3s,color .3s}
.tpd-side__txt{display:grid;text-align:left}
.tpd-side__txt b{font:650 .8rem/1.2 var(--tx-display);color:var(--x-ink)}
.tpd-side__txt small{font-size:.72rem;font-weight:700}
.tpd-side__txt small:empty{display:none}
.tpd-side .tpd-drop{margin-left:4px}
.tpd-side.is-good .tpd-side__icon{background:var(--x-green-t);color:var(--x-green)}
.tpd-side.is-good small{color:var(--x-green)}
.tpd-side.is-bad .tpd-side__icon{background:var(--x-red-t);color:var(--x-red)}
.tpd-side.is-bad small{color:var(--x-red)}
.tpd-side.is-wait .tpd-side__icon{background:var(--x-amber-t);color:var(--x-amber)}
.tpd-side.is-wait small{color:var(--x-amber)}
.tpd-side.is-mute small{color:var(--x-ink-3)}
.tpd-side[data-id="court"].is-good .tpd-side__icon::after,.tpd-side[data-id="tax"].is-good .tpd-side__icon::after{content:"";position:absolute;left:5px;right:5px;top:50%;height:2px;border-radius:2px;background:currentColor;transform:rotate(-38deg)}
@keyframes tpd-in{from{opacity:0;transform:translateY(6px) scale(.94)}to{opacity:1;transform:none}}

.tpd-fx{position:absolute;inset:0;z-index:6;pointer-events:none}
.tpd-pay{position:absolute;display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 10px;border-radius:999px;background:var(--x-gold-2);color:#3B2800;font-size:.76rem;font-weight:700;white-space:nowrap;box-shadow:0 8px 16px -8px rgba(0,0,0,.55)}
.tpd-pay--letter{border:1px solid var(--x-line-2);background:var(--x-bg);color:var(--x-ink)}
.tpd-pay--bill{background:var(--x-red);color:#fff}

/* pointing at something */
.tpd-actor.is-hi .tpd-ava::after,.tpd-side.is-hi .tpd-side__icon::before,.tpd-trust.is-hi::after{content:"";position:absolute;inset:-7px;border:2px solid var(--x-gold-2);border-radius:inherit;animation:tpd-ring 1.3s ease-out 2;pointer-events:none}
.tpd-trust.is-hi::after{inset:-9px;border-radius:21px}
.tpd-key.is-hi,.tpd-pill.is-hi{animation:tpd-nudge 1.3s ease-in-out 2}
@keyframes tpd-ring{0%{opacity:1;transform:scale(.92)}100%{opacity:0;transform:scale(1.18)}}
@keyframes tpd-nudge{0%,100%{transform:none}30%{transform:scale(1.22)}60%{transform:scale(.96)}}

/* captions and controls */
.tpd-cap{grid-area:cap;padding:14px 18px 4px;border-top:1px solid var(--x-line)}
.tpd-steps{margin:0;padding:0 0 0 1.2em;color:var(--x-ink)}
.tpd.is-live .tpd-steps{padding:0;list-style:none}
.tpd-steps>li{margin:0 0 8px;font-size:1.06rem;line-height:1.5}
.tpd.is-live[data-mode="story"] .tpd-steps>li{display:none;margin:0}
.tpd.is-live[data-mode="story"] .tpd-steps>li.is-on{display:block;min-height:3em;animation:tpd-cap .4s ease}
@keyframes tpd-cap{from{opacity:0;transform:translateY(4px)}to{opacity:1;transform:none}}
.tpd-ctrl{grid-area:ctrl;display:flex;align-items:center;gap:8px;padding:8px 16px 16px}
.tpd-btn{display:inline-grid;place-items:center;width:40px;height:40px;padding:0;border:1px solid var(--x-line-2);border-radius:11px;background:var(--x-bg);color:var(--x-ink);cursor:pointer;transition:border-color .15s,background .15s}
.tpd-btn:hover{border-color:var(--x-ink-3)}
.tpd-btn[data-act="prev"] svg{transform:rotate(180deg)}
.tpd-btn--main{display:inline-flex;gap:7px;width:auto;padding:0 15px;border-color:var(--x-green);background:var(--x-green);color:#fff;font:650 .9rem var(--eg-text)}
[data-theme="dark"] .tpd-btn--main{color:#08130F}
.tpd-btn--main:hover{border-color:var(--x-green-2);background:var(--x-green-2)}
.tpd-btn--main .is-pause,.tpd-btn--main .is-replay,.tpd.is-playing .tpd-btn--main .is-play,.tpd.is-end .tpd-btn--main .is-play{display:none}
.tpd.is-playing .tpd-btn--main .is-pause,.tpd.is-end .tpd-btn--main .is-replay{display:inline-flex}
.tpd-btn--main>span{display:inline-flex;align-items:center;gap:7px}
.tpd.is-first [data-act="prev"],.tpd.is-end [data-act="next"]{opacity:.38;pointer-events:none}
.tpd-count{margin-left:auto;color:var(--x-ink-3);font-size:.86rem;font-variant-numeric:tabular-nums}

/* the set-up guide: titled steps beside the diagram */
.tpd[data-mode="guide"] .tpd-steps>li{counter-increment:tpdstep}
.tpd[data-mode="guide"] .tpd-steps{counter-reset:tpdstep}
.tpd-steps__t{display:block;font:700 1.02rem/1.3 var(--tx-display);color:var(--x-ink)}
.tpd-steps__d{display:block;margin-top:3px;color:var(--x-ink-2);font-size:.96rem;line-height:1.55}
.tpd.is-live[data-mode="guide"] .tpd-steps>li{position:relative;margin:0;padding:10px 12px 10px 46px;border-radius:12px;cursor:pointer;transition:background .2s}
.tpd.is-live[data-mode="guide"] .tpd-steps>li::before{content:counter(tpdstep);position:absolute;top:10px;left:10px;display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:var(--x-bg-3);color:var(--x-ink-2);font:700 .8rem/1 var(--tx-display)}
.tpd.is-live[data-mode="guide"] .tpd-steps>li.is-on{background:var(--x-green-t)}
.tpd.is-live[data-mode="guide"] .tpd-steps>li.is-on::before{background:var(--x-green);color:#fff}
[data-theme="dark"] .tpd.is-live[data-mode="guide"] .tpd-steps>li.is-on::before{color:#08130F}
.tpd.is-live[data-mode="guide"] .tpd-steps>li:not(.is-on) .tpd-steps__d{display:none}
.tpd.is-live[data-mode="guide"] .tpd-steps>li:not(.is-on):hover{background:var(--x-bg-2)}
@media (min-width:1000px){
  .tpd--guide{grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr);grid-template-areas:"bars bars" "cap stage" "ctrl stage"}
  .tpd--guide .tpd-cap{padding:14px 12px 4px 14px;border-top:0;border-right:1px solid var(--x-line)}
  .tpd--guide .tpd-ctrl{border-right:1px solid var(--x-line);align-self:end}
  .tpd--guide .tpd-stage{display:grid;align-content:center}
}
@media (max-width:999px){
  .tpd.is-live[data-mode="guide"] .tpd-steps>li{display:none;padding-left:46px}
  .tpd.is-live[data-mode="guide"] .tpd-steps>li.is-on{display:block;background:none;padding:2px 0 2px 40px}
  .tpd.is-live[data-mode="guide"] .tpd-steps>li.is-on::before{top:2px;left:0}
}

/* narrow diagrams stack top to bottom */
@container (max-width:540px){
  .tpd-board,.tpd-board.no-bens{grid-template-columns:minmax(0,1fr);grid-template-areas:"left" "trust" "right" "side";row-gap:22px}
  .tpd-zone--left{flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:12px 26px}
  .tpd-group{align-items:flex-start}
  .tpd-zone--right{flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:flex-start;gap:12px 20px}
  .tpd-actor{max-width:118px}
}

/* ---------------------------------------------------------------- /trusts */
.tx-hero{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(28px,4vw,60px);align-items:center;padding-block:clamp(26px,3.6vw,56px) clamp(32px,4vw,64px);background:var(--x-bg-2);border-bottom:1px solid var(--x-line)}
body.eg .tx-hero h1{margin:0 0 18px;font-size:clamp(2.6rem,5.4vw,4.5rem);line-height:.98;letter-spacing:-.045em}
.tx-hero h1 span{color:var(--x-gold-2)}
.tx-lede{margin:0 0 24px;color:var(--x-ink-2);font-size:clamp(1.08rem,1.4vw,1.24rem);line-height:1.55;max-width:34em}
.tx-basics{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,4vw,56px);padding-block:clamp(36px,4.6vw,64px) 0}
.tx-roles ul{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.tx-roles li{display:grid;grid-template-columns:44px minmax(0,1fr);gap:2px 14px;align-items:center;padding:14px 16px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-bg)}
.tx-roles__ico{grid-row:1/span 2;display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--c,#1E5C4A);color:#fff}
.tx-roles b{font:700 1.02rem/1.25 var(--tx-display)}
.tx-roles b small{margin-left:8px;color:var(--x-ink-3);font:600 .8rem var(--eg-text)}
.tx-roles li>span:not(.tx-roles__ico){color:var(--x-ink-2);font-size:.95rem;line-height:1.45}
.tx-kinds__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.tx-kind{display:flex;flex-direction:column;gap:8px;padding:16px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-bg)}
.tx-kind h3{display:flex;align-items:center;gap:8px;margin:0;font-size:1.12rem}
.tx-kind h3 svg{color:var(--x-green)}
.tx-kind--locked h3 svg{color:var(--x-ink)}
.tx-kind p{margin:0;color:var(--x-ink-2);font-size:.94rem;line-height:1.5}
.tx-kind ul{display:grid;gap:6px;margin:4px 0 0;padding:0;list-style:none}
.tx-kind li{display:flex;gap:8px;align-items:flex-start;font-size:.92rem;line-height:1.4}
.tx-kind li svg{flex:none;margin-top:1px}
.tx-kind li.is-yes svg{color:var(--x-green)}
.tx-kind li.is-no svg{color:var(--x-red)}
.tx-kind a{margin-top:auto;padding-top:4px;color:var(--x-green)!important;font-size:.9rem;font-weight:650}
.tx-guide{padding-block:clamp(40px,5vw,72px) 0}
.tx-list{padding-block:clamp(40px,5vw,72px) 0}
.tx-group{margin-top:clamp(22px,3vw,34px)}
.tx-group__head{display:flex;align-items:baseline;gap:12px;margin:0 0 8px}
.tx-group__num{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:var(--x-ink);color:var(--x-bg);font:700 .85rem/1 var(--tx-display);transform:translateY(4px)}
body.eg .tx-group__head h3{margin:0;font-size:clamp(1.2rem,2vw,1.45rem)}
.tx-group__head p{margin:0;color:var(--x-ink-3);font-size:.95rem}
.tx-rows{margin:0;padding:0;list-style:none;border-top:1px solid var(--x-line)}
.tx-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.5fr) auto 20px;align-items:center;gap:8px 22px;padding:14px 8px;border-bottom:1px solid var(--x-line);color:var(--x-ink)!important;text-decoration:none!important;transition:background .15s}
.tx-row:hover{background:var(--x-bg-2)}
.tx-row__name{font:700 1.04rem/1.3 var(--tx-display)}
.tx-row__short{color:var(--x-ink-2);font-size:.95rem;line-height:1.45}
.tx-row__tags{display:flex;gap:6px;justify-content:flex-end}
.tx-row>svg{color:var(--x-ink-3);transition:transform .15s}
.tx-row:hover>svg{transform:translateX(3px);color:var(--x-green)}
.tx-tag{display:inline-flex;align-items:center;gap:5px;height:24px;padding:0 9px;border-radius:999px;background:var(--x-bg-3);color:var(--x-ink-2);font-size:.74rem;font-weight:650;white-space:nowrap}
.tx-tag--lock{background:var(--x-ink);color:var(--x-bg)}
.tx-tag--open{background:var(--x-green-t);color:var(--x-green)}
.tx-pro{padding-block:clamp(36px,4.6vw,60px) 0}
.tx-pro details{border:1px solid var(--x-line);border-radius:16px;background:var(--x-bg-2)}
.tx-pro summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:18px 20px;cursor:pointer;list-style:none}
.tx-pro summary::-webkit-details-marker{display:none}
.tx-pro summary b{display:block;font:700 1.1rem/1.3 var(--tx-display)}
.tx-pro summary small{display:block;margin-top:2px;color:var(--x-ink-3);font-size:.88rem}
.tx-pro summary>svg{flex:none;transition:transform .2s}
.tx-pro details[open] summary>svg{transform:rotate(180deg)}
.tx-pro__note{margin:0 20px 12px;color:var(--x-ink-2);font-size:.9rem}
.tx-pro .eg-tablewrap{margin:0 12px 12px}
.tx-after{margin-top:clamp(40px,5vw,72px);padding-block:clamp(32px,4vw,56px);border-top:1px solid var(--x-line);background:var(--x-bg-2)}
.tx-after h2{margin:0 0 16px;font-size:clamp(1.35rem,2.3vw,1.8rem)}
.tx-after ul{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,250px),1fr));gap:10px;margin:0;padding:0;list-style:none}
.tx-after a{display:grid;grid-template-columns:minmax(0,1fr) 18px;gap:3px 12px;height:100%;box-sizing:border-box;padding:16px 18px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-bg);color:var(--x-ink)!important;text-decoration:none!important}
.tx-after a:hover{border-color:var(--x-ink-3)}
.tx-after b{font:700 1rem/1.3 var(--tx-display)}
.tx-after span{grid-column:1;color:var(--x-ink-2);font-size:.9rem;line-height:1.45}
.tx-after svg{grid-column:2;grid-row:1/span 2;align-self:center;color:var(--x-ink-3)}

/* ---------------------------------------------------------------- a trust page */
.tx-thead{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(26px,4vw,56px);align-items:center;padding-block:clamp(22px,3vw,44px) clamp(28px,3.6vw,52px);background:var(--x-bg-2);border-bottom:1px solid var(--x-line)}
body.eg .tx-thead h1{margin:0 0 14px;font-size:clamp(2.2rem,4.4vw,3.6rem);line-height:1.02;letter-spacing:-.04em}
.tx-tags{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 14px}
.tx-thead .tx-lede{margin-bottom:12px;color:var(--x-ink)}
.tx-aka{margin:0 0 20px;color:var(--x-ink-3);font-size:.92rem;line-height:1.5}
.tx .tx-save{margin:0;width:auto;display:inline-flex;align-items:center;gap:8px;min-height:48px;padding:0 18px;border:1px solid var(--x-line-2);border-radius:12px;background:var(--x-bg);color:var(--x-ink);font:650 .95rem var(--eg-text);cursor:pointer}
.tx .tx-save.on{color:var(--x-gold)}
.tx-work{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(24px,4vw,56px);padding-block:clamp(36px,4.6vw,64px) 0}
.tx-how ol{display:grid;gap:0;margin:0;padding:0;list-style:none;counter-reset:txstep}
.tx-how li{position:relative;display:grid;grid-template-columns:36px minmax(0,1fr);gap:14px;padding:0 0 18px;counter-increment:txstep}
.tx-how li::before{content:counter(txstep);display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--x-green);color:#fff;font:700 .95rem/1 var(--tx-display);position:relative;z-index:1}
[data-theme="dark"] .tx-how li::before{color:#08130F}
.tx-how li:not(:last-child)::after{content:"";position:absolute;left:17px;top:36px;bottom:0;width:2px;background:var(--x-line)}
.tx-how li p{margin:6px 0 0;color:var(--x-ink);font-size:1.02rem;line-height:1.55}
.tx-note{margin:2px 0 0 50px;color:var(--x-ink-3);font-size:.86rem}
.tx-side{display:grid;gap:12px;align-content:start}
.tx-box{padding:18px 20px;border:1px solid var(--x-line);border-radius:16px;background:var(--x-bg)}
body.eg .tx-box h2,body.eg .tx-how h2{margin:0 0 12px;font-size:1.3rem}
.tx-box ul{display:grid;gap:9px;margin:0;padding:0;list-style:none}
.tx-box li{display:flex;align-items:flex-start;gap:10px;font-size:.98rem;line-height:1.45}
.tx-box li svg{flex:none;margin-top:1px}
.tx-box--good li svg{color:var(--x-green)}
.tx-box--know li svg{color:var(--x-amber)}
.tx-name{padding-block:clamp(30px,4vw,48px) 0}
.tx-name dl{display:flex;flex-wrap:wrap;gap:10px;margin:0}
.tx-name dl>div{display:flex;align-items:baseline;gap:10px;padding:12px 16px;border:1px solid var(--x-line);border-radius:12px;background:var(--x-bg)}
.tx-name dt{color:var(--x-green);font:700 1rem var(--tx-display);white-space:nowrap}
.tx-name dd{margin:0;color:var(--x-ink-2);font-size:.95rem;line-height:1.45}
.tx-pager{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding-block:clamp(30px,4vw,48px) 0}
.tx-pager a{display:flex;flex-direction:column;gap:3px;padding:16px 18px;border:1px solid var(--x-line);border-radius:14px;background:var(--x-bg);color:var(--x-ink)!important;text-decoration:none!important;transition:border-color .15s}
.tx-pager a:hover{border-color:var(--x-ink-3)}
.tx-pager a.is-next{grid-column:2;align-items:flex-end;text-align:right}
.tx-pager a:only-child{grid-column:1/-1;align-items:flex-start;text-align:left}
.tx-pager span{display:inline-flex;align-items:center;gap:6px;color:var(--x-green);font-size:.78rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.tx-pager a.is-prev span svg{transform:rotate(180deg)}
.tx-pager b{font:700 1.1rem/1.3 var(--tx-display)}
.tx-pager small{color:var(--x-ink-2);font-size:.9rem}
.tx-fine{display:grid;grid-template-columns:minmax(0,280px) minmax(0,1fr);gap:clamp(20px,4vw,60px);align-items:start;padding-block:clamp(40px,5vw,72px) 0}
.tx-fine__head{position:sticky;top:calc(var(--eg-header-h) + 20px)}
body.eg .tx-fine__head h2{margin:0 0 8px;font-size:clamp(1.4rem,2.4vw,1.9rem)}
.tx-fine__head p{margin:0;color:var(--x-ink-2);font-size:.96rem;line-height:1.55}
.tx-fine__list{border-top:1px solid var(--x-line)}
.tx-fine details{border-bottom:1px solid var(--x-line)}
.tx-fine summary{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:16px 4px;color:var(--x-ink);font:650 1.04rem/1.35 var(--tx-display);cursor:pointer;list-style:none}
.tx-fine summary::-webkit-details-marker{display:none}
.tx-fine summary>svg{flex:none;color:var(--x-ink-3);transition:transform .2s}
.tx-fine details[open]>summary>svg{transform:rotate(180deg)}
.tx-fine summary:hover{color:var(--x-green)}
.tx-fine__body{padding:0 4px 20px;color:var(--x-ink-2);font-size:.97rem;line-height:1.62}
.tx-fine__body p{margin:0 0 10px}
.tx-fine__body :is(ul,ol){margin:0 0 10px;padding-left:20px}
.tx-fine__body li{margin:0 0 6px}
.tx-fine__body li b{color:var(--x-ink)}
.tx-fine__body dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 28px;margin:6px 0 0}
.tx-fine__body dt{color:var(--x-ink-3);font-size:.72rem;font-weight:700;letter-spacing:.07em;text-transform:uppercase}
.tx-fine__body dd{margin:2px 0 0;color:var(--x-ink)}
.tx-fine__cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
body.eg .tx-fine__cols h3{margin:0 0 8px;font-size:1rem}
.tx-fine__note{color:var(--x-ink-3);font-size:.86rem}
.tx-more{padding-block:clamp(40px,5vw,64px) 0}
body.eg .tx-more h2{margin:0 0 4px;font-size:clamp(1.35rem,2.3vw,1.8rem)}
.tx-more>p{margin:0 0 14px;color:var(--x-ink-3)}
.tx .tx-sources{margin-top:clamp(36px,5vw,64px);border-top:1px solid var(--x-line)}

/* ---------------------------------------------------------------- tablet and phone */
@media (max-width:1000px){
  .tx-hero,.tx-thead,.tx-basics,.tx-work{grid-template-columns:minmax(0,1fr)}
  .tx-fine{grid-template-columns:minmax(0,1fr)}
  .tx-fine__head{position:static}
}
@media (max-width:760px){
  .tx-row{grid-template-columns:minmax(0,1fr) 18px;gap:4px 12px;padding:14px 4px}
  .tx-row__name{grid-column:1}
  .tx-row__short{grid-column:1}
  .tx-row__tags{grid-column:1;justify-content:flex-start;order:2}
  .tx-row>svg{grid-column:2;grid-row:1/span 3}
}
@media (max-width:640px){
  body.eg .tx-hero h1{font-size:clamp(2.4rem,11.5vw,3rem)}
  body.eg .tx-thead h1{font-size:clamp(2rem,9.6vw,2.6rem)}
  .tx-actions .tx-btn{flex:1 1 auto}
  .tx-kinds__grid,.tx-pager{grid-template-columns:minmax(0,1fr)}
  .tx-pager a.is-next{grid-column:auto;align-items:flex-start;text-align:left}
  .tpd{border-radius:16px}
  .tpd-stage{padding:10px 10px 8px}
  .tpd-cap{padding:12px 14px 2px}
  .tpd-ctrl{padding:8px 12px 14px}
  .tpd-steps>li{font-size:1.02rem}
  .tx-fine__body dl,.tx-fine__cols{grid-template-columns:minmax(0,1fr)}
  .tx-name dl>div{flex-direction:column;gap:2px}
}
@media (prefers-reduced-motion:reduce){
  .tpd *,.tpd *::before,.tpd *::after{animation:none!important;transition:none!important}
}

/* ---------- static example (13 Oct 2026, "back off the gas"): the finished diagram, the
   steps listed beneath it, one button that plays it through. No autoplay, no progress bars. */
.tpd--static{grid-template-areas:"stage" "cap" "ctrl";box-shadow:none}
.tpd--static .tpd-bars{display:none}
.tpd--static .tpd-stage{background:var(--x-bg-2)}
.tpd.is-live.tpd--static .tpd-steps{counter-reset:tpdx;padding:0}
.tpd.is-live.tpd--static .tpd-steps>li{position:relative;display:block;margin:0;padding:8px 0 8px 36px;font-size:.98rem;line-height:1.5;color:var(--x-ink-2);counter-increment:tpdx;animation:none;min-height:0}
.tpd.is-live.tpd--static .tpd-steps>li::before{content:counter(tpdx);position:absolute;left:0;top:9px;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--x-bg-3);color:var(--x-ink-2);font:650 .76rem/1 var(--tx-display)}
.tpd.is-live.tpd--static.is-playing .tpd-steps>li.is-on{color:var(--x-ink)}
.tpd.is-live.tpd--static.is-playing .tpd-steps>li.is-on::before{background:var(--x-green);color:#fff}
[data-theme="dark"] .tpd.is-live.tpd--static.is-playing .tpd-steps>li.is-on::before{color:#08130F}
.tpd--static .tpd-ctrl{padding-top:4px}
.tpd--static [data-act="prev"],.tpd--static [data-act="next"],.tpd--static .tpd-count{display:none}
.tpd--static .tpd-btn--main{background:var(--x-bg);border-color:var(--x-line-2);color:var(--x-ink)}
.tpd--static .tpd-btn--main:hover{border-color:var(--x-ink-3);background:var(--x-bg)}
.tpd--static.is-idle .tpd-btn--main .is-pause,.tpd--static.is-idle .tpd-btn--main .is-replay{display:none}
.tpd--static.is-idle .tpd-btn--main .is-play{display:inline-flex}
.tpd--static .tpd-cap{padding-top:10px}
.tpd--static .tpd-madeup{margin:10px 0 0;color:var(--x-ink-3);font-size:.82rem}

/* trust page head: the plain explanation, then a photograph; nothing else competing */
@media (min-width:1001px){.tx-thead{grid-template-columns:minmax(0,1.05fr) minmax(0,.95fr)}}
.tx-thead__photo{position:relative;margin:0;border-radius:18px;overflow:hidden;aspect-ratio:4/3;background:var(--x-bg-3)}
.tx-thead__photo picture{position:absolute;inset:0;display:block;width:100%;height:100%}
.tx-thead__photo img{display:block;width:100%;height:100%!important;object-fit:cover}
.tx-meta{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0 0 6px;color:var(--x-ink-3);font-size:.86rem}
.tx-meta b{color:var(--x-ink-2);font-weight:600}
.tx-worked{padding-block:clamp(36px,4.6vw,64px) 0}
.tx-worked .tx-h2{margin-bottom:4px}
@media (max-width:1000px){.tx-thead__photo{aspect-ratio:16/9}}