:root{font-family:ui-rounded,"SF Pro Rounded",system-ui,-apple-system,sans-serif;color:#293f39;background:#faf7f2;color-scheme:light;line-height:1.55;--ink:#293f39;--muted:#65716d;--green:#3c6657;--green-light:#e8f1e8;--peach:#f7dfcc;--line:#e5e8df;--card:#fffefa}

*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0;padding:28px 36px 48px;max-width:1420px;margin-inline:auto}
button,select,textarea,input{font:inherit}
button,a,summary,input{ -webkit-tap-highlight-color:transparent}
button{border:1px solid transparent;border-radius:18px;min-height:48px;padding:12px 20px;background:var(--green);color:#fff;font-size:15px;font-weight:600;cursor:pointer;transition:background .15s,box-shadow .15s}
button:hover:enabled{background:#2f5446;box-shadow:0 4px 12px #3c66571c}
button:disabled{background:#e7ebe3;color:#78827b;cursor:default;box-shadow:none}
button.secondary{background:#edf1e8;color:var(--ink);border-color:#dfe6d8}
button.secondary:hover:enabled{background:#dfe9da}
button.quiet{background:transparent;color:var(--green);font-weight:500}
button.quiet:hover:enabled{background:#eff2e9}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,summary:focus-visible{outline:3px solid #bd8053;outline-offset:4px}
h1,h2,h3,p{margin:0}
h1{font-size:18px;font-weight:500;line-height:1.3}
h2{font-size:24px;line-height:1.3;letter-spacing:-.5px}
h3{font-size:18px}
p{font-size:15px;margin:12px 0}
small{font-size:12px}
.muted,.helper{color:var(--muted);font-size:13px}
.helper{line-height:1.55}
.eyebrow{display:block;font-size:11px;font-weight:650;letter-spacing:1.4px;color:#758277;margin-bottom:9px}
.app-header{display:flex;align-items:center;gap:24px;padding-bottom:24px;border-bottom:1px solid var(--line);margin-bottom:28px}
.brand{display:flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none}
.brand-logo{width:54px;height:54px;object-fit:cover;border-radius:17px;box-shadow:0 7px 22px #2d423b1c}
.auth-page{min-height:calc(100vh - 76px);display:grid;grid-template-columns:minmax(320px,1fr) minmax(360px,480px);align-items:center;gap:clamp(44px,8vw,120px);max-width:1160px;margin:0 auto}
.auth-welcome{padding:32px 0}
.auth-brand{display:inline-flex;margin-bottom:72px}.auth-brand .brand-logo{width:72px;height:72px;border-radius:22px}
.auth-welcome>h1{font-size:clamp(40px,5.2vw,66px);font-weight:650;line-height:1.04;letter-spacing:-2.7px;max-width:760px}
.auth-welcome>p{font-size:18px;color:var(--muted);max-width:620px;margin:22px 0 36px}
.auth-plans{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-width:760px;margin-bottom:14px}.auth-plans>div{display:flex;flex-direction:column;gap:3px;padding:15px 17px;border:1px solid #e0e4d9;border-radius:20px;background:#fffefa}.auth-plans span{font-size:13px;font-weight:700}.auth-plans strong{font-size:17px;white-space:nowrap}.auth-plans small{color:var(--muted);font-size:11px}.auth-plans>div>small{margin-top:auto;padding-top:8px}.auth-plans strong small{font-size:10px;margin-left:2px}.auth-plans .auth-plan-paid{border-color:#789281;background:#f5faef}.auth-plans .auth-plan-ultra{border-color:#b8a2cf;background:#faf6ff}
.auth-paid-button{margin:0 0 18px;min-height:46px;background:#3f6c58}
.auth-privacy{display:flex;gap:14px;align-items:flex-start;max-width:570px;padding:18px 20px;border-radius:22px;background:#f1eee5}
.auth-privacy>span{display:grid;place-items:center;width:42px;height:42px;flex:0 0 42px;border-radius:15px;background:#e5eadf;color:#496d5d;font-size:24px}
.auth-privacy strong{font-size:14px}.auth-privacy p{font-size:13px;color:var(--muted);margin:4px 0 0}
.auth-card{padding:34px;box-shadow:0 18px 60px #4f493610}
.auth-tabs{display:grid;grid-template-columns:1fr 1fr;gap:6px;background:#f0efe7;border-radius:18px;padding:5px;margin-bottom:30px}
.auth-tabs button{min-height:44px;padding:8px;border-radius:14px;background:transparent;color:var(--muted)}
.auth-tabs button:hover{background:#f8f7f1;box-shadow:none}
.auth-tabs button[aria-selected=true]{background:#fffefa;color:var(--ink);box-shadow:0 2px 8px #4f493612}
.auth-card form h2{font-size:27px;margin-bottom:4px}.auth-card form>.muted{margin:0 0 22px}
.auth-card input{width:100%;border:1px solid #d9dfd4;border-radius:16px;background:#fcfcf7;color:var(--ink);font-size:16px;padding:12px 14px;margin-top:7px;min-height:50px}
.auth-card input::placeholder{color:#89928b}
.auth-card .auth-submit{margin-top:26px;min-height:52px}
.field-hint{display:block;color:var(--muted);margin-top:6px}
.auth-error{background:#fde8df;border:1px solid #e4b3a0;color:#854732;padding:12px 14px;border-radius:15px;font-size:13px;margin:18px 0 0}
.auth-links{display:flex;justify-content:center;flex-wrap:wrap;gap:8px 16px;margin-top:20px}.auth-links a{color:var(--muted);font-size:12px;text-underline-offset:3px}
.account{position:relative;padding-left:10px;border-left:1px solid var(--line)}
.account summary{display:flex;align-items:center;gap:7px;list-style:none;cursor:pointer;border-radius:12px;padding:8px 9px;font-size:13px;font-weight:650;max-width:180px}.account summary::-webkit-details-marker{display:none}.account summary:hover{background:#eff2e9}.account summary span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.account-menu{position:absolute;z-index:30;top:calc(100% + 9px);right:0;display:grid;min-width:220px;padding:10px;background:#fffefa;border:1px solid var(--line);border-radius:18px;box-shadow:0 16px 42px #293f3925}.account-menu a,.account-menu button{display:block;width:100%;min-height:38px;padding:9px 11px;border-radius:11px;text-align:left;font-size:13px}.account-menu a{color:var(--ink);text-decoration:none}.account-menu a:hover{background:#eff2e9}.account-menu .danger-quiet{background:transparent;color:#9a493e}.account-menu .danger-quiet:hover{background:#fbece8;box-shadow:none}
.confirm-dialog{width:min(470px,calc(100vw - 28px));border:0;border-radius:26px;padding:0;background:#fffefa;color:var(--ink);box-shadow:0 26px 80px #23342a2e}.confirm-dialog::backdrop{background:rgba(35,49,42,.46);backdrop-filter:blur(5px)}.confirm-dialog form{padding:28px}.confirm-dialog h2{font-size:26px}.confirm-dialog input{width:100%;border:1px solid #d9dfd4;border-radius:16px;background:#fcfcf7;color:var(--ink);font-size:16px;padding:12px 14px;margin-top:7px;min-height:50px}.confirm-dialog .danger{background:#a04b3f}.confirm-dialog .danger:hover:enabled{background:#84392f}
.account-menu .admin-menu-button{background:#e8f0e5;color:#315f4b;font-weight:750}.account-menu .admin-menu-button:hover{background:#dbe9d8;box-shadow:none}
.admin-dialog{width:min(1080px,calc(100vw - 28px));max-width:none;max-height:calc(100dvh - 28px);border:0;border-radius:30px;padding:0;background:#f8f6ef;color:var(--ink);box-shadow:0 26px 80px #23342a2e}.admin-dialog::backdrop{background:rgba(35,49,42,.5);backdrop-filter:blur(5px)}.admin-shell{padding:28px;overflow:auto;max-height:calc(100dvh - 28px)}
.admin-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.admin-heading h2{font-size:30px;letter-spacing:-.8px}.admin-heading p{margin:7px 0 0;color:var(--muted);font-size:13px}.admin-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:22px 0}.admin-stats>div{display:grid;gap:2px;padding:16px 18px;border:1px solid var(--line);border-radius:19px;background:#fffefa}.admin-stats strong{font-size:24px;color:var(--green)}.admin-stats span{font-size:12px;color:var(--muted)}
.admin-identity>span{display:block;margin-top:3px;color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.admin-search{display:grid;gap:7px}.admin-search>div{display:grid;grid-template-columns:minmax(180px,1fr) auto auto;gap:9px}.admin-search input{width:100%;min-height:46px;border:1px solid #d7ddd4;border-radius:15px;background:#fffefa;padding:10px 13px;font:inherit}.admin-users{display:grid;gap:12px;margin-top:17px}.admin-user{display:grid;grid-template-columns:minmax(210px,1.2fr) minmax(180px,.9fr) minmax(270px,1.4fr);gap:18px;align-items:center;padding:18px;border:1px solid #e1e4dc;border-radius:22px;background:#fffefa}.admin-user.is-banned{border-color:#d8afa7;background:#fff9f7}.admin-user.is-self{background:#f2f5ec}.admin-identity{min-width:0}.admin-identity strong{display:block;font-size:16px;overflow:hidden;text-overflow:ellipsis}.admin-identity a{display:block;margin-top:3px;color:var(--muted);font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.admin-badges{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}.admin-badge{padding:5px 8px;border-radius:999px;background:#edf1e8;color:#4c6554;font-size:10px;font-weight:750}.admin-badge.blocked{background:#f8e4df;color:#914a3f}.admin-badge.admin{background:#eee4f7;color:#705588}.admin-meta{display:grid;gap:5px;font-size:12px;color:var(--muted)}.admin-meta strong{color:var(--ink)}.admin-controls{display:grid;grid-template-columns:1fr auto;gap:8px}.admin-controls select,.admin-controls input{min-width:0;min-height:42px;border:1px solid #d7ddd4;border-radius:13px;background:#fbfcf7;padding:8px 10px;font:inherit}.admin-controls button{min-height:42px;padding:9px 12px;font-size:12px}.admin-controls .admin-wide{grid-column:1/-1}.admin-controls .admin-ban{background:#a04b3f}.admin-controls .admin-unban{background:#517562}.admin-empty{padding:30px;text-align:center;border:1px dashed #cdd5ca;border-radius:22px;color:var(--muted)}.admin-audit{margin-top:20px;border-top:1px solid var(--line);padding-top:16px}.admin-audit summary{cursor:pointer;font-weight:750}.admin-audit-entries{display:grid;gap:8px;margin-top:12px}.admin-audit-entry{display:flex;justify-content:space-between;gap:16px;padding:10px 12px;border-radius:13px;background:#eeeee7;font-size:12px}.admin-audit-entry span{color:var(--muted);text-align:right}
.billing-trigger{display:flex;align-items:center;gap:9px;min-height:42px;padding:7px 13px;border:1px solid #dbe4d7;border-radius:16px;background:#f4f7ef;color:var(--ink);box-shadow:none;text-align:left}
.billing-trigger:hover:enabled{background:#eaf1e5;box-shadow:none}.billing-trigger svg{width:20px;height:20px;fill:none;stroke:#527362;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.billing-trigger span{display:grid;line-height:1.1}.billing-trigger small{font-size:9px;letter-spacing:.7px;text-transform:uppercase;color:var(--muted)}.billing-trigger strong{font-size:13px;color:#355f4e}
.header-context{flex:1}.connection-status{display:inline-flex;align-items:center;margin:0;padding:7px 11px;border-radius:999px;background:#f3eee5;color:var(--muted);font-size:11px;font-weight:650}.connection-status:before{content:"";width:6px;height:6px;margin-right:7px;border-radius:50%;background:#b18a61}
.privacy-chip,.status-chip,.hint-chip,.clock{font-size:12px;border-radius:50px;padding:7px 12px;background:var(--green-light);color:#4c6554;line-height:1.3}
.privacy-chip:before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#608773;margin-right:7px}
.privacy-chip.small{font-size:11px}
.status-chip{background:#f1eee7;max-width:100%;text-align:center}
.hint-chip{background:#f2ebfb;color:#75638a;font-size:11px}
.clock{font-size:15px;font-variant-numeric:tabular-nums;background:#f4eee3;white-space:nowrap}
.card{background:var(--card);border:1px solid #e9e9e0;border-radius:30px;padding:28px;min-width:0;box-shadow:0 8px 32px #4f493604}
.section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:18px}
.section-title h2{font-size:20px}
.buttons{display:flex;gap:10px;flex-wrap:wrap;margin-top:18px}
.full{width:100%}
.next-step{width:100%;margin-top:24px;min-height:54px}
.billing-dialog{width:min(1180px,calc(100vw - 32px));max-width:none;border:0;border-radius:30px;padding:0;background:transparent;color:var(--ink);overflow:visible}
.billing-dialog::backdrop{background:rgba(35,49,42,.46);backdrop-filter:blur(5px)}
.billing-dialog-shell{padding:30px;background:linear-gradient(135deg,#fffefa 0%,#f2f6e9 100%);border:1px solid #dfe7d8;border-radius:30px;box-shadow:0 26px 80px #23342a2e}
.subscription-heading{display:flex;justify-content:space-between;align-items:flex-start;gap:24px}
.subscription-heading h2{font-size:29px;letter-spacing:-.8px}.subscription-heading p{color:var(--muted);font-size:15px;max-width:720px;margin-bottom:0}
.billing-dialog-actions{display:flex;align-items:center;gap:10px;flex-shrink:0}
.dialog-close{display:grid;place-items:center;width:42px;height:42px;min-height:42px;padding:0;border-radius:50%;background:#eef1e9;color:#53645b;font-size:25px;font-weight:400;line-height:1}.dialog-close:hover:enabled{background:#e2e9dd;color:var(--ink);box-shadow:none}
.plan-badge{flex-shrink:0;padding:10px 17px;border-radius:999px;background:#355f4e;color:white;font-size:14px;font-weight:700}
.plan-comparison{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px}
.plan-card{display:flex;flex-direction:column;border:1px solid #e1e5dc;border-radius:24px;background:#fffefa;padding:22px}
.plan-card.featured{border:2px solid #638573;background:#fbfff8;padding:21px}
.plan-card.ultra{border:2px solid #9a7fb4;background:#fdfaff;padding:21px}.plan-card.ultra .best-choice{background:#eee4f7;color:#705588}
.plan-card-title{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.plan-card-title>div{display:grid;gap:3px}
.plan-name{font-size:14px;color:var(--muted);font-weight:700}.plan-card-title strong{font-size:27px;line-height:1.2;color:var(--ink)}.plan-card-title strong small{font-size:12px;color:var(--muted);font-weight:500;margin-left:3px}
.plan-state,.best-choice{font-size:11px;border-radius:999px;padding:6px 9px;background:#e8f1e8;color:#426451;white-space:nowrap}.best-choice{background:#f5e4ce;color:#765339}
.plan-card>p{font-size:13px;color:var(--muted);margin:13px 0 8px}.plan-card ul{margin:5px 0 18px;padding:0;list-style:none;display:grid;gap:7px;font-size:13px;color:var(--muted)}
.plan-card li:before{content:"✓";color:#4d7b64;font-weight:800;margin-right:8px}.plan-card li strong{color:var(--ink)}.plan-card button{margin-top:auto}
.plan-card.is-current{box-shadow:inset 0 0 0 2px #527562}.billing-message,.plan-explainer{font-size:12px;color:var(--muted);margin:16px 2px 0}.plan-explainer{padding:13px 15px;border-radius:16px;background:#f3f0e8}.plan-explainer strong{color:var(--ink)}
.setup-steps{display:flex;gap:10px;grid-column:1/-1;grid-row:1;background:#f0efe6;border-radius:24px;padding:8px}
.setup-steps button{flex:1;display:flex;align-items:center;gap:13px;justify-content:center;text-align:left;background:transparent;color:#627267;border-radius:18px}
.setup-steps button span{display:grid;place-items:center;width:34px;height:34px;border-radius:50%;background:#e1e5d9;flex-shrink:0}
.setup-steps small{display:block;font-weight:400;font-size:12px;margin-top:2px}
.setup-steps button[aria-current]{background:#fffefa;color:#355846;box-shadow:0 3px 8px #544e3210}
.setup-steps button[aria-current] span{background:#dfead8}
.setup-steps button:hover:enabled{background:#faf9f2}
.setup-intro{grid-column:1/-1;grid-row:2;padding:8px 4px 4px}
.setup-intro h2{font-size:36px;letter-spacing:-1px}
.setup-intro p{color:var(--muted);font-size:17px;margin:8px 0 0}
#setupPage{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);align-items:start;gap:24px}
.preview{grid-column:2;grid-row:3;position:sticky;top:24px}
[data-step-panel]{grid-column:1;grid-row:3}
.tip{background:#f7ecdf;color:#66523d;border-radius:20px;padding:15px 18px;font-size:14px;margin:18px 0}
.helper span{font-size:20px;color:#9b7355;margin-right:6px}
#scene{position:relative;height:410px;overflow:hidden;border-radius:24px;background:radial-gradient(ellipse at 50% 40%,#f3eddb,#e6eadf 78%)}
#scene canvas{display:block}
#placeholder{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;color:#647164}
.placeholder-face{font-size:64px;color:#89a58e;line-height:1.3}
#placeholder p{font-size:17px;margin:16px 0 4px}
.model-views{display:flex;gap:6px;margin:15px 0;flex-wrap:wrap}
.model-views button{flex:1;background:#f0f2e9;color:var(--ink);font-size:12px;padding:10px;border-radius:14px;white-space:normal}
.model-views button:hover:enabled{background:#e5ecdf}
.model-views button[aria-pressed=true]{background:#dfead8}
.model-views button:disabled{color:#808d80;background:#f4f4ed}
.appearance,.device-settings,.lesson-settings{margin-top:22px;border-top:1px solid var(--line);padding-top:16px}
.appearance summary,.device-settings summary,.lesson-settings summary{cursor:pointer;color:var(--muted);font-size:13px;padding:4px 0}
.appearance button{margin-top:12px}
.appearance input[type=color]{display:block;width:70px;height:40px;border:0;background:transparent}
.camera-frame{position:relative;overflow:hidden;background:#e3e8df;border-radius:24px}
video{display:block;width:100%;height:340px;object-fit:contain;background:#243b33;transform:scaleX(-1)}
.face-guide{position:absolute;pointer-events:none;inset:9% 29% 26%;border:2px dashed #ffffffe0;border-radius:48%}
.scan-overlay{position:absolute;inset:auto 0 0;padding:45px 20px 20px;background:linear-gradient(transparent,#203c34ed);text-align:center;pointer-events:none;color:white}
.scan-overlay #cameraHint{font-size:20px;line-height:1.3;font-weight:600;margin:8px 0;color:white;text-shadow:0 1px 4px #0005}
.scan-overlay #scanPhase{font-size:12px;color:#dae8d3}
.scan-overlay #scanCountdown{font-size:44px;font-variant-numeric:tabular-nums;line-height:1.2}
progress{width:100%;height:6px;accent-color:#6b956e;margin-top:14px}
.toggle-row{display:flex;gap:12px;align-items:center;margin-top:18px;font-size:15px;padding:8px 0}
.toggle-row small{display:block;color:var(--muted);font-size:12px;margin-top:3px}
input[type=checkbox]{width:22px;height:22px;accent-color:var(--green);flex-shrink:0;cursor:pointer}
.reading-label{margin-top:22px;display:block}
label:not(.toggle-row):not(.mic-switch){font-size:14px;display:block;margin-top:18px;font-weight:550}
select,textarea{width:100%;border:1px solid #d9dfd4;border-radius:16px;background:#fcfcf6;color:var(--ink);font-size:15px;padding:12px 14px;margin-top:7px;min-height:48px;max-width:100%}
select{cursor:pointer}
textarea{resize:vertical;min-height:105px;line-height:1.6}
textarea::placeholder{color:#7a847c;font-size:14px}
blockquote{background:#f2f4e9;border:0;border-radius:22px;margin:10px 0 20px;padding:22px;font-size:17px;line-height:1.7}
.voice-takes{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:16px 0 8px}
.voice-takes button{display:grid;grid-template-columns:32px 1fr;grid-template-rows:auto auto;column-gap:9px;text-align:left;align-items:center;min-height:72px;padding:11px 12px;background:#f6f5ed;color:var(--ink);border:1px solid var(--line);box-shadow:none}
.voice-takes button>span{grid-row:1/3;display:grid;place-items:center;width:32px;height:32px;border-radius:12px;background:#e4e9dd;color:var(--green);font-weight:700}
.voice-takes button strong{font-size:13px;line-height:1.25}.voice-takes button small{color:var(--muted);font-size:11px}
.voice-takes button[aria-pressed=true]{border-color:#6d9575;background:#edf4e9;box-shadow:0 0 0 2px #dce9d8}
.voice-takes button.recorded>span{background:#527d62;color:#fff}.voice-takes button.recorded small{color:#477153;font-weight:650}
meter{display:block;width:100%;height:14px;margin-top:20px}
audio{display:block;width:100%;margin-top:20px}
#voiceHint,#tutorStatus{font-size:14px;color:var(--muted)}
.ready-features{display:grid;gap:12px;margin:22px 0}
.ready-features>div{display:flex;gap:14px;align-items:flex-start;background:#f6f5ed;border-radius:22px;padding:16px}
.ready-features>div>span{display:grid;place-items:center;font-size:24px;width:42px;height:42px;background:#eee3d0;border-radius:15px;flex-shrink:0}
.ready-features p{margin:0;font-size:14px;color:var(--muted)}
.ready-features strong{display:block;color:var(--ink);font-size:15px;margin-bottom:5px}
.ready-camera{margin-top:10px}
.ready-camera-preview{margin-top:14px;padding:14px;border:1px solid #dde5d9;border-radius:22px;background:#f6f8f2}.ready-camera-preview .section-title{margin-bottom:10px}.ready-camera-preview .section-title strong{font-size:14px}.ready-camera-preview button{min-height:36px;padding:6px 10px;font-size:12px}.ready-camera-preview video{height:240px}.ready-camera-preview .helper{margin:9px 3px 0}
.parent-summary{margin:24px 0 18px;padding:20px;border:1px solid var(--line);border-radius:22px;background:#faf9f4}
.parent-summary h3{margin:0;font-size:19px}
.summary-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:16px 0}
.summary-grid>div{padding:12px 8px;border-radius:16px;background:#fff;text-align:center;border:1px solid var(--line)}
.summary-grid strong{display:block;font-size:23px;color:var(--green);font-variant-numeric:tabular-nums}
.summary-grid span{display:block;margin-top:3px;font-size:11px;color:var(--muted)}
.summary-cost{display:flex;gap:10px;justify-content:space-between;flex-wrap:wrap;margin:12px 0;font-size:13px}
.ready-mic{padding:18px;border:1px solid #dbe6d6;border-radius:22px;background:#edf4e9}
.start-button{background:#3f6c58;font-size:18px}
#error{position:sticky;top:12px;z-index:25;background:#fde8df;border:1px solid #e4b3a0;color:#854732;padding:18px 22px;border-radius:22px;margin-bottom:20px;white-space:pre-wrap;font-size:14px}
#readyHint{background:#f0f2e7;border-radius:18px;color:var(--muted);padding:12px 18px;font-size:13px}
body:not(.in-lesson) #readyHint{display:none}
body.in-lesson #readyHint:empty{display:none}

/* The lesson keeps speaking and asking in sight; adult settings stay folded. */
#lessonPage{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(340px,.85fr);gap:24px;align-items:start}
.lesson-avatar{position:sticky;top:20px}
.lesson-avatar #scene{height:clamp(330px,44vh,490px);background:radial-gradient(ellipse at 50% 40%,#f8efdc,#e8eddf 78%)}
.lesson-side{display:grid;gap:22px}
.speech-bubble{font-size:18px;line-height:1.55;background:#f7f1e6;border-radius:8px 24px 24px 24px;padding:18px 20px;min-height:3.2em;margin:16px 0}
.mic-card{display:flex;gap:13px;align-items:center;background:#eff0e9;border:1px solid #e1e3d8;border-radius:23px;padding:16px;margin-top:18px}
.mic-card[data-state=listening],.mic-card[data-state=speech]{background:#eaf3e7;border-color:#cedfc8}
.mic-card[data-state=waiting],.mic-card[data-state=processing],.mic-card[data-state=connecting]{background:#f6eedf;border-color:#eaddc7}
.mic-card[data-state=error]{background:#fbece5;border-color:#e8c3b2}
.mic-icon{display:grid;place-items:center;width:42px;height:42px;flex-shrink:0;background:#e0e5d9;border-radius:15px;color:#637563}
.mic-card[data-state=listening] .mic-icon,.mic-card[data-state=speech] .mic-icon{background:#cee3c8;color:#366046}
.mic-icon svg{width:24px;height:24px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round}
.mic-copy{flex:1;min-width:0}
.mic-copy strong{font-size:15px}
.mic-copy p{font-size:12px;color:var(--muted);line-height:1.4;margin:4px 0 0}
.mic-switch{display:flex;flex-direction:column;align-items:center;gap:5px;font-size:10px;color:var(--muted);cursor:pointer}
.mic-level{height:3px;background:#dfe7d7;border-radius:10px;margin-top:9px;overflow:hidden}
.mic-level span{display:block;height:100%;width:0;background:#6a9b67;border-radius:10px;transition:width .1s}
.lesson-tip{display:flex;gap:12px;align-items:center;font-size:13px;margin:14px 0}
.lesson-tip p{font-size:13px;margin:0;flex:1}
.lesson-tip button{flex-shrink:0;font-size:12px;padding:8px 10px}
.lesson-actions{gap:8px;margin-top:14px}
.lesson-actions button{font-size:13px;padding:10px 14px}
.lesson-action-hint{margin:7px 2px 0;color:var(--muted);font-size:12px;line-height:1.45}
.child-camera video{height:150px}
.child-camera h2{font-size:17px}
.in-lesson .face-guide,.in-lesson .scan-overlay{display:none}
#monitorStatus{font-size:13px;color:var(--muted)}
.child-camera .buttons{margin-top:12px}
.child-camera button{font-size:13px;padding:10px 14px}
#retryCameraBtn{width:100%;margin-top:12px}
.child-camera .helper{margin-bottom:0}
#tutorMessages{max-height:330px;overflow:auto;display:grid;gap:12px;margin:14px 0;scrollbar-width:thin}
.chat-message{margin:0;padding:16px 18px;white-space:pre-wrap;overflow-wrap:anywhere;border-radius:20px;background:#f5f0e7;font-size:15px}
.chat-message.user{background:#ecf2e7;border-radius:20px 20px 6px 20px}
.chat-message strong{display:block;margin-bottom:6px;font-size:12px;font-weight:600;color:#657b64}
.tutor form label{margin-top:10px!important}
.tutor .buttons button{font-size:14px}
.tutor .lesson-settings p{font-size:12px}
.in-lesson .app-header{margin-bottom:20px}

/* A guided full-screen capture keeps voice instructions visible and legible. */
.scanning-screen{position:fixed;inset:0;z-index:100;background:#e8ede2;padding:20px 5vw;overflow:auto;border-radius:0;display:flex;flex-direction:column}
.scanning-screen>h2,.scanning-screen>p,.scanning-screen>.eyebrow,.scanning-screen>.next-step,.scanning-screen>.toggle-row,.scanning-screen>.tip{display:none}
.scanning-screen #setupCameraSlot{flex:1;min-height:0}
.scanning-screen .camera-frame{height:100%}
.scanning-screen video{height:calc(100dvh - 135px);max-height:900px}
.scanning-screen .scan-overlay{padding-bottom:26px}
.scanning-screen .scan-overlay #cameraHint{font-size:clamp(24px,4vw,38px)}
.scanning-screen .buttons{justify-content:center}
.scanning-screen #cameraBtn,.scanning-screen #scanBtn{display:none}
.scanning-screen #cancelScanBtn{min-width:250px}
.scanning-screen .face-guide{inset:9% 31% 26%}
.portrait-scan .face-guide{height:33%;width:24%;top:8%}
.portrait-scan .face-guide:after{content:"";position:absolute;width:260%;height:135%;left:-80%;top:112%;border:2px dashed #ffffffe0;border-radius:45% 45% 16% 16%}

#portraitEditor{margin-top:22px;padding-top:16px}
.portrait-editor-image{position:relative;border-radius:22px;overflow:hidden;background:#e3e8dc;max-width:560px;margin:16px auto;touch-action:none}
.portrait-editor-image canvas{display:block;width:100%;height:auto}
.portrait-cutout{display:block;width:100%;height:auto;border-radius:20px;background:repeating-conic-gradient(#e1e5df 0% 25%,#fafbf8 0% 50%) 50% / 20px 20px}
.portrait-handle{position:absolute;transform:translate(-50%,-50%);width:36px;height:36px;padding:0;min-height:0;border:2px solid #fff;border-radius:50%;background:#406b59e8;color:#fff;box-shadow:0 2px 9px #253a3550;touch-action:none;font-size:12px;font-weight:700}
.portrait-handle[aria-pressed=true]{background:#ffdaac;color:#513e29;border-color:#fff;z-index:2}
.portrait-nudges{display:flex;gap:8px;margin-top:12px}
.portrait-nudges button{flex:1;font-size:22px;min-height:44px;background:#edf1e8;color:var(--ink);padding:8px}
#portraitHint{min-height:2.5em}
.scanning-screen #portraitEditor{display:none}
.setup:has(#portraitEditor:not([hidden])) #setupCameraSlot,.setup:has(#portraitEditor:not([hidden]))>progress,.setup:has(#portraitEditor:not([hidden]))>h2,.setup:has(#portraitEditor:not([hidden]))>p,.setup:has(#portraitEditor:not([hidden]))>.eyebrow,.setup:has(#portraitEditor:not([hidden]))>.toggle-row,.setup:has(#portraitEditor:not([hidden]))>.buttons,.setup:has(#portraitEditor:not([hidden]))>.tip{display:none}
.setup:has(#portraitEditor:not([hidden])) #portraitEditor{margin:0;padding:0}

@media(max-width:1000px){body{padding:24px}
.card{padding:22px}
.privacy-chip{font-size:11px}
.setup-steps small{display:none}
.setup-intro h2{font-size:30px}
.mic-card{padding:13px}
.lesson-actions button{padding:10px}
#scene{height:370px}
}

@media(max-width:760px){body{padding:18px 14px 28px}
.auth-page{min-height:calc(100vh - 46px);display:block;max-width:500px}
.auth-welcome{padding:6px 2px 24px}.auth-brand{margin-bottom:42px}.auth-welcome>h1{font-size:38px;letter-spacing:-1.7px}.auth-welcome>p{font-size:16px;margin:17px 0 22px}.auth-plans{grid-template-columns:1fr}.auth-paid-button{width:100%}.auth-privacy{display:none}.auth-card{padding:22px}
.app-header{gap:14px;padding-bottom:18px;margin-bottom:20px;flex-wrap:wrap}
.brand-logo{width:48px;height:48px;border-radius:15px}
.app-header>.privacy-chip{display:none}
.account{margin-left:auto;border:0;padding:0}.account>span{max-width:100px}
.card{padding:20px;border-radius:26px}
.section-title{flex-wrap:wrap;gap:8px}
.section-title h2{font-size:19px}
#setupPage,#lessonPage{grid-template-columns:1fr;gap:18px}
.billing-dialog{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);overflow:auto}.billing-dialog-shell{padding:21px;border-radius:25px}.subscription-heading{display:block;padding-right:42px}.subscription-heading h2{font-size:25px}.billing-dialog-actions{position:absolute;top:18px;right:18px}.billing-dialog-actions .plan-badge{display:none}.plan-comparison{grid-template-columns:1fr}.plan-card{padding:18px}.plan-card.featured{padding:17px}
.setup-steps{gap:2px;padding:6px;border-radius:21px}
.setup-steps button{font-size:12px;gap:6px;padding:10px 5px;min-height:48px;border-radius:16px}
.setup-steps button span{width:25px;height:25px;font-size:11px}
.setup-steps small{display:none}
.setup-intro h2{font-size:28px}
.setup-intro p{font-size:15px}
.setup-intro{padding:3px 4px}
.voice-takes{grid-template-columns:1fr}.voice-takes button{min-height:60px}
.preview{grid-column:1;grid-row:4;position:static}
[data-step-panel]{grid-column:1;grid-row:3}
.setup video{height:300px}
.scan-overlay #cameraHint{font-size:18px}
#scene{height:370px}
.lesson-avatar{position:static}
.lesson-avatar #scene{height:310px}
.lesson-avatar>.section-title{flex-wrap:nowrap}
.lesson-avatar>.section-title h2{font-size:22px}
.lesson-side{gap:18px}
.speech-bubble{font-size:16px;padding:16px}
.lesson-actions{display:grid;grid-template-columns:1fr 1fr}
.lesson-actions .quiet{grid-column:1/-1;min-height:38px}
.mic-copy strong{font-size:14px}
.mic-icon{width:34px;height:38px;border-radius:13px}
.mic-card{gap:10px;padding:13px}
.mic-switch{font-size:9px}
.lesson-tip{align-items:flex-start}
.lesson-tip button{min-height:38px}
.tutor .section-title{display:block}
.hint-chip{display:inline-block;margin-top:8px}
.scanning-screen{padding:12px}
.scanning-screen video{height:calc(100dvh - 130px)}
.portrait-handle{width:34px;height:34px}
.portrait-editor-image{margin:14px -5px}
.ready-features>div{padding:14px}
.summary-grid{grid-template-columns:repeat(2,1fr)}
.buttons button{flex-grow:1}
.clock{font-size:13px;padding:6px 10px}
.child-camera video{height:140px}
}

@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important}
}


.lesson-toolbar{display:flex;align-items:center;gap:8px}
.lesson-toolbar button{font-size:13px;padding:10px 15px;min-height:44px}
.in-lesson .app-header>.privacy-chip,.in-lesson #readyHint{display:none}
.lesson-avatar .mic-card{margin-top:0;margin-bottom:16px}
.lesson-avatar #scene{height:clamp(300px,42vh,410px)}
.lesson-tip{margin-top:0;padding:12px 16px}
.mic-switch input{appearance:none;width:40px;height:24px;border-radius:14px;background:#cbd2c6;position:relative;margin:0}
.mic-switch input:before{content:"";position:absolute;width:18px;height:18px;background:white;border-radius:50%;left:3px;top:3px;transition:transform .18s}
.mic-switch input:checked{background:#638b68}
.mic-switch input:checked:before{transform:translateX(16px)}
.helper:empty{display:none}

@media(max-width:760px){.lesson-toolbar{width:100%;justify-content:space-between;margin-top:0}
.lesson-toolbar button{flex:1}
.in-lesson .app-header{gap:10px}
.lesson-avatar #scene{height:280px}
}


.on-break .child-camera .camera-frame:after{content:"Перерыв · камера выключена";position:absolute;inset:0;display:grid;place-items:center;background:#eef1e7;color:#60725f;font-size:14px}

/* The embedded scanner is the only capture flow; the child camera lives in the lesson. */
.scan-steps{display:flex;gap:12px;margin:22px 0;color:var(--muted,#686e66);flex-wrap:wrap}.scan-steps div{display:flex;align-items:center;gap:8px}.scan-steps span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#e8eee5;color:#43695d;font-weight:700}
.avatar-consent{align-items:flex-start;margin-block:20px}.avatar-consent input{margin-top:5px}
#scannerDialog{width:min(1100px,calc(100vw - 24px));max-width:none;height:calc(100dvh - 32px);max-height:none;border:0;border-radius:24px;padding:18px;background:#faf7f2;color:#263e35;overflow:hidden}
#scannerDialog::backdrop{background:rgba(32,48,40,.55);backdrop-filter:blur(4px)}
#scannerDialog[open]{display:flex;flex-direction:column;gap:12px}.scanner-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}.scanner-heading h2{margin:0;font-size:1.15rem}#scannerMessage{margin:0;font-size:.9rem}
@media(max-width:600px){#scannerDialog{width:100vw;height:100dvh;margin:0;max-height:100dvh;border-radius:0;padding:12px}.scanner-heading button{font-size:.8rem;padding:10px}.scan-steps{font-size:.88rem;gap:8px}}

@media(max-width:760px){.admin-dialog{width:100vw;height:100dvh;max-height:100dvh;border-radius:0}.admin-shell{max-height:100dvh;padding:18px}.admin-heading h2{font-size:25px}.admin-stats{grid-template-columns:repeat(3,1fr);gap:7px}.admin-stats>div{padding:12px 10px}.admin-stats strong{font-size:20px}.admin-search>div{grid-template-columns:1fr 1fr}.admin-search input{grid-column:1/-1}.admin-user{grid-template-columns:1fr;gap:13px;padding:16px}.admin-controls{grid-template-columns:1fr}.admin-controls .admin-wide{grid-column:1}.admin-audit-entry{display:grid;gap:4px}.admin-audit-entry span{text-align:left}}

#scannerCamera{flex:1;min-height:0;overflow:hidden;border-radius:20px;background:#e8eee5}#scannerCamera .camera-frame{height:100%;max-height:none}#scannerCamera video{height:100%;width:100%;object-fit:contain}.capture-status{display:flex;align-items:center;justify-content:space-between;padding:6px 12px}#captureCountdown{font-size:2rem;font-weight:700;color:#3c6657}
