/* Мультик: подписи поверх сцены, панель подписей, выборы, карта глав. Токены и кнопки — из style.css (GENOMA/8). */
.cart{max-width:1100px;margin:0 auto;padding:8px 16px 16px}
.chtitle{font:400 11px/1.6 var(--px);color:var(--paper);margin:8px 0}
.lab{position:absolute;transform:translateX(-50%);white-space:nowrap;pointer-events:none;font:600 11px/1.25 var(--mono);color:var(--bone)}
.lab.cap{color:var(--fog);font-weight:400;font-size:10px}
.lab.plate,.lab.ok,.lab.warn,.lab.bad{background:var(--ink);border:1px solid var(--ash);padding:1px 6px}
.lab.ok{border-color:var(--success);color:var(--success)}
.lab.warn{border-color:var(--warning);color:var(--warning)}
.lab.bad{border-color:var(--danger);color:var(--danger-text)}
.lab.big{font:400 9px/1.5 var(--px);color:var(--paper);background:var(--ink);border:1px solid var(--ash);padding:2px 8px}
@media (max-width:620px){.lab{font-size:9px}.lab.cap{font-size:8px}.lab.big{font-size:7px}}

.caps{margin:8px 0}
.caps p{margin:0 0 6px;padding:6px 12px;background:var(--coal);border-left:3px solid var(--ash)}
.caps .say{border-left-color:var(--accent);color:var(--paper)}
.cap.bio::before{content:"В клетке · ";color:var(--fog);font-weight:600}
.cap.our::before{content:"У нас · ";color:var(--paper);font-weight:600}
.cap.our{border-left-color:var(--paper)}

.ask{min-height:56px;margin:8px 0}
.ask-q{color:var(--paper);font-weight:600;margin:0 0 8px}
.ask .row-btns,.dlg-foot .row-btns{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.note{padding:6px 10px;margin:8px 0;border-left:3px solid var(--ash);background:var(--coal)}
.note.ok{border-left-color:var(--success)}.note.warn{border-left-color:var(--warning)}
.pkg-row{margin-bottom:10px}.pkg-row b{display:block;color:var(--paper);margin-bottom:4px}
.btn.toggle[aria-pressed="true"]{background:var(--paper);color:var(--ink);border-color:var(--paper)}
.btn:disabled{opacity:.45;cursor:not-allowed}
a.btn{display:inline-flex;align-items:center;text-decoration:none}
input[type=text]{width:100%;max-width:420px;padding:8px 10px;background:var(--graphite);color:var(--bone);border:1px solid var(--ash);border-radius:2px;font:inherit;margin-bottom:12px}

.map{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:8px;margin:8px 0}
.map[hidden]{display:none}
.map .wide{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:8px}
.chap{display:block;text-align:left;padding:10px 12px;background:var(--coal);color:var(--bone);border:1px solid var(--ash);cursor:pointer;min-height:44px}
.chap small{display:block;color:var(--fog);font-size:12px;margin-top:2px}
.chap b{color:var(--paper)}
.chap:hover,.chap:focus-visible{border-color:var(--bone)}
.chap.seen b::after{content:" ✓";color:var(--success)}

.dots{display:flex;flex-wrap:wrap;gap:4px;margin:8px 0}
.dots button{min-width:32px;min-height:32px;padding:0 6px;background:var(--coal);color:var(--fog);border:1px solid var(--ash);cursor:pointer;font-weight:600}
.dots button.seen{color:var(--success);border-color:var(--success)}
.dots button[aria-current="true"]{background:var(--accent);color:var(--ink);border-color:var(--accent)}
#glossBody{padding:0 16px;overflow:auto}
#glossBody table{margin-bottom:8px}
#glossBody td:first-child{color:var(--paper);font-weight:600;white-space:nowrap}

/* телефон: сцена на всю ширину экрана, чтобы целый масштаб был крупнее (iPhone 17 Pro Max: 440 px × 3 → 4×) */
@media (max-width:520px){
  .cart{padding-left:16px;padding-right:16px}
  .cart .scene-wrap{margin-left:-16px;margin-right:-16px;border-left:0;border-right:0}
  .chtitle{font-size:9px}
}