/* mía · оболочка приложения. Подключается последней: убирает презентационную «студию» прототипа,
   на телефоне раскрывает приложение на весь экран, на широком экране оставляет его в колонке телефона. */
html,body{height:100%}
body{overscroll-behavior:none;-webkit-tap-highlight-color:transparent}
.studio.app-shell{display:flex;align-items:center;justify-content:center;max-width:none;min-height:100dvh;padding:24px;gap:0}
.app-shell .device-stage{width:auto}
.app-shell .device{height:min(880px,calc(100dvh - 48px))}

@media(max-width:720px){
 .studio.app-shell{display:block;padding:0}
 .app-shell .device-stage{width:100%}
 .app-shell .device{width:100%;max-width:100%;height:100dvh;min-height:0;border-radius:0;box-shadow:none}
 /* Настоящие поля устройства вместо нарисованных статус-бара и индикатора «домой». */
 .app-shell .app-header{padding-top:calc(13px + env(safe-area-inset-top))}
 .app-shell .device[data-view=onboarding] .app-viewport{padding-top:env(safe-area-inset-top)}
 .app-shell .home-bar,.app-shell .device[data-view=onboarding] .home-bar{height:max(12px,env(safe-area-inset-bottom))}
 .app-shell .home-bar:after{display:none}
}

/* Ссылка-кнопка перехода в нативное приложение выглядит как основная кнопка. */
a.ob-app-link{text-decoration:none;box-sizing:border-box}

/* Недоступные (ещё не открытые) дни в списке пути. */
.route-row.locked{opacity:.5;cursor:default}
.route-row.locked:active{transform:none}

/* Возврат из просмотра прошлого дня. */
.day-return{display:flex;align-items:center;gap:8px;width:100%;margin:0 0 12px;padding:11px 15px;border:0;border-radius:16px;background:#2D213C;color:#fff;font:600 12px/1.3 var(--sans);text-align:left;cursor:pointer}
.day-return span{flex:1}
.day-return svg{width:16px;height:16px;flex:none;color:#DFFF70}

/* Аудиоплеер записанных треков. */
.audio-control.has-track{flex-wrap:wrap;row-gap:10px}
.audio-track{flex-basis:100%;display:flex;align-items:center;gap:10px;font:600 10px/1 var(--sans);font-variant-numeric:tabular-nums}
.audio-track input[type=range]{flex:1;min-width:0;height:22px;margin:0;background:transparent;accent-color:#2D213C;cursor:pointer}
.audio-track span{min-width:30px;text-align:center;opacity:.8}

/* Блок тестового режима в аккаунте. */
.test-tools{margin-top:18px;padding:16px;border:1.5px dashed #B99BE0;border-radius:20px;background:#F3ECFD}
.test-tools>span{display:flex;align-items:center;gap:7px;font:700 9px/1 var(--sans);letter-spacing:1.2px;color:#5B3F7E}
.test-tools>span svg{width:14px;height:14px}
.test-tools p{margin:9px 0 12px;font-size:12px;line-height:1.55;color:#4B3D57}
.test-tools button{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;min-height:44px;border:0;border-radius:14px;background:#2D213C;color:#fff;font:600 12px/1.2 var(--sans);cursor:pointer}
.test-tools button svg{width:15px;height:15px;color:#DFFF70}
.test-tools button:disabled{opacity:.45;cursor:default}

/* Шаг «почта» в языке экранов с вопросами. */
.fq-field{display:block;margin:0 0 14px}
.fq-field>span{display:block;font-size:9px;letter-spacing:1px;text-transform:uppercase;color:var(--mia-muted);margin:0 0 8px 4px}
.fq-field input{width:100%;box-sizing:border-box;min-height:60px;padding:0 18px;border:1.5px solid #DFD1EA;border-radius:19px;background:#FFF;font:500 16px/1.3 var(--sans);color:var(--mia-ink)}
.fq-field input::placeholder{color:#A195AB}
.fq-field input:focus{border-color:var(--mia-violet)}
.fq-field input[aria-invalid=true]{border-color:#C0567A;background:#FFF6F9}
.fq-consent{display:flex;gap:11px;align-items:flex-start;padding:15px 14px;border-radius:19px;background:var(--mia-lilac-soft);font-size:11px;line-height:1.6;color:var(--mia-ink);cursor:pointer;margin:0 0 10px}
.fq-consent input{flex:none;width:20px;height:20px;margin:1px 0 0;accent-color:var(--mia-violet)}
.fq-consent a{color:var(--mia-violet);text-underline-offset:3px}

/* Тариф и оплата подписки. */
.ob-order-email{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:15px;padding-top:15px;border-top:1px solid #DAC9E5;font-size:11px;color:var(--mia-muted);min-width:0}
.ob-order-email>span{display:flex;align-items:center;gap:6px;min-width:0;overflow-wrap:anywhere}
.ob-order-email svg{width:14px;height:14px;flex:none}
.ob-order-email button{flex:none;font-size:10px;color:var(--mia-violet);text-decoration:underline;text-underline-offset:3px;min-height:30px}
.ob-pay-links a{font-size:8px;text-decoration:underline;text-underline-offset:3px;padding:9px 0;color:var(--mia-muted)}
.sheet .ob-pay-links{margin:4px 0 14px}
.ob-actions a.ob-store-link{margin-top:10px;background:transparent;border:1.5px solid var(--mia-ink);color:var(--mia-ink);box-shadow:none}
.ob-paid .ob-footnote b{font-weight:600;overflow-wrap:anywhere}
.ob-paid.is-waiting .ob-success-spark{animation:mia-wait 1.6s ease-in-out infinite}
@keyframes mia-wait{50%{opacity:.35;transform:rotate(12deg) scale(.85)}}
.reduced-motion .ob-paid.is-waiting .ob-success-spark{animation:none}
@media(prefers-reduced-motion:reduce){.ob-paid.is-waiting .ob-success-spark{animation:none}}

/* Подвал сайта: тёмный блок во всю ширину экрана, как в макете. */
.site-footer{margin:30px -24px -15px;padding:30px 22px 34px;background:var(--mia-night);color:#C4B3D6;font-size:13px;line-height:1.6}
.site-footer-logo{display:block;font:italic 800 34px/1 var(--sans);letter-spacing:-3px;color:#FBF7FF;margin-bottom:18px}
.site-footer p{margin:0 0 22px;padding-bottom:22px;border-bottom:1px solid rgba(251,247,255,.14)}
.site-footer nav{display:flex;flex-wrap:wrap;gap:12px 22px;margin-bottom:18px}
.site-footer a{color:#E8DCFB;text-decoration:underline;text-underline-offset:4px;text-decoration-color:rgba(232,220,251,.45)}
.site-footer small{display:block;font-size:12px;color:#A594B8}
@media(max-width:720px){.site-footer{margin:30px -22px -12px}}
@media(max-width:360px){.site-footer{margin:30px -18px -12px}}
