/* Freedu — приложение ученика. Стили — точная копия утверждённых макетов: база apps-v4 (app-android.html) + start-v3/sadd.css
   (в нём add.css apps-v4 и дополнения parent-v3, start-v3). Отличия от макета — только в конце файла, раздел «оболочка». */
:root{--paper:#ffffff;--card:#f7f9fc;--ink:#0c1530;--mut:#4d5873;--line:#dfe5ef;--soft:#eef2f8;--acc:#1631a3;--g:#0b7f57;
  --fh:"Literata",Georgia,serif;--fb:"Golos Text","Segoe UI",Roboto,system-ui,sans-serif}
:root[data-theme="dark"]{--paper:#0b1220;--card:#111a2c;--ink:#e9eef8;--mut:#9aa8c2;--line:#1f2b44;--soft:#162138;--acc:#7aa2ff;--g:#2fc48d}
*{box-sizing:border-box}html,body{margin:0;height:100%;background:var(--paper);color:var(--ink);font:15px/1.45 var(--fb);overflow:hidden}
a{color:inherit;text-decoration:none;cursor:pointer}button{font:inherit;cursor:pointer}
svg{fill:none;stroke:currentColor;stroke-width:1.7;stroke-linejoin:round;stroke-linecap:round}
.app{position:relative;height:100%;display:flex;flex-direction:column}
#bg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;z-index:0}
.scr{position:relative;z-index:1;flex:1;overflow:auto;padding:12px 16px 0;scrollbar-width:none}.scr::-webkit-scrollbar{display:none}
.sys,.win,.rail,.side,.tabs,.home{display:none}
/* общие блоки */
.top{display:flex;align-items:center;gap:10px;margin:4px 0 12px}.top small{display:block;color:var(--mut);font-size:13px}.top b{font:800 22px/1.1 var(--fh)}
.top>div{flex:1}.streak{display:flex;flex-direction:column;align-items:center;font:800 18px/1 var(--fh);color:var(--g);padding:6px 10px;border:1px solid var(--line);border-radius:12px;background:var(--paper)}
.streak small{font:600 10px/1.2 var(--fb);color:var(--mut)}
.av{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:var(--acc);color:#fff;font:800 16px/1 var(--fh);flex:none}
.coach{display:flex;align-items:center;gap:10px;margin-bottom:12px}.coach svg{width:54px;height:auto;flex:none;stroke:none}
.bub{position:relative;background:var(--paper);border:1px solid var(--line);border-radius:14px;padding:9px 12px;font-weight:600;font-size:14px;box-shadow:0 8px 20px rgba(12,21,48,.06)}
.bub:before{content:"";position:absolute;left:-7px;top:50%;margin-top:-6px;width:12px;height:12px;background:var(--paper);border-left:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}
.ey{display:block;font:700 11px/1.2 var(--fb);letter-spacing:.12em;text-transform:uppercase;color:var(--acc)}
.cont{background:color-mix(in srgb,var(--card) 92%,transparent);border:1px solid var(--line);border-radius:18px;padding:16px;margin-bottom:12px}
.cont h1{font:800 22px/1.15 var(--fh);margin:6px 0 2px}.cont p{margin:0 0 12px;color:var(--mut);font-size:14px}
.bar{height:6px;border-radius:6px;background:var(--soft);overflow:hidden}.bar i{display:block;height:100%;background:linear-gradient(90deg,var(--acc),var(--g));border-radius:6px}
.meta{display:flex;justify-content:space-between;font-size:12px;color:var(--mut);margin:6px 0 12px}
.go{width:100%;min-height:48px;border:0;border-radius:12px;background:var(--acc);color:#fff;font-weight:700;font-size:15px;transition:background .25s}.go:hover{background:var(--g)}
.today{display:flex;align-items:center;gap:12px;background:color-mix(in srgb,var(--card) 92%,transparent);border:1px solid var(--line);border-radius:16px;padding:12px;margin-bottom:14px}
.today b{display:block;font-size:14.5px}.today small{color:var(--mut);font-size:12.5px}
.geoask{display:flex;flex-direction:column;gap:6px;background:color-mix(in srgb,var(--card) 92%,transparent);border:1px solid var(--line);border-radius:16px;padding:12px;margin-bottom:14px}
.geoask[hidden]{display:none}.geoask small{color:var(--mut);font-size:12.5px}.geoask .gbtn{margin:4px 0 0}
.ring{position:relative;width:44px;height:44px;flex:none}.ring svg{width:44px;height:44px;transform:rotate(-90deg)}.ring circle{stroke:var(--soft);stroke-width:3.4}.ring circle.v{stroke:var(--g)}
.ring b{position:absolute;inset:0;display:grid;place-items:center;font:800 14px/1 var(--fh)}
h2{font:800 18px/1.2 var(--fh);margin:4px 0 10px}
.subs{display:flex;gap:10px;overflow-x:auto;margin:0 -16px 14px;padding:0 16px 4px;scrollbar-width:none}.subs::-webkit-scrollbar{display:none}
.sub{flex:0 0 66%;display:flex;flex-direction:column;gap:4px;padding:14px;border-radius:16px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 92%,transparent)}
.sub b{font:700 17px/1.2 var(--fh)}.sub small{color:var(--mut);font-size:12.5px}.sub .bar{margin-top:6px}
.tag{align-self:flex-start;font:700 10.5px/1 var(--fb);letter-spacing:.06em;text-transform:uppercase;padding:5px 8px;border-radius:20px;border:1px solid var(--line);color:var(--mut)}.tag.ok{border-color:var(--g);color:var(--g)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}
.card{display:flex;flex-direction:column;gap:3px;padding:13px;border-radius:16px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 92%,transparent)}
.card b{font:700 15.5px/1.2 var(--fh)}.card small{color:var(--mut);font-size:12.5px}.lnk{margin-top:6px;font-weight:700;font-size:13px;color:var(--acc)}.lnk:after{content:" →"}
.rep{padding:13px;border-radius:16px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 92%,transparent)}
.rep ul{list-style:none;margin:8px 0 0;padding:0;font-size:13.5px}.rep li{display:flex;justify-content:space-between;gap:8px;padding:5px 0;border-top:1px solid var(--line)}.rep li span{color:var(--mut);white-space:nowrap;font-size:12px}
.pad{height:120px}
/* --- телефон: нижние вкладки --- */
.tabs a{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;font-weight:600;color:var(--mut);flex:1}
.tabs svg{width:22px;height:22px}
/* Android: строка состояния, нижняя навигация Material, полоса жестов */
:root[data-p="android"] .sys{display:flex;align-items:center;justify-content:space-between;height:30px;padding:0 18px;font:600 13px/1 var(--fb);position:relative;z-index:2}
:root[data-p="android"] .sys .isl{width:10px;height:10px;border-radius:50%;background:#111;position:absolute;left:50%;margin-left:-5px}
:root[data-p="android"] .tabs{display:flex;position:absolute;left:0;right:0;bottom:0;z-index:3;padding:10px 4px 22px;background:color-mix(in srgb,var(--card) 96%,transparent);border-top:1px solid var(--line)}
:root[data-p="android"] .tabs a.on{color:var(--ink)}:root[data-p="android"] .tabs a.on svg{background:color-mix(in srgb,var(--g) 22%,transparent);border-radius:16px;padding:3px 0;width:56px;height:28px}
:root[data-p="android"] .home{display:block;position:absolute;left:50%;bottom:8px;width:110px;height:4px;margin-left:-55px;border-radius:4px;background:var(--ink);opacity:.35;z-index:4}
/* iPhone: Dynamic Island, крупный заголовок, полупрозрачная панель вкладок, полоса «домой» */
:root[data-p="ios"] .sys{display:flex;align-items:center;justify-content:space-between;height:50px;padding:14px 30px 0;font:600 15px/1 -apple-system,var(--fb);position:relative;z-index:2}
:root[data-p="ios"] .sys .isl{width:110px;height:32px;border-radius:20px;background:#000;position:absolute;left:50%;top:10px;margin-left:-55px}
:root[data-p="ios"] .top b{font-size:28px}
:root[data-p="ios"] .tabs{display:flex;position:absolute;left:0;right:0;bottom:0;z-index:3;padding:8px 4px 30px;background:color-mix(in srgb,var(--paper) 78%,transparent);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-top:.5px solid var(--line)}
:root[data-p="ios"] .tabs a.on{color:var(--acc)}
:root[data-p="ios"] .home{display:block;position:absolute;left:50%;bottom:8px;width:134px;height:5px;margin-left:-67px;border-radius:5px;background:var(--ink);z-index:4}
:root[data-p="ios"] .go{border-radius:14px}
.sys .ic{display:flex;gap:5px;align-items:center}.sys i{display:block;background:var(--ink);border-radius:2px}.sys .sig{width:16px;height:10px;clip-path:polygon(0 100%,100% 0,100% 100%)}.sys .wifi{width:14px;height:10px;border-radius:10px 10px 2px 2px;clip-path:polygon(50% 100%,0 20%,100% 20%)}.sys .bat{width:22px;height:11px;border-radius:3px;opacity:.85}
/* Windows: окно, левая панель разделов, правая колонка профиля */
:root[data-p="win"] .app{display:grid;grid-template-columns:220px minmax(0,1fr) 300px;grid-template-rows:36px 1fr}
:root[data-p="win"] .win{display:flex;grid-column:1/-1;align-items:center;gap:0;height:36px;padding-left:14px;background:color-mix(in srgb,var(--card) 90%,transparent);border-bottom:1px solid var(--line);position:relative;z-index:2;font-size:13px}
.wlogo{display:flex;align-items:center;gap:8px;font:800 14px/1 var(--fh);flex:1}.wlogo svg{width:20px;height:20px;stroke:none;color:var(--g)}
.wbtn{width:46px;height:36px;display:grid;place-items:center;color:var(--mut);font-size:12px}.wbtn.x:hover{background:#c42b1c;color:#fff}
:root[data-p="win"] .rail{display:flex;flex-direction:column;gap:3px;padding:16px 12px;border-right:1px solid var(--line);position:relative;z-index:1;background:color-mix(in srgb,var(--paper) 80%,transparent)}
.rail a{display:flex;align-items:center;gap:12px;min-height:42px;padding:0 12px;border-radius:10px;color:var(--mut);font-weight:600}.rail a:hover{background:var(--soft);color:var(--ink)}
.rail a.on{background:var(--soft);color:var(--acc);box-shadow:inset 3px 0 0 var(--acc)}.rail svg{width:22px;height:22px}.rail .sep{height:1px;background:var(--line);margin:8px 6px}
:root[data-p="win"] .scr{padding:24px 28px 0}
:root[data-p="win"] .top b{font-size:28px}
:root[data-p="win"] .cont{padding:22px}:root[data-p="win"] .cont h1{font-size:30px}:root[data-p="win"] .go{width:auto;padding:0 28px}
:root[data-p="win"] .subs{display:grid;grid-template-columns:repeat(3,1fr);margin:0 0 14px;padding:0;overflow:visible}:root[data-p="win"] .sub{flex:none}
:root[data-p="win"] .side{display:block;padding:20px 18px;border-left:1px solid var(--line);position:relative;z-index:1;background:color-mix(in srgb,var(--paper) 80%,transparent);overflow:auto}
:root[data-p="win"] .top .streak,:root[data-p="win"] .top .av{display:none}
.who{display:flex;align-items:center;gap:12px;margin-bottom:14px}.who b{display:block;font:700 17px/1.2 var(--fh)}.who small{color:var(--mut);font-size:13px}
.stats{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:12px}.stats div{padding:11px;border:1px solid var(--line);border-radius:12px;background:var(--card)}
.stats b{display:block;font:800 22px/1 var(--fh)}.stats small{color:var(--mut);font-size:12px}
.blk{padding:12px 0;border-top:1px solid var(--line)}.hd2{display:flex;justify-content:space-between;font-size:13px;font-weight:700;margin-bottom:8px}.hd2 span+span{color:var(--mut);font-weight:500}
.heat{display:grid;grid-template-columns:repeat(12,1fr);grid-auto-flow:column;grid-template-rows:repeat(7,1fr);gap:3px}.heat i{aspect-ratio:1;border-radius:3px;background:var(--soft)}
.heat i.l1{background:color-mix(in srgb,var(--g) 30%,var(--soft))}.heat i.l2{background:color-mix(in srgb,var(--g) 60%,var(--soft))}.heat i.l3{background:var(--g)}
.mut{margin:4px 0;color:var(--mut);font-size:13px}
:root[data-p="win"] .pad{height:60px}
/* --- v2: экраны --- */
.view{display:none}.view.on{display:block;animation:vin .22s ease-out}
@keyframes vin{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}
.hd{margin:6px 0 14px}.hd h1{font:800 26px/1.15 var(--fh);margin:0}.hd small{color:var(--mut);font-size:13.5px}
:root[data-p="win"] .hd h1{font-size:32px}
.c{text-align:center}
.lv{display:flex;gap:6px;margin-bottom:14px}.lv span{flex:1;text-align:center;padding:7px 0;border-radius:10px;border:1px solid var(--line);font-weight:700;font-size:13px;color:var(--mut);background:var(--paper)}
.lv span.on{border-color:var(--g);color:var(--g)}
.mod{display:flex;align-items:center;gap:12px;padding:12px;border-radius:14px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 92%,transparent);margin-bottom:8px}
.mod i{width:34px;height:34px;flex:none;border-radius:50%;display:grid;place-items:center;font:800 14px/1 var(--fh);font-style:normal;background:var(--soft);color:var(--mut)}
.mod.done i{background:var(--g);color:#fff}.mod.cur{border-color:var(--acc)}.mod.cur i{background:var(--acc);color:#fff}
.mod b{display:block;font:700 15px/1.2 var(--fh)}.mod small{color:var(--mut);font-size:12.5px}
.les{list-style:none;margin:-2px 0 10px;padding:0 0 0 22px;border-left:2px solid var(--line);margin-left:28px}
.les li{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;font-size:14px;color:var(--mut)}
.les li i{font-style:normal;width:20px;text-align:center;font-size:12px}.les li.d{color:var(--ink)}.les li.d i{color:var(--g);font-weight:800}
.les li.c{background:color-mix(in srgb,var(--acc) 10%,var(--paper));color:var(--ink);font-weight:700;cursor:pointer;border:1px solid var(--acc)}.les li.c i{color:var(--acc)}
.les li span{margin-left:auto;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--acc)}
/* урок */
.lh{display:flex;align-items:center;gap:12px;margin:6px 0 18px}.lh .bar{flex:1}.lh span{font-size:13px;color:var(--mut);min-width:36px;text-align:right}
.x{width:36px;height:36px;display:grid;place-items:center;border-radius:50%;border:1px solid var(--line);background:var(--paper);font-size:15px;color:var(--mut)}
.rt{flex:1;font:700 15px/1.2 var(--fh)}
.qk{font-size:12px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--mut)}
.qq{font:700 22px/1.3 var(--fh);margin:6px 0 16px;padding:18px;border-radius:16px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 94%,transparent)}
.qq u{text-decoration:none;display:inline-block;min-width:70px;border-bottom:2px solid var(--acc)}
.opts{display:grid;gap:8px}.opt{min-height:50px;text-align:left;padding:0 16px;border-radius:12px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font-weight:600;font-size:16px}
.opt:hover{border-color:var(--acc)}.opt{position:relative}.opt.ok{border-color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}.opt.ok:after{content:"✓";position:absolute;right:16px;top:50%;transform:translateY(-50%);font:800 18px var(--fh);color:var(--acc)}.opt.no{color:var(--mut);text-decoration:line-through;text-decoration-color:var(--acc)}.opt:disabled{cursor:default}
.inp{display:flex;gap:8px}.inp input{flex:1;min-height:50px;border-radius:12px;border:1px solid var(--line);background:var(--paper);color:var(--ink);padding:0 14px;font:600 16px var(--fb)}
.inp input.ok{border-color:var(--ink)}.inp input.no{color:var(--mut);text-decoration:line-through;text-decoration-color:var(--acc)}.inp .go{width:auto;padding:0 18px}
.fb{margin-top:14px;padding:14px 14px 14px 16px;border-radius:4px 14px 14px 4px;font-size:14.5px;border-left:3px solid var(--acc);background:var(--paper);box-shadow:0 6px 18px rgba(12,21,48,.06)}.fb .dg{display:flex;gap:10px;align-items:flex-start;margin-top:10px;font-weight:600;font-size:14px}.fb .dg svg{width:40px;height:auto;flex:none;stroke:none}
.fb>b:first-child{display:block;margin-bottom:2px}.fb .go{margin-top:12px}
.fin{text-align:center;padding-top:20px}.fin svg{width:120px;height:auto;stroke:none}.fin h1{font:800 26px/1.2 var(--fh);margin:10px 0 6px}.fin p{color:var(--mut);margin:0 0 16px}
.fin .go{margin-top:8px}.go.alt{background:none;border:1px solid var(--line);color:var(--ink)}.go.alt:hover{background:var(--soft)}
/* вкладки-переключатели */
.ctab{display:flex;gap:6px;margin-bottom:12px}.ctab span{padding:7px 12px;border-radius:20px;border:1px solid var(--line);font-size:13px;font-weight:600;color:var(--mut);cursor:pointer;background:var(--paper)}.ctab span.on{background:var(--ink);color:var(--paper);border-color:var(--ink)}
/* книги */
.book{display:flex;gap:14px;align-items:center;padding:12px;border-radius:14px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 92%,transparent);margin-bottom:10px}
.book b{display:block;font:700 16px/1.2 var(--fh)}.book small{color:var(--mut);font-size:12.5px}.book>div{flex:1}.book .bar{margin-top:8px}
.cov{width:52px;height:70px;flex:none;border-radius:6px;display:grid;place-items:end start;padding:6px;color:#fff;font:800 12px/1 var(--fb)}
.cov.c1{background:linear-gradient(160deg,#1631a3,#0b7f57)}.cov.c2{background:linear-gradient(160deg,#a3541b,#d9a441)}.cov.c3{background:linear-gradient(160deg,#25304d,#5a6b94)}
.story{font:500 19px/1.75 var(--fh);padding:18px;border-radius:16px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 94%,transparent)}
.story b{font-weight:500;cursor:pointer;border-bottom:1px dotted var(--acc)}.story b.on{background:color-mix(in srgb,var(--acc) 16%,transparent);border-radius:4px}
.tip{margin-top:12px;padding:12px 14px;border-radius:12px;background:var(--ink);color:var(--paper);font-size:14.5px}.tip b{font-family:var(--fh)}
/* настройки */
.rows{border:1px solid var(--line);border-radius:14px;background:color-mix(in srgb,var(--card) 94%,transparent)}
.row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 14px;border-top:1px solid var(--line);font-weight:600;font-size:14.5px}.row:first-child{border-top:0}.row small{color:var(--mut);font-weight:500;font-size:13px;text-align:right}
.seg{display:flex;border:1px solid var(--line);border-radius:10px;overflow:hidden}.seg span{padding:6px 10px;font-size:13px;cursor:pointer;color:var(--mut)}.seg span.on{background:var(--acc);color:#fff}
.toast{position:absolute;left:50%;bottom:110px;transform:translateX(-50%);z-index:9;max-width:86%;padding:10px 16px;border-radius:12px;background:var(--ink);color:var(--paper);font-size:14px;font-weight:600;text-align:center;box-shadow:0 10px 30px rgba(0,0,0,.2)}
:root[data-p="win"] .toast{bottom:40px}
.streak{cursor:pointer}

/* v3 */
.pad.big{height:52vh}:root[data-p="win"] .pad.big{height:46vh}
.av{cursor:pointer}
.subj{display:flex;align-items:center;gap:12px;padding:13px;border-radius:14px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 92%,transparent);margin-bottom:10px}
.subj>div{flex:1;min-width:0}.subj b{display:block;font:700 16px/1.2 var(--fh)}.subj small{color:var(--mut);font-size:12.5px}.subj .bar{margin-top:8px}
.ic1{width:44px;height:44px;flex:none;border-radius:12px;display:grid;place-items:center;font:800 16px/1 var(--fh);background:var(--soft);color:var(--acc)}
.lh .ib{width:36px;height:36px}.lh .ib svg{width:18px;height:18px}
.gbtn{display:flex;gap:8px;margin-bottom:14px}.gbtn .go{flex:1;width:auto;padding:0 12px}
.find{margin-top:14px;padding:14px;border-radius:14px;border:1px solid var(--line);background:var(--paper);text-align:center;font-size:14.5px}
.find .sp{display:inline-block;width:18px;height:18px;border:2px solid var(--line);border-top-color:var(--acc);border-radius:50%;animation:spn .8s linear infinite;vertical-align:-4px;margin-right:8px}
@keyframes spn{to{transform:rotate(360deg)}}
.shots{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}:root[data-p="win"] .shots{grid-template-columns:repeat(3,1fr)}
.shot small{display:block;margin-top:5px;color:var(--mut);font-size:12px}
.sh-img{aspect-ratio:.8;border-radius:10px;border:1px solid var(--line);background:var(--card);padding:10px;display:flex;flex-direction:column;gap:6px;overflow:hidden;font-size:12px;box-shadow:0 6px 14px rgba(12,21,48,.06)}
.sh-img i{font:800 15px/1.1 var(--fh);font-style:normal}.sh-img u{text-decoration:none;border-bottom:2px solid var(--acc)}
.sh-img.new{animation:pop .5s ease-out}@keyframes pop{from{transform:scale(.6);opacity:0}to{transform:none;opacity:1}}
.sheet{position:absolute;inset:0;z-index:8;background:rgba(5,10,25,.45);display:flex;align-items:flex-end}.sheet[hidden]{display:none}
.sh-box{width:100%;padding:18px 16px 40px;border-radius:20px 20px 0 0;background:var(--paper)}.sh-box b{font:800 18px/1.2 var(--fh)}
.sh-box textarea{width:100%;margin:6px 0 12px;border:1px solid var(--line);border-radius:12px;padding:10px;font:15px var(--fb);background:var(--card);color:var(--ink);resize:none}
:root[data-p="win"] .sheet{align-items:center;justify-content:center}:root[data-p="win"] .sh-box{width:440px;border-radius:16px;padding:20px}
.flash{position:absolute;inset:0;z-index:9;background:#fff;pointer-events:none;animation:fl .45s ease-out forwards}.flash[hidden]{display:none}@keyframes fl{from{opacity:.85}to{opacity:0}}
.row.sub2{padding-top:0;border-top:0}.row.sub2 small{text-align:left}
.mods .les li.c{cursor:pointer}
:root[data-p="win"] .top .av{display:grid}
.news{padding:13px;border-radius:16px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 92%,transparent);margin-bottom:16px}
.nw{display:block;padding:9px 0;border-top:1px solid var(--line)}.nw:first-of-type{border-top:0;padding-top:6px}.nw b{display:block;font:700 15px/1.25 var(--fh)}.nw small{color:var(--mut);font-size:12.5px}
.cs{color:var(--ink)}.lk{color:var(--acc);font-weight:600}
#marks .shots{margin-top:4px}

/* вызов по расписанию и самоконтроль */
.call{position:absolute;inset:0;z-index:7;background:color-mix(in srgb,var(--paper) 94%,transparent);display:flex;align-items:center;justify-content:center;padding:24px;backdrop-filter:blur(4px)}
.call[hidden]{display:none}.cl-in{text-align:center;max-width:320px}.cl-in svg{width:130px;height:auto;stroke:none}
.cl-in h1{font:800 30px/1.1 var(--fh);margin:8px 0}.cl-in p{color:var(--mut);margin:0 0 18px}.cl-x{display:block;margin-top:16px;color:var(--mut);font-size:13px;text-decoration:underline}
.lockbar{position:absolute;left:12px;right:12px;top:36px;z-index:6;display:flex;justify-content:space-between;align-items:center;padding:8px 14px;border-radius:12px;background:var(--ink);color:var(--paper);font-size:13.5px}
.lockbar[hidden]{display:none}.lockbar b{font-variant-numeric:tabular-nums}.lockbar small{opacity:.75}
:root[data-p="ios"] .lockbar{top:54px}
.app.locked #v-lesson .lh{margin-top:44px}
a.row{color:inherit}.tin{font:700 16px var(--fb);padding:5px 8px;border-radius:10px;border:1px solid var(--line);background:var(--card);color:var(--ink)}
.sw{width:42px;height:24px;border-radius:12px;background:var(--line);position:relative;flex:none;cursor:pointer;transition:background .2s}.sw:after{content:"";position:absolute;left:3px;top:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:left .2s;box-shadow:0 1px 3px rgba(0,0,0,.2)}
.sw.on{background:var(--acc)}.sw.on:after{left:21px}

#clbtn:not([hidden]){display:grid;gap:8px}.cant{text-align:left;margin-top:6px}.cant b{display:block;font:700 15px/1.2 var(--fh);margin:12px 0 8px}
.chips{display:flex;flex-wrap:wrap;gap:6px}.chips span{padding:8px 12px;border-radius:18px;border:1px solid var(--line);font-size:13.5px;font-weight:600;cursor:pointer;color:var(--mut);background:var(--paper)}.chips span.on{border-color:var(--acc);color:var(--acc)}
.cant .seg{margin-bottom:14px}.waitb{margin-top:12px;padding:12px;border-radius:14px;border:1px solid var(--line);background:var(--paper);font-size:14.5px;text-align:left}.waitb .go{margin-top:10px}
.lockbar a{color:inherit;text-decoration:underline;cursor:pointer}

.mode{display:flex;flex-direction:column;gap:3px;padding:13px 14px;border-radius:16px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 92%,transparent);margin:0 0 12px}
.mode b{font:700 16px/1.25 var(--fh)}.mode small{color:var(--mut);font-size:12.5px}.mode .lnk{align-self:flex-start;cursor:pointer}
:root[data-mode="adult"] .kid-only,:root:not([data-mode="adult"]) .adult-only{display:none!important}

