/* Доклад v2 «Биоэкономика и ИИ» — фото + стекло, один тезис на слайд.
   Сцена 1920×1080 масштабируется целиком. Токены цвета — в начале файла.
   Дизайны: steklo (по умолчанию, фото + светлое стекло), temno (фото + тёмное стекло), sochno (сочные цветные плашки), svet (светлое стекло), proektor (максимальный контраст). */

/* ---------------- палитра X-BIO + цвета ступеней (сквозные) ---------------- */
:root {
  --xg: #7FB91F;            /* зелёный знака X-BIO */
  --xr: #D01030;            /* красный знака X-BIO */
  --xy: #FFC233;            /* жёлтый акцент */
  --see: #3EC1F3;           /* ВИДЕТЬ — голубой */
  --think: #FFC233;         /* ПОНИМАТЬ — жёлтый */
  --act: #8CCB3A;           /* ДЕЙСТВОВАТЬ — зелёный */
  --sec: #FF5470;           /* безопасность — красный X-BIO, осветлённый для тёмного фона */
  --thermo: #C9B8A6;        /* термопереработка — тёплый серый */
  --human: #FFFFFF;
  --bg: #0A110E;
  --fg: #F5F8F3;
  --muted: #C4CEC6;
  --line: rgba(255, 255, 255, .22);
  --glass: rgba(9, 16, 13, .72);
  --glass-b: rgba(255, 255, 255, .16);
  --glass-blur: 26px;
  --panel-fg: var(--fg);
  --panel-muted: var(--muted);
  --scrim: rgba(5, 10, 8, .55);
  --photo-f: saturate(1.08) contrast(1.02);
  --f-main: 'Onest', 'Golos Text', system-ui, sans-serif;
  --f-num: 'Onest', 'Golos Text', system-ui, sans-serif;
  --w-title: 300;
  --w-num: 200;
  --ease: cubic-bezier(.23, 1, .32, 1);
  --move: cubic-bezier(.77, 0, .175, 1);
  --step-ms: 110ms;
  --dur: 760ms;
  /* поля (фон слайдов без фото) */
  --f-ink: radial-gradient(1100px 700px at 88% 8%, rgba(62, 193, 243, .16), transparent 60%), radial-gradient(900px 640px at 6% 100%, rgba(140, 203, 58, .16), transparent 60%), radial-gradient(700px 500px at 60% 110%, rgba(255, 194, 51, .10), transparent 60%), #0A110E;
  --f-forest: radial-gradient(1200px 800px at 85% 0%, rgba(127, 185, 31, .30), transparent 60%), radial-gradient(900px 700px at 0% 100%, rgba(208, 16, 48, .16), transparent 60%), linear-gradient(160deg, #0F2E1C, #071510);
  --f-green: linear-gradient(135deg, #9AD13A 0%, #7FB91F 45%, #5E9A14 100%);
  --f-see: radial-gradient(1000px 700px at 85% 20%, rgba(120, 220, 255, .35), transparent 60%), linear-gradient(140deg, #0B79B0 0%, #07507A 55%, #053251 100%);
  --f-think: radial-gradient(1000px 700px at 80% 15%, rgba(255, 240, 180, .55), transparent 60%), linear-gradient(140deg, #FFCF4A 0%, #FFB71F 55%, #F29A00 100%);
  --f-act: radial-gradient(1000px 700px at 85% 15%, rgba(190, 240, 120, .22), transparent 60%), linear-gradient(140deg, #2F7A20 0%, #22601A 55%, #123F12 100%);
  --f-red: linear-gradient(140deg, #D01030, #8E0A22);
}
/* текст на ярких полях */
.fd-green, .fd-think { --fg: #0D1A10; --muted: #1F3020; --line: rgba(13, 26, 16, .25); }
.fd-think { --fg: #1E1300; --muted: #3E2C05; --line: rgba(30, 19, 0, .25); }
.fd-see { --muted: #D6ECF8; }
.fd-act { --muted: #DDEFD0; }

/* sochno — плашки залиты цветом ступени, цифры шрифтом Unbounded */
[data-design="sochno"] {
  --glass: rgba(10, 30, 20, .78);
  --f-num: 'Unbounded', 'Onest', sans-serif;
  --w-num: 300;
  --f-ink: radial-gradient(1000px 700px at 90% 0%, rgba(62, 193, 243, .32), transparent 60%), radial-gradient(900px 640px at 0% 100%, rgba(140, 203, 58, .32), transparent 60%), radial-gradient(800px 600px at 55% 120%, rgba(255, 84, 112, .22), transparent 60%), #0B1512;
  --f-forest: radial-gradient(1200px 800px at 85% 0%, rgba(127, 185, 31, .5), transparent 60%), radial-gradient(900px 700px at 0% 100%, rgba(208, 16, 48, .3), transparent 60%), linear-gradient(160deg, #13402A, #08180F);
}
[data-design="sochno"] .slide[data-c] .glass { background: color-mix(in srgb, var(--c) 30%, rgba(8, 16, 12, .86)); border-color: color-mix(in srgb, var(--c) 60%, transparent); }

/* proektor — максимум контраста: фото темнее, плашки почти непрозрачные */
[data-design="proektor"] {
  --glass: rgba(4, 8, 6, .86);
  --scrim: rgba(0, 0, 0, .66);
  --photo-f: saturate(1.05) brightness(.82);
  --muted: #DCE3DD;
  --w-title: 400;
  --w-num: 300;
}

/* svet — светлое стекло для светлого зала */
[data-theme="light"] {
  --bg: #F3F6F1;
  --fg: #0D1A12;
  --muted: #34443A;
  --line: rgba(13, 26, 18, .2);
  --glass: rgba(250, 252, 248, .80);
  --glass-b: rgba(255, 255, 255, .75);
  --scrim: rgba(250, 252, 248, .25);
  --see: #06679C;
  --think: #8A5A00;
  --act: #33700F;
  --sec: #B00E2A;
  --thermo: #7A6550;
  --human: #0D1A12;
  --f-ink: radial-gradient(1100px 700px at 88% 8%, rgba(62, 193, 243, .20), transparent 60%), radial-gradient(900px 640px at 6% 100%, rgba(140, 203, 58, .22), transparent 60%), radial-gradient(700px 500px at 60% 110%, rgba(255, 194, 51, .18), transparent 60%), #F5F8F2;
  --f-forest: radial-gradient(1200px 800px at 85% 0%, rgba(127, 185, 31, .30), transparent 60%), radial-gradient(900px 700px at 0% 100%, rgba(208, 16, 48, .10), transparent 60%), linear-gradient(160deg, #EAF3E2, #F7FAF4);
  --f-see: radial-gradient(1000px 700px at 85% 20%, rgba(255, 255, 255, .7), transparent 60%), linear-gradient(140deg, #CDEBFA, #9DD7F4);
  --f-act: radial-gradient(1000px 700px at 85% 15%, rgba(255, 255, 255, .6), transparent 60%), linear-gradient(140deg, #DDF0C6, #B9E08A);
}
[data-theme="light"] .fd-see, [data-theme="light"] .fd-act { --fg: #0D1A12; --muted: #26362B; }
[data-theme="light"] .fd-see { --see: #065E8E; }
[data-theme="light"] .fd-act { --act: #2C6410; }
[data-theme="light"] .fd-think { --think: #6B3F00; }

/* ---------------- база ---------------- */
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; background: #050807; color: var(--fg); font-family: var(--f-main); font-weight: 400; -webkit-font-smoothing: antialiased; }
html[data-theme="light"], html[data-theme="light"] body { background: #DDE3DC; }
button { font: inherit; color: inherit; }
::selection { background: var(--xg); color: #0D1A10; }
.deck body { overflow: hidden; }
#viewport { position: fixed; inset: 0; overflow: hidden; }
#stage { position: absolute; left: 0; top: 0; width: 1920px; height: 1080px; transform-origin: 0 0; }
.slide { position: absolute; inset: 0; width: 1920px; height: 1080px; overflow: hidden; background: var(--bg); color: var(--fg); opacity: 0; visibility: hidden; transition: opacity 260ms var(--ease), visibility 0s linear 260ms; }
.slide.cur { opacity: 1; visibility: visible; transition: opacity 260ms var(--ease), visibility 0s; z-index: 2; }
.slide.skip:not(.cur) { display: none; }
.slide[data-c="see"] { --c: var(--see); }
.slide[data-c="think"] { --c: var(--think); }
.slide[data-c="act"] { --c: var(--act); }
.slide[data-c="sec"] { --c: var(--sec); }
.slide { --c: var(--xg); }
[data-theme="light"] .slide { --c: #2D600F; }
[data-theme="light"] .slide[data-c="see"] { --c: var(--see); } [data-theme="light"] .slide[data-c="think"] { --c: var(--think); } [data-theme="light"] .slide[data-c="act"] { --c: var(--act); } [data-theme="light"] .slide[data-c="sec"] { --c: var(--sec); }

/* поля */
.fd-ink { background: var(--f-ink); }
.fd-forest { background: var(--f-forest); }
.fd-green { background: var(--f-green); }
.fd-see { background: var(--f-see); }
.fd-think { background: var(--f-think); }
.fd-act { background: var(--f-act); }
.fd-red { background: var(--f-red); }

/* фото на весь слайд + медленный наезд */
.bg { position: absolute; inset: 0; overflow: hidden; }
.bg img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: var(--photo-f); transform: scale(1.02); transform-origin: var(--kb-o, 50% 50%); will-change: transform; }
.slide.on .bg img { animation: kb 18s cubic-bezier(.25, .1, .25, 1) both; }
@keyframes kb { from { transform: scale(1.02); } to { transform: scale(1.13); } }
.scrim { position: absolute; inset: 0; pointer-events: none; }
.scrim.left { background: linear-gradient(90deg, var(--scrim) 0%, transparent 62%); }
.scrim.right { background: linear-gradient(270deg, var(--scrim) 0%, transparent 62%); }
.scrim.bottom { background: linear-gradient(0deg, var(--scrim) 0%, transparent 60%); }
.scrim.full { background: linear-gradient(90deg, rgba(5, 10, 8, .62), rgba(5, 10, 8, .25)); }
[data-theme="light"] .scrim.full { background: linear-gradient(90deg, rgba(245, 248, 243, .45), rgba(245, 248, 243, .05)); }

/* стекло */
.glass { position: absolute; background: var(--glass); -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(1.5); backdrop-filter: blur(var(--glass-blur)) saturate(1.5); border: 1px solid var(--glass-b); border-radius: 34px; color: var(--panel-fg); box-shadow: 0 30px 80px -30px rgba(0, 0, 0, .55); }
[data-theme="light"] .glass { box-shadow: 0 30px 80px -30px rgba(20, 40, 25, .35); }

/* типографика */
.ttl { margin: 0; font-weight: var(--w-title); font-size: 78px; line-height: 1.06; letter-spacing: -.02em; text-wrap: balance; }
.ttl.xl { font-size: 104px; line-height: 1.02; letter-spacing: -.03em; }
.ttl.sm { font-size: 58px; }
.line { margin: 26px 0 0; font-size: 34px; line-height: 1.32; color: var(--muted); font-weight: 400; text-wrap: pretty; max-width: 1500px; }
.line.q { color: var(--fg); font-weight: 400; display: inline-flex; align-items: center; gap: 18px; padding: 14px 30px 14px 22px; border-radius: 999px; background: color-mix(in srgb, var(--sec) 22%, transparent); border: 1px solid color-mix(in srgb, var(--sec) 55%, transparent); }
.line.q::before { content: '?'; display: grid; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: var(--sec); color: #fff; font-size: 30px; }
.hd { position: absolute; left: 120px; top: 96px; right: 120px; }
.chip { display: inline-flex; align-items: center; gap: 12px; font-size: 22px; line-height: 1; padding: 10px 18px; border-radius: 999px; border: 1px solid var(--line); color: var(--fg); letter-spacing: .01em; }
.chip i { width: 14px; height: 14px; border-radius: 50%; background: var(--c); flex: none; }
.stepchip { margin-bottom: 30px; border-color: color-mix(in srgb, var(--c) 70%, transparent); background: color-mix(in srgb, var(--c) 18%, transparent); }
.k-number:not(.has-photo) .num { color: var(--fg); }
.num { font-family: var(--f-num); font-weight: var(--w-num); font-size: 330px; line-height: .86; letter-spacing: -.045em; font-variant-numeric: tabular-nums; white-space: nowrap; color: var(--c); }
.num .pre, .num .suf { font-size: .42em; letter-spacing: -.02em; font-weight: 300; }
.num .suf { margin-left: .06em; }
[data-design="sochno"] .num { letter-spacing: -.06em; }
.ico { width: 1em; height: 1em; fill: none; stroke: currentColor; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; flex: none; }
.ico.fill { fill: currentColor; stroke: none; }

/* подвал: источник слева, номер справа */
.foot { position: absolute; left: 120px; right: 60px; bottom: 34px; display: flex; align-items: flex-end; justify-content: space-between; gap: 40px; font-size: 19px; color: var(--muted); pointer-events: none; }
.foot .src { max-width: 1300px; line-height: 1.35; }
.foot .pg { display: inline-flex; align-items: center; gap: 12px; font-variant-numeric: tabular-nums; padding: 8px 14px; border-radius: 999px; background: var(--glass); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); color: var(--panel-fg); }
.foot .pg img { height: 24px; width: auto; }
.has-photo .foot .src { padding: 8px 14px; border-radius: 14px; background: var(--glass); color: var(--panel-muted); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.analog { display: inline-flex; align-items: center; gap: 10px; font-size: 22px; padding: 10px 18px; border-radius: 999px; border: 1px dashed var(--line); color: var(--fg); }

/* лестница-индикатор (справа вверху) */
.lad { position: absolute; right: 120px; top: 60px; display: flex; align-items: flex-end; gap: 8px; z-index: 5; }
.lad span { display: block; width: 46px; border-radius: 6px; opacity: .3; }
.lad span:nth-child(1) { height: 12px; background: var(--see); }
.lad span:nth-child(2) { height: 22px; background: var(--think); }
.lad span:nth-child(3) { height: 32px; background: var(--act); }
.lad span.on { opacity: 1; }
.lad b { font-weight: 400; font-size: 20px; margin-right: 10px; align-self: center; color: var(--panel-fg); padding: 6px 12px; border-radius: 999px; background: var(--glass); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.has-photo .lad, .k-number.has-photo .lad { padding: 10px 12px; border-radius: 16px; background: var(--glass); -webkit-backdrop-filter: blur(10px); backdrop-filter: blur(10px); }
.has-photo .lad b { background: none; padding: 0; }

/* ---------------- титул ---------------- */
.k-title .glass { left: 110px; top: 110px; width: 1120px; padding: 64px 70px 60px; }
.k-title .logos { display: flex; align-items: center; gap: 26px; margin-bottom: 54px; }
.k-title .logos img { height: 72px; width: auto; }
.k-title .logos img.ty { height: 56px; }
.k-title .meta { margin-top: 46px; display: flex; flex-wrap: wrap; gap: 12px; }
.k-title .meta .chip { font-size: 24px; }

/* ---------------- фото + плашка ---------------- */
.k-photo .glass { padding: 56px 64px 60px; }
.k-photo .glass.left { left: 110px; bottom: 130px; width: 980px; }
.k-photo .glass.right { right: 110px; bottom: 130px; width: 980px; }
.k-photo .glass.bottom { left: 110px; right: 110px; bottom: 110px; }
.k-photo .glass.bottom .ttl { font-size: 84px; }

/* сканер на фото (ступень «видеть») — декоративная рамка распознавания */
.scan { position: absolute; left: 1180px; top: 170px; width: 520px; height: 600px; pointer-events: none; }
.scan i { position: absolute; width: 70px; height: 70px; border: 3px solid var(--see); }
.scan i:nth-child(1) { left: 0; top: 0; border-right: 0; border-bottom: 0; border-top-left-radius: 18px; }
.scan i:nth-child(2) { right: 0; top: 0; border-left: 0; border-bottom: 0; border-top-right-radius: 18px; }
.scan i:nth-child(3) { left: 0; bottom: 0; border-right: 0; border-top: 0; border-bottom-left-radius: 18px; }
.scan i:nth-child(4) { right: 0; bottom: 0; border-left: 0; border-top: 0; border-bottom-right-radius: 18px; }
.scan b { position: absolute; left: 6px; right: 6px; top: 0; height: 3px; background: linear-gradient(90deg, transparent, var(--see), transparent); box-shadow: 0 0 24px 4px color-mix(in srgb, var(--see) 60%, transparent); opacity: 0; }
.slide.on .scan b { animation: sweep 2.8s var(--move) .9s 2 both; }
@keyframes sweep { 0% { top: 4%; opacity: 0; } 10% { opacity: 1; } 90% { opacity: 1; } 100% { top: 96%; opacity: 0; } }

/* ---------------- большая цифра ---------------- */
.k-number .hd { top: 110px; }
.k-number .ttl { font-size: 70px; max-width: 1100px; }
.k-number .bign { position: absolute; left: 110px; top: 330px; }
.k-number .bign .line { margin-top: 34px; max-width: 900px; font-size: 36px; color: var(--fg); }
.k-number .vz { position: absolute; left: 1120px; top: 300px; width: 680px; height: 640px; }
.k-number .tag { position: absolute; left: 120px; bottom: 100px; }
/* цифра на фото — в стеклянной плашке */
.k-number.has-photo .glass { left: 110px; top: 110px; bottom: 120px; width: 1040px; padding: 60px 66px; display: flex; flex-direction: column; }
.k-number.has-photo .glass .ttl { font-size: 62px; }
.k-number.has-photo .glass .num { margin-top: auto; font-size: 300px; color: var(--c); }
.k-number.has-photo .glass .line { font-size: 34px; color: var(--panel-fg); margin-top: 28px; }

/* инфографика цифр */
.dots { display: grid; grid-template-columns: repeat(10, 1fr); gap: 16px; width: 600px; margin: 10px 0 0 40px; }
.dots i { aspect-ratio: 1; border-radius: 50%; background: var(--c); }
.dots i.off { background: transparent; border: 2px solid var(--line); }
.vz-cap { margin-top: 26px; font-size: 26px; color: var(--muted); }
.sq { display: grid; grid-template-columns: repeat(10, 1fr); gap: 10px; width: 520px; margin-left: 80px; }
.sq i { aspect-ratio: 1; border-radius: 8px; background: color-mix(in srgb, var(--fg) 22%, transparent); }
.sq.add { margin-top: 22px; }
.sq.add i { background: var(--fg); box-shadow: 0 0 0 4px color-mix(in srgb, var(--fg) 25%, transparent); }
.sq-cap { margin: 30px 0 0 80px; font-size: 28px; color: var(--fg); }
.bars { position: absolute; inset: 0; }
.bars .b { position: absolute; bottom: 90px; width: 190px; border-radius: 22px 22px 6px 6px; background: color-mix(in srgb, var(--fg) 26%, transparent); transform-origin: 50% 100%; }
.bars .b.hi { background: var(--fg); }
.bars .bv { position: absolute; width: 190px; text-align: center; font-size: 40px; font-weight: 300; }
.bars .bl { position: absolute; bottom: 30px; width: 190px; text-align: center; font-size: 28px; color: var(--muted); }
.donut { position: absolute; left: 70px; top: 20px; width: 600px; height: 600px; }
.donut circle { fill: none; stroke-width: 64; }
.donut .bgc { stroke: color-mix(in srgb, var(--fg) 18%, transparent); }
.donut .fgc { stroke: var(--fg); stroke-linecap: round; }
.donut-t { position: absolute; left: 70px; top: 270px; width: 600px; text-align: center; font-size: 30px; color: var(--muted); }
.ridbar { display: flex; gap: 6px; margin-top: 34px; }
.ridbar i { flex: 1; height: 34px; border-radius: 6px; }
.ridleg { display: flex; flex-wrap: wrap; gap: 10px 30px; margin-top: 18px; font-size: 22px; color: var(--panel-muted); }
.ridleg span { display: inline-flex; align-items: center; gap: 10px; }
.ridleg span i { width: 14px; height: 14px; border-radius: 4px; }

/* ---------------- схемы ---------------- */
.fig { position: absolute; inset: 0; pointer-events: none; }
.fig > svg { position: absolute; inset: 0; width: 1920px; height: 1080px; overflow: visible; }
.lb { position: absolute; translate: -50% 0; text-align: center; }
.lb.l { translate: none; text-align: left; }
.lb:not([style*="width"]) { width: max-content; }
.lb.r { translate: -100% 0; text-align: right; }
.lb .t { font-size: 34px; line-height: 1.15; font-weight: 400; }
.lb .s { font-size: 25px; line-height: 1.3; color: var(--muted); margin-top: 8px; }
.lb .loss { font-size: 24px; color: var(--sec); margin-top: 8px; display: inline-flex; gap: 8px; align-items: center; }
.lb .loss::before { content: '−'; display: inline-grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--sec); color: #fff; font-size: 22px; line-height: 1; }
.yr { font-family: var(--f-num); font-weight: var(--w-num); font-size: 150px; line-height: 1; letter-spacing: -.04em; }
.node { position: absolute; translate: -50% -50%; display: grid; place-items: center; border-radius: 50%; }
.node .ico { width: 46%; height: 46%; stroke-width: 1.3; }
.ln { fill: none; stroke: var(--line); stroke-width: 3; }
.ln.c { stroke: var(--c); }
.draw { stroke-dasharray: 1; stroke-dashoffset: 1; }
.slide.on .draw { stroke-dashoffset: 0; transition: stroke-dashoffset 1300ms var(--move) calc(var(--d, 0) * var(--step-ms)); }
.box { position: absolute; translate: -50% -50%; border-radius: 30px; display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; gap: 10px; }
.box .ico { width: 64px; height: 64px; }
.box .t { font-size: 36px; }
.box .s { font-size: 24px; color: var(--muted); }
.price { font-family: var(--f-num); font-weight: var(--w-num); color: var(--sec); }
.tierdots { display: inline-flex; gap: 10px; align-items: center; }
.tierdots i { width: 44px; height: 12px; border-radius: 6px; background: color-mix(in srgb, var(--sec) 25%, transparent); }
.tierdots i.on { background: var(--sec); }
.part { offset-rotate: 0deg; }
.slide.on .part { animation: run 2.6s linear infinite; animation-delay: calc(var(--o, 0) * -1s + 1.2s); }
@keyframes run { from { offset-distance: 0%; opacity: 0; } 8% { opacity: 1; } 92% { opacity: 1; } to { offset-distance: 100%; opacity: 0; } }
.spin { transform-box: fill-box; transform-origin: 50% 50%; }
.slide.on .spin { animation: spin 40s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.kii { position: absolute; display: inline-flex; align-items: center; gap: 14px; font-size: 26px; padding: 14px 24px; border-radius: 999px; background: color-mix(in srgb, var(--sec) 20%, transparent); border: 1px solid color-mix(in srgb, var(--sec) 60%, transparent); }
.kii .ico { width: 30px; height: 30px; color: var(--sec); }

/* три рычага эффекта */
.lever { position: absolute; border-radius: 34px; padding: 40px 42px; background: color-mix(in srgb, var(--lc) 14%, var(--glass)); border: 1px solid color-mix(in srgb, var(--lc) 55%, transparent); -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); display: flex; flex-direction: column; color: var(--fg); }
.lever .lh { display: flex; align-items: center; gap: 16px; font-size: 34px; }
.lever .li { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 50%; background: var(--lc); color: var(--bg); font-size: 36px; }
.lever .lv { margin-top: auto; font-family: var(--f-num); font-weight: var(--w-num); font-size: 168px; line-height: .9; letter-spacing: -.04em; color: var(--lc); white-space: nowrap; }
.lever .ls { margin-top: 22px; font-size: 28px; line-height: 1.3; }
.lever .lw { margin-top: 14px; font-size: 21px; color: var(--muted); }
/* подпись к фото и карточки 3D-моделей */
.phcap { position: absolute; left: 110px; top: 56px; font-size: 21px; padding: 8px 16px; border-radius: 12px; background: var(--glass); color: var(--panel-muted); -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
.cards { position: absolute; right: 110px; top: 130px; width: 520px; display: flex; flex-direction: column; gap: 22px; }
.card { margin: 0; position: relative; border-radius: 22px; overflow: hidden; border: 1px solid var(--glass-b); box-shadow: 0 20px 50px -20px rgba(0, 0, 0, .6); background: #fff; height: 256px; }
.card img { width: 100%; height: 100%; object-fit: cover; display: block; }
.card figcaption { position: absolute; left: 12px; bottom: 12px; font-size: 19px; padding: 6px 12px; border-radius: 10px; background: rgba(9, 16, 13, .8); color: #F5F8F3; }

/* ---------------- РИД ---------------- */
.k-rids .hd { top: 90px; }
.k-rids .ttl { font-size: 66px; }
.k-rids .line { font-size: 30px; margin-top: 18px; }
.rg { position: absolute; top: 330px; }
.rg h3 { margin: 0 0 18px; font-weight: 400; font-size: 30px; display: flex; align-items: center; gap: 14px; }
.rg h3 i { width: 18px; height: 18px; border-radius: 50%; background: var(--gc); }
.rg h3 span { color: var(--muted); font-size: 24px; }
.rg .tiles { display: grid; gap: 14px; }
.tile { all: unset; box-sizing: border-box; cursor: pointer; display: flex; flex-direction: column; justify-content: space-between; gap: 8px; width: 248px; min-height: 118px; padding: 16px 18px; border-radius: 18px; background: color-mix(in srgb, var(--gc) 16%, var(--glass)); border: 1px solid color-mix(in srgb, var(--gc) 55%, transparent); -webkit-backdrop-filter: blur(14px); backdrop-filter: blur(14px); color: var(--fg); transition: transform 160ms var(--ease), background 160ms var(--ease); }
.tile .ty { display: flex; justify-content: space-between; font-size: 18px; color: var(--muted); }
.tile .ty span { display: inline-flex; align-items: center; gap: 8px; }
.tile .ty .ico { width: 20px; height: 20px; color: var(--gc); }
.tile .nm { font-size: 22px; line-height: 1.2; }
.tile:focus-visible { outline: 3px solid var(--gc); outline-offset: 3px; }
@media (hover: hover) and (pointer: fine) { .tile:hover { transform: translateY(-3px); background: color-mix(in srgb, var(--gc) 30%, var(--glass)); } }
.rg[data-g="see"] { --gc: var(--see); }
.rg[data-g="think"] { --gc: var(--think); }
.rg[data-g="act"] { --gc: var(--act); }
.rg[data-g="thermo"] { --gc: var(--thermo); }

/* ---------------- врезка ---------------- */
.k-embed { background: var(--bg); }
.k-embed iframe { position: absolute; left: 0; top: 76px; width: 1920px; height: 1004px; border: 0; background: var(--bg); }
.emb-t { position: absolute; left: 0; right: 0; top: 0; height: 76px; z-index: 3; display: flex; align-items: center; gap: 18px; padding: 0 40px; font-size: 32px; font-weight: 300; background: var(--f-forest); border-bottom: 1px solid var(--line); pointer-events: none; color: var(--fg); }
.emb-t::before { content: ''; width: 14px; height: 14px; border-radius: 50%; background: var(--act); }
.emb-ph { position: absolute; inset: 200px 160px; display: grid; place-items: center; border: 2px dashed var(--line); border-radius: 30px; }

/* ---------------- финал ---------------- */
.k-final .glass.l { left: 110px; top: 160px; width: 980px; padding: 60px 66px; }
.k-final .glass.l .org { margin-top: 44px; display: flex; align-items: center; gap: 22px; font-size: 26px; }
.k-final .glass.l .org img { height: 56px; }
.qrcard { position: absolute; right: 150px; top: 160px; width: 560px; padding: 44px; border-radius: 34px; background: #fff; color: #0D1A12; text-align: center; box-shadow: 0 30px 80px -24px rgba(0, 0, 0, .6); }
.qrcard img { width: 472px; height: 472px; display: block; }
.qrcard .u { margin-top: 18px; font-size: 32px; font-weight: 400; letter-spacing: .01em; }

/* ---------------- приложения ---------------- */
.srcs { position: absolute; left: 120px; right: 120px; top: 330px; display: grid; grid-template-columns: 1fr 1fr; gap: 18px 40px; font-size: 21px; line-height: 1.35; }
.srcs div { padding: 16px 20px; border-radius: 16px; background: var(--glass); border: 1px solid var(--glass-b); }
.srcs a { color: inherit; text-decoration: none; }
.srcs b { font-weight: 400; color: var(--act); }
.ridtab { position: absolute; left: 120px; right: 120px; top: 230px; border-collapse: collapse; font-size: 17px; }
.ridtab td, .ridtab th { text-align: left; padding: 7px 10px; border-bottom: 1px solid var(--line); vertical-align: top; font-weight: 400; }
.ridtab th { color: var(--muted); }

/* пометки «чего не хватает» */
.todos { display: none; position: absolute; right: 30px; bottom: 90px; z-index: 20; max-width: 560px; flex-direction: column; gap: 8px; }
.marks .todos { display: flex; }
.todos div, .todo { background: #FFE34D; color: #2A2200; font-size: 20px; line-height: 1.3; padding: 10px 16px; border-radius: 10px; box-shadow: 0 6px 20px rgba(0, 0, 0, .3); }

/* ---------------- появление ---------------- */
.rv { opacity: 0; transform: translateY(26px); }
.rv.fromL { transform: translateX(-70px); }
.rv.fromR { transform: translateX(70px); }
.rv.pop { transform: scale(.88); }
.rv.grow { transform: scaleY(0); opacity: 1; }
.slide.on .rv { opacity: 1; transform: none; transition: opacity var(--dur) var(--ease), transform var(--dur) var(--ease); transition-delay: calc(var(--d, 0) * var(--step-ms)); }
.slide.on .rv.grow { transition-duration: 1100ms; }
.slide.on .glass.rv { transition-duration: 900ms; }
.dots i, .sq i { opacity: 0; transform: scale(.4); }
.slide.on .dots i, .slide.on .sq i { opacity: 1; transform: none; transition: opacity 420ms var(--ease), transform 420ms var(--ease); transition-delay: calc(700ms + var(--i) * 12ms); }
.slide.on .sq.add i { transition-delay: calc(1900ms + var(--i) * 140ms); }
.donut .fgc { stroke-dashoffset: var(--len); }
.slide.on .donut .fgc { stroke-dashoffset: var(--to); transition: stroke-dashoffset 1500ms var(--move) 500ms; }

[data-motion="calm"] { --step-ms: 170ms; --dur: 1100ms; }
[data-motion="calm"] .slide.on .bg img, [data-motion="calm"] .slide.on .part, [data-motion="calm"] .slide.on .spin { animation: none; }
[data-motion="off"] .slide .rv, [data-motion="off"] .dots i, [data-motion="off"] .sq i { opacity: 1 !important; transform: none !important; transition: none !important; }
[data-motion="off"] .draw { stroke-dashoffset: 0 !important; transition: none !important; }
[data-motion="off"] .donut .fgc { stroke-dashoffset: var(--to) !important; transition: none !important; }
[data-motion="off"] .bg img, [data-motion="off"] .scan b, [data-motion="off"] .spin { animation: none !important; }
[data-motion="off"] .part { display: none; }
[data-motion="off"] .slide { transition: none; }
@media (prefers-reduced-motion: reduce) {
  html:not([data-motion-user]) .slide .rv, html:not([data-motion-user]) .dots i, html:not([data-motion-user]) .sq i { transform: none !important; }
  html:not([data-motion-user]) .bg img, html:not([data-motion-user]) .part, html:not([data-motion-user]) .spin, html:not([data-motion-user]) .scan b { animation: none !important; }
}

/* ---------------- меню ---------------- */
#menuBtn { position: fixed; right: 14px; top: 12px; z-index: 50; width: 40px; height: 40px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .06); color: rgba(255, 255, 255, .5); cursor: pointer; display: grid; place-items: center; opacity: .35; transition: opacity 160ms var(--ease); }
[data-theme="light"] #menuBtn { color: rgba(0, 0, 0, .5); background: rgba(0, 0, 0, .05); }
#menuBtn .ico { width: 20px; height: 20px; }
#menuBtn:hover, #menuBtn:focus-visible, #menuBtn[aria-expanded="true"] { opacity: 1; }
.idle #menuBtn { opacity: 0; }
#menu { position: fixed; right: 14px; top: 60px; z-index: 51; width: 380px; max-height: calc(100vh - 80px); overflow: auto; padding: 18px 20px; border-radius: 20px; background: rgba(14, 22, 18, .94); color: #EEF3EE; -webkit-backdrop-filter: blur(20px); backdrop-filter: blur(20px); border: 1px solid rgba(255, 255, 255, .14); font-size: 14px; opacity: 0; transform: scale(.96); transform-origin: top right; pointer-events: none; transition: opacity 180ms var(--ease), transform 180ms var(--ease); }
#menu.open { opacity: 1; transform: none; pointer-events: auto; }
#menu h4 { margin: 14px 0 8px; font-weight: 400; font-size: 12px; letter-spacing: .08em; text-transform: uppercase; color: #9DB0A2; }
#menu h4:first-child { margin-top: 0; }
.pvs { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.pv { all: unset; box-sizing: border-box; cursor: pointer; border-radius: 12px; padding: 10px; border: 1px solid rgba(255, 255, 255, .14); display: flex; flex-direction: column; gap: 8px; }
.pv[aria-pressed="true"] { border-color: #9AD13A; box-shadow: 0 0 0 2px #9AD13A inset; }
.pv:focus-visible { outline: 2px solid #9AD13A; outline-offset: 2px; }
.pv .sw2 { height: 46px; border-radius: 8px; display: flex; overflow: hidden; }
.pv .sw2 i { flex: 1; }
.pv .nm2 { font-size: 13px; }
.seg { display: flex; gap: 6px; }
.seg button, #menu .row button { flex: 1; padding: 8px 6px; border-radius: 10px; border: 1px solid rgba(255, 255, 255, .16); background: transparent; cursor: pointer; font-size: 13px; color: #EEF3EE; }
.seg button[aria-pressed="true"] { background: #9AD13A; color: #0D1A10; border-color: #9AD13A; }
#menu .tg { display: flex; justify-content: space-between; align-items: center; margin-top: 14px; }
.sw { width: 44px; height: 24px; border-radius: 12px; border: 0; background: rgba(255, 255, 255, .2); position: relative; cursor: pointer; }
.sw::after { content: ''; position: absolute; left: 3px; top: 3px; width: 18px; height: 18px; border-radius: 50%; background: #fff; transition: transform 160ms var(--ease); }
.sw[aria-pressed="true"] { background: #FFC233; }
.sw[aria-pressed="true"]::after { transform: translateX(20px); }
#menu .row { display: flex; gap: 6px; margin-top: 14px; }
#menu .keys { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 4px 10px; color: #C9D6CC; font-size: 12.5px; }
#menu .keys b { display: inline-block; min-width: 38px; font-weight: 400; color: #9AD13A; }
#toast { position: fixed; left: 50%; bottom: 30px; transform: translate(-50%, 20px); z-index: 60; background: rgba(14, 22, 18, .92); color: #fff; padding: 10px 18px; border-radius: 999px; font-size: 15px; opacity: 0; transition: opacity 200ms var(--ease), transform 200ms var(--ease); pointer-events: none; }
#toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ---------------- окно РИД ---------------- */
.modal { position: fixed; inset: 0; z-index: 40; display: grid; place-items: center; background: rgba(3, 8, 5, .66); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); opacity: 0; pointer-events: none; transition: opacity 220ms var(--ease); }
.modal.open { opacity: 1; pointer-events: auto; }
.dlg { position: relative; width: min(1400px, 94vw); height: min(860px, 90vh); display: grid; grid-template-columns: 46% 54%; grid-template-rows: 1fr auto; border-radius: 26px; overflow: hidden; background: #F7F9F6; color: #102017; box-shadow: 0 40px 120px rgba(0, 0, 0, .6); transform: scale(.96); transition: transform 240ms var(--ease); }
.modal.open .dlg { transform: none; }
.dlg .doc { background: #E8EDE7; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 22px; overflow: hidden; min-height: 0; }
.dlg .doc img { max-width: 100%; max-height: calc(100% - 30px); object-fit: contain; box-shadow: 0 10px 30px rgba(0, 0, 0, .2); background: #fff; }
.dlg .doc .cap { font-size: 13px; color: #4A5A50; margin-top: 10px; }
.dlg .doc .ph { text-align: center; color: #4A5A50; }
.dlg .doc .ph .ico { width: 60px; height: 60px; }
.dlg .info { overflow: auto; padding: 34px 40px 20px; font-size: 16px; line-height: 1.5; min-height: 0; }
.dlg .mt { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; margin-bottom: 14px; }
.dlg .mt .c2 { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; padding: 5px 10px; border-radius: 999px; background: #E6EEE3; }
.dlg .mt .c2 .ico { width: 15px; height: 15px; }
.dlg .btn { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; padding: 8px 14px; border-radius: 10px; background: #2E7D32; color: #fff; text-decoration: none; font-size: 14px; }
.dlg .btn .ico { width: 16px; height: 16px; }
.dlg h3 { margin: 4px 0 18px; font-weight: 400; font-size: 24px; line-height: 1.3; }
.dlg .fld { margin-bottom: 14px; }
.dlg .fld .k { font-size: 12px; text-transform: uppercase; letter-spacing: .06em; color: #5A6B60; }
.dlg .fld .v.sm { font-size: 14.5px; }
.dlg .note { font-size: 13px; color: #5A6B60; margin-top: 10px; }
.dlg .nav2 { grid-column: 1 / -1; padding: 10px 20px; font-size: 13px; color: #5A6B60; background: #EEF2ED; text-align: center; }
.dlg .x { position: absolute; right: 14px; top: 14px; width: 40px; height: 40px; border-radius: 50%; border: 0; background: #E3E9E2; color: #102017; cursor: pointer; display: grid; place-items: center; z-index: 2; }
.dlg .x .ico { width: 20px; height: 20px; }
.dlg .x:focus-visible, .dlg .btn:focus-visible { outline: 3px solid #2E7D32; outline-offset: 2px; }

.m-only { display: none; }

/* ---------------- телефон: обычная прокрутка ---------------- */
.mobile body { overflow: auto; }
.mobile #viewport { position: static; overflow: visible; }
.mobile #stage { position: static; width: auto; height: auto; transform: none !important; }
.mobile .slide { position: relative; width: auto; height: auto; min-height: 0; opacity: 1; visibility: visible; padding: 28px 16px 48px; display: flex; flex-direction: column; gap: 18px; overflow: hidden; }
.mobile .slide.skip, .mobile .slide[data-print-only] { display: none; }
.mobile .slide.has-photo { min-height: 92svh; justify-content: flex-end; }
.mobile .hd, .mobile .glass, .mobile .bign, .mobile .vz, .mobile .tag, .mobile .qrcard, .mobile .rg, .mobile .srcs, .mobile .k-number .bign { position: relative; left: auto !important; right: auto !important; top: auto !important; bottom: auto !important; width: auto !important; }
.mobile .glass { padding: 24px 22px !important; border-radius: 22px; }
.mobile .ttl, .mobile .ttl.xl, .mobile .k-number .ttl, .mobile .k-photo .glass.bottom .ttl, .mobile .k-rids .ttl, .mobile .k-number.has-photo .glass .ttl { font-size: 30px; }
.mobile .line, .mobile .k-number .bign .line, .mobile .k-number.has-photo .glass .line { font-size: 18px; margin-top: 12px; }
.mobile .line.q::before { width: 30px; height: 30px; font-size: 18px; }
.mobile .num, .mobile .k-number.has-photo .glass .num { font-size: 120px; margin-top: 18px; }
.mobile .chip, .mobile .analog { font-size: 14px; }
.mobile .stepchip { margin-bottom: 14px; }
.mobile .k-title .logos img { height: 44px; } .mobile .k-title .logos img.ty { height: 34px; } .mobile .k-title .logos { margin-bottom: 20px; }
.mobile .foot { position: relative; left: auto; right: auto; bottom: auto; font-size: 13px; }
.mobile .foot .pg { display: none; }
.mobile .lad, .mobile .fig, .mobile .scan, .mobile .vz, .mobile .cards { display: none; }
.mobile .phcap { position: relative; left: auto; top: auto; font-size: 12px; align-self: flex-start; }
.mobile .m-only { display: block; }
.mobile .m-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 10px; }
.mobile .m-list li { padding: 12px 14px; border-radius: 14px; background: var(--glass); border: 1px solid var(--glass-b); font-size: 16px; display: flex; gap: 12px; align-items: baseline; }
.mobile .m-list li i { width: 12px; height: 12px; border-radius: 50%; background: var(--mc, var(--c)); flex: none; transform: translateY(1px); }
.mobile .m-list li span { color: var(--muted); font-size: 14px; }
.mobile .rg h3 { font-size: 20px; }
.mobile .rg .tiles { grid-template-columns: 1fr 1fr !important; }
.mobile .tile { width: auto; height: auto; min-height: 84px; }
.mobile .tile .nm { font-size: 15px; }
.mobile .k-embed { min-height: 0; }
.mobile .k-embed iframe { display: none; }
.mobile .emb-t { position: relative; left: auto; top: auto; font-size: 20px; }
.mobile .qrcard { width: 260px !important; padding: 20px; margin: 0 auto; }
.mobile .qrcard img { width: 220px; height: 220px; }
.mobile .qrcard .u { font-size: 16px; }
.mobile .srcs { grid-template-columns: 1fr; font-size: 14px; }
.mobile .ridbar i { height: 20px; }
.mobile .ridleg { font-size: 13px; }
.mobile .k-number .tag { margin-top: 6px; }
.mobile .rv, .mobile .dots i, .mobile .sq i { opacity: 1; transform: none; }
.mobile .dlg { grid-template-columns: 1fr; grid-template-rows: 40% 1fr auto; height: 92vh; }
.mobile .dlg .info { padding: 18px; }
.mobile #menuBtn { opacity: .6; }

/* ---------------- печать (PDF 16:9) ---------------- */
@page { size: 1920px 1080px; margin: 0; }
.print body, .print #viewport { overflow: visible; position: static; height: auto; background: none; }
.print #stage { position: static; transform: none !important; height: auto; }
.print .slide { position: relative; opacity: 1; visibility: visible; page-break-after: always; break-after: page; transition: none; }
.print .slide.skip { display: none; }
.print .rv, .print .dots i, .print .sq i { opacity: 1 !important; transform: none !important; transition: none !important; }
.print .draw { stroke-dashoffset: 0 !important; }
.print .donut .fgc { stroke-dashoffset: var(--to) !important; }
.print .bg img, .print .scan b, .print .spin { animation: none !important; }
.print .part { display: none; }
.print #menuBtn, .print #menu, .print #toast, .print .modal { display: none !important; }
.mobile .tile { min-width: 0; }
.mobile .tile .ty { font-size: 12px; gap: 6px; flex-wrap: wrap; }
.emb-shot { position: absolute; left: 0; top: 76px; width: 1920px; height: 1004px; object-fit: cover; }

/* ---------------- steklo (по умолчанию, 20.10.2026): фото + СВЕТЛОЕ матовое стекло ----------------
   Плашки на фото — светлые (кремово-зелёное стекло), текст тёмный, акценты — тёмные оттенки ступеней.
   Слайды-поля без фото и цветные плашки на них (рычаги, плитки, бруски) — как раньше (тёмные).
   Старое тёмное стекло — дизайн temno («Тёмное стекло» в меню). */
[data-design="steklo"] :is(.glass, .foot .pg, .has-photo .foot .src, .has-photo .lad, .lad b, .phcap, .hero, .rm-hint) {
  --glass: rgba(247, 250, 244, .78);
  --glass-b: rgba(255, 255, 255, .78);
  --panel-fg: #0B1A10;
  --panel-muted: #2C3D31;
  --fg: #0B1A10;
  --muted: #2C3D31;
  --line: rgba(11, 26, 16, .24);
  --see: #05557F;
  --think: #6E4500;
  --act: #2A5C0C;
  --sec: #A00D27;
  --thermo: #5E4B39;
  --human: #0B1A10;
  --noc: #04557C;
  --p30: #6E4600;
  --ind: #2A5C0C;
  --xy: #B07A00;
  --c: #2A5A0E;
}
[data-design="steklo"] .slide[data-c="see"] :is(.glass, .lad b, .phcap, .hero) { --c: var(--see); }
[data-design="steklo"] .slide[data-c="think"] :is(.glass, .lad b, .phcap, .hero) { --c: var(--think); }
[data-design="steklo"] .slide[data-c="act"] :is(.glass, .lad b, .phcap, .hero) { --c: var(--act); }
[data-design="steklo"] .slide[data-c="sec"] :is(.glass, .lad b, .phcap, .hero) { --c: var(--sec); }
[data-design="steklo"] .slide[data-c="noc"] :is(.glass, .lad b, .phcap, .hero) { --c: var(--noc); }
[data-design="steklo"] .slide[data-c="p30"] :is(.glass, .lad b, .phcap, .hero) { --c: var(--p30); }
[data-design="steklo"] .slide[data-c="ind"] :is(.glass, .lad b, .phcap, .hero) { --c: var(--ind); }
[data-design="steklo"] .glass { -webkit-backdrop-filter: blur(28px) saturate(1.35) brightness(1.06); backdrop-filter: blur(28px) saturate(1.35) brightness(1.06); border: 1px solid var(--glass-b); box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85), 0 30px 80px -30px rgba(6, 20, 12, .55); }
[data-design="steklo"] :is(.foot .pg, .has-photo .foot .src, .has-photo .lad, .lad b, .phcap, .rm-hint) { box-shadow: inset 0 0 0 1px var(--glass-b), 0 10px 30px -14px rgba(6, 20, 12, .5); }
[data-design="steklo"] .has-photo .lad b { box-shadow: none; }
[data-design="steklo"] .hero { box-shadow: 0 10px 30px -14px rgba(6, 20, 12, .5); }
[data-design="steklo"] .has-photo .lad span { opacity: .28; } [data-design="steklo"] .has-photo .lad span.on { opacity: 1; }
[data-design="steklo"] .scrim.full { background: linear-gradient(90deg, rgba(5, 10, 8, .30), rgba(5, 10, 8, .08)); }
[data-design="steklo"].print .glass { background: rgba(247, 250, 244, .90); }
[data-design="steklo"] .hero .ico { background: #FFC233; }

/* кнопки листания ‹ › (20.10) — внутри нижней панели .dock (как в excursion-noc) */
.navBtn { position: relative; width: 44px; height: 44px; border-radius: 50%; border: 0; background: rgba(255, 255, 255, .10); color: rgba(255, 255, 255, .75); font-size: 30px; line-height: 1; cursor: pointer; display: grid; place-items: center; padding: 0 0 4px; opacity: .45; transition: opacity 160ms var(--ease); }
.navBtn:hover, .navBtn:focus-visible { opacity: 1; }
[data-theme="light"] .navBtn { background: rgba(0, 0, 0, .06); color: rgba(0, 0, 0, .6); }
/* автопоказ: кнопка рядом с ‹ › (20.10) */
.navBtn.pill { width: auto; border-radius: 22px; padding: 0 16px; font: 500 15px/1 var(--f-main, sans-serif); letter-spacing: .01em; white-space: nowrap; overflow: hidden; }
.navBtn.apBtn span { position: relative; z-index: 1; }
.navBtn.apBtn i { position: absolute; left: 0; bottom: 0; height: 3px; width: 100%; background: var(--ind, #3EC1F3); transform-origin: 0 50%; transform: scaleX(0); opacity: 0; }
.navBtn.apBtn.on { opacity: .9; }
.navBtn.apBtn.on i { opacity: 1; }
.navBtn.apBtn.run i { animation: apgo var(--ap, 12s) linear forwards; }
.navBtn.apBtn.hold i { opacity: .35; transform: scaleX(1); }
.navBtn.pill, [data-theme="light"] .navBtn.pill { background: rgba(10, 17, 14, .62); color: #fff; opacity: .8; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.navBtn.pill:hover, .navBtn.pill:focus-visible, .navBtn.pill.on { opacity: 1; }
/* нижняя панель управления: ‹ › · автопоказ · на весь экран (видна при движении мыши) */
.dock { position: fixed; left: 50%; bottom: 14px; transform: translateX(-50%); z-index: 50; display: flex; align-items: center; gap: 8px; transition: opacity 200ms var(--ease, ease); }
.idle .dock { opacity: 0; }
.idle .dock:hover, .idle .dock:focus-within { opacity: .6; }
.print .dock, .st-on .dock { display: none; }
.mobile .dock { bottom: 10px; }
.mobile .dock .prev, .mobile .dock .next, .mobile .dock .apBtn { display: none; }
/* кнопка «⛶ На весь экран» (переносимая: fsButton() в deck.js + это правило) */
.fsBtn span { pointer-events: none; }
.dock .navBtn, [data-theme="light"] .dock .navBtn { background: rgba(10, 17, 14, .62); color: #fff; opacity: .8; -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px); }
.dock .navBtn:hover, .dock .navBtn:focus-visible, .dock .navBtn.on { opacity: 1; }

/* автопоказ: полоска внизу экрана */
#apbar { position: fixed; left: 0; bottom: 0; height: 4px; width: 100%; z-index: 60; transform-origin: 0 50%; transform: scaleX(0); background: var(--ind, #3EC1F3); opacity: .75; pointer-events: none; }
#apbar.run { animation: apgo var(--ap, 12s) linear forwards; }
@keyframes apgo { to { transform: scaleX(1); } }
.auto #menuBtn { opacity: 0; }
.auto.idle, .auto.idle * { cursor: none; }
.print #apbar { display: none; }