/* Transparency uses the shared chapter shell and existing admin previews. */
body[data-page=transparency] #stage{top:88px;bottom:108px}
body[data-page=transparency] #stage .chapter:not(.ready-chapter){display:flex;flex-direction:column;align-items:stretch;justify-content:flex-start;gap:24px;padding-top:12px;padding-bottom:18px;overflow-y:auto;overscroll-behavior-y:contain;touch-action:pan-y}
body[data-page=transparency] #stage .chapter:not(.ready-chapter) .chapter-copy{width:100%;max-width:1120px;margin:0 auto;display:grid;grid-template-columns:1fr 1fr;gap:10px 40px;align-items:start;flex:none}
body[data-page=transparency] .chapter-copy .eyebrow{display:none}
body[data-page=transparency] #stage .chapter:not(.ready-chapter) .chapter-copy :is(h1,h2){margin:0;font-size:clamp(32px,3vw,46px);line-height:1.1;letter-spacing:-.045em}
body[data-page=transparency] #stage .chapter .chapter-copy>p{max-width:480px;font-size:14px;line-height:1.65;padding-top:3px}
body[data-page=transparency] #stage .transparency-demo{max-width:1120px;width:100%;margin-inline:auto;min-height:0;flex:1;padding:0;border:0;box-shadow:none;border-radius:0;background:transparent}
body[data-page=transparency] #stage #surveillance .chapter-copy{display:block;text-align:center;margin-bottom:0}
body[data-page=transparency] #stage #surveillance .chapter-copy>p{max-width:none;margin:14px auto 0}
body[data-page=transparency] #stage #surveillance .transparency-demo{display:flex;flex-direction:column;justify-content:center;gap:16px;max-width:1000px;flex:1}
body[data-page=transparency] #conduct .chapter-copy h2{color:var(--violet)}
.transparency-demo.native-settings-host>div{height:100%;min-height:0}
.tr-vendors{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px 18px;padding:8px}
.tr-vendor{position:relative;display:flex;flex-direction:column;align-items:center;gap:16px;padding:24px 12px 20px;border:1px solid var(--border);border-radius:18px;background:var(--panel);transition:transform .18s,box-shadow .18s,border-color .18s}
.tr-vendor:hover,.tr-vendor:focus-visible{color:var(--text);border-color:var(--text);box-shadow:4px 4px 0 var(--text);transform:translate(-2px,-2px)}
.tr-vendor b{font:500 12px/1.4 var(--body);text-align:center}
.tr-logo{width:128px;height:58px;display:grid;place-items:center;border-radius:8px;background:#fff;padding:6px}
.tr-logo img{max-height:46px;max-width:116px;object-fit:contain;width:auto;height:auto}
.tr-vendor:first-child .tr-logo img{width:44px;height:44px;image-rendering:auto}
.tr-external{position:absolute;top:12px;right:14px;font-size:13px;color:var(--muted);opacity:0;transition:opacity .18s}.tr-vendor:hover .tr-external,.tr-vendor:focus-visible .tr-external{opacity:1}
.tr-vendor-detail{height:78px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;max-width:740px;margin:0 auto;color:var(--muted);font-size:13px;line-height:1.6;padding:0 12px}.tr-vendor-detail b{color:var(--text);font-size:12px;margin-bottom:4px}
.tr-delayed{opacity:0;transform:translateY(12px);transition:opacity .7s,transform .7s;display:flex;align-items:center;justify-content:center;gap:35px;padding:6px 12px;min-height:58px}.tr-delayed.is-visible{opacity:1;transform:none}.tr-delayed>p{font:500 clamp(19px,2vw,27px)/1.25 var(--display);letter-spacing:-.04em}
.tr-continue{position:relative;display:flex;align-items:center;gap:28px;padding:12px 0;color:var(--text);font-size:13px;white-space:nowrap}.tr-continue::before,.tr-continue::after{content:'';position:absolute;left:0;right:0;bottom:0;height:2px;background:currentColor}.tr-continue::before{opacity:.16}.tr-continue::after{transform:scaleX(0);transform-origin:left}.is-visible .tr-continue::after{animation:tr-progress 8s linear forwards}.tr-continue span{font-size:20px;transition:transform .2s}.tr-continue:hover span{transform:translateX(5px)}@keyframes tr-progress{to{transform:scaleX(1)}}
.tr-attribution{text-align:center;font:10px/1.4 var(--body);color:var(--muted);margin-top:4px}
.tr-concern-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:36px;height:100%;min-height:0}.tr-concern-copy{overflow-y:auto;scrollbar-width:thin;padding:0 4px 8px 0}.tr-concern-nav{display:grid;gap:0}.tr-concern-nav button{display:flex;text-align:left;justify-content:space-between;gap:10px;padding:12px 6px;border-bottom:1px solid var(--border);font-size:12px;line-height:1.4;color:var(--muted);position:relative}.tr-concern-nav button[aria-pressed=true]{color:var(--text);font-weight:600}.tr-concern-nav button[aria-pressed=true]::after{content:'';position:absolute;bottom:-1px;height:2px;background:var(--violet);left:0;right:0;transform-origin:left;animation:tr-progress 8s linear forwards}.tr-concern-nav button span{font-weight:400}
.tr-concern-answer{margin-top:22px;padding:20px;background:var(--lilac);color:#111;border-radius:18px;border:1px solid #111;box-shadow:3px 3px 0 #111}.tr-concern-answer h3{font:500 21px/1.2 var(--display);letter-spacing:-.04em;margin:0 0 12px}.tr-concern-answer p{font:13px/1.65 var(--body)}
.tr-evidence-wrap{display:flex;flex-direction:column;min-height:0;gap:12px}.tr-evidence-caption{display:flex;justify-content:space-between;gap:12px;flex:none;padding:0 6px}.tr-evidence-caption span{font-size:11px;font-weight:600}.tr-evidence-caption small{font-size:10px;color:var(--muted)}
body[data-page=transparency] #stage .tr-evidence{flex:1;min-height:0;max-width:none;width:100%;padding:0!important;border:0!important;box-shadow:none!important;background:transparent!important}.tr-evidence.native-settings-host>div{height:100%}
body[data-page=transparency] #record .transparency-demo{display:flex;flex-direction:column;gap:12px}.tr-record-caption{font-size:10px;color:var(--muted);text-align:center}.tr-record-native.manager-demo{flex:1;min-height:0;display:flex;flex-direction:column}.tr-evidence.manager-demo{display:flex;flex-direction:column}.tr-record-native .manager-viewport,.tr-evidence .manager-viewport{flex:1;min-height:0;height:100%}
@media(max-height:760px) and (min-width:761px){body[data-page=transparency] #stage .chapter:not(.ready-chapter){gap:18px}.tr-vendor{padding:14px 10px;gap:8px}.tr-logo{height:44px}.tr-logo img{max-height:36px}.tr-vendor-detail{height:64px}.tr-delayed{min-height:42px}.tr-concern-nav button{padding:8px 4px;font-size:11px}.tr-concern-answer{margin-top:14px;padding:16px}.tr-concern-answer p{font-size:12px}.tr-concern-answer h3{font-size:19px}.tr-attribution{font-size:9px}}
@media(max-width:760px){body[data-page=transparency] #stage{top:76px;bottom:104px}body[data-page=transparency] #stage .chapter:not(.ready-chapter){gap:20px;padding-top:8px;padding-bottom:24px}body[data-page=transparency] #stage .chapter:not(.ready-chapter) .chapter-copy{display:block}body[data-page=transparency] #stage .chapter .chapter-copy>p{margin-top:12px;font-size:13px}body[data-page=transparency] #stage .transparency-demo{flex:none;min-height:0;height:auto}body[data-page=transparency] #stage #surveillance .transparency-demo{flex:none;gap:14px}.tr-vendors{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:4px}.tr-vendor{padding:16px 8px;gap:8px}.tr-vendor b{font-size:11px}.tr-vendor-detail{height:110px;flex:none;font-size:12px}.tr-delayed{flex-direction:column;gap:8px;text-align:center;min-height:100px}.tr-attribution{font-size:9px}.tr-concern-layout{grid-template-columns:1fr;gap:24px;height:auto}.tr-concern-copy{overflow:visible}.tr-concern-nav{grid-template-columns:1fr 1fr;gap:4px 12px}.tr-concern-nav button{font-size:11px;padding:10px 3px}.tr-concern-answer{margin-top:18px}.tr-evidence-wrap{min-height:580px}.tr-evidence-caption{flex-wrap:wrap;gap:4px}.tr-record-native.manager-demo{min-height:650px}.tr-record-caption{font-size:9px}.transparency-demo.native-settings-host>div{height:auto}.tr-evidence.native-settings-host>div{height:100%}}
@media(prefers-reduced-motion:reduce){.tr-vendor,.tr-delayed,.tr-continue span{transition:none}.tr-continue::after,.tr-concern-nav button[aria-pressed=true]::after{animation:none;transform:scaleX(1)}}
body[data-page=transparency] .chapter-copy>p:empty{display:none}
body[data-page=transparency] #stage #conduct .chapter-copy{display:block}
.tr-evidence-stack{position:relative;flex:1;min-height:0}
body[data-page=transparency] #stage .tr-evidence-stack>.tr-evidence{height:100%}
body[data-page=transparency] #stage .tr-evidence-stack>.tr-evidence[hidden]{display:none!important}
.tr-fixed-price{display:block;font:600 clamp(26px,3vw,37px)/1.05 var(--display);letter-spacing:-.05em;margin:20px 0}
.tr-concern-answer>small{display:block;font-size:10px;line-height:1.5;margin-top:16px}
body[data-page=transparency] #record .tr-concern-nav{gap:12px}
body[data-page=transparency] #record .tr-concern-nav button{padding:16px;border:1px solid var(--border);border-radius:14px;font-size:14px;background:var(--panel);transition:box-shadow .18s}
body[data-page=transparency] #record .tr-concern-nav button[aria-pressed=true]{background:var(--acid);color:#111;border-color:#111;box-shadow:3px 3px 0 #111}
body[data-page=transparency] #record .tr-concern-nav button::after{display:none}
body[data-page=transparency] #record .tr-concern-answer{background:transparent;color:var(--text);box-shadow:none;border:0;padding:10px 2px}
@media(max-width:760px){.tr-evidence-stack{height:650px;flex:none}body[data-page=transparency] #record .tr-concern-nav button{font-size:12px;padding:14px}.tr-concern-layout{height:auto}}
body[data-page=transparency] #record .tr-concern-copy{display:flex;flex-direction:column;overflow:hidden;padding-right:6px}
body[data-page=transparency] #record .tr-concern-nav{display:flex;flex-direction:column;overflow:auto;scrollbar-width:thin;min-height:0;flex:1;padding:2px 6px 8px 0}
body[data-page=transparency] #record .tr-concern-nav button{flex:none;min-height:80px;align-items:center}
body[data-page=transparency] #record .tr-concern-nav button b{display:block;font-weight:500}
body[data-page=transparency] #record .tr-concern-nav button small{display:block;font-size:11px;line-height:1.5;margin-top:7px;font-weight:400}
body[data-page=transparency] #record .tr-concern-answer{flex:none;margin-top:18px}
.tr-feature-motion{align-self:flex-start;color:var(--muted);font-size:10px;margin:0 0 12px;padding:4px 0}
@media(max-width:760px){body[data-page=transparency] #record .tr-concern-nav{max-height:290px;flex:none}body[data-page=transparency] #record .tr-concern-copy{overflow:visible}}
/* One scroll position drives both the feature rail and native preview track. */
.tr-sync-rail{position:relative;overflow:auto;min-height:0;scrollbar-width:none;overscroll-behavior:contain;padding:3px 8px 0 3px}
.tr-sync-card{display:flex;flex-direction:column;justify-content:center;text-align:left;width:100%;flex:none;padding:22px;margin-bottom:16px;border:1px solid var(--border);border-radius:16px;background:var(--panel);color:var(--text);gap:14px;box-sizing:border-box}
.tr-sync-card b{font-size:13px;font-weight:500}.tr-sync-card strong{font:500 25px/1.15 var(--display);letter-spacing:-.04em}.tr-sync-card>span{font:12px/1.6 var(--body);color:var(--muted)}
.tr-sync-card[aria-pressed=true]{background:var(--acid);color:#111;border-color:#111;box-shadow:3px 3px 0 #111}.tr-sync-card[aria-pressed=true]>span{color:#454342}
.tr-sync-window{position:relative;flex:1;min-height:0;overflow:hidden}.tr-sync-track{will-change:transform}.tr-sync-slide{box-sizing:border-box;overflow:hidden;width:100%;padding-bottom:16px!important}.tr-sync-slide.manager-demo{display:flex;flex-direction:column}
.tr-sync-slide .manager-viewport{flex:1;min-height:0}.tr-sync-slide .manager-demo-tabs{flex-wrap:wrap;gap:6px 16px}.tr-evidence-caption small{font-size:10px;color:var(--muted)}
body[data-page=transparency] #stage .tr-phone-pair{display:grid;grid-template-columns:1fr 1fr;gap:18px;height:100%}.tr-mobile-demo{min-width:0;min-height:0;display:flex;flex-direction:column}.tr-mobile-demo .mobile-chalk-note{display:none}.tr-telegram-demo{margin:0;min-width:0;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px}.tr-telegram-demo img{max-width:100%;max-height:90%;object-fit:contain;border-radius:22px}.tr-telegram-demo figcaption{font-size:11px;color:var(--muted)}
@media(min-width:761px){body[data-page=transparency] #stage{top:70px;bottom:92px}body[data-page=transparency] #stage .chapter:not(.ready-chapter){gap:16px;padding-top:4px;padding-bottom:8px;overflow:hidden}body[data-page=transparency] #stage .chapter:not(.ready-chapter) .chapter-copy :is(h1,h2){font-size:clamp(28px,2.6vw,40px)}body[data-page=transparency] #stage .chapter .chapter-copy>p{font-size:13px;line-height:1.5}.tr-concern-layout{gap:24px;grid-template-columns:260px minmax(0,1fr)}}
@media(max-width:760px){body[data-page=transparency] #stage .tr-synced-showcase{height:680px;min-height:0}.tr-synced-showcase .tr-concern-layout{height:100%;grid-template-columns:150px minmax(0,1fr);gap:10px}.tr-synced-showcase .tr-evidence-wrap{min-height:0}.tr-sync-card{padding:12px;gap:10px}.tr-sync-card strong{font-size:20px}.tr-sync-card>span{font-size:11px}.tr-sync-card b{font-size:11px}body[data-page=transparency] #stage .tr-phone-pair{grid-template-columns:1fr;grid-template-rows:1fr 1fr;gap:8px}.tr-sync-slide .manager-demo-tabs button{font-size:10px}}
body[data-page=transparency]:has(#record.active) .chapter-arrows{display:none!important}
@media(max-width:760px){.tr-synced-showcase .tr-concern-layout{grid-template-columns:minmax(0,1fr);grid-template-rows:190px minmax(0,1fr);gap:16px}.tr-synced-showcase .tr-sync-rail{height:190px}.tr-synced-showcase .tr-sync-card{padding:16px}.tr-synced-showcase .tr-sync-card strong{font-size:22px}.tr-synced-showcase .tr-sync-card>span{font-size:12px}}
/* Countdown fill uses the same clock as the synchronized scene transition. */
.tr-sync-card{position:relative;isolation:isolate;overflow:hidden}
.tr-sync-card::before{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(0,0,0,.045),rgba(0,0,0,.11));transform:scaleY(var(--tour-progress,0));transform-origin:top;z-index:-1;pointer-events:none}
.tr-sync-card:not([aria-pressed=true])::before{display:none}
@media(prefers-reduced-motion:reduce){.tr-sync-card::before{display:none}}
.tr-telegram-demo img{border:5px solid #252525;border-radius:28px;padding:5px;background:#fff;box-sizing:border-box;box-shadow:0 2px 8px #0001}
.tr-telegram-demo{gap:0}.tr-telegram-screen{display:grid;place-items:center;flex:1;min-height:0;width:100%}
.tr-telegram-screen img{max-height:none;max-width:100%;object-fit:contain;border:5px solid #202020;padding:0;background:#fff;border-radius:26px;box-shadow:0 12px 36px #0002}
.tr-phone-caption,.tr-telegram-demo figcaption{height:24px;flex:none;text-align:center;font:11px/24px var(--body);color:var(--muted)}
