/* Исправления и экраны Пико (магазин, кабинет родителя, рисование, математика). */
/* Камера: у .overlay и .nocam в style.css задан display:grid, из-за этого атрибут hidden не срабатывал
   и полупрозрачный зелёный слой «Включаю камеру» (rgba(30,60,32,.78)) оставался поверх камеры всю зарядку. */
[hidden],.overlay[hidden],.nocam[hidden]{display:none!important}
/* Камера: никакого фона поверх видео. Холст со скелетом прозрачный, видео видно целиком. */
html .cam,html .cam video{background:transparent!important}
html .cam canvas{background:transparent!important;background-color:transparent!important;z-index:1}
html .cam video{z-index:0;opacity:1!important;visibility:visible!important;filter:none!important;mix-blend-mode:normal!important}
#pk-btn{display:none!important}
.yz-fab{position:absolute;right:16px;bottom:calc(104px + env(safe-area-inset-bottom,0px));z-index:20;width:64px;height:64px;border-radius:50%;background:var(--grad-btn);color:#fff;font-family:var(--head);font-weight:800;font-size:.8rem;box-shadow:var(--sh-g);display:grid;place-items:center;text-align:center;line-height:1.05;border:3px solid #fff}
.yz-fab span{font-size:1.5rem;display:block}
.yzo{position:absolute;inset:0;z-index:70;background:var(--paper);padding-top:var(--sat,0px);padding-bottom:env(safe-area-inset-bottom,0px);display:flex;flex-direction:column;animation:yzin .25s var(--ease)}
@keyframes yzin{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.yzo-h{background:var(--grad);color:#fff;padding:16px 16px 18px;display:flex;align-items:center;gap:12px;border-radius:0 0 28px 28px;flex:none}
.yzo-h h2{flex:1;color:#fff;font-size:1.25rem}
.yzo-b{flex:1;overflow-y:auto;padding:16px 16px 40px;display:flex;flex-direction:column;gap:14px}
.yz-bal{display:flex;gap:8px;flex-wrap:wrap}
.yz-tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.yz-tile{background:#fff;border-radius:24px;padding:18px 14px;box-shadow:var(--sh);display:flex;flex-direction:column;gap:6px;min-height:128px;text-align:left}
.yz-tile i{font-style:normal;font-size:2.2rem;line-height:1}
.yz-tile b{font-size:1.02rem}.yz-tile span{font-size:.85rem;color:var(--gray);line-height:1.25}
.yz-item{background:#fff;border-radius:22px;padding:14px;box-shadow:var(--sh);display:flex;gap:12px;align-items:flex-start}
.yz-em{width:56px;height:56px;border-radius:18px;background:var(--g-soft);display:grid;place-items:center;font-size:1.9rem;flex:none}
.yz-item .grow{display:flex;flex-direction:column;gap:6px}
.yz-price{font-family:var(--head);font-weight:700;color:var(--g3)}
.yz-rub{font-family:var(--head);font-weight:700;color:var(--dark)}
.yz-row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.yz-in{min-height:44px!important;padding:0 10px!important;border-radius:12px!important;font-size:.95rem!important;width:96px!important;box-shadow:none!important;border:2px solid var(--line)!important}
.yz-in.wide{width:100%!important}
.yz-note{background:#fff8e1;border-radius:18px;padding:12px 14px;font-size:.92rem;line-height:1.35}
.yz-ok{background:var(--g-soft);border-radius:18px;padding:12px 14px;font-size:.95rem}
.yz-err{background:#ffe9e9;border-radius:18px;padding:12px 14px;font-size:.95rem;color:#8a1016}
.yz-canvas{position:relative;width:100%;aspect-ratio:1/1;background:#fff;border-radius:24px;box-shadow:var(--sh);overflow:hidden;touch-action:none}
.yz-canvas canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none}
.yz-pal{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.yz-pal button{width:36px;height:36px;border-radius:50%;border:3px solid #fff;box-shadow:0 2px 6px rgba(0,0,0,.2)}
.yz-pal button[aria-pressed=true]{outline:3px solid var(--dark);outline-offset:1px}
.yz-say{display:flex;gap:10px;align-items:center;background:#fff;border-radius:20px;padding:12px 14px;box-shadow:var(--sh);font-family:var(--head);font-weight:600;line-height:1.3}
.yz-say i{font-style:normal;font-size:1.8rem}
.yz-ex{font-family:var(--head);font-weight:800;font-size:2.4rem;text-align:center;color:var(--dark);padding:6px 0}
.yz-ans{font-family:var(--head)!important;font-size:1.6rem!important;text-align:center;min-height:64px!important}
.yz-steps{display:flex;flex-direction:column;gap:6px}
.yz-steps div{font-size:.92rem;color:var(--gray)}
.yz-gal{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.yz-gal img{width:100%;border-radius:14px;box-shadow:var(--sh);background:#fff}
.yz-pcard{display:flex;gap:12px;align-items:center;text-align:left;width:100%}
.yz-pcard i{font-style:normal;font-size:1.8rem}
/* магазин по уровням, документы */
.yz-tier{display:flex;flex-direction:column;gap:2px;margin:14px 2px 2px}
.yz-tier b{font-size:1.05rem}
.yz-docs{flex-wrap:wrap;justify-content:center;margin-top:14px}
.yz-doc{background:#fff;border-radius:16px;padding:12px 14px;margin:8px 0;line-height:1.5}
.yz-doc b{display:block;color:#1e6f31;margin-bottom:4px}
.yz-doc p{margin:4px 0}
/* Камера: никаких цветных подложек поверх видео. Ребёнок всегда видит себя как в зеркале.
   Надписи «Приготовься», «Загружаю модель», отсчёт и «Готово!» читаются за счёт тени, а не фона. */
html .sess .cam .overlay{background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
html .sess .cam .overlay .ov-top,html .sess .cam .overlay .ov-sub{color:#fff!important;text-shadow:0 1px 3px rgba(0,0,0,.85),0 0 12px rgba(0,0,0,.6)}
html .sess .cam .overlay .big{color:#fff!important;text-shadow:0 2px 6px rgba(0,0,0,.8),0 0 22px rgba(0,0,0,.55)}
html .sess .cam .nocam{background:transparent!important}
