/* Только геометрия сцены Байти. Шрифт, фон страницы, обложка, шапка, разделы,
   кнопки и подвал приходят из настоящих tokens.css и catalog.css. */
.bytey-local .demo-bytey-layout{grid-template-columns:minmax(0,1fr) 300px}
.bytey-local .demo-bytey-stage{aspect-ratio:16/9;max-height:420px}
.bytey-local .demo-bytey-stage{isolation:isolate;background:radial-gradient(ellipse at 50% 85%,#5c408941,transparent 55%),radial-gradient(ellipse at 15% 10%,#49347745,transparent 60%),radial-gradient(ellipse at 95% 40%,#205a6240,transparent 65%),#10111f}
.bytey-local .demo-bytey-stage::before{content:"";position:absolute;z-index:-1;inset:58% -30% -40%;transform:perspective(260px) rotateX(54deg);transform-origin:50% 0;background-image:linear-gradient(#a991d21c 1px,transparent 1px),linear-gradient(90deg,#a991d21c 1px,transparent 1px);background-size:48px 48px;mask-image:radial-gradient(ellipse at 50% 25%,#000,transparent 64%);pointer-events:none}
.bytey-local .demo-bytey-stage::after{content:"";position:absolute;z-index:-1;left:26%;right:26%;height:13%;bottom:6%;border:1px solid #b5a0e940;border-radius:50%;background:radial-gradient(ellipse,#8671c332,#25233644 65%,transparent 70%);box-shadow:0 8px 25px #0005,0 0 50px #9a7bdc12;pointer-events:none}
.bytey-local .demo-bytey-stage>.fallback{object-fit:contain}
.bytey-local-mode{display:flex;align-items:center;gap:12px;font-size:.75rem;color:var(--text-muted)}
.bytey-local .demo-cseq-head #pause{min-width:44px;width:44px;display:grid;place-items:center;padding:10px}
#pause svg{width:16px;height:16px;stroke:currentColor;stroke-width:2;fill:none}
.bytey-local-power{position:absolute;left:16px;top:14px;display:flex;align-items:center;gap:8px;font-size:.75rem;color:var(--mint);pointer-events:none}
.battery-track{width:24px;height:10px;border:1px solid currentColor;border-radius:2px;padding:2px}
.battery-fill{display:block;width:32%;height:100%;background:currentColor}
.bytey-local .demo-bytey-controls{justify-content:flex-start}
.bytey-local .demo-bytey-controls>*{flex-shrink:0}
.bytey-local .demo-bytey-controls>:first-child{margin-top:auto}
.bytey-local .demo-bytey-controls>:last-child{margin-bottom:auto}
.bytey-local .demo-bytey-status{min-height:1.5em;font-size:.8rem;text-align:center}
.bytey-local-looks{display:flex;gap:8px;justify-content:center;margin-top:12px}
.bytey-local-looks .mini-look{padding:5px;width:80px;min-width:0;display:flex;flex-direction:column;align-items:center;font-size:.7rem;color:var(--text-secondary)}
.mini-look img{width:58px;height:58px;object-fit:contain}
.mini-look[aria-pressed=true],.bytey-local .action.active{border-color:var(--accent);background:var(--accent-soft)}
.bytey-local summary{cursor:pointer;font-size:.85rem;color:var(--text-secondary);padding:4px 0 12px}
.bytey-local-silent{font-size:.75rem;color:var(--text-muted);margin:0}
.bytey-volume{display:grid;grid-template-columns:1fr auto;align-items:center;gap:0 12px;margin-top:14px;color:var(--text-secondary);font-size:.75rem}
.bytey-volume output{font-variant-numeric:tabular-nums;color:var(--text-muted)}
.bytey-volume input{grid-column:1/-1;width:100%;min-width:0;height:32px;margin:0;accent-color:var(--accent);cursor:pointer}
.bytey-volume input:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}
.bytey-tabs{display:flex;gap:4px;margin-bottom:12px;border-bottom:1px solid var(--card-border)}
.bytey-tabs button{flex:1;padding:10px 2px;font:inherit;font-size:.7rem;color:var(--text-muted);background:none;border:0;border-bottom:2px solid transparent;cursor:pointer}
.bytey-tabs button[aria-selected=true]{color:var(--text);border-bottom-color:var(--accent)}
.bytey-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}
.bytey-choices[hidden]{display:none}
.bytey-choice.demo-tile-btn{display:flex;flex-direction:column;justify-content:flex-start;gap:5px;min-width:0;padding:5px;font-size:.65rem;text-align:center;line-height:1.2}
.bytey-choice img{display:block;width:100%;aspect-ratio:1.4;object-fit:contain;border-radius:4px}
.bytey-choice span{min-height:2.4em;display:flex;align-items:center;justify-content:center;overflow-wrap:anywhere}
.bytey-choice[aria-pressed=true]{border-color:var(--accent);background:var(--accent-soft)}
.bytey-local .demo-bytey-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}
.error-panel{position:absolute;inset:20%;padding:16px;background:var(--bg-2);border:1px solid var(--card-border);border-radius:var(--radius-md);font-size:.85rem;color:var(--text-secondary)}
@media(max-width:980px){.bytey-local .demo-bytey-layout{grid-template-columns:minmax(0,1fr)}.bytey-local .demo-bytey-stage{aspect-ratio:4/3;max-height:440px;width:100%}.bytey-local .demo-bytey-controls{grid-template-columns:minmax(0,1fr);gap:12px;margin-top:22px}.bytey-local .demo-bytey-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}.bytey-local .more .demo-bytey-buttons{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:480px){.bytey-local .demo-bytey-stage{aspect-ratio:1;max-height:340px}.bytey-local .demo-bytey-buttons .demo-tile-btn{font-size:.75rem;padding:8px;min-height:48px;text-align:center;justify-content:center;flex-wrap:wrap}.bytey-local-mode{gap:8px;font-size:.65rem}.bytey-local-looks .mini-look{width:64px;font-size:.65rem}.mini-look img{width:48px;height:48px}.bytey-local .demo-bytey-status{font-size:.75rem}.bytey-local-power{font-size:.65rem;left:10px;top:10px}}