.row{flex-wrap:wrap;row-gap:8px}.row>span:first-child{flex:1 1 0;min-width:120px}.row .seg{flex:none;max-width:100%}

/* первый запуск */
.onb{position:absolute;inset:0;z-index:20;background:var(--paper);overflow:auto;padding:44px 18px 30px}.onb[hidden]{display:none}
:root[data-p="ios"] .onb{padding-top:60px}:root[data-p="win"] .onb{padding:60px calc(50% - 220px) 30px}
.st{display:none}.st.on{display:block;animation:vin .22s ease-out}
.o-mid{min-height:calc(100% - 20px);display:flex;flex-direction:column;justify-content:center;gap:12px;padding-top:30px}
.logo{width:110px;height:auto;align-self:center;stroke:none}.brand{font:800 34px/1 var(--fh);text-align:center;margin-bottom:18px}
.langs{display:grid;gap:10px}.langs button{min-height:54px;border-radius:14px;border:1px solid var(--line);background:var(--card);color:var(--ink);font:700 18px var(--fb)}.langs button:hover{border-color:var(--acc)}
.o-mid .dog{width:96px;height:auto;stroke:none}.bub.big{font-size:15px}.o-mid h1{font:800 28px/1.15 var(--fh);margin:8px 0 0}.o-mid p{margin:0 0 6px}
.o-mid .go{width:100%}
.pick{display:block;padding:16px;border-radius:16px;border:1px solid var(--line);background:var(--card);margin-bottom:10px;cursor:pointer}.pick:hover{border-color:var(--acc)}
.pick b{display:block;font:700 18px/1.2 var(--fh);margin-bottom:4px}.pick small{color:var(--mut);font-size:13px}.pick.dis{opacity:.6}
.stp{font-size:13px;color:var(--mut)}
.fl{display:block;margin-bottom:14px;font-weight:700;font-size:14px}.fl input{display:block;width:100%;margin-top:6px;min-height:48px;border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink);padding:0 14px;font:600 16px var(--fb)}
.fl small{display:block;margin-top:5px;color:var(--mut);font-weight:500;font-size:12.5px}.fl .seg{margin-top:6px;display:inline-flex}
.fl[hidden]{display:none}.fl small.nkw{color:var(--ink);font-weight:700}.nkn{margin:-8px 0 12px;font-size:13.5px}
.cons{display:flex;gap:10px;align-items:flex-start;margin:0 0 12px;font-size:13.5px;line-height:1.4}.cons input{width:20px;height:20px;flex:0 0 20px;margin:1px 0 0;accent-color:var(--acc)}
.onb.me .kidf{display:none}
.code{display:flex;gap:10px;justify-content:center;margin:20px 0}.code input{width:56px;height:64px;text-align:center;font:800 28px var(--fh);border-radius:12px;border:1px solid var(--line);background:var(--card);color:var(--ink)}
.pair{display:flex;flex-direction:column;align-items:center;gap:8px;margin:14px 0 18px}.qr{width:150px;height:150px;display:grid;grid-template-columns:repeat(21,1fr);padding:8px;background:#fff;border-radius:10px;border:1px solid var(--line)}.qr i{background:#0c1530}.qr i.o{background:none}
.pcode{font:800 34px/1 var(--fh);letter-spacing:.08em}
.blk2{display:block;margin:14px 0}.small2{font-size:12.5px}
/* оплата */
.plan{display:flex;flex-direction:column;gap:3px;padding:14px;border-radius:16px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 92%,transparent);margin-bottom:10px}
.plan b{font:800 20px/1.2 var(--fh)}.plan small{color:var(--mut);font-size:13px}.plan .go{margin-top:8px}.plan.best{border-color:var(--acc);box-shadow:inset 0 0 0 1px var(--acc)}
.subsc{border-color:color-mix(in srgb,var(--acc) 45%,var(--line))}.subsc small{color:var(--acc);font-weight:600}
.les li.pw{cursor:pointer}.les li.pw span{color:var(--mut)}
.sys{z-index:21!important}

