/* CAC Web Dashboard — student dashboard styles. Colours/radius/font come from :root variables emitted by the plugin (admin-controlled). */
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
html.cw-lock,html.cw-lock body{overflow:hidden}
body{margin:0;font-family:var(--font);background:var(--bg);color:var(--text);line-height:1.55;font-size:15px;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img{max-width:100%;display:block}
a{color:var(--primary);text-decoration:none}
a:hover{text-decoration:underline}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
h1,h2,h3,h4{line-height:1.25;margin:0 0 .4em;letter-spacing:-.01em}
h1{font-size:1.75rem;font-weight:800}
h2{font-size:1.3rem;font-weight:800}
h3{font-size:1.05rem;font-weight:700}
p{margin:0 0 .8em}
[hidden]{display:none!important}
:focus-visible{outline:3px solid rgba(var(--primary-rgb),.45);outline-offset:2px;border-radius:6px}
.muted{color:var(--muted)}
.sm{font-size:.86rem}
.center{text-align:center}
.ic{width:1.15em;height:1.15em;flex:none;vertical-align:-.18em}
.ic.big{width:44px;height:44px}
.cw-row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}
.cw-row.end{justify-content:flex-end}
.cw-row.between{justify-content:space-between}
.grow{flex:1 1 auto;min-width:0}
.hide-m{display:initial}.only-m{display:none}
@media(max-width:900px){.hide-m{display:none!important}.only-m{display:initial}}

/* ---------- boot ---------- */
.cw-boot{min-height:100vh;display:flex;flex-direction:column;gap:14px;align-items:center;justify-content:center;color:var(--muted)}
.cw-spin{width:38px;height:38px;border:4px solid rgba(var(--primary-rgb),.18);border-top-color:var(--primary);border-radius:50%;animation:cwspin .8s linear infinite}
@keyframes cwspin{to{transform:rotate(360deg)}}
.cw-dots{display:inline-block;width:14px;height:14px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:cwspin .7s linear infinite;vertical-align:-2px}

