.head{margin-bottom:20px}
.lvtabs{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:14px}
.lvtabs button{display:flex;gap:10px;align-items:center;text-align:left;padding:12px 14px;border-radius:16px;border:1px solid var(--line);background:rgba(255,255,255,.04);cursor:pointer;min-width:0;min-height:56px;transition:.2s}
.lvtabs button:hover{border-color:rgba(103,232,249,.5)}
.lvtabs button[aria-selected="true"]{background:linear-gradient(135deg,rgba(34,211,238,.18),rgba(124,58,237,.25),rgba(236,72,153,.18));border-color:rgba(255,255,255,.35)}
.lvtabs .n{width:34px;height:34px;flex:none;border-radius:11px;display:grid;place-items:center;font-weight:800;background:rgba(255,255,255,.08)}
.lvtabs button[aria-selected="true"] .n{background:var(--grad)}
.lvtabs b{display:block;font-size:15px}.lvtabs small{display:block;color:var(--mut);font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.lvtabs span:last-child{min-width:0}
.lvwrap{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:14px;align-items:start}
.lvstage{padding:22px;min-height:470px}
.lvstage [role=tabpanel]{outline:none}
.meta{padding:18px;position:sticky;top:80px}
.meta h3{font-size:18px;margin:2px 0 8px}
.meta p{font-size:14px;color:var(--mut);margin-bottom:10px}
.meta ul{list-style:none;display:grid;gap:6px;margin:10px 0}
.meta li{font-size:13.5px;padding:8px 10px;border-radius:10px;background:rgba(255,255,255,.04)}
.meta li b{color:#a5f3fc}
.dots{display:inline-flex;gap:4px;vertical-align:middle}
.dots i{width:12px;height:12px;border-radius:4px;background:rgba(255,255,255,.12)}
.dots i.on{background:var(--grad)}
/* shared lesson bits */
.lh{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:14px;flex-wrap:wrap}
.lh h2{font-size:20px;letter-spacing:-.3px}
.btnrow{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
.mail{border-radius:16px;background:#f8fafc;color:#0f172a;overflow:hidden;box-shadow:0 20px 40px -20px rgba(0,0,0,.7);position:relative;font-size:14px}
.mail .mh{padding:12px 16px;border-bottom:1px solid #e2e8f0;display:grid;gap:3px;background:#fff}
.mail .mh .subj{font-weight:800;font-size:15.5px}
.mail .mh small{color:#475569}
.mail .mb{padding:14px 16px;display:grid;gap:10px;line-height:1.55}
.mail .fake-btn{display:inline-block;background:#2563eb;color:#fff;padding:9px 16px;border-radius:8px;font-weight:700;width:max-content;max-width:100%}
.mail .att{display:inline-flex;gap:6px;align-items:center;font-size:13px;padding:6px 10px;border-radius:8px;background:#e2e8f0;width:max-content;max-width:100%}
.flag{position:relative;display:inline-block;max-width:100%;border-radius:6px;outline:2px dashed transparent;outline-offset:2px;transition:.2s}
.lv2 .flag{cursor:pointer;outline-color:rgba(37,99,235,.35);background:rgba(37,99,235,.06)}
.lv2 .flag:hover,.lv2 .flag:focus-visible{outline-color:#2563eb;background:rgba(37,99,235,.12)}
.flag.on{outline:2px solid #e11d48!important;background:rgba(225,29,72,.1)!important}
.flag .pin{position:absolute;top:-11px;right:-9px;width:19px;height:19px;font-size:11px;border-radius:50%;background:#e11d48;color:#fff;font-size:12px;font-weight:800;display:none;place-items:center;z-index:2}
.flag.on .pin,.lv1 .flag .pin{display:grid}
.lv1 .flag{outline:2px solid rgba(225,29,72,.6);background:rgba(225,29,72,.06)}
.legend{display:grid;gap:8px;margin-top:12px}
.legend div{display:flex;gap:10px;font-size:14px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.05);animation:pop .3s}
.legend i{flex:none;width:22px;height:22px;border-radius:50%;background:#e11d48;font-style:normal;font-weight:800;font-size:12px;display:grid;place-items:center}
@keyframes pop{from{opacity:0;transform:translateY(6px)}}
.slides{min-height:330px}
.slides h3{font-size:22px;margin-bottom:8px}.slides p{color:#d6def0;margin-bottom:12px}
.pager{display:flex;justify-content:space-between;align-items:center;margin-top:16px}
.pager .dots i{width:22px;height:6px}
.mcq{margin-top:14px;padding:16px;border-radius:16px;background:rgba(255,255,255,.04);border:1px solid var(--line)}
.mcq h3{font-size:16px;margin-bottom:10px}
.opt{display:block;width:100%;text-align:left;padding:12px 14px;border-radius:12px;border:1px solid var(--line);background:rgba(255,255,255,.05);margin-bottom:8px;cursor:pointer;font-weight:600;min-height:46px}
.opt:hover:not([disabled]){border-color:var(--cy)}
.opt.right{border-color:#34d399;background:rgba(52,211,153,.16)}.opt.wrong{border-color:#fb7185;background:rgba(251,113,133,.14)}
.fb{font-size:14px;color:#dbe4f7;min-height:1.2em;margin-top:6px}
.split{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:16px}
/* level 3 */
.inbox{display:grid;gap:8px}
.irow{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:center;padding:12px 14px;border-radius:14px;background:rgba(255,255,255,.05);border:1px solid var(--line)}
.irow b{display:block;font-size:14.5px}.irow small{color:var(--mut);font-size:12.5px;display:block;overflow-wrap:anywhere}
.irow .acts{display:flex;gap:6px}
.irow .acts button{padding:8px 12px;border-radius:10px;border:1px solid var(--line);background:rgba(255,255,255,.06);cursor:pointer;font-weight:700;font-size:13px;min-height:40px}
.irow.ok{border-color:#34d399}.irow.bad{border-color:#fb7185}
.irow .res{grid-column:1/-1;font-size:13.5px;color:#dbe4f7;padding-top:6px;border-top:1px solid var(--line)}
.score{font-weight:800}
/* level 4 */
.sim{display:grid;gap:12px}
.simhud{display:flex;gap:8px;flex-wrap:wrap}
.simhud .chip b{color:#fff;font-size:14px}
.tbar{height:6px;border-radius:6px;background:rgba(255,255,255,.1);overflow:hidden}.tbar i{display:block;height:100%;background:var(--grad);transition:width .25s linear}
.queue{position:relative;min-height:250px;display:grid;place-items:center}
.mcard{width:min(460px,100%);border-radius:16px;background:#f8fafc;color:#0f172a;box-shadow:0 20px 40px -18px rgba(0,0,0,.8);padding:14px 16px;touch-action:pan-y;user-select:none;transition:transform .25s,opacity .25s;animation:drop .35s}
@keyframes drop{from{transform:translateY(-20px) scale(.96);opacity:0}}
.mcard .from{font-size:12.5px;color:#475569;overflow-wrap:anywhere}.mcard .subj{font-weight:800;margin:4px 0}.mcard .snip{font-size:13.5px;color:#334155}
.mcard.gl{transform:translateX(-120%) rotate(-8deg);opacity:0}.mcard.gr{transform:translateX(120%) rotate(8deg);opacity:0}
.pending{position:absolute;top:0;right:0;font-size:12px;font-weight:800;padding:4px 10px;border-radius:999px;background:#ec4899}
.simact{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.simact .btn{min-height:54px}
.btn.rep{background:rgba(251,113,133,.2);border:1px solid rgba(251,113,133,.55);box-shadow:none}
.btn.keep{background:rgba(52,211,153,.2);border:1px solid rgba(52,211,153,.55);box-shadow:none}
.combo{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%);font-size:34px;font-weight:800;pointer-events:none;animation:float 1s forwards}
@keyframes float{to{transform:translate(-50%,-120%);opacity:0}}
.deb{display:grid;gap:8px;margin-top:10px}.deb div{font-size:13.5px;padding:10px 12px;border-radius:12px;background:rgba(255,255,255,.05);border-left:3px solid #fb7185}
.deb div.okk{border-left-color:#34d399}
/* glance */
.glance{padding:22px;margin-top:22px}
.glance h2{font-size:22px;margin-bottom:12px}
.tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch}
table{width:100%;border-collapse:collapse;font-size:14px;min-width:640px}
th,td{text-align:left;padding:11px 12px;border-bottom:1px solid rgba(255,255,255,.08);vertical-align:top}
thead th{font-size:11.5px;text-transform:uppercase;letter-spacing:.1em;color:var(--mut)}
tbody th{white-space:nowrap}
/* estimator */
.est{margin-top:34px}
.esthead h2{font-size:clamp(26px,3.4vw,38px);letter-spacing:-.8px;margin-bottom:6px}
.samp{color:#fde68a}
.estgrid{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1fr);gap:14px;margin-top:16px;align-items:start}
.form{padding:20px;display:grid;gap:16px}
.fld{display:grid;gap:8px;border:0;min-width:0}
.fld>span,.fld legend{display:flex;justify-content:space-between;font-weight:700;font-size:14px;padding:0}
.fld output{color:#a5f3fc}
input[type=range]{width:100%;accent-color:#a78bfa;height:28px}
select,input[type=number]{width:100%;padding:11px 12px;border-radius:12px;border:1px solid var(--line);background:#12183a;font-size:14.5px}
.seg{display:grid;grid-template-columns:repeat(auto-fit,minmax(100px,1fr));gap:6px}
.seg label{position:relative}
.seg input{position:absolute;opacity:0;inset:0;cursor:pointer}
.seg span{display:block;text-align:center;padding:10px 6px;border-radius:12px;border:1px solid var(--line);font-size:13px;font-weight:700;background:rgba(255,255,255,.04)}
.seg input:checked+span{background:var(--grad);border-color:transparent}
.seg input:focus-visible+span{outline:3px solid var(--cy);outline-offset:2px}
.chk{display:flex;flex-wrap:wrap;gap:10px 18px}
.chk label{display:flex;gap:8px;align-items:center;font-size:14px;cursor:pointer;min-height:32px}
.chk input{width:18px;height:18px;accent-color:#ec4899}
.adv summary{cursor:pointer;font-size:13.5px;color:#a5f3fc;font-weight:700}
.adv .fld{margin-top:10px}
.out{padding:22px;position:sticky;top:80px;overflow:hidden}
.stamp{position:absolute;top:18px;right:-36px;transform:rotate(35deg);background:#fbbf24;color:#0b1026;font-weight:800;font-size:11px;letter-spacing:.14em;text-transform:uppercase;padding:5px 44px}
.price{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap;font-size:clamp(28px,3.6vw,42px);font-weight:800;letter-spacing:-1px;margin:6px 0 2px}
.price span{background:var(--gradt);-webkit-background-clip:text;background-clip:text;color:transparent}
.price i{font-style:normal;color:var(--mut);font-size:.7em}
.kpis{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:14px 0}
.kpis div{padding:10px;border-radius:12px;background:rgba(255,255,255,.05);text-align:center}
.kpis b{display:block;font-size:20px}.kpis small{font-size:11px;color:var(--mut)}
.bd{display:grid;gap:6px}
.bd div{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px;font-size:13px;align-items:center}
.bd span{color:var(--mut)}
.bd .bar{grid-column:1/-1;height:6px;border-radius:6px;background:rgba(255,255,255,.08);overflow:hidden}.bd .bar i{display:block;height:100%;background:var(--grad)}
@media(max-width:1000px){.lvwrap{grid-template-columns:1fr}.meta{position:static}.estgrid{grid-template-columns:1fr}.out{position:static}.split{grid-template-columns:1fr}}
@media(max-width:700px){.lvtabs{grid-template-columns:repeat(2,minmax(0,1fr))}.lvstage{padding:14px;min-height:0}.lvtabs small{white-space:normal}}
@media(max-width:420px){.irow{grid-template-columns:1fr}.lvtabs button{padding:10px}.lvtabs .n{width:28px;height:28px}}
/* v2 premium */
.lhero{position:relative;overflow:hidden;border-radius:28px;min-height:340px;display:flex;align-items:center;padding:36px;margin:18px 0 22px;isolation:isolate;border:1px solid var(--line)}
.lhero .hbg{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 50%;z-index:-2;animation:lkb 20s ease-in-out infinite alternate}
.lhero:after{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0b1026 0%,#0b1026e6 35%,#0b102600 70%)}
@keyframes lkb{to{transform:scale(1.06)}}
.htxt{max-width:560px}
.lvtabs .n{position:relative;width:52px;height:52px;border-radius:14px;overflow:visible;background:#0f1538;padding:0}
.lvtabs .n img{width:100%;height:100%;object-fit:cover;border-radius:14px;transition:transform .35s cubic-bezier(.2,.9,.3,1.4)}
.lvtabs .n em{position:absolute;right:-6px;bottom:-6px;width:22px;height:22px;border-radius:8px;display:grid;place-items:center;font-style:normal;font-size:11px;font-weight:800;background:#1e2457;border:1px solid #ffffff33}
.lvtabs button[aria-selected="true"] .n{background:#0f1538;box-shadow:0 0 0 2px #22d3ee,0 8px 24px -8px #22d3ee}
.lvtabs button[aria-selected="true"] .n em{background:var(--grad);border-color:transparent}
.lvtabs button:hover .n img{transform:scale(1.08) rotate(-3deg)}
.lvtabs button{transition:transform .2s,border-color .2s,background .3s}.lvtabs button:active{transform:scale(.97)}
.opt,.btn{transition:transform .15s,background .2s,border-color .2s}.opt:active{transform:scale(.98)}
@media(max-width:760px){.lhero{min-height:0;padding:22px;align-items:flex-end;padding-top:180px}.lhero .hbg{object-position:80% 0;height:220px;bottom:auto}.lhero:after{background:linear-gradient(0deg,#0b1026 45%,#0b102600 75%)}}
@media(max-width:420px){.lvtabs .n{width:40px;height:40px}}
@media(prefers-reduced-motion:reduce){.lhero .hbg{animation:none}}