:root[data-p="ios"] .no-ios,:root:not([data-p="ios"]) .ios-only{display:none!important}
/* --- оболочка: отличия от макета --- */
.defs{position:absolute;width:0;height:0;overflow:hidden}
/* строку состояния и полосу «домой» рисует система; в макете они нарисованы для показа — здесь только отступ под вырез экрана */
:root[data-p="android"] .sys,:root[data-p="ios"] .sys{height:env(safe-area-inset-top,0px);padding:0}
/* Windows: своя строка заголовка окна (кнопки окна подключит Electron, шаг 10) */
:root[data-p="win"] .win{-webkit-app-region:drag;user-select:none}
.wbtn{-webkit-app-region:no-drag}
#selfon{margin-top:14px}
.seg span:focus-visible,.sw:focus-visible,[data-go]:focus-visible,[data-soon]:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
/* в макете пустые ряды доски сжимались (строки по содержимому) — клетки квадратные */

/* === экран урока: утверждённый макет web/design/lesson/v2 (l.css). Отличия: тема — data-theme (в макете data-v),
   подписи «Правило / Подсказка / Частая ошибка» — из словаря (переменные --l-rule… ставит app.js), .card макета не трогаем (занят главной) === */
:root[data-p="win"][data-view="lesson"] .app{grid-template-columns:240px minmax(0,1fr) 280px}
#outline,#lside{display:none!important}
:root[data-p="win"][data-view="lesson"] .rail:not(#outline),:root[data-p="win"][data-view="lesson"] .side:not(#lside){display:none!important}
:root[data-p="win"][data-view="lesson"] #outline{display:flex!important}:root[data-p="win"][data-view="lesson"] #lside{display:block!important}
/* оглавление и колонка урока стоят в разметке после main — на сетке окна ставим явно: слева, по центру, справа */
:root[data-p="win"][data-view="lesson"] #outline{grid-column:1;grid-row:2}:root[data-p="win"][data-view="lesson"] .scr{grid-column:2;grid-row:2}:root[data-p="win"][data-view="lesson"] #lside{grid-column:3;grid-row:2}
:root[data-view="lesson"] .tabs{display:none!important}
.lt{position:sticky;top:0;z-index:3;margin:0 -16px 14px;padding:8px 16px;background:color-mix(in srgb,var(--paper) 88%,transparent);backdrop-filter:blur(6px)}
:root[data-p="win"] .lt{margin:0 -28px 18px;padding:10px 28px}
.segs{flex:1;display:flex;gap:3px}.segs i{flex:1;height:5px;border-radius:3px;background:var(--soft)}.segs i.d{background:var(--g)}.segs i.c{background:var(--acc)}
.les-h .ey{margin-bottom:4px}.les-h h1{font:800 26px/1.15 var(--fh);margin:0 0 6px}:root[data-p="win"] .les-h h1{font-size:34px}
.les-h .sub{color:var(--mut);font-size:14px;margin:0 0 14px}
.hook{font-size:16px;line-height:1.6;padding:16px;border-radius:16px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 94%,transparent);margin-bottom:14px}
.goals{list-style:none;margin:0 0 14px;padding:0}.goals li{position:relative;padding:6px 0 6px 26px;font-size:14.5px;border-top:1px solid var(--line)}.goals li:first-child{border-top:0}
.goals li:before{content:"";position:absolute;left:4px;top:13px;width:9px;height:9px;border-radius:50%;border:2px solid var(--acc)}
.fact{font-size:14px;color:var(--mut);padding:12px 14px;border-left:3px solid var(--g);background:color-mix(in srgb,var(--g) 6%,var(--paper));border-radius:4px 12px 12px 4px;margin-bottom:16px}
.fact b{color:var(--ink)}
.theory{font-size:15.5px;line-height:1.6;padding:18px;border-radius:16px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 95%,transparent);margin-bottom:16px;overflow-x:auto}
.theory h2{font:800 22px/1.2 var(--fh);margin:4px 0 12px}.theory p{margin:0 0 10px}
.formula{font:700 17px/1.4 var(--fh);padding:12px 14px;border-radius:12px;background:var(--soft);margin:0 0 12px;text-align:center}
.tbl{width:100%;border-collapse:collapse;margin:0 0 12px;font-size:14px}.tbl th{text-align:left;font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--mut);padding:6px 8px;border-bottom:2px solid var(--line)}
.tbl td{padding:8px;border-bottom:1px solid var(--line);vertical-align:top}
.rule,.theory .tip,.warn:where(:not(.gm *)){padding:11px 14px;border-radius:4px 12px 12px 4px;margin:0 0 12px;font-size:14.5px}
.rule{border-left:3px solid var(--acc);background:color-mix(in srgb,var(--acc) 7%,var(--paper))}
.theory .tip{border-left:3px solid var(--g);background:color-mix(in srgb,var(--g) 7%,var(--paper))}
.warn:where(:not(.gm *)){border-left:3px solid #b7791f;background:color-mix(in srgb,#b7791f 8%,var(--paper))}
.ex{padding:5px 0;font-size:15px}.ex .tr{color:var(--mut);font-size:13px}.ex .ru{color:var(--mut)}
.say{border-bottom:1px dotted var(--acc);cursor:pointer;font-weight:600}.say:hover{color:var(--acc)}.say.pl{background:color-mix(in srgb,var(--acc) 14%,transparent);border-radius:4px}
#v-lesson s{color:var(--mut)}
.chk-h{display:flex;justify-content:space-between;align-items:baseline;margin:4px 0 10px}.chk-h b{font:800 18px/1.2 var(--fh)}.chk-h span{font-size:13px;color:var(--mut)}
.q{margin-bottom:14px}
.ord-line{min-height:50px;display:flex;flex-wrap:wrap;gap:6px;padding:8px;border-radius:12px;border:1px dashed var(--line);margin-bottom:8px;background:var(--paper)}
.ord-bank{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}.tile{padding:9px 12px;border-radius:10px;border:1px solid var(--line);background:var(--card);font-weight:600;cursor:pointer;color:var(--ink);font-size:15px}
.tile.used{visibility:hidden}.ord-line .tile{background:var(--paper);border-color:var(--ink)}
.tf{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.next{margin-top:6px}
.vgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:16px}:root[data-p="win"] .vgrid{grid-template-columns:repeat(3,1fr)}
.vc{padding:10px 12px;border-radius:12px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 94%,transparent);cursor:pointer}
.vc b{display:block;font:700 15.5px/1.2 var(--fh);color:var(--ink)}.vc .tr{display:block;color:var(--mut);font-size:12px}.vc small{display:block;color:var(--mut);font-size:13px;margin-top:2px}
.res{text-align:center;padding-top:10px}.res .big{font:800 54px/1 var(--fh);margin:6px 0}.res svg{width:110px;height:auto;stroke:none}
.res .bub{display:inline-block;margin:6px 0 16px;text-align:left}.res .bub:before{display:none}
.errs{text-align:left;margin:0 0 14px}
#outline{gap:2px}#outline a{min-height:36px;font-size:13.5px}#outline a i{font-style:normal;width:20px;text-align:center;color:var(--mut)}#outline a.d i{color:var(--g)}
#outline .ot{font:800 15px/1.2 var(--fh);color:var(--ink);padding:4px 12px 10px}
:root[data-p="win"] #lside .goals li{font-size:13.5px}
.ls{list-style:none;margin:0;padding:0;font-size:13.5px}.ls li{padding:7px 0;border-top:1px solid var(--line)}.ls li:first-child{border-top:0}
.blkc{padding:14px;border-radius:16px;border:1px solid var(--line);background:color-mix(in srgb,var(--card) 92%,transparent);margin-bottom:12px}
.theory .tip{color:var(--ink);margin-top:0}
/* v2: читаемость урока — плотные карточки, чёткие рамки, подписи у правил */
:root{--lc:#ffffff;--lb:#c9d2e3;--lt:#0c1530;--r-bg:#eef2ff;--r-bd:#8ea2ea;--r-tx:#1631a3;--t-bg:#e9f7f0;--t-bd:#7fcaa8;--t-tx:#0b6b49;--w-bg:#fff4e2;--w-bd:#e2ad55;--w-tx:#8a5a0b;--th:#eef2f8;
  --l-rule:"";--l-tip:"";--l-warn:""}