/* ---------- buttons ---------- */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:11px 20px;border-radius:999px;border:1.5px solid transparent;font-weight:700;font-size:.95rem;line-height:1.2;cursor:pointer;transition:transform .15s,box-shadow .2s,background .2s,border-color .2s;text-decoration:none!important;white-space:nowrap;user-select:none;-webkit-tap-highlight-color:transparent}
.btn:active{transform:scale(.97)}
.btn[disabled],.btn.busy{opacity:.65;pointer-events:none}
.btn.primary{background:var(--grad);color:var(--on-primary);box-shadow:0 8px 20px -8px rgba(var(--primary-rgb),.7)}
.btn.primary:hover{box-shadow:0 12px 26px -8px rgba(var(--primary-rgb),.8);transform:translateY(-1px)}
.btn.accent{background:var(--accent);color:var(--on-accent);box-shadow:0 8px 20px -10px var(--accent)}
.btn.outline{background:transparent;border-color:var(--primary);color:var(--primary)}
.btn.outline:hover{background:var(--primary-l)}
.btn.ghost{background:var(--soft);color:var(--text);border-color:var(--border)}
.btn.ghost:hover{background:var(--primary-l);border-color:rgba(var(--primary-rgb),.35)}
.btn.danger{background:#DC2626;color:#fff}
.btn.ok{background:#16A34A;color:#fff}
.btn.block{display:flex;width:100%}
.btn.sm{padding:8px 14px;font-size:.85rem}
.btn.lg{padding:14px 26px;font-size:1.02rem}
.btn.icon{padding:9px;border-radius:50%}
.link-btn{background:none;border:0;padding:0;color:var(--primary);font-weight:700;cursor:pointer}
.link-btn:hover{text-decoration:underline}

/* ---------- forms ---------- */
.fld{display:block;margin:0 0 14px}
.fld>span{display:block;font-weight:700;font-size:.86rem;margin-bottom:6px}
.fld>span i{color:#DC2626;font-style:normal}
.inp{width:100%;padding:12px 14px;border:1.5px solid var(--border);border-radius:var(--radius-sm);background:var(--surface);transition:border-color .2s,box-shadow .2s;min-height:46px}
.inp:focus{outline:0;border-color:var(--primary);box-shadow:0 0 0 4px rgba(var(--primary-rgb),.15)}
textarea.inp{min-height:110px;resize:vertical}
.inp.err{border-color:#DC2626}
.help{font-size:.8rem;color:var(--muted);margin-top:5px}
.pw{position:relative}
.pw .inp{padding-right:46px}
.pw button{position:absolute;right:6px;top:50%;transform:translateY(-50%);background:none;border:0;padding:8px;color:var(--muted)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:0 14px}
@media(max-width:560px){.two{grid-template-columns:1fr}}
.formerr{background:rgba(220,38,38,.09);color:#B91C1C;border:1px solid rgba(220,38,38,.25);padding:10px 14px;border-radius:var(--radius-sm);margin-bottom:14px;font-size:.9rem}
.formok{background:rgba(22,163,74,.1);color:#15803D;border:1px solid rgba(22,163,74,.25);padding:10px 14px;border-radius:var(--radius-sm);margin-bottom:14px;font-size:.9rem}
.chk{display:flex;gap:10px;align-items:flex-start;font-size:.9rem;cursor:pointer}
.chk input{width:18px;height:18px;margin-top:2px;accent-color:var(--primary)}

/* ---------- app shell ---------- */
.cw-shell{display:grid;grid-template-columns:272px minmax(0,1fr);min-height:100vh}
.cw-side{position:sticky;top:0;height:100vh;overflow:auto;background:var(--surface);border-right:1px solid var(--border);padding:16px 14px;display:flex;flex-direction:column;gap:6px;z-index:40;scrollbar-width:thin}
.cw-brand-row{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:4px 6px 14px}
.cw-iconbtn.side-x{display:none}
.cw-brand{display:flex;align-items:center;gap:10px;font-weight:800;font-size:1.1rem;color:var(--text)!important;text-decoration:none!important;min-width:0}
.cw-brand span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.brand-img{height:38px;width:auto;max-width:170px;object-fit:contain}
.brand-img.sm{height:32px;max-width:130px}
.brand-mark{width:40px;height:40px;border-radius:13px;background:var(--grad);color:var(--on-primary);display:grid;place-items:center;font-weight:800;font-size:1.1rem;flex:none;box-shadow:0 8px 18px -8px rgba(var(--primary-rgb),.7)}
.brand-mark.sm{width:34px;height:34px;border-radius:11px;font-size:1rem}
.lg-d{display:none}
:root[data-theme="dark"] .lg-l.has-d{display:none}
:root[data-theme="dark"] .lg-d{display:inline-block}
@media(prefers-color-scheme:dark){:root[data-theme="auto"] .lg-l.has-d{display:none}:root[data-theme="auto"] .lg-d{display:inline-block}}
.cw-nav{display:flex;flex-direction:column;gap:3px}
.cw-nav a{display:flex;align-items:center;gap:12px;padding:9px 14px;border-radius:14px;color:var(--text);font-weight:650;text-decoration:none!important;transition:background .15s,color .15s}
.cw-nav a .ic{width:20px;height:20px;color:var(--muted);transition:color .15s}
.cw-nav a:hover{background:var(--soft)}
.cw-nav a:hover .ic{color:var(--primary)}
.cw-nav a.on{background:var(--grad);color:var(--on-primary);box-shadow:0 10px 22px -12px rgba(var(--primary-rgb),.85)}
.cw-nav a.on .ic{color:inherit}
.cw-nav .grp{font-size:.7rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted);font-weight:800;padding:12px 14px 4px}
.cw-side-foot{margin-top:auto;padding-top:14px;display:flex;flex-direction:column;gap:10px}
.cw-support{background:var(--primary-l);border-radius:var(--radius);padding:14px;font-size:.85rem}
.cw-support b{display:block;margin-bottom:4px;font-size:.95rem}
.side-u{display:flex;align-items:center;gap:10px;padding:10px;border-radius:14px;background:var(--soft);border:1px solid var(--border);color:var(--text)!important;text-decoration:none!important;min-width:0}
.side-u>span:not(.cw-avatar){min-width:0;display:flex;flex-direction:column;line-height:1.25}
.side-u b,.side-u small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.side-u small{color:var(--muted)}
.side-site{display:flex;align-items:center;gap:8px;padding:8px 12px;color:var(--muted)!important;font-weight:600;font-size:.85rem;text-decoration:none!important;border-radius:10px}
.side-site:hover{background:var(--soft)}
.cw-main-col{min-width:0;display:flex;flex-direction:column;min-height:100vh}
.cw-top{position:sticky;top:0;z-index:30;display:flex;align-items:center;gap:10px;padding:10px 28px;background:color-mix(in srgb,var(--nav-bg) 88%,transparent);backdrop-filter:saturate(180%) blur(14px);-webkit-backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--border);min-height:64px}
.cw-top .sp{flex:1}
.cw-top .brand-m{display:none}
.cw-iconbtn{width:42px;height:42px;border-radius:50%;display:inline-grid;place-items:center;background:var(--soft);border:1px solid var(--border);color:var(--nav-text);position:relative;flex:none}
.cw-iconbtn:hover{background:var(--primary-l)}
.cw-avatar{width:40px;height:40px;border-radius:50%;background:var(--grad);color:var(--on-primary);display:inline-grid;place-items:center;font-weight:800;border:0;flex:none}
.cw-menu-btn{display:none}
.avatar-b{border:0;background:none;padding:0;border-radius:50%;line-height:0}
.umenu-w{position:relative}
.umenu{position:absolute;right:0;top:calc(100% + 10px);min-width:236px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow-lg);padding:8px;z-index:60}
.um-h{padding:10px 12px;border-bottom:1px solid var(--border);margin-bottom:6px;display:flex;flex-direction:column}
.um-h small{color:var(--muted)}
.umenu a,.umenu button{display:flex;gap:10px;align-items:center;width:100%;padding:10px 12px;border:0;background:none;border-radius:10px;color:var(--text)!important;font-weight:600;text-decoration:none!important;text-align:left}
.umenu a:hover,.umenu button:hover{background:var(--soft)}
.umenu .danger{color:#DC2626!important}
.cw-main{padding:28px 28px 64px;width:100%;max-width:1240px;margin:0 auto;flex:1}
.cw-bottom{display:none}
.cw-scrim{display:none}
.cw-foot{border-top:1px solid var(--border);color:var(--muted);font-size:.82rem}
.df-in{display:flex;gap:10px 18px;flex-wrap:wrap;justify-content:space-between;align-items:center;padding:16px 28px}
.df-l{display:flex;gap:14px;flex-wrap:wrap}
.df-l a{color:var(--muted)}
.df-s{display:flex;gap:8px}
.soc{width:34px;height:34px;border-radius:50%;display:grid;place-items:center;background:var(--soft);border:1px solid var(--border);color:var(--muted)!important;text-decoration:none!important}
.soc:hover{color:var(--primary)!important;border-color:var(--primary)}
.skip{position:absolute;left:-999px;top:8px;background:var(--primary);color:var(--on-primary)!important;padding:8px 14px;border-radius:8px;z-index:300;font-weight:700}
.skip:focus{left:8px}
.fs{min-height:100vh;display:grid;place-items:center;padding:24px;background:var(--bg)}
.fs-card{max-width:480px;width:100%;text-align:center;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);padding:34px 28px;box-shadow:var(--shadow-lg);display:flex;flex-direction:column;gap:12px;align-items:center}
.fs-card h1{font-size:1.45rem;margin:0}
.fs-card p{margin:0}
.fs-card .ic.big{color:var(--primary)}
body.auth-mode .cw-side,body.auth-mode .cw-top,body.auth-mode .cw-bottom,body.auth-mode .cw-foot,body.auth-mode .cw-scrim{display:none!important}
body.auth-mode .cw-shell{grid-template-columns:1fr}
body.auth-mode .cw-main{padding:0;max-width:none}
@media(max-width:1000px){
	.cw-shell{grid-template-columns:1fr}
	.cw-side{position:fixed;left:0;top:0;bottom:0;width:292px;max-width:86vw;transform:translateX(-102%);transition:transform .25s ease,visibility 0s linear .25s;box-shadow:var(--shadow-lg);height:100dvh;visibility:hidden}
	.cw-shell.open .cw-side{transform:none;visibility:visible;transition-delay:0s}
	.cw-shell.open .cw-scrim{display:block;position:fixed;inset:0;background:rgba(2,6,23,.5);z-index:35}
	body.nav-open{overflow:hidden}
	.cw-iconbtn.side-x{display:inline-grid}
	.cw-menu-btn{display:inline-grid}
	.cw-top{padding:8px 14px;min-height:58px}
	.cw-top .brand-m{display:flex;align-items:center;gap:8px;font-weight:800;color:var(--nav-text)!important;text-decoration:none!important;min-width:0}
	.cw-main{padding:18px 14px 96px}
	.df-in{padding:14px 14px 96px}
	.cw-bottom{display:grid;grid-template-columns:repeat(5,1fr);position:fixed;left:0;right:0;bottom:0;z-index:30;background:var(--surface);border-top:1px solid var(--border);padding:6px 4px calc(6px + env(safe-area-inset-bottom));box-shadow:0 -6px 24px -12px rgba(15,23,42,.25)}
	.cw-bottom a,.cw-bottom button{display:flex;flex-direction:column;align-items:center;gap:2px;padding:6px 2px;font-size:.68rem;font-weight:700;color:var(--muted);text-decoration:none!important;border-radius:12px;background:none;border:0}
	.cw-bottom .ic{width:22px;height:22px}
	.cw-bottom .on{color:var(--primary)}
	.cw-bottom .on .ic{filter:drop-shadow(0 4px 6px rgba(var(--primary-rgb),.4))}
	.cw-shell.player-on .cw-bottom{display:none}
	.cw-shell.player-on .cw-main{padding-bottom:30px}
}
@media(max-width:480px){.cw-top .top-l{display:none}}

/* ---------- page pieces ---------- */
.page-h{display:flex;align-items:flex-end;justify-content:space-between;gap:14px;flex-wrap:wrap;margin-bottom:20px}
.page-h h1{margin:0}
.page-h p{margin:4px 0 0;color:var(--muted)}
.sec{margin:32px 0}
.sec-h{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:14px}
.sec-h h2{margin:0}
.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px}
.card.flat{box-shadow:none}
.tag{display:inline-flex;align-items:center;gap:4px;font-size:.72rem;font-weight:800;padding:3px 9px;border-radius:99px;background:var(--primary-l);color:var(--primary);letter-spacing:.02em}
.tag.free{background:rgba(22,163,74,.13);color:#15803D}
.tag.off{background:rgba(220,38,38,.12);color:#B91C1C}
.tag.warn{background:rgba(245,158,11,.16);color:#B45309}
.tag.dark{background:rgba(15,23,42,.8);color:#fff}
.tag.own{background:#16A34A;color:#fff}
.grid{display:grid;gap:18px;grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
.grid.s{grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}
.grid.l{grid-template-columns:repeat(auto-fill,minmax(320px,1fr))}
@media(max-width:560px){.grid,.grid.l{grid-template-columns:1fr}.grid.s{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}}
.bar{height:7px;border-radius:99px;background:var(--soft);overflow:hidden;border:1px solid var(--border)}
.bar i{display:block;height:100%;background:var(--grad);border-radius:99px;transition:width .4s}
.tabs{display:flex;gap:6px;padding:5px;background:var(--soft);border:1px solid var(--border);border-radius:99px;width:fit-content;max-width:100%;overflow:auto;margin-bottom:18px}
.tabs button,.tabs a{border:0;background:none;padding:8px 18px;border-radius:99px;font-weight:700;color:var(--muted);white-space:nowrap;text-decoration:none!important}
.tabs .on{background:var(--surface);color:var(--primary);box-shadow:var(--shadow)}
.search{position:relative;max-width:420px;flex:1 1 220px}
.search .ic{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--muted)}
.search .inp{padding-left:42px;border-radius:99px}
.filters{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin-bottom:18px}
.crumbs{display:flex;gap:6px;align-items:center;font-size:.85rem;color:var(--muted);margin-bottom:12px;flex-wrap:wrap}
.crumbs a{color:var(--muted)}

/* ---------- home (dashboard) ---------- */
.hero-d{display:flex;gap:22px;align-items:center;justify-content:space-between;flex-wrap:wrap;padding:32px 34px;border-radius:var(--radius-lg);background:linear-gradient(135deg,var(--hero-from),var(--hero-to));color:var(--hero-text);position:relative;overflow:hidden;box-shadow:var(--shadow-lg);margin-bottom:8px}
.hero-d::before,.hero-d::after{content:"";position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.2),transparent 65%);pointer-events:none}
.hero-d::before{width:340px;height:340px;right:-90px;top:-130px}
.hero-d::after{width:240px;height:240px;left:30%;bottom:-150px}
.hd-b{position:relative;z-index:1;max-width:640px}
.hd-b h1{color:inherit;margin:0 0 6px;font-size:clamp(1.5rem,3.4vw,2.2rem)}
.hd-b p{margin:0 0 18px;opacity:.9;max-width:560px}
.hd-b .tag{margin-bottom:12px}
.hd-s{display:flex;gap:12px;position:relative;z-index:1;flex-wrap:wrap}
.hd-s>div{background:rgba(255,255,255,.16);border:1px solid rgba(255,255,255,.28);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-radius:18px;padding:12px 20px;text-align:center;min-width:96px}
.hd-s b{display:block;font-size:1.5rem;line-height:1.15}
.hd-s b .ic{width:1.3rem;height:1.3rem}
.hd-s small{opacity:.85;font-size:.75rem}
.hd-cta{background:#fff;color:var(--primary)!important;box-shadow:0 10px 24px -10px rgba(0,0,0,.45)}
.hd-cta:hover{text-decoration:none;transform:translateY(-1px)}
.hd-ghost{background:rgba(255,255,255,.16);color:var(--hero-text)!important;border-color:rgba(255,255,255,.4)}
.hd-ghost:hover{background:rgba(255,255,255,.26);text-decoration:none}
.qa-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:14px}
.qa{display:flex;flex-direction:column;align-items:center;gap:10px;padding:18px 10px;border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);text-align:center;color:var(--text)!important;text-decoration:none!important;transition:transform .18s,box-shadow .2s,border-color .2s}
.qa:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg);border-color:color-mix(in srgb,var(--c) 45%,transparent)}
.qa .ic-w{width:52px;height:52px;border-radius:17px;display:grid;place-items:center;color:#fff;background:linear-gradient(135deg,var(--c),color-mix(in srgb,var(--c) 60%,#fff));box-shadow:0 10px 20px -10px var(--c)}
.qa .ic-w .ic{width:26px;height:26px}
.qa b{font-size:.9rem}
@media(max-width:560px){.qa-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.qa{padding:14px 6px;gap:8px}.qa .ic-w{width:44px;height:44px;border-radius:14px}.qa b{font-size:.74rem;line-height:1.2}.hero-d{padding:24px 20px}}
.chip-row{display:flex;flex-wrap:wrap;gap:10px}
.chip-l{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;border-radius:99px;background:color-mix(in srgb,var(--c) 11%,var(--surface));border:1px solid color-mix(in srgb,var(--c) 32%,transparent);color:var(--c)!important;font-weight:700;text-decoration:none!important;transition:transform .15s}
.chip-l:hover{transform:translateY(-2px)}
.mc.cont{background:var(--primary-l);border-color:rgba(var(--primary-rgb),.3);margin-top:18px}
.plan-c.hl{border-color:var(--primary);box-shadow:var(--shadow-lg)}

/* ---------- course / plan / ebook / video cards ---------- */
.cc{display:flex;flex-direction:column;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);transition:transform .2s,box-shadow .25s;color:var(--text)!important;text-decoration:none!important;position:relative;height:100%}
.cc:hover{transform:translateY(-4px);box-shadow:var(--shadow-lg)}
.cc .thumb{aspect-ratio:16/9;width:100%;object-fit:fill;background:var(--soft)}/* whole image, stretched to the frame (never cropped) */
.cc.vid .thumb{object-fit:cover}
.thumb.ph{display:grid;place-items:center;color:var(--primary);background:linear-gradient(135deg,var(--primary-l),var(--soft));aspect-ratio:16/9}
.thumb.ph .ic{width:40px;height:40px;opacity:.6}
.cc .body{padding:14px 16px 16px;display:flex;flex-direction:column;gap:8px;flex:1}
.cc h3{margin:0;font-size:1.02rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.cc .meta{display:flex;gap:12px;color:var(--muted);font-size:.8rem;flex-wrap:wrap}
.cc .meta span{display:inline-flex;align-items:center;gap:5px}
.cc .foot{margin-top:auto;display:flex;align-items:center;justify-content:space-between;gap:8px;padding-top:6px}
.cc .ribbon{position:absolute;top:12px;left:12px}
.price-now{font-size:1.18rem;font-weight:800;color:var(--text)}
.price-old{color:var(--muted);font-weight:500;font-size:.85rem}
.book{aspect-ratio:3/4;object-fit:fill;background:var(--soft);width:100%}  /* ebook cover: whole image, stretched to the frame */
.book.ph{display:grid;place-items:center}
.stars{color:#F59E0B;font-size:.85rem;letter-spacing:1px}
.vid{position:relative}
.vid .thumb{aspect-ratio:16/9}
.vid .play{position:absolute;inset:0;display:grid;place-items:center;background:linear-gradient(0deg,rgba(0,0,0,.35),transparent 55%)}
.vid .play span{width:54px;height:54px;border-radius:50%;background:rgba(255,255,255,.92);color:#DC2626;display:grid;place-items:center;box-shadow:0 8px 24px rgba(0,0,0,.35)}
.vid .play .ic{width:26px;height:26px;margin-left:3px}
.plan{position:relative;background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-lg);padding:22px;display:flex;flex-direction:column;gap:10px;transition:transform .2s,box-shadow .2s,border-color .2s;cursor:pointer}
.plan:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.plan.on{border-color:var(--primary);box-shadow:0 0 0 4px rgba(var(--primary-rgb),.14),var(--shadow-lg)}
.plan.hl::before{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(180deg,rgba(var(--primary-rgb),.08),transparent 40%);pointer-events:none}
.plan .badge{position:absolute;top:-12px;left:50%;transform:translateX(-50%);background:var(--accent);color:var(--on-accent);font-weight:800;font-size:.72rem;padding:4px 14px;border-radius:99px;white-space:nowrap}
.plan .nm{font-weight:800;font-size:1.05rem}
.plan .pr{font-size:1.9rem;font-weight:800;line-height:1}
.plan .pr small{font-size:.9rem;font-weight:600;color:var(--muted)}
.plan .off{display:inline-block;background:rgba(22,163,74,.13);color:#15803D;padding:2px 9px;border-radius:99px;font-size:.74rem;font-weight:800;width:fit-content}
.plan .cut{display:flex;gap:6px;flex-wrap:wrap;font-size:.76rem;font-weight:700;color:#15803D}
.plan .dur{color:var(--muted);font-size:.85rem}
.plan .tick{position:absolute;top:14px;right:14px;width:24px;height:24px;border-radius:50%;background:var(--primary);color:#fff;display:none;place-items:center}
.plan.on .tick{display:grid}
.plan .tick .ic{width:15px;height:15px}
.subbar{display:flex;gap:14px;align-items:center;flex-wrap:wrap;justify-content:space-between;background:linear-gradient(135deg,rgba(22,163,74,.12),rgba(22,163,74,.04));border:1px solid rgba(22,163,74,.3);border-radius:var(--radius);padding:14px 18px;margin-bottom:18px}
.subbar b{color:#15803D}
.checkout{position:sticky;bottom:12px;z-index:5;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);padding:14px 18px;display:flex;gap:14px;flex-wrap:wrap;align-items:center;justify-content:space-between;margin-top:22px}
@media(max-width:1000px){.checkout{bottom:78px}}
.couponrow{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.couponrow .inp{flex:1 1 160px;text-transform:uppercase}
.coupon-ok{display:flex;gap:8px;align-items:center;color:#15803D;font-weight:700;font-size:.88rem;flex-wrap:wrap}

/* ---------- course detail ---------- */
.cd{display:grid;grid-template-columns:minmax(0,1fr) 360px;grid-template-areas:"a b" "c b";grid-template-rows:auto 1fr;gap:0 26px;align-items:start}
.cd>.a{grid-area:a;min-width:0}.cd>.b{grid-area:b;min-width:0}.cd>.c{grid-area:c;min-width:0}
@media(max-width:1000px){.cd{grid-template-columns:1fr;grid-template-areas:"a" "b" "c";grid-template-rows:auto}.cd>.b{margin-top:16px}}
.cd-hero{border-radius:var(--radius-lg);overflow:hidden;background:#000;position:relative;aspect-ratio:16/9;box-shadow:var(--shadow-lg)}
.cd-hero img,.cd-hero iframe{width:100%;height:100%;object-fit:fill;border:0;display:block}
.cd-hero .ph{height:100%;background:linear-gradient(135deg,var(--hero-from),var(--hero-to));color:var(--hero-text)}
.cd-hero .playbtn{position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.25);border:0;color:#fff;width:100%}
.cd-hero .playbtn span{width:70px;height:70px;border-radius:50%;background:rgba(255,255,255,.95);color:var(--primary);display:grid;place-items:center;box-shadow:0 10px 30px rgba(0,0,0,.4)}
.cd-hero .playbtn .ic{width:30px;height:30px;margin-left:4px}
.buybox{position:sticky;top:82px}
@media(max-width:1000px){.buybox{position:static}}
.buybox .big{font-size:2.2rem;font-weight:800;line-height:1.1}
.facts{list-style:none;margin:14px 0;padding:0;display:grid;gap:9px}
.facts li{display:flex;gap:10px;align-items:center;font-size:.92rem}
.facts .ic{color:var(--primary)}
.rich{overflow-wrap:anywhere}
.rich img{border-radius:12px;margin:10px 0;height:auto}
.rich ul,.rich ol{padding-left:22px}
.rich table{border-collapse:collapse;max-width:100%;display:block;overflow:auto}
.rich td,.rich th{border:1px solid var(--border);padding:6px 10px}
.rich iframe{width:100%;aspect-ratio:16/9;border:0;border-radius:12px}
.curr{display:flex;flex-direction:column;gap:8px}
.curr details{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);overflow:hidden}
.curr summary{padding:13px 16px;font-weight:800;cursor:pointer;display:flex;gap:10px;align-items:center;list-style:none}
.curr summary::-webkit-details-marker{display:none}
.curr summary .n{margin-left:auto;font-weight:600;color:var(--muted);font-size:.8rem}
.curr summary .ic.ch{transition:transform .2s}
.curr details[open] summary .ic.ch{transform:rotate(90deg)}
.lsn{display:flex;gap:12px;align-items:center;padding:11px 16px;border-top:1px solid var(--border);color:var(--text);text-decoration:none!important;width:100%;background:none;border-left:0;border-right:0;border-bottom:0;text-align:left;font-size:.92rem}
.lsn:hover{background:var(--soft)}
.lsn .dot{width:30px;height:30px;border-radius:50%;background:var(--primary-l);color:var(--primary);display:grid;place-items:center;flex:none}
.lsn .dot .ic{width:15px;height:15px}
.lsn.done .dot{background:#16A34A;color:#fff}
.lsn.lock{opacity:.6}
.lsn.lock .dot{background:var(--soft);color:var(--muted)}
.lsn.on{background:var(--primary-l)}
.lsn.on .dot{background:var(--primary);color:var(--on-primary)}
.lsn .t{flex:1;min-width:0}
.lsn .t b{display:block;font-weight:600;overflow:hidden;text-overflow:ellipsis}
.lsn .t small{color:var(--muted)}
.sect-h{padding:8px 16px;font-size:.76rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:800;background:var(--soft);border-top:1px solid var(--border)}

/* ---------- watch (player) ---------- */
.watch{display:grid;grid-template-columns:minmax(0,1fr) 380px;gap:22px;align-items:start}
@media(max-width:1100px){.watch{grid-template-columns:1fr}}
.pl{background:#000;border-radius:var(--radius-lg);overflow:hidden;position:relative;box-shadow:var(--shadow-lg)}
.pl-box{position:relative;aspect-ratio:16/9;background:#000;width:100%}
.pl-box video,.pl-box iframe,.pl-box #cw-yt{position:absolute;inset:0;width:100%;height:100%;border:0;background:#000;object-fit:contain}
.pl-msg{position:absolute;inset:0;display:grid;place-items:center;text-align:center;color:#fff;padding:20px;background:rgba(0,0,0,.6);z-index:3}
.pl-msg .cw-spin{margin:0 auto 10px;border-color:rgba(255,255,255,.25);border-top-color:#fff}
.pl-bar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 12px;background:#0B1020;color:#E2E8F0}
.pl-bar .seg{display:inline-flex;background:rgba(255,255,255,.08);border-radius:99px;padding:3px}
.pl-bar .seg button{border:0;background:none;color:#CBD5E1;padding:6px 14px;border-radius:99px;font-weight:700;font-size:.82rem}
.pl-bar .seg button.on{background:var(--primary);color:var(--on-primary)}
.pl-bar select{background:rgba(255,255,255,.08);color:#E2E8F0;border:1px solid rgba(255,255,255,.16);border-radius:99px;padding:6px 10px;font-size:.82rem;font-weight:600}
.pl-bar select option{color:#0F172A}
.pl-bar .sk{border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);color:#E2E8F0;border-radius:99px;padding:6px 12px;font-size:.8rem;font-weight:700;display:inline-flex;gap:5px;align-items:center}
.pl-bar .sk:hover{background:rgba(255,255,255,.14)}
.pl-bar .sp{flex:1}
.watch-info{margin-top:14px}
.watch-info h1{font-size:1.25rem}
.watch-nav{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.wlist{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;max-height:calc(100vh - 110px);display:flex;flex-direction:column;position:sticky;top:78px}
.wlist-h{padding:14px 16px;border-bottom:1px solid var(--border)}
.wlist-h h3{margin:0 0 6px;font-size:.98rem}
.wlist-b{overflow:auto;flex:1;-webkit-overflow-scrolling:touch}
.wlist details{border-bottom:1px solid var(--border)}
.wlist summary{padding:11px 16px;font-weight:800;font-size:.9rem;cursor:pointer;background:var(--soft);list-style:none;display:flex;gap:8px;align-items:center}
.wlist summary::-webkit-details-marker{display:none}
.wlist summary .n{margin-left:auto;color:var(--muted);font-weight:600;font-size:.78rem}
.pdfs{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px}
@media(max-width:1100px){
	.wlist{position:static;max-height:none}
	.pl.stick{position:sticky;top:58px;z-index:20;border-radius:0 0 var(--radius) var(--radius);margin:-18px -14px 0}
	.pl.stick+.watch-info{margin-top:14px}
}

/* ---------- lists / rows ---------- */
.rows{display:flex;flex-direction:column;gap:10px}
.row{display:flex;gap:14px;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px;color:var(--text)!important;text-decoration:none!important;transition:box-shadow .2s,border-color .2s}
a.row:hover,button.row:hover{box-shadow:var(--shadow);border-color:rgba(var(--primary-rgb),.3)}
button.row{width:100%;text-align:left;cursor:pointer}
.row .ico{width:44px;height:44px;border-radius:13px;background:var(--primary-l);color:var(--primary);display:grid;place-items:center;flex:none}
.row .ico .ic{width:22px;height:22px}
.row .ico.lock{background:var(--soft);color:var(--muted)}
.row .txt{flex:1;min-width:0}
.row .txt b{display:block;overflow:hidden;text-overflow:ellipsis}
.row .txt small{color:var(--muted)}
.row .end{color:var(--muted)}
.row.lockd{opacity:.85}

/* my learning card */
.mc{display:flex;gap:14px;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px;box-shadow:var(--shadow);color:var(--text)!important;text-decoration:none!important;transition:transform .2s,box-shadow .2s}
.mc:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}
.mc .thumb{width:156px;aspect-ratio:16/9;border-radius:12px;object-fit:fill;flex:none;align-self:flex-start}
.mc .thumb.ph{display:grid;place-items:center}
.mc .b{flex:1;min-width:0;display:flex;flex-direction:column;gap:6px}
.mc h3{margin:0;font-size:.98rem;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.mc small{color:var(--muted)}
@media(max-width:480px){.mc .thumb{width:112px}}

/* ---------- live ---------- */
.live-dot{display:inline-flex;align-items:center;gap:6px;color:#DC2626;font-weight:800;font-size:.78rem}
.live-dot::before{content:"";width:9px;height:9px;border-radius:50%;background:#DC2626;animation:pulse 1.2s infinite}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(220,38,38,.6)}70%{box-shadow:0 0 0 9px rgba(220,38,38,0)}100%{box-shadow:0 0 0 0 rgba(220,38,38,0)}}

/* ---------- ebook reader ---------- */
.ebd{display:grid;grid-template-columns:260px minmax(0,1fr);gap:26px;align-items:start}
@media(max-width:800px){.ebd{grid-template-columns:1fr}.ebd .book{max-width:220px;margin:0 auto}}
.reader{position:fixed;inset:0;z-index:80;background:#1E293B;display:flex;flex-direction:column}
.reader-h{display:flex;gap:10px;align-items:center;padding:8px 12px;background:#0F172A;color:#fff}
.reader-h b{flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.reader iframe{flex:1;width:100%;border:0;background:#fff}
.reader .btn.ghost{background:rgba(255,255,255,.1);color:#fff;border-color:rgba(255,255,255,.2)}

/* ---------- auth pages ---------- */
.auth-wrap{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr)}
.auth-art{background:linear-gradient(140deg,var(--hero-from),var(--hero-to));color:var(--hero-text);padding:48px;display:flex;flex-direction:column;justify-content:center;gap:22px;position:relative;overflow:hidden}
.auth-art::before,.auth-art::after{content:"";position:absolute;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.18),transparent 65%)}
.auth-art::before{width:420px;height:420px;right:-120px;top:-120px}
.auth-art::after{width:320px;height:320px;left:-100px;bottom:-100px}
.auth-art h2{font-size:2rem;color:inherit;position:relative}
.auth-art p{opacity:.85;max-width:420px;position:relative}
.auth-art ul{list-style:none;padding:0;margin:0;display:grid;gap:12px;position:relative}
.auth-art li{display:flex;gap:12px;align-items:center;font-weight:600}
.auth-art li .ic{width:32px;height:32px;padding:7px;background:rgba(255,255,255,.16);border-radius:10px}
.auth-art .cw-brand{color:inherit!important;padding:0;position:relative}
.auth-form{display:flex;align-items:center;justify-content:center;padding:36px 22px}
.auth-card{width:100%;max-width:440px}
.auth-card h1{font-size:1.6rem}
.auth-card .alt{margin-top:18px;text-align:center;color:var(--muted)}
.acct{display:flex;gap:12px;align-items:center;width:100%;padding:13px;border:1.5px solid var(--border);border-radius:var(--radius);background:var(--surface);text-align:left;margin-bottom:10px}
.acct:hover{border-color:var(--primary);background:var(--primary-l)}
.acct .cw-avatar{flex:none}
@media(max-width:860px){
	.auth-wrap{grid-template-columns:1fr}
	.auth-art{padding:26px 22px;gap:10px}
	.auth-art h2{font-size:1.35rem}
	.auth-art ul,.auth-art p{display:none}
}

/* ---------- profile ---------- */
.prof{display:grid;grid-template-columns:300px minmax(0,1fr);gap:22px;align-items:start}
@media(max-width:900px){.prof{grid-template-columns:1fr}}
.prof-card{text-align:center}
.prof-card .cw-avatar{width:84px;height:84px;font-size:2rem;margin:0 auto 12px}
.set-list{display:flex;flex-direction:column}
.set-list .row{border-radius:0;border-width:0 0 1px;box-shadow:none;background:none}
.set-list .row:last-child{border-bottom:0}

/* ---------- banners ---------- */
.cw-car{position:relative;border-radius:var(--radius-lg);overflow:hidden;box-shadow:var(--shadow);background:var(--soft);margin-bottom:20px;touch-action:pan-y}
.cw-car-track{display:flex;transition:transform .5s cubic-bezier(.4,0,.2,1)}
.cw-car-slide{flex:0 0 100%;display:block;position:relative}
.cw-car-slide img{width:100%;height:100%;object-fit:cover;display:block}
.cw-car-dots{position:absolute;left:0;right:0;bottom:10px;display:flex;justify-content:center;gap:6px}
.cw-car-dots button{width:8px;height:8px;border-radius:50%;border:0;background:rgba(255,255,255,.55);padding:0;transition:all .2s}
.cw-car-dots button.on{background:#fff;width:22px;border-radius:99px}
.cw-car-nav{position:absolute;top:50%;transform:translateY(-50%);width:38px;height:38px;border-radius:50%;background:rgba(0,0,0,.4);border:0;color:#fff;display:grid;place-items:center}
.cw-car-nav.l{left:10px}.cw-car-nav.r{right:10px}
@media(max-width:700px){.cw-car-nav{display:none}}
.cw-cd{border-radius:14px;position:relative;margin:0 0 20px;overflow:hidden;color:#fff;box-shadow:var(--shadow)}
.cw-cd .bgimg{position:absolute;inset:0;width:100%;height:100%}
.cw-cd .in{position:relative;padding:12px 16px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.cw-cd.st-title_top .in,.cw-cd.st-stacked .in,.cw-cd.st-vertical .in{flex-direction:column;align-items:stretch}
.cw-cd .txt{flex:1 1 220px;min-width:0}
.cw-cd .tt{font-weight:800}
.cw-cd .ms{opacity:.95}
.cw-cd .chips{display:flex;gap:4px;align-items:center}
.cw-cd .chip{background:#fff;color:#000;border-radius:5px;padding:4px 9px;text-align:center;min-width:44px}
.cw-cd .chip b{display:block;font-size:14px;line-height:1.1}
.cw-cd .chip i{display:block;font-style:normal;font-size:10px}
.cw-cd .cta{border:0;border-radius:20px;padding:8px 18px;font-weight:700;cursor:pointer}
.cw-cd .x{position:absolute;top:4px;right:6px;background:none;border:0;color:#fff;padding:4px;opacity:.85;z-index:2}
.cw-pop-img{position:relative;width:min(90vw,460px);max-width:min(92vw,460px);margin:auto}
.cw-pop-img>img{width:100%;height:auto;display:block;border-radius:16px;box-shadow:0 20px 60px rgba(0,0,0,.5)}
.cw-pop-btns{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.cw-pop-btns.over{position:absolute;left:12px;right:12px;bottom:18px}
.cw-pop-btns.below{margin-top:14px}
.cw-pop-btns.stack{flex-direction:column;align-items:center}
.cw-pop-btns button{border:0;cursor:pointer;display:inline-flex;gap:6px;align-items:center;justify-content:center;padding:10px 18px;animation:pulseb 1.8s ease-in-out infinite}
@keyframes pulseb{50%{transform:scale(1.05)}}
.cw-pop-x{position:absolute;top:10px;right:10px;width:28px;height:28px;border-radius:50%;background:rgba(0,0,0,.45);border:0;color:#fff;display:grid;place-items:center;z-index:2}
.cw-modal.popup{align-items:center}
.cw-modal.popup .cw-modal-box{background:none;box-shadow:none;max-width:none;width:auto;overflow:visible;border:0}
.cw-modal.popup .cw-modal-body{padding:0;overflow:visible}
.cw-modal.popup.pop-classic .cw-modal-box{background:none}
.pop-card{border-radius:14px;overflow:hidden;margin:auto;box-shadow:0 20px 60px rgba(0,0,0,.4);position:relative}
.pop-card .pb{padding:14px;display:flex;flex-direction:column;gap:8px;align-items:center;text-align:center}
.pop-card img,.pop-card iframe{width:100%;border:0;display:block}
.pop-chips{display:flex;gap:6px;justify-content:center}
.pop-chips div{color:#fff;border-radius:9px;padding:5px 9px;min-width:46px}
.pop-chips b{display:block;font-size:14px}
.pop-chips small{font-size:8px}
.subban{border-radius:26px;padding:20px;color:#fff;margin:auto;max-width:440px;width:100%;box-shadow:0 30px 80px rgba(0,0,0,.5)}
.subban .glass{background:rgba(255,255,255,.18);border-radius:22px;padding:16px}
.subban .gold{border-radius:16px;padding:10px 14px;text-align:center;margin-bottom:14px}
.subban ul{list-style:none;padding:0;margin:12px 0;display:grid;gap:8px}
.subban li{display:flex;gap:8px;align-items:center}
.subban li i{width:18px;height:18px;border-radius:50%;background:#00ffcc;color:#000;display:grid;place-items:center;font-style:normal;font-weight:800;font-size:12px;flex:none}
.subban .pl2{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px;border-radius:14px;margin-bottom:9px;cursor:pointer;border:3px solid transparent}
.subban .pl2.on{border-color:#ffd700}
.subban .go{width:100%;border:0;border-radius:14px;padding:14px;margin-top:8px;font-weight:800;cursor:pointer}

/* ---------- practice ---------- */
.pgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:14px}
.ptile{display:flex;flex-direction:column;gap:10px;padding:18px;border-radius:var(--radius-lg);background:var(--surface);border:1px solid var(--border);box-shadow:var(--shadow);color:var(--text)!important;text-decoration:none!important;transition:transform .2s,box-shadow .2s;position:relative;overflow:hidden}
.ptile:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.ptile .ic-w{width:50px;height:50px;border-radius:15px;display:grid;place-items:center;color:#fff}
.ptile .ic-w .ic{width:26px;height:26px}
.ptile h3{margin:0}
.ptile p{margin:0;color:var(--muted);font-size:.86rem}
.ptile .lk{position:absolute;top:14px;right:14px;color:var(--muted)}
.qbox{max-width:760px;margin:0 auto}
.qhead{display:flex;gap:12px;align-items:center;justify-content:space-between;margin-bottom:14px;flex-wrap:wrap}
.hearts{display:flex;gap:4px;color:#EF4444}
.hearts .ic{width:22px;height:22px;fill:currentColor}
.hearts .lost{color:var(--border);fill:currentColor}
.qcard{padding:22px}
.qtext{font-size:1.2rem;font-weight:700;margin-bottom:16px}
.opts{display:grid;gap:10px}
.opt{display:flex;gap:12px;align-items:center;text-align:left;width:100%;padding:13px 16px;border:2px solid var(--border);border-radius:var(--radius);background:var(--surface);font-weight:600;transition:border-color .15s,background .15s,transform .1s}
.opt:hover:not([disabled]){border-color:var(--primary);background:var(--primary-l)}
.opt .k{width:30px;height:30px;border-radius:50%;background:var(--soft);display:grid;place-items:center;font-weight:800;font-size:.85rem;flex:none}
.opt.right{border-color:#16A34A;background:rgba(22,163,74,.12)}
.opt.right .k{background:#16A34A;color:#fff}
.opt.wrong{border-color:#DC2626;background:rgba(220,38,38,.1)}
.opt.wrong .k{background:#DC2626;color:#fff}
.opt[disabled]{cursor:default}
.explain{margin-top:14px;padding:12px 14px;border-radius:var(--radius-sm);background:var(--soft);border-left:4px solid var(--primary)}
.result{text-align:center;padding:30px 20px}
.result .score{font-size:3.2rem;font-weight:800;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;line-height:1.1}
.sb-line{min-height:64px;padding:12px;border:2px dashed var(--border);border-radius:var(--radius);display:flex;gap:8px;flex-wrap:wrap;align-items:center;background:var(--soft)}
.sb-bank{display:flex;gap:8px;flex-wrap:wrap;margin-top:14px;min-height:46px}
.wchip{padding:8px 14px;border-radius:99px;background:var(--surface);border:1.5px solid var(--border);font-weight:700;box-shadow:var(--shadow);transition:transform .1s}
.wchip:hover{border-color:var(--primary);transform:translateY(-1px)}
.wchip.used{opacity:.25;pointer-events:none}
.letters{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:16px 0}
.lbox{width:46px;height:52px;border-radius:12px;border:2px solid var(--border);display:grid;place-items:center;font-size:1.3rem;font-weight:800;background:var(--surface);text-transform:uppercase}
.lbox.filled{border-color:var(--primary);background:var(--primary-l)}
.lkey{width:46px;height:46px;border-radius:12px;border:1.5px solid var(--border);background:var(--surface);font-weight:800;font-size:1.05rem;text-transform:uppercase;box-shadow:var(--shadow)}
.lkey:hover{background:var(--primary-l)}
.lkey.used{opacity:.25;pointer-events:none}
.bubble{max-width:82%;padding:10px 14px;border-radius:18px;margin:6px 0;position:relative}
.bubble.a{background:var(--soft);border:1px solid var(--border);border-bottom-left-radius:4px;margin-right:auto}
.bubble.b{background:var(--grad);color:var(--on-primary);border-bottom-right-radius:4px;margin-left:auto}
.bubble small{display:block;opacity:.75;margin-top:2px}
.bubble .spk{position:absolute;right:-6px;bottom:-6px}
.streak{display:flex;gap:6px}
.streak i{width:34px;height:34px;border-radius:50%;background:var(--soft);border:1px solid var(--border);display:grid;place-items:center;font-style:normal;font-size:.7rem;font-weight:800;color:var(--muted)}
.streak i.ok{background:#F59E0B;color:#fff;border-color:#F59E0B}
.big-flame{font-size:2.6rem}
.tr{display:grid;grid-template-columns:1fr 1fr;gap:14px}
@media(max-width:760px){.tr{grid-template-columns:1fr}}
.tr textarea{min-height:170px}
.langsw{display:flex;align-items:center;gap:10px;justify-content:center;margin-bottom:14px;flex-wrap:wrap}
.langsw b{padding:8px 16px;border-radius:99px;background:var(--primary-l);color:var(--primary)}

/* topic body */
.tframe{width:100%;border:0;background:var(--surface);border-radius:var(--radius);display:block}
.locked-card{text-align:center;padding:38px 22px}
.locked-card .ic{width:52px;height:52px;color:var(--accent);margin-bottom:8px}

/* ---------- modal / sheet ---------- */
.cw-modal{position:fixed;inset:0;z-index:100;background:rgba(2,6,23,.62);display:flex;align-items:center;justify-content:center;padding:18px;opacity:0;transition:opacity .2s;backdrop-filter:blur(3px)}
.cw-modal.in{opacity:1}
.cw-modal-box{background:var(--surface);color:var(--text);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);width:100%;max-width:480px;max-height:92vh;display:flex;flex-direction:column;transform:translateY(14px) scale(.98);transition:transform .22s;overflow:hidden}
.cw-modal.in .cw-modal-box{transform:none}
.cw-modal.wide .cw-modal-box{max-width:860px}
.cw-modal-head{display:flex;align-items:center;gap:10px;padding:14px 18px;border-bottom:1px solid var(--border)}
.cw-modal-head h3{margin:0;flex:1;font-size:1.05rem}
.cw-x{width:34px;height:34px;border-radius:50%;border:0;background:var(--soft);display:grid;place-items:center}
.cw-modal-body{padding:18px;overflow:auto;-webkit-overflow-scrolling:touch}
.cw-modal.sheet{align-items:flex-end;padding:0}
.cw-modal.sheet .cw-modal-box{max-width:560px;border-radius:22px 22px 0 0;transform:translateY(40px);max-height:90vh}
.cw-modal.sheet.in .cw-modal-box{transform:none}
@media(min-width:700px){.cw-modal.sheet{align-items:center;padding:18px}.cw-modal.sheet .cw-modal-box{border-radius:var(--radius-lg)}}
.cw-confirm-t{margin:0 0 16px}
#cw-toasts{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);z-index:200;display:flex;flex-direction:column;gap:8px;align-items:center;width:max-content;max-width:92vw;pointer-events:none}
@media(max-width:1000px){#cw-toasts{bottom:88px}}
.cw-toast{background:#0F172A;color:#fff;padding:11px 18px;border-radius:14px;box-shadow:0 12px 34px rgba(0,0,0,.35);font-weight:600;font-size:.9rem;opacity:0;transform:translateY(10px);transition:all .25s;max-width:92vw}
.cw-toast.in{opacity:1;transform:none}
.cw-toast.ok{background:#15803D}.cw-toast.error{background:#B91C1C}.cw-toast.warn{background:#B45309}

/* ---------- skeleton / empty ---------- */
.cw-skel .sk{background:linear-gradient(90deg,var(--soft) 25%,var(--border) 37%,var(--soft) 63%);background-size:400% 100%;animation:sk 1.3s ease infinite;border-radius:14px}
.sk-h{height:34px;width:40%;margin-bottom:20px}
.sk-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:18px}
.sk-c{height:230px}
@keyframes sk{0%{background-position:100% 50%}100%{background-position:0 50%}}
.cw-empty{text-align:center;padding:48px 20px;color:var(--muted);display:flex;flex-direction:column;align-items:center;gap:6px}
.cw-empty .ic.big{color:var(--primary);opacity:.55;margin-bottom:6px}
.cw-empty h3{color:var(--text);margin:0}
.cw-empty p{max-width:420px;margin:0 0 10px}
.cw-empty.err .ic.big{color:#DC2626}
.notice{padding:12px 16px;border-radius:var(--radius);background:rgba(245,158,11,.13);border:1px solid rgba(245,158,11,.4);color:var(--text);margin-bottom:16px;display:flex;gap:10px;align-items:flex-start}
.notice .ic{color:#D97706;margin-top:3px}
.notice.info{background:var(--primary-l);border-color:rgba(var(--primary-rgb),.3)}
.notice.info .ic{color:var(--primary)}
.maint{min-height:100vh;display:grid;place-items:center;padding:24px;text-align:center}
.maint .card{max-width:480px;padding:36px}

/* ---------- forms (additions) ---------- */
.fld>label{display:block;font-weight:700;font-size:.86rem;margin-bottom:6px}
.fld .muted{font-weight:500}
.fld-r{text-align:right;margin:-6px 0 14px;font-size:.88rem}
.hint{display:block;color:var(--muted);font-size:.78rem;margin-top:5px}
.pw .ic.on{color:var(--primary)}
.fmsg{display:none;padding:10px 14px;border-radius:var(--radius-sm);margin-bottom:14px;font-size:.9rem;font-weight:600;line-height:1.4}
.fmsg.show{display:block}
.fmsg.err{background:rgba(220,38,38,.09);color:#B91C1C;border:1px solid rgba(220,38,38,.25)}
.fmsg.ok{background:rgba(22,163,74,.1);color:#15803D;border:1px solid rgba(22,163,74,.25)}
.fmsg.info{background:var(--primary-l);color:var(--text);border:1px solid rgba(var(--primary-rgb),.28)}
[data-theme="dark"] .fmsg.err{color:#FCA5A5}[data-theme="dark"] .fmsg.ok{color:#86EFAC}
.lnk{background:none;border:0;padding:0;color:var(--primary);font-weight:700;cursor:pointer;text-decoration:underline dotted}
input[type=date].inp{min-height:46px}
select.inp{appearance:none;-webkit-appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 20px) 55%,calc(100% - 14px) 55%;background-size:6px 6px;background-repeat:no-repeat;padding-right:38px}

/* ---------- auth (additions) ---------- */
.auth-art .cw-brand{font-size:1.25rem}
.auth-card .alt a{font-weight:700}
.acct{cursor:pointer;color:var(--text)}
.acct .ic{color:var(--muted)}
.acct .grow b{font-weight:700}

/* ---------- profile / orders / coins ---------- */
.prof-l,.prof-r{min-width:0}
.prof-card h2{margin:0 0 2px}
.pf-stats{display:flex;justify-content:space-around;gap:8px;margin-top:16px;padding-top:14px;border-top:1px solid var(--border)}
.pf-stats b{display:block;font-size:1.3rem;line-height:1.2}
.pf-stats small{color:var(--muted)}
.set-list .row{border:0;border-radius:12px;box-shadow:none;background:none;padding:11px 10px}
.set-list a.row:hover,.set-list button.row:hover{background:var(--soft);box-shadow:none}
.row.danger .ico{background:rgba(220,38,38,.12);color:#DC2626}
.row.danger .txt b{color:#DC2626}
.row .cw-avatar{flex:none}
.tsw{display:inline-flex;background:var(--soft);border:1px solid var(--border);border-radius:99px;padding:4px;gap:4px;max-width:100%;flex-wrap:wrap}
.tsw button{border:0;background:none;padding:8px 16px;border-radius:99px;font-weight:700;color:var(--muted);display:inline-flex;gap:6px;align-items:center}
.tsw button.on{background:var(--surface);color:var(--primary);box-shadow:var(--shadow)}
.refund p{margin:0 0 8px}
.refund ul{margin:0 0 10px;padding-left:20px}
.refund .warn-t{color:#DC2626;font-weight:800}
.ord-list{display:flex;flex-direction:column;gap:12px}
.ord{display:flex;gap:14px;align-items:flex-start}
.ord-i{width:44px;height:44px;border-radius:13px;background:var(--primary-l);color:var(--primary);display:grid;place-items:center;flex:none}
.ord-b{flex:1;min-width:0}
.ord-t{display:flex;gap:8px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.ord-t b{overflow-wrap:anywhere}
.ord-ids{margin-top:4px;overflow-wrap:anywhere}
.ord-a{font-weight:800;font-size:1.1rem;white-space:nowrap}
@media(max-width:560px){.ord{flex-wrap:wrap}.ord-a{margin-left:58px}}
.coins-grid{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:20px;align-items:start}
@media(max-width:900px){.coins-grid{grid-template-columns:1fr}}
.coins-hero{border-radius:var(--radius-lg);padding:26px;background:linear-gradient(135deg,var(--hero-from),var(--hero-to));color:var(--hero-text);box-shadow:var(--shadow-lg);position:relative;overflow:hidden}
.coins-hero::after{content:"";position:absolute;right:-60px;top:-80px;width:240px;height:240px;border-radius:50%;background:radial-gradient(circle,rgba(255,255,255,.22),transparent 65%)}
.coins-hero>*{position:relative;z-index:1}
.ch-l{font-size:.75rem;letter-spacing:.16em;opacity:.85;font-weight:700}
.ch-n{font-size:3rem;font-weight:800;display:flex;gap:10px;align-items:center;line-height:1.15;margin:6px 0}
.ch-n .ic{width:2.4rem;height:2.4rem;color:#FCD34D}
.ch-s{opacity:.92;font-weight:600;margin-bottom:12px}
.coins-hero .bar{background:rgba(255,255,255,.22);border-color:transparent}
.coins-hero .bar i{background:#fff}
.ch-b{background:#fff;color:var(--primary)!important;margin-top:16px}
.ch-b[disabled]{opacity:.7}
.how{list-style:none;padding:0;margin:0;display:grid;gap:10px}
.how li{display:flex;gap:10px;align-items:flex-start}
.how .ic{color:#16A34A;margin-top:3px}
.refcode{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:12px 14px;border:2px dashed rgba(var(--primary-rgb),.5);border-radius:var(--radius);background:var(--primary-l)}
.refcode b{font-size:1.35rem;letter-spacing:.14em;overflow-wrap:anywhere}
.ref-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:16px;text-align:center}
.ref-stats b{display:block;font-size:1.3rem}
.ref-stats small{color:var(--muted)}

/* ---------- practice (additions) ---------- */
.chips{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:16px}
.chip{padding:8px 16px;border-radius:99px;border:1.5px solid var(--border);background:var(--surface);font-weight:700;color:var(--muted)}
.chip.on{background:var(--primary);color:var(--on-primary);border-color:var(--primary)}
.cw-iconbtn.sm{width:auto;height:34px;border-radius:99px;padding:0 12px;gap:5px}
.cw-iconbtn small{font-size:.66rem;font-weight:800}
.ring{--p:0;--c:#16A34A;width:150px;height:150px;border-radius:50%;margin:18px auto;display:grid;place-items:center;background:conic-gradient(var(--c) calc(var(--p)*1%),var(--soft) 0)}
.ring>div{width:118px;height:118px;border-radius:50%;background:var(--surface);display:grid;place-content:center;text-align:center;line-height:1.2}
.ring b{font-size:1.5rem}
.ring small{color:var(--muted);font-size:.75rem}
.ring.big{width:172px;height:172px}
.ring.big>div{width:138px;height:138px}
.ring.big b{font-size:2rem}
.rchips{display:flex;gap:10px;justify-content:center;flex-wrap:wrap}
.rchips span{--a:#16A34A;display:flex;flex-direction:column;align-items:center;padding:10px 16px;border-radius:14px;background:color-mix(in srgb,var(--a) 10%,var(--surface));border:1px solid color-mix(in srgb,var(--a) 28%,transparent);min-width:92px}
.rchips small{color:var(--muted);font-size:.72rem}
.rchips b{color:var(--a);font-size:1.15rem}
.dl{text-align:center;padding:26px 20px}
.flame{width:112px;height:112px;border-radius:50%;margin:0 auto;display:grid;place-content:center;background:linear-gradient(135deg,#FF2D55,#FF8FA3);color:#fff;text-align:center;box-shadow:0 18px 34px -16px rgba(255,45,85,.8)}
.flame .ic{width:34px;height:34px;margin:0 auto}
.flame b{font-size:1.6rem;display:block;line-height:1.1}
.dl-l{margin:20px 0;padding:16px;border:1px solid var(--border);border-radius:var(--radius);background:var(--soft);text-align:left}
.dtypes{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.dtype{padding:9px 12px;border-radius:12px;font-size:.78rem;font-weight:700;color:var(--c);background:color-mix(in srgb,var(--c) 10%,transparent);border:1px solid color-mix(in srgb,var(--c) 28%,transparent);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.wk{display:flex;justify-content:space-between;margin-top:12px;gap:4px}
.wk div{text-align:center}
.wk small{display:block;font-size:.65rem;color:var(--muted);margin-bottom:3px}
.wk span{width:30px;height:30px;border-radius:50%;background:var(--soft);border:1px solid var(--border);display:grid;place-items:center;font-size:.68rem;font-weight:700;color:var(--muted)}
.wk span.on{background:#22C55E;color:#fff;border-color:#22C55E}
.cv-list{display:flex;flex-direction:column;gap:14px;margin:14px 0 24px}
.cv-line{display:flex;gap:10px;align-items:flex-end;max-width:94%}
.cv-line.r{flex-direction:row-reverse;margin-left:auto}
.cv-sp{width:34px;height:34px;border-radius:50%;background:var(--primary-l);color:var(--primary);font-weight:800;display:grid;place-items:center;flex:none;font-size:.78rem}
.cv-bub{background:var(--surface);border:1px solid var(--border);border-radius:18px 18px 18px 4px;padding:12px 14px;box-shadow:var(--shadow);min-width:0;transition:box-shadow .2s}
.cv-line.r .cv-bub{background:var(--grad);color:var(--on-primary);border-radius:18px 18px 4px 18px;border-color:transparent}
.cv-line.r .cw-iconbtn{background:rgba(255,255,255,.2);border-color:rgba(255,255,255,.3);color:inherit}
.cv-en{font-weight:700;font-size:1.02rem;overflow-wrap:anywhere}
.cv-hi{opacity:.88;margin-top:2px;overflow-wrap:anywhere}
.cv-tools{display:flex;gap:6px;margin-top:8px;flex-wrap:wrap}
.cv-line.on .cv-bub{box-shadow:0 0 0 3px rgba(var(--primary-rgb),.45),var(--shadow)}
.cv-bar{position:sticky;bottom:14px;display:flex;gap:10px;justify-content:center;background:var(--surface);padding:10px;border-radius:99px;border:1px solid var(--border);box-shadow:var(--shadow-lg);z-index:5}
@media(max-width:1000px){.cv-bar{bottom:80px}}
@media(max-width:420px){.cv-bar .btn{padding:10px 12px}.cv-bar .btn span{font-size:.8rem}}
.tr-bar{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:center}
.conv-card .body .foot{margin-top:10px}

/* ---------- misc shared ---------- */
.link-btn .ic{width:1em;height:1em}
.sec[hidden]{display:none}


/* ---------- subscription page ---------- */
.sub-hero{text-align:center;padding:26px 20px 6px}
.sub-hero .crown{width:68px;height:68px;border-radius:50%;margin:0 auto 12px;display:grid;place-items:center;background:linear-gradient(135deg,#FBBF24,#F59E0B);color:#fff;box-shadow:0 16px 30px -14px rgba(245,158,11,.9)}
.sub-hero .crown .ic{width:34px;height:34px}
.sub-hero h1{margin:0 0 6px}
.sub-hero p{color:var(--muted);max-width:540px;margin:0 auto}
.benefits{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:12px;margin-top:20px;padding:0;list-style:none}
.benefit{display:flex;gap:12px;align-items:center;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px;font-weight:500;box-shadow:var(--shadow)}
.benefit b{font-weight:800}
.bi{width:40px;height:40px;border-radius:12px;display:grid;place-items:center;color:#fff;flex:none}
.bi .ic{width:20px;height:20px}
.coins-card{margin-top:18px;border-radius:var(--radius-lg);padding:18px 20px;color:#fff;background:linear-gradient(135deg,#7C3AED,#EC4899);box-shadow:var(--shadow-lg)}
.coins-card .btn.ghost{background:rgba(255,255,255,.2);color:#fff;border-color:rgba(255,255,255,.4)}
.cico{width:46px;height:46px;border-radius:50%;background:rgba(255,255,255,.2);display:grid;place-items:center;flex:none}
.cico .ic{width:24px;height:24px;color:#FCD34D}
.plans-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:22px;align-items:stretch;padding-top:12px}
.plans-grid:has(.pcard:only-child){grid-template-columns:minmax(260px,420px);justify-content:center}
.pcard{position:relative;background:var(--surface);border:2px solid var(--border);border-radius:var(--radius-lg);padding:28px 22px 22px;display:flex;flex-direction:column;gap:10px;box-shadow:var(--shadow);transition:transform .2s,box-shadow .2s}
.pcard:hover{transform:translateY(-3px);box-shadow:var(--shadow-lg)}
.pcard.hl{border-color:var(--primary);box-shadow:0 0 0 4px rgba(var(--primary-rgb),.12),var(--shadow-lg)}
.pcard.flash{animation:cwflash 1.2s ease 2}
@keyframes cwflash{50%{box-shadow:0 0 0 8px rgba(var(--primary-rgb),.35)}}
.ribbon-t{position:absolute;top:-13px;left:50%;transform:translateX(-50%);background:linear-gradient(90deg,#F59E0B,#EF4444);color:#fff;font-size:.7rem;font-weight:800;letter-spacing:.06em;padding:5px 14px;border-radius:99px;white-space:nowrap}
.ribbon-t.alt{background:var(--accent);color:var(--on-accent)}
.pcard h3{font-size:1.2rem;margin:4px 0 0}
.pcard .dur{color:var(--muted);font-size:.86rem;display:flex;gap:6px;align-items:center;flex-wrap:wrap}
.pcard .price{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap;margin-top:6px}
.pcard .price .now{font-size:2.1rem;font-weight:800;line-height:1}
.pcard .price s{color:var(--muted)}
.pcard .price .pct{background:rgba(22,163,74,.13);color:#15803D;padding:2px 9px;border-radius:99px;font-size:.74rem;font-weight:800}
.adj{color:#15803D;font-weight:700;font-size:.82rem}
.chipbtn{align-self:flex-start;border:1.5px dashed var(--primary);background:var(--primary-l);color:var(--primary);padding:7px 12px;border-radius:99px;font-weight:600;font-size:.82rem;display:inline-flex;gap:6px;align-items:center}
.pcard .btn{margin-top:auto}
.coupon-card{margin-top:22px}

/* ---------- PDF viewer ---------- */
.cw-modal.pdfv{padding:0;background:#0B1020;align-items:stretch}
.cw-modal.pdfv .cw-modal-box{max-width:none;width:100%;height:100%;max-height:none;border-radius:0;background:#0B1020;transform:none}
.cw-modal.pdfv .cw-modal-body{padding:0;flex:1;min-height:0;display:flex;overflow:hidden}
.pdf-shell{display:flex;flex-direction:column;width:100%;height:100%;min-height:0}
.pdf-top{display:flex;align-items:center;gap:8px;padding:8px 12px;padding-top:calc(8px + env(safe-area-inset-top));background:#0B1020;color:#fff;border-bottom:1px solid rgba(255,255,255,.1)}
.pdf-top .cw-iconbtn{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18);color:#fff}
.pdf-title{flex:1;min-width:0;font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pdf-pgno{font-size:.82rem;opacity:.8;white-space:nowrap}
.pdf-body{flex:1;min-height:0;overflow:auto;background:#1E293B;-webkit-overflow-scrolling:touch;padding:12px 0 28px}
.pdf-pages{display:flex;flex-direction:column;align-items:center;gap:12px;width:max-content;min-width:100%}
.pdf-pg{background:#fff;box-shadow:0 6px 20px rgba(0,0,0,.45);flex:none}
.pdf-pg canvas{display:block}
.pdf-load{display:flex;flex-direction:column;align-items:center;gap:10px;color:#CBD5E1;padding:70px 22px;text-align:center}
.pdf-load.err .ic{width:40px;height:40px;color:#F87171}
.pdf-load.err b{color:#fff}
.pdf-load .cw-spin{border-color:rgba(255,255,255,.2);border-top-color:#fff}

@media print{.cw-side,.cw-top,.cw-bottom,.cw-foot{display:none!important}}
@media(prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}

/* ---------- small helpers ---------- */
.cw-slot:empty{display:none}
.cw-slot{margin:0 0 18px}
.watch-main{min-width:0}
@media(max-width:560px){
	.benefits{grid-template-columns:1fr 1fr;gap:10px}
	.benefit{flex-direction:column;text-align:center;padding:14px 8px;font-size:.82rem;gap:8px}
	.plans-grid{gap:26px}
}
@media(max-width:1000px){.cw-shell.player-on .crumbs{display:none}}

/* ---------- 10-digit phone + 3-box date of birth + inline field errors ---------- */
.inp-phone{letter-spacing:.06em;font-variant-numeric:tabular-nums}
.dob{display:grid;grid-template-columns:1fr 1fr 1.7fr;gap:10px}
.dob .inp{text-align:center;padding-left:8px;padding-right:8px;letter-spacing:.06em;font-variant-numeric:tabular-nums}
.dob .inp::placeholder{letter-spacing:.04em;font-weight:600}
.fld.bad .inp{border-color:#DC2626;box-shadow:0 0 0 4px rgba(220,38,38,.12)}
.ferr{display:block;color:#B91C1C;font-size:.82rem;font-weight:600;margin-top:6px;line-height:1.35}
.ferr:empty{display:none}
[data-theme="dark"] .ferr{color:#FCA5A5}

/* ---------- banners: tall banners scroll on phones (never cut off); on desktop the button sits BESIDE the picture ---------- */
.cw-modal.popup:not(.sheet){align-items:flex-start;overflow-y:auto;-webkit-overflow-scrolling:touch}
.cw-modal.popup:not(.sheet) .cw-modal-box{margin:auto;max-height:none}
.cw-modal.popup.sheet{overflow-y:auto}
.pop-card .pc-side{display:flex;flex-direction:column;gap:10px}
.subban .sb-cols{display:block}
@media(min-width:900px){
	/* discount popup: image on the left, buttons in a column on the right */
	.pop-discount .cw-pop-img{display:flex;align-items:center;gap:24px;width:auto;max-width:min(94vw,900px)}
	.pop-discount .cw-pop-img>img{width:auto;height:auto;max-width:min(62vw,560px);max-height:88vh;flex:0 1 auto;min-width:0}
	.pop-discount .cw-pop-btns,.pop-discount .cw-pop-btns.over,.pop-discount .cw-pop-btns.below,.pop-discount .cw-pop-btns.stack{position:static;left:auto;right:auto;bottom:auto;flex:0 0 240px;flex-direction:column;align-items:stretch;justify-content:center;margin:0}
	.pop-discount .cw-pop-btns button{max-width:100%}
	.pop-discount .cw-pop-x{top:-14px;right:-14px;background:#fff!important;color:#111!important;box-shadow:0 4px 14px rgba(0,0,0,.35)}
	/* popup banner (classic + floating card) with a picture: picture left, text + button right */
	.pop-card.has-media{width:min(94vw,880px)!important}
	.pc-classic.has-media .pc-main{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(240px,1fr);column-gap:22px;align-items:center}
	.pc-classic.has-media .pc-body{display:contents!important}
	.pc-classic.has-media .pc-media{grid-column:1;grid-row:1 / span 2;background:#F8FAFB;border-radius:10px;padding:4px;margin:4px 0}
	.pc-classic.has-media .pc-media img{width:auto!important;height:auto!important;max-width:100%;max-height:74vh;margin:0 auto}
	.pc-classic.has-media .pc-text{grid-column:2;grid-row:1;align-self:end;padding-bottom:12px}
	.pc-classic.has-media .pc-act{grid-column:2;grid-row:2;align-self:start;display:flex;flex-direction:column;gap:6px}
	.pc-floating.has-media{border-radius:24px!important}
	.pc-floating.has-media .pb{display:grid!important;grid-template-columns:1fr 1fr;gap:26px!important;align-items:center!important}
	.pc-floating .pc-media img{max-height:70vh}
	/* "special offer" subscription dialog: offer + features left, plans + button right */
	.subban{max-width:920px;width:min(94vw,920px)!important}
	.subban .sb-cols{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:center}
	.subban .sb-l ul{margin-bottom:0}
	/* countdown strip: text + timer left, button right */
	.cw-cd .cd-stack{display:grid!important;grid-template-columns:minmax(0,1fr) auto;column-gap:20px;align-items:center}
	.cw-cd .cd-stack>.tt,.cw-cd .cd-stack>.ms,.cw-cd .cd-stack>.chips{grid-column:1}
	.cw-cd .cd-stack>.cd-act{grid-column:2;grid-row:1 / span 3;width:auto!important;justify-content:flex-end!important}
}

/* ======================================================================
 * v1.1.0 — Autopay, EMI & the Rs-trial (same tabs / cards / status as the apps)
 * ==================================================================== */
.sub-tabs{margin:22px auto 20px}
.sub-tabs button{display:inline-flex;align-items:center;gap:7px}
.sub-tabs .ic{width:16px;height:16px}
.tbadge{font-size:.62rem;font-weight:800;letter-spacing:.05em;padding:2px 8px;border-radius:99px;background:linear-gradient(90deg,#F59E0B,#EF4444);color:#fff}

/* status / failed / pending cards */
.apstat,.apfail,.appnote{background:var(--surface);border:1.5px solid var(--border);border-radius:var(--radius-lg);padding:16px 18px;margin:0 0 16px;box-shadow:var(--shadow)}
.apstat.pending{border-color:rgba(245,158,11,.6);background:linear-gradient(180deg,rgba(245,158,11,.11),var(--surface) 70%)}
.apfail{border-color:rgba(220,38,38,.4);background:linear-gradient(180deg,rgba(220,38,38,.07),var(--surface) 70%)}
.apfail.cancelled{border-color:rgba(245,158,11,.5);background:linear-gradient(180deg,rgba(245,158,11,.09),var(--surface) 70%)}
.appnote{border-color:rgba(245,158,11,.45);background:rgba(245,158,11,.08);box-shadow:none}
.appnote p{margin:0 0 4px;font-size:.92rem}
.aps-h{display:flex;gap:12px;align-items:center}
.aps-ic{font-size:1.6rem;line-height:1;flex:none}
.aps-t{display:block;font-size:1.02rem;line-height:1.3}
.aps-s{color:var(--muted);font-size:.85rem}
.aps-m{margin:10px 0 0;font-size:.92rem}
.apchip{font-size:.66rem;font-weight:800;letter-spacing:.06em;padding:4px 10px;border-radius:99px;white-space:nowrap;flex:none}
.apchip.ok{background:rgba(22,163,74,.14);color:#15803D}
.apchip.pause{background:rgba(245,158,11,.2);color:#B45309}
.apchip.info{background:var(--primary-l);color:var(--primary)}
.apchip.grey{background:var(--soft);color:var(--muted);border:1px solid var(--border)}
.apchip.fail{background:rgba(220,38,38,.12);color:#B91C1C}
.aps-bar{height:8px;border-radius:99px;background:var(--soft);overflow:hidden;border:1px solid var(--border);margin-top:12px}
.aps-bar i{display:block;height:100%;background:var(--grad);border-radius:99px;transition:width .5s}
.aps-pt{display:flex;justify-content:space-between;gap:10px;margin-top:6px;font-size:.82rem;font-weight:700;color:var(--muted)}
.aps-sch{margin-top:10px;display:flex;flex-direction:column;gap:6px}
.aps-r{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;background:var(--soft);font-size:.9rem}
.aps-r.due{background:rgba(245,158,11,.15)}
.aps-r .dot{width:24px;height:24px;border-radius:50%;display:grid;place-items:center;font-size:.75rem;font-weight:800;background:var(--surface);border:1.5px solid var(--border);color:var(--muted);flex:none}
.aps-r .dot.ok{background:#16A34A;border-color:#16A34A;color:#fff}
.aps-r .dot.due{background:#F59E0B;border-color:#F59E0B;color:#fff}
.aps-r small{font-weight:700;color:var(--muted);min-width:66px;text-align:right}
.aps-r small.ok{color:#15803D}
.aps-r small.due{color:#B45309}
.aps-next{margin-top:10px;font-size:.9rem;font-weight:700;color:var(--primary)}
.aps-pm{margin-top:10px;padding:10px 12px;border-radius:12px;background:rgba(245,158,11,.15);color:#92400E;font-size:.88rem;font-weight:600}
:root[data-theme="dark"] .aps-pm{color:#FCD34D}
.aps-cl{margin-top:10px;padding:10px 12px;border-radius:12px;background:var(--soft);border:1px solid var(--border);font-size:.86rem;color:var(--muted)}
.aps-x{margin-top:10px;text-align:center}
.apstat>.btn{margin-top:12px}
.link-btn.grey{color:var(--muted);font-weight:600;font-size:.84rem}

/* EMI / monthly autopay plan cards */
.pcard.apc{padding-top:30px}
.apc-f{list-style:none;padding:0;margin:4px 0 6px;display:flex;flex-direction:column;gap:7px;color:var(--muted);font-size:.88rem}
.apc-f li{display:flex;gap:8px;align-items:center}
.apc-f .ic{width:16px;height:16px;color:var(--primary);flex:none}
.emi-opts{display:flex;flex-direction:column;gap:8px;margin-top:6px}
.emi-opt{display:flex;gap:12px;align-items:center;padding:12px;border:1.5px solid var(--border);border-radius:14px;background:var(--soft)}
.emi-opt small{display:block;color:var(--muted);font-size:.8rem;line-height:1.4}
.eo-t{font-weight:600}
.eo-t b{font-size:1.15rem;color:var(--primary)}
.mon-trial{display:flex;gap:8px;align-items:center;font-size:.86rem;font-weight:700;color:var(--primary);background:var(--primary-l);padding:8px 12px;border-radius:12px}
.mon-trial .ic{width:16px;height:16px;flex:none}
.mon-trial.plain{color:var(--muted);background:var(--soft);font-weight:600}

/* compact trial cross-sell with an electric sweep (left -> right, inside the card) */
.trialx{position:relative;overflow:hidden;display:flex;align-items:center;gap:12px;width:100%;text-align:left;margin:18px 0 0;padding:12px 16px;border:1.5px solid rgba(var(--primary-rgb),.38);border-radius:16px;background:linear-gradient(135deg,var(--primary-l),var(--surface));cursor:pointer;color:var(--text);font:inherit;text-decoration:none!important}
.trialx::after{content:"";position:absolute;top:0;bottom:0;left:-45%;width:38%;background:linear-gradient(100deg,transparent,rgba(var(--primary-rgb),.22),rgba(255,255,255,.6),rgba(var(--primary-rgb),.22),transparent);transform:skewX(-18deg);animation:cwzap 2.9s ease-in-out infinite;pointer-events:none}
@keyframes cwzap{0%{left:-45%}65%,100%{left:125%}}
.trialx .tx-ic{width:36px;height:36px;border-radius:12px;display:grid;place-items:center;background:var(--grad);color:var(--on-primary);flex:none}
.trialx .tx-ic .ic{width:18px;height:18px}
.trialx b{display:block;font-size:.95rem;line-height:1.3}
.trialx small{display:block;color:var(--muted);font-size:.8rem;line-height:1.35}
.trialx .tx-cta{font-weight:800;color:var(--primary);display:inline-flex;gap:4px;align-items:center;white-space:nowrap;font-size:.86rem}
.trialx .tx-cta .ic{width:15px;height:15px}
@media(max-width:520px){.trialx{padding:11px 12px}.trialx .tx-cta{font-size:.8rem}}
@media(prefers-reduced-motion:reduce){.trialx::after{animation:none;display:none}}
.trialwrap{position:relative;margin-top:16px}
.trialwrap .trialx{margin:0;padding-right:40px}
.trialwrap .tw-x{position:absolute;top:6px;right:6px;width:26px;height:26px;border-radius:50%;border:0;background:rgba(0,0,0,.06);color:var(--muted);display:grid;place-items:center;cursor:pointer;z-index:2}
.trialwrap .tw-x:hover{background:rgba(0,0,0,.12)}
.trialwrap .tw-x .ic{width:14px;height:14px}

/* confirm dialog (Pay today / Then monthly / Total) */
.ap-confirm .cw-modal-box{max-width:400px}
.apcf{text-align:center}
.apcf-ic{width:54px;height:54px;border-radius:50%;display:grid;place-items:center;margin:0 auto 8px;background:var(--primary-l);color:var(--primary)}
.apcf-ic .ic{width:26px;height:26px}
.apcf h3{margin:0 0 2px;font-size:1.15rem}
.apcf-box{margin:14px 0 10px;border:1.5px solid var(--border);border-radius:14px;overflow:hidden;text-align:left}
.apcf-r{display:flex;justify-content:space-between;gap:12px;padding:11px 14px;border-top:1px solid var(--border)}
.apcf-r:first-child{border-top:0}
.apcf-r.em{background:var(--primary-l)}
.apcf-r.em b{color:var(--primary);font-size:1.08rem}
.apcf .help{margin:0 0 14px;text-align:left}

/* trial phase notes (Rs-trial students: quizzes open, paid courses only their first lessons) */
.trialnote{display:flex;gap:10px;align-items:flex-start;padding:12px 16px;border-radius:var(--radius);background:var(--primary-l);border:1px solid rgba(var(--primary-rgb),.3);margin:0 0 16px;font-size:.9rem}
.trialnote .ic{color:var(--primary);margin-top:2px;flex:none}
.trialnote b{display:block}
@media(max-width:520px){
	.sub-tabs{width:100%;gap:2px;padding:4px}
	.sub-tabs button{flex:1 1 0;justify-content:center;padding:8px 6px;font-size:.86rem;gap:5px}
	.sub-tabs .ic{display:none}
	.tbadge{font-size:.55rem;padding:2px 6px}
}