:root[data-theme="dark"]{--lc:#111a2c;--lb:#33415f;--lt:#eef2fa;--r-bg:#16224a;--r-bd:#4a64c8;--r-tx:#a9bcff;--t-bg:#0f2a22;--t-bd:#2f8f68;--t-tx:#7fe0b6;--w-bg:#2c2110;--w-bd:#a8741f;--w-tx:#f2c46d;--th:#18233b}
:root[data-view="lesson"] #bg{opacity:.28}
#v-lesson .theory,#v-lesson .hook,#v-lesson .qq,#v-lesson .fb,#v-lesson .vc,#v-lesson .les-h .sub{background:var(--lc)!important;border:1.5px solid var(--lb)!important;color:var(--lt);box-shadow:0 2px 0 rgba(12,21,48,.04)}
.theory{font-size:16.5px;line-height:1.65;padding:20px}
.theory h2{font-size:24px}
.theory .ey{color:var(--r-tx)}
.formula{background:var(--th);border:1.5px solid var(--lb);font-size:18px;color:var(--lt)}
.tbl{border:1.5px solid var(--lb);border-radius:10px;overflow:hidden;border-collapse:separate;border-spacing:0}
.tbl th{background:var(--th);color:var(--lt);font-size:12.5px;border-bottom:1.5px solid var(--lb)}
.tbl td{border-bottom:1px solid var(--lb);color:var(--lt)}.tbl tr:last-child td{border-bottom:0}.tbl tbody tr:nth-child(even) td{background:color-mix(in srgb,var(--th) 50%,transparent)}
.rule,.theory .tip,.warn:where(:not(.gm *)){position:relative;border:1.5px solid;border-left-width:5px;border-radius:10px;padding:26px 14px 12px;color:var(--lt);font-size:15.5px}
.rule{background:var(--r-bg);border-color:var(--r-bd)}.theory .tip{background:var(--t-bg);border-color:var(--t-bd)}.warn:where(:not(.gm *)){background:var(--w-bg);border-color:var(--w-bd)}
.rule:before,.theory .tip:before,.warn:where(:not(.gm *)):before{position:absolute;left:14px;top:7px;font:800 11px/1 var(--fb);letter-spacing:.12em;text-transform:uppercase}
.rule:before{content:var(--l-rule);color:var(--r-tx)}.theory .tip:before{content:var(--l-tip);color:var(--t-tx)}.warn:where(:not(.gm *)):before{content:var(--l-warn);color:var(--w-tx)}
#v-lesson .say{color:var(--r-tx);border-bottom:1.5px solid color-mix(in srgb,var(--r-tx) 45%,transparent);font-weight:700}
.ex{padding:7px 0;border-bottom:1px dashed var(--lb)}.ex:last-child{border-bottom:0}.ex .ru,.ex .tr{color:color-mix(in srgb,var(--lt) 70%,transparent)}
#v-lesson s{color:color-mix(in srgb,var(--lt) 60%,transparent)}
.hook{font-size:16.5px}.goals li{border-top-color:var(--lb);color:var(--lt)}.fact{border:1.5px solid var(--t-bd);border-left-width:5px;background:var(--t-bg);color:var(--lt)}
#v-lesson .qk{color:var(--r-tx)}#v-lesson .qq{font-size:22px}
#v-lesson .opt{border:1.5px solid var(--lb);background:var(--lc);color:var(--lt);font-size:16.5px;min-height:52px}#v-lesson .opt:hover{border-color:var(--r-bd)}
#v-lesson .opt.ok{border-color:var(--lt);box-shadow:inset 0 0 0 1.5px var(--lt)}#v-lesson .opt.no{color:color-mix(in srgb,var(--lt) 55%,transparent)}
#v-lesson .inp input{border:1.5px solid var(--lb);background:var(--lc);color:var(--lt);font-size:16.5px}
.tile{border:1.5px solid var(--lb);background:var(--lc);color:var(--lt)}.ord-line{border:1.5px dashed var(--lb);background:var(--lc)}
#v-lesson .fb{border-left:5px solid var(--r-bd)!important;font-size:15.5px}
.chk-h b{font-size:20px}
.lt{background:var(--paper);border-bottom:1px solid var(--lb)}
.vc b{color:var(--r-tx)}
/* дополнения к макету урока: перевод под спойлером (details.trn движка), прослушать вопрос, расставить по порядку, ответ с опечаткой */
.theory details.trn{margin:-4px 0 10px;font-size:14.5px;color:color-mix(in srgb,var(--lt) 75%,transparent)}.theory details.trn summary{cursor:pointer;color:var(--r-tx);font-weight:600}
.qa{display:flex;gap:8px;margin:-6px 0 12px}.qa .go{width:auto;padding:0 16px;min-height:40px}
.seql{list-style:none;margin:0 0 10px;padding:0;display:grid;gap:6px}.seql li{display:flex;align-items:center;gap:8px;padding:8px 10px;border-radius:10px;border:1.5px solid var(--lb);background:var(--lc);color:var(--lt)}
.seql li span{flex:1}.seql button{width:34px;height:34px;border-radius:8px;border:1px solid var(--lb);background:var(--paper);color:var(--lt)}
.fb .tp{display:block;color:var(--mut);font-size:14px;margin:2px 0 4px}
.kbd{margin:10px 0 0;padding:8px 12px;border-radius:8px;border:1.5px solid var(--w-bd);border-left-width:4px;background:var(--w-bg);color:var(--w-tx);font-size:14.5px;font-weight:600}
/* закладки-снимки в профиле */
.sh-img span{display:-webkit-box;-webkit-line-clamp:7;-webkit-box-orient:vertical;overflow:hidden}
#marks2 .mut{margin:6px 0}
/* первый запуск: ошибки полей — текстом, без красных панелей */
.ferr{min-height:1.2em;margin:0 0 10px;color:var(--acc);font-weight:600;font-size:13.5px}.ferr:empty{min-height:0}
#sms-reset{display:none}.onb.reset #sms-reset{display:block}.onb.reset #code{margin-bottom:10px}
.pick:focus-visible,.x:focus-visible,.lk:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
/* липкая шапка урока прилегает к верху: иначе в отступе .scr над ней просвечивает прокрученный текст */
:root[data-view="lesson"] .scr{padding-top:0}#v-lesson .lt{margin-top:0}
/* код из SMS — 6 цифр (на сервере 6; в макете было 4 клетки): клетки уже, чтобы влезали в 360 px */
.code{gap:8px}.code input{width:46px;height:58px;font-size:26px;padding:0}
#l-ask[hidden]{display:none}#l-ask .gbtn{margin:10px 0 0}
/* контрольная (каждые 3 урока): строка в карте курса; пометки без подсказки у сборки фраз; итог с разбором — плотной карточкой, как урок v2 */
.les li.cp{font-size:13.5px}.les li.cp.o,.les li.cp.d,.les li.sk{cursor:pointer}.les li.cp.d span,.les li.cp.o span,.les li.sk span{color:var(--mut)}
#v-lesson .ord-line.no .tile,#v-lesson .seql.no span{color:color-mix(in srgb,var(--lt) 55%,transparent);text-decoration:line-through;text-decoration-color:var(--acc)}
#v-lesson .ord-line.ok:after,#v-lesson .seql.ok:after{content:"✓";align-self:center;margin-left:auto;font:800 18px var(--fh);color:var(--acc)}
.cps{margin:0 0 4px;font-size:14px;color:var(--mut)}.cps b{color:var(--ink)}
#v-lesson .cpr .errs{background:var(--lc);border:1.5px solid var(--lb);color:var(--lt)}
.cpx li{padding:10px 0}.cpx p{margin:2px 0}.cpx .cq{font-weight:700}.cpx s{color:var(--mut);text-decoration-color:var(--acc)}.cpx .ce{margin-top:4px;font-size:13.5px;color:var(--mut)}
.cpr .go.alt{margin-top:8px}
/* словарь модуля, экзамены модуля и уровня: строки в карте курса (закрытые — подсказка замка по нажатию); слова словаря с примером */
.les li.cp.pack,.les li.cp.module,.les li.cp.level{cursor:pointer}.les li.cp.level{font-weight:700}
.pl-link{display:inline-block;margin:0 0 14px;font-size:13.5px}.pl-link[hidden]{display:none}
.pl-text{white-space:normal;margin-bottom:12px}.pl-box{overflow-x:auto}.pl-tab{width:100%;font-size:13.5px}
.pl-tab td,.pl-tab th{padding:6px 7px;text-align:center;white-space:nowrap}.pl-tab th{text-transform:none;letter-spacing:0;font-size:12px}.pl-tab td:first-child,.pl-tab th:first-child{text-align:left}
#stage #plSkip{margin-top:12px}.pl-ask .gbtn{margin-top:10px}
.vgrid.pk{grid-template-columns:1fr}:root[data-p="win"] .vgrid.pk{grid-template-columns:repeat(2,1fr)}
.vc .vx{display:block;margin-top:6px;padding-top:6px;border-top:1px dashed var(--lb);font-size:14px;color:var(--lt)}.vc .vx .say{cursor:pointer}.vc .vx small{margin-top:1px}
/* шаг 8: полоса занятия на всех раскладках, чат с родителем */
.lockbar span span{font-weight:600}.lockbar small a{margin-left:4px}
.chatl{list-style:none;margin:10px 0;padding:0;max-height:46vh;overflow:auto;display:flex;flex-direction:column;gap:6px;font-size:14.5px}
.chatl li{max-width:85%;padding:8px 12px;border-radius:14px;border:1px solid var(--line);background:var(--card)}.chatl li.me{align-self:flex-end;background:var(--paper)}
.chatl li small{display:block;color:var(--mut);font-size:11.5px}.chatl li.mut{align-self:center;border:0;background:none;color:var(--mut)}
#chat .inp{margin-bottom:8px}
/* полоса занятия не закрывает шапку урока: экран начинается под ней (липкая шапка урока — в своей прокрутке) */
/* (в макете сверху была нарисованная строка состояния телефона — здесь её нет, поэтому полоса выше) */
.lockbar,:root[data-p="ios"] .lockbar{top:6px;gap:10px}:root[data-p="win"] .lockbar{top:42px}
.lockbar>span{white-space:nowrap}.lockbar small{text-align:right}
.app.locked .scr,:root[data-p="win"] .app.locked .rail,:root[data-p="win"] .app.locked .side{margin-top:56px}.app.locked #v-lesson .lt{margin-top:0}

/* обратная SMS (сервер v1.4, shared/smsin.js): текст и номер крупно, предупреждение — заметной рамкой */
.smsin .si-lead{font-weight:600;margin:0 0 12px}
.si-card{border:1.5px solid var(--line);border-radius:14px;padding:8px 14px;background:var(--card);margin-bottom:10px}
.si-row{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 10px;padding:6px 0}.si-row+.si-row{border-top:1px solid var(--line)}
.si-row small{grid-column:1/-1;color:var(--mut);font-size:12px}
.si-v{font:800 22px/1.2 var(--fh);letter-spacing:.04em;color:var(--ink);user-select:all}
.si-copy{width:auto!important;min-height:36px;padding:0 14px!important}
a.si-open{display:flex;align-items:center;justify-content:center;text-decoration:none;margin-bottom:8px}
.si-share{margin-bottom:8px}
.si-warn{margin:10px 0;padding:12px 14px;border:2px solid var(--acc);border-radius:12px;font-weight:700;font-size:15px;line-height:1.35;color:var(--ink);background:color-mix(in srgb,var(--acc) 7%,var(--paper))}
.si-state{color:var(--mut);font-size:14px;margin:8px 0;font-variant-numeric:tabular-nums}.si-new{margin-bottom:6px}
/* «Учёба»: Курс · Тренировка · Тесты · Справочник — те же карточки, ряды и чипы, что в apps-v4 */
#stab{flex-wrap:wrap}.spane{display:none}.spane.on{display:block}
.tsrc{margin:6px 0 12px}.tsrc span{cursor:pointer}
.tgames .card{cursor:pointer;min-height:96px}.tgames .card.off{opacity:.55}.tgames .gstat{margin-top:auto;padding-top:4px}
a.row.trow{cursor:pointer;text-decoration:none;color:inherit}a.row.trow.off{color:var(--mut)}
#cust .row .go{width:100%}#cust .row .seg{flex:1 1 100%;display:flex}#cust .row .seg span{flex:1;text-align:center}
.spane h2{margin:18px 0 8px}#cust .row .go[disabled]{opacity:.5}
.hist li{display:flex;justify-content:space-between;gap:10px}.hist small{color:var(--mut);white-space:nowrap}
#sp-ref .inp{margin-bottom:12px}#sp-ref .ctab{margin-top:4px}
.rtag{font-size:15px;margin:16px 0 6px}
.rule-item{border:1px solid var(--line);border-radius:12px;background:color-mix(in srgb,var(--card) 94%,transparent);margin:0 0 6px;padding:10px 12px}
.rule-item summary{display:flex;justify-content:space-between;gap:10px;cursor:pointer;font-weight:600;font-size:14.5px;list-style:none}
.rule-item summary::-webkit-details-marker{display:none}.rule-item small{color:var(--mut);font-weight:500;font-size:12.5px;white-space:nowrap}
.rule-item.locked{display:flex;justify-content:space-between;color:var(--mut);font-size:14px}
.rule-item .theory{margin:10px 0 8px;background:var(--lc);border:1.5px solid var(--lb);color:var(--lt);border-radius:12px}
.dfil{border:0;padding:0 0 10px}.dfil .tin{flex:1 1 160px;min-width:0}
.dict .wrow{display:grid;grid-template-columns:auto auto 1fr auto;gap:8px;align-items:baseline;cursor:pointer}
.dict .wrow b{font-family:var(--fh)}.dict .wrow .tr,.dict .wrow small{color:var(--mut);font-size:12.5px}
.srow{cursor:pointer}
/* игры в рамке урока */
.fcard{display:flex;flex-direction:column;align-items:center;gap:6px;padding:28px 16px;border-radius:16px;border:1.5px solid var(--lb);background:var(--lc);color:var(--lt);cursor:pointer;text-align:center;margin-bottom:12px}
.fcard .fc-en{font:800 28px/1.15 var(--fh)}.fcard .fc-ru{font-size:18px}.fcard .tr{color:var(--mut)}
.fbtns{display:flex;gap:8px;flex-wrap:wrap;margin:6px 0}.fbtns .go{flex:1 1 0;min-width:96px;margin:0}.fbtns[hidden]{display:none}
.go.sm{padding:8px 12px;font-size:13px;width:auto}
.mgrid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.mgrid>div{display:flex;flex-direction:column;gap:8px}
#v-lesson .mt.sel{border-color:var(--acc);box-shadow:0 0 0 2px color-mix(in srgb,var(--acc) 35%,transparent)}
#v-lesson .mt.ok{opacity:.55}#v-lesson .mt.no{text-decoration:line-through;text-decoration-color:var(--acc)}
.water{height:10px;border-radius:6px;border:1.5px solid var(--lb);background:var(--lc);overflow:hidden;margin:2px 0 10px}
.water i{display:block;height:100%;background:color-mix(in srgb,var(--acc) 55%,transparent);transition:width .3s}
.fword{display:flex;gap:6px;flex-wrap:wrap;margin:12px 0;font:800 24px/1 var(--fh)}
.fword span{min-width:22px;border-bottom:2px solid var(--lb);text-align:center;padding-bottom:3px}.fword span.sp{border:0}.fword span.miss{color:var(--mut);text-decoration:line-through}
.kb{display:flex;flex-direction:column;gap:5px;margin:8px 0}.kb div{display:flex;gap:4px;justify-content:center}
.key{min-width:28px;height:38px;border-radius:8px;border:1.5px solid var(--lb);background:var(--lc);color:var(--lt);font:700 15px var(--fb, inherit);cursor:pointer;flex:1 1 0;max-width:40px}
.key.hit{opacity:.5}.key.miss{text-decoration:line-through;color:var(--mut)}
.slots .tile.empty{color:var(--mut)}
.dw s{color:var(--mut);text-decoration-color:var(--acc)}
/* практика модуля и выходной тест: текст / запись, письмо; тексты и образец не выделяются и не копируются */
.noselect{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none}
.pass{margin-bottom:14px}.pass.script p{margin:4px 0}
.wtext{width:100%;box-sizing:border-box;padding:12px;border-radius:12px;border:1.5px solid var(--lb);background:var(--lc);color:var(--lt);font:16px/1.55 var(--fb, inherit);resize:vertical;margin:10px 0 4px}
.wmine{white-space:pre-wrap}.model{border-color:var(--t-bd)!important}
#pl{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:10px}#pl .go{width:auto;margin:0}
.pass p.pn{position:relative;padding-left:28px}.pass .pnum{position:absolute;left:0;top:3px;font-size:12.5px;color:var(--mut)}
.pass h3{font:700 18px/1.3 var(--fh);margin:6px 0 10px}
.pass .gloss{margin-top:14px;padding:10px 14px;border-radius:10px;background:var(--th);border:1px solid var(--lb);font-size:14.5px}
/* «глазок» в поле пароля (shared/peek.js) */
.peek-w{position:relative;display:block;margin-top:6px}.fl .peek-w input{margin-top:0;padding-right:52px}
.peek{position:absolute;right:4px;top:50%;transform:translateY(-50%);width:44px;height:44px;border:0;border-radius:10px;background:none;color:var(--mut);display:grid;place-items:center;cursor:pointer}
.peek:hover{color:var(--ink)}.peek:focus-visible{outline:2px solid var(--acc);outline-offset:-2px}
.peek .peek-x{display:none}.peek[aria-pressed="true"] .peek-x{display:inline}
/* «Мой класс» (v1.12): задания класса — отступы между заданиями, просрочено — цветом «частой ошибки» */
.cls .hw{margin-top:12px}.cls .hw .rows{margin-top:6px}.cls>.lnk{display:inline-block;margin-top:12px;cursor:pointer}.tag.bad{border-color:var(--w-bd);color:var(--w-tx)}
/* «Информатика» (pycourse.js): урок Python — их страница в рамке на всю высоту экрана, прокрутка — внутри рамки */
:root[data-view="pylesson"] .tabs{display:none!important}:root[data-view="pylesson"] .scr{display:flex;flex-direction:column;padding-bottom:0}
#v-pylesson.on{display:flex;flex-direction:column;flex:1;min-height:0}#v-pylesson .lh{margin:6px 0 8px}
#py-lt{min-width:0;font-size:14px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}#v-pylesson .lh .go{width:auto;min-height:40px;padding:0 14px;font-size:14px}
#py-box{flex:1;min-height:0;display:flex}#py-frame{flex:1;width:100%;min-height:0;border:0;border-radius:12px;background:var(--paper)}
#v-pycourse .les .ru{margin-left:6px;font-size:10px;color:var(--mut)}[data-py-mod]{cursor:pointer}
.app.locked #v-pylesson .lh{margin-top:44px}
/* ---------- Книги: полки, профиль книги, читалка, карточка слова (books.js) ---------- */
#bk-tabs{margin-bottom:10px}.bq{display:block;margin-bottom:12px}.bq[hidden]{display:none}
.bq input{width:100%;min-height:44px;padding:0 14px;border-radius:12px;border:1px solid var(--line);background:var(--paper);color:var(--ink);font:inherit}
.bsh{font:800 18px/1.2 var(--fh);margin:6px 0 8px}.bshelf{margin-bottom:8px}.card.off{opacity:.7}
.book{cursor:pointer;color:inherit;text-decoration:none}.book:focus-visible,.btoc a:focus-visible,.x:focus-visible{outline:2px solid var(--acc);outline-offset:2px}
.bphead{display:flex;gap:16px;align-items:flex-start;margin-bottom:12px}.bphead h1{font:800 22px/1.15 var(--fh);margin:0 0 4px}
.bcov{width:96px;height:136px;flex:none;border-radius:8px;display:flex;flex-direction:column;justify-content:flex-end;padding:10px;color:#fff;box-shadow:0 8px 20px rgba(12,21,48,.18)}
.bcov b{font:800 13px/1.15 var(--fh)}.bcov small{font-size:10.5px;opacity:.85;margin-top:4px}
.bpm{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.bpact .go[disabled],.rdnav .go[disabled]{opacity:.45}
.bfit{margin:4px 0;font-weight:700}.bfit.easy,.bfit.fit{color:var(--g)}.bfit.stretch{color:var(--acc)}.bfit.hard{color:#b4541a}
.btoc{list-style:none;margin:0;padding:0}.btoc a{display:flex;gap:10px;align-items:center;padding:9px 4px;border-top:1px solid var(--line);cursor:pointer}
.btoc i{width:26px;height:26px;flex:none;border-radius:50%;display:grid;place-items:center;font:700 12px/1 var(--fb);font-style:normal;background:var(--soft);color:var(--mut)}
.btoc span{flex:1}.btoc small{color:var(--mut);font-size:12px}.btoc a.d i{background:color-mix(in srgb,var(--g) 22%,transparent);color:var(--g)}.btoc a.c span{font-weight:700}
.bdict{list-style:none;margin:0;padding:0}.bdict li{display:flex;align-items:center;gap:8px;padding:10px 0;border-top:1px solid var(--line)}.bdict li>div{flex:1;min-width:0}
.bdict b{font:700 15px/1.2 var(--fh)}.bdict small{display:block;color:var(--mut);font-size:12.5px}.bdict b+small{display:inline}
.chip{min-height:32px;padding:0 10px;border-radius:16px;border:1px solid var(--line);background:var(--paper);color:var(--mut);font:600 12.5px var(--fb)}.chip.on{border-color:var(--g);color:var(--g)}
.mbooks{margin:-2px 0 10px 28px;padding:8px 0 0 22px;border-left:2px solid var(--line)}.mbooks .hd2{margin-bottom:4px}.mbooks .book{padding:8px;margin-bottom:6px}.mbooks .cov{width:34px;height:46px;font-size:10px}
.rdh .rt{min-width:0;flex:1 1 calc(100% - 52px)}:root[data-p="win"] .rdh .rt{flex-basis:auto}.rdh .rt b,.rdh .rt small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.rdh .rt small{color:var(--mut);font:500 12px var(--fb)}
.rdh{flex-wrap:wrap;gap:6px;position:sticky;top:-12px;z-index:2;background:var(--paper);padding:6px 0;margin-bottom:6px}.rdh .x{flex:none;font-weight:700;font-size:13px;cursor:pointer}
.rdh .x.on{border-color:var(--acc);color:var(--acc)}.rdh .x[hidden]{display:none}.rdbar{margin-bottom:12px}
.rdtoc{border:1px solid var(--line);border-radius:14px;padding:10px 12px;margin-bottom:12px;background:var(--card)}.rdtoc[hidden]{display:none}
.rd{max-width:680px;margin:0 auto;font-family:Georgia,'Times New Roman',serif;line-height:1.65;color:var(--ink);padding:4px 2px}
.rd h2{font:800 22px/1.2 var(--fh);margin:6px 0 16px}.rd h3{font:700 17px/1.2 var(--fh);margin:18px 0 8px;text-align:center}.rd p{margin:0 0 .9em;text-indent:1.2em}
.rd .w{cursor:pointer;border-radius:3px}.rd .w:hover{background:var(--soft)}.rd .w.sel{background:color-mix(in srgb,var(--acc) 25%,transparent)}
.rd .s.say{background:color-mix(in srgb,var(--g) 18%,transparent);border-radius:4px}
.rdnav{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:22px 0 8px}
#v-reader[data-rt="sepia"]{--paper:#f4ecd8;--ink:#3b2f1e;--mut:#6f604a;--line:#ddd0b3;--soft:#eadfc4;--card:#efe5cc}
#v-reader[data-rt="dark"]{--paper:#111418;--ink:#d9dde3;--mut:#9aa3ae;--line:#262c35;--soft:#1d232b;--card:#161b21;--acc:#7aa2ff}
#v-reader.on{background:var(--paper);color:var(--ink);margin:-12px -16px 0;padding:12px 16px 0;min-height:100%}
.wcard{position:sticky;bottom:12px;z-index:5;margin:0 auto;max-width:520px;background:var(--paper);border:1px solid var(--line);border-radius:16px;padding:14px;box-shadow:0 12px 30px rgba(12,21,48,.22)}
.wcard[hidden]{display:none}.wc-h{display:flex;align-items:center;gap:8px}.wc-h b{font:800 20px/1.2 var(--fh)}.wc-h .x{margin-left:auto;cursor:pointer}.wc-tr{color:var(--mut)}
.wc-ru{font-size:16px;margin:8px 0 12px}.wc-b{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px}.wc-b .go{min-height:44px;font-size:13.5px}
:root[data-p="win"] .bcov{width:120px;height:170px}