/* ─── TOKENS (light-only: white · telegram blue · red) ── */
:root{
  --white:#ffffff;
  --blue:#2aabee;
  --blue-light:#e8f4fc;
  --blue-mid:rgba(42,171,238,0.12);
  --red:#e84855;
  --red-hover:#d93a48;
  --red-light:rgba(232,72,85,0.1);
  --red-mid:rgba(232,72,85,0.14);
  --bg:#fafbfc;
  --bg2:#f3f5f7;
  --s:#ffffff;
  --s2:#f8fafb;
  --s3:#eef4f8;
  --gold:var(--blue);
  --gold2:#5bc4f7;
  --gd:var(--blue-mid);
  --gg:rgba(42,171,238,0.18);
  --fg:#1a1a1a;
  --fg2:#6b7280;
  --fg3:#9ca3af;
  --b:#e5e7eb;
  --b2:rgba(42,171,238,0.28);
  --b3:rgba(42,171,238,0.45);
  --glass:rgba(255,255,255,0.94);
  --sh:0 16px 40px rgba(0,0,0,0.08);
  --shsm:0 4px 14px rgba(0,0,0,0.06);
  --tg:var(--blue);
  --gr:var(--blue);
  --re:var(--red);
  --re2:var(--red-light);
  --gr2:var(--blue-mid);
  --r:12px;
  --btn-outline-border:#d1d5db;
  --btn-outline-hover:rgba(232,72,85,0.08);
  --btn-outline-radius:5px;
  color-scheme:light;
}
html[data-theme="light"],html[data-theme="dark"]{color-scheme:light;}

/* ─── RESET ──────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{scroll-behavior:auto;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;overflow-x:hidden;overflow-y:scroll;}
body{
  font-family:'Plus Jakarta Sans','Inter',system-ui,-apple-system,sans-serif;
  background:var(--bg);color:var(--fg);
  overflow-x:hidden;overflow-y:visible;position:relative;
  padding-bottom:32px;min-height:100%;
}
body.user-signed-in{padding-bottom:0;}
body::before{
  content:'';position:fixed;inset:0;z-index:0;pointer-events:none;
  background:
    linear-gradient(180deg, rgba(250,251,252,0.5) 0%, rgba(250,251,252,0.18) 14%, transparent 32%),
    radial-gradient(ellipse 110% 80% at 50% -6%, rgba(42,171,238,0.26) 0%, rgba(91,196,247,0.12) 38%, transparent 72%),
    radial-gradient(ellipse 58% 52% at 94% 18%, rgba(236,72,153,0.22) 0%, rgba(244,114,182,0.10) 42%, transparent 74%),
    radial-gradient(ellipse 52% 48% at 6% 28%, rgba(232,72,85,0.20) 0%, rgba(232,72,85,0.06) 45%, transparent 72%),
    radial-gradient(ellipse 48% 44% at 72% 58%, rgba(167,139,250,0.18) 0%, rgba(139,92,246,0.06) 40%, transparent 70%),
    radial-gradient(ellipse 55% 42% at 18% 82%, rgba(42,171,238,0.14) 0%, transparent 68%),
    radial-gradient(ellipse 50% 40% at 85% 90%, rgba(232,72,85,0.16) 0%, transparent 68%);
}
@media(max-width:768px){
  body.user-signed-in{padding-bottom:0;}
}

/* cursor glow */
#cursor-glow{
  position:fixed;width:600px;height:600px;border-radius:50%;
  background:radial-gradient(circle,rgba(42,171,238,0.05) 0%,transparent 65%);
  pointer-events:none;z-index:0;transform:translate(-50%,-50%);
  transition:left .8s ease,top .8s ease;
}
#cursor-glow{background:radial-gradient(circle,rgba(42,171,238,0.06) 0%,rgba(236,72,153,0.03) 40%,transparent 65%);}

/* ─── PAGE SYSTEM ─────────────────────────── */
.page{display:none;min-height:100vh;position:relative;z-index:1;}
.page.active{display:block;}

/* ─── NAV ─────────────────────────────────── */
.nav{
  position:fixed;top:0;left:0;right:0;z-index:900;
  height:64px;padding:0 56px;
  display:flex;align-items:center;justify-content:space-between;
  background:transparent;
  transition:background .3s,border-color .3s,backdrop-filter .3s;
}
.nav.scrolled{
  background:var(--glass);
  backdrop-filter:blur(28px) saturate(1.5);
  -webkit-backdrop-filter:blur(28px) saturate(1.5);
  border-bottom:1px solid var(--b);
}

/* Floating pill nav on home */
body.on-land{padding-top:0;font-size:18px;}
body.on-land #page-land{padding-top:96px;}
body.on-land .nav{
  position:fixed;top:14px;left:50%;right:auto;
  transform:translateX(-50%);
  width:calc(100% - 32px);max-width:1240px;
  height:auto;min-height:58px;padding:8px 12px 8px 18px;
  border-radius:10px;
  background:#ffffff;
  opacity:1;
  backdrop-filter:none;
  -webkit-backdrop-filter:none;
  border:1px solid #e5e7eb;
  box-shadow:0 10px 40px rgba(15,23,42,.12);
  pointer-events:auto;z-index:950;
}
body.on-land .nav.scrolled{
  box-shadow:0 14px 44px rgba(15,23,42,.14);
}
html[data-theme="dark"] body.on-land .nav{
  background:#12141a;
  border-color:#2a2f3a;
}
body.on-land .logo{cursor:pointer;pointer-events:auto;}
body.on-land .nav-links--float{
  flex:1;justify-content:center;display:flex !important;
  pointer-events:auto;
}
body.on-land .logo-svg{width:40px !important;height:40px !important;}
body.on-land .logo-text{font-size:21px;}
body.on-land .nav-links--float .nl{
  font-size:14px;font-weight:600;padding:10px 11px;
  color:#4b5563;background:none !important;border:none !important;
  border-radius:0;cursor:pointer;pointer-events:auto;
  transition:color .2s;
}
body.on-land .nav-links--float .nl:hover,
body.on-land .nav-links--float .nl.on{
  color:#111827;background:none !important;border:none !important;
}
body.on-land .nav-links--float .nl-pricing{
  color:#4b5563 !important;font-weight:600 !important;
  background:none !important;border:none !important;
  padding:10px 11px !important;cursor:pointer !important;
}
body.on-land .nav-links--float .nl-pricing:hover,
body.on-land .nav-links--float .nl-pricing.on{
  color:#111827 !important;background:none !important;border:none !important;
}
body.on-land button,
body.on-land .land-btn,
body.on-land .nav-start-btn,
body.on-land .land-faq-q,
body.on-land .land-proof-link{cursor:default;}
body.on-land .nav-r{flex-shrink:0;gap:0;pointer-events:auto;}
body.on-land .nav-auth-guest,
body.on-land .nav-signin-hint{display:none !important;}
body.on-land .nav-start-btn{
  margin-right:2px;
  background:var(--red) !important;
  color:#fff !important;
  border:1px solid var(--red) !important;
  opacity:1 !important;
  pointer-events:auto !important;
  cursor:pointer !important;
  box-shadow:none !important;
  transition:border-color .2s,background .2s !important;
}
body.on-land .nav-start-btn:hover{
  background:var(--red-hover) !important;
  border-color:var(--red-hover) !important;
}
body.on-land .nav-start-btn{padding:12px 24px !important;font-size:15px !important;}
.nav-start-btn{
  display:inline-flex;align-items:center;padding:10px 20px;
  border:1px solid var(--red);border-radius:12px;background:var(--red);color:#fff;
  font-family:'Outfit',system-ui,sans-serif;font-size:13px;font-weight:700;
  cursor:pointer;pointer-events:auto;
  transition:border-color .2s,background .2s,filter .2s;
  box-shadow:none;
}
.nav-start-btn:hover{background:var(--red-hover);border-color:var(--red-hover);color:#fff;}

/* Logo */
.logo{display:flex;align-items:center;gap:10px;cursor:pointer;text-decoration:none;}
.logo-svg{flex-shrink:0;transition:transform .3s;}
.logo:hover .logo-svg{transform:none;}
.logo-text{font-family:'Inter',system-ui,sans-serif;font-size:19px;font-weight:700;color:var(--fg);letter-spacing:-.01em;transition:color .2s;}
body.on-land .logo:hover .logo-text{color:var(--fg);}

.nav-links{display:flex;gap:2px;}
.nl{padding:8px 18px;border-radius:9px;font-size:14px;font-weight:500;color:var(--fg2);cursor:pointer;border:none;background:none;font-family:'Plus Jakarta Sans',sans-serif;transition:all .18s;display:inline-flex;align-items:center;gap:6px;}
.nl:hover,.nl.on{color:var(--fg);background:var(--s2);}
.nl-daily{color:#fff !important;font-weight:700 !important;background:var(--blue) !important;border-radius:var(--btn-outline-radius) !important;padding:6px 16px !important;box-shadow:none !important;animation:none !important;}
.nl-daily:hover{background:#2499d6 !important;}
.nl-daily-dot{width:6px;height:6px;border-radius:50%;background:#fff;animation:dailyPulse 2s ease-in-out infinite;flex-shrink:0;}
@keyframes dailyPulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(1.4)}}
.nl-pricing{color:var(--red) !important;font-weight:600 !important;border:1px solid rgba(232,72,85,.25) !important;border-radius:var(--btn-outline-radius) !important;padding:6px 16px !important;background:var(--red-light) !important;transition:all .2s;}
.nl-pricing:hover{background:var(--red-mid) !important;}

.nav-r{display:flex;align-items:center;gap:8px;}

/* theme btn */
.back-btn{display:flex;align-items:center;gap:6px;padding:7px 16px 7px 11px;border-radius:var(--btn-outline-radius);border:1.5px solid var(--btn-outline-border);background:transparent;color:var(--fg);font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:700;cursor:pointer;transition:background .15s;white-space:nowrap;box-shadow:none;}
.back-btn:hover{background:var(--btn-outline-hover);color:var(--fg);border-color:var(--btn-outline-border);}
.back-btn svg{flex-shrink:0;color:var(--tg);}
.theme-btn{display:none !important;}

/* signin btn */
.signin-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-width:168px;padding:10px 32px;border:1px solid var(--red);
  color:#fff;background:var(--red);border-radius:var(--btn-outline-radius);
  font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:700;
  cursor:default;transition:background .15s,border-color .15s,box-shadow .15s;box-shadow:0 2px 10px rgba(232,72,85,0.22);
}
.signin-btn:hover{background:var(--red-hover);border-color:var(--red-hover);color:#fff;}
.signin-btn.signin-loading,.google-signin-btn.signin-loading{
  background:var(--white) !important;
  border:1px solid #e5e7eb !important;
  color:#6b7280 !important;
  cursor:default !important;
  pointer-events:none;
  min-width:200px;
  font-weight:500;
}
.signin-btn.signin-loading svg,.google-signin-btn.signin-loading svg{flex-shrink:0;}

/* user chip */
.uchip{
  display:flex;align-items:center;gap:8px;padding:5px 13px 5px 5px;
  background:var(--s);border:1px solid var(--b);border-radius:100px;
  cursor:pointer;transition:all .18s;
}
.uchip:hover,.uchip.open{border-color:var(--b2);}
.uc-img{width:28px;height:28px;border-radius:50%;border:1.5px solid var(--gold);object-fit:cover;flex-shrink:0;}
.uc-fb{width:28px;height:28px;border-radius:50%;background:var(--gd);border:1.5px solid var(--gold);display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;color:var(--gold);flex-shrink:0;}
.uc-name{font-size:13px;font-weight:600;color:var(--fg);max-width:90px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.uc-name.chroma{
  background:linear-gradient(90deg,#f97316,#eab308,#ef4444,#f97316);
  background-size:200% auto;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:chromaShift 2.5s linear infinite;
  font-weight:700;
}
@keyframes chromaShift{0%{background-position:0% center}100%{background-position:200% center}}
/* Also in dropdown */
.udrop-name.chroma{
  background:linear-gradient(90deg,#f97316,#eab308,#ef4444,#f97316);
  background-size:200% auto;
  -webkit-background-clip:text;background-clip:text;
  -webkit-text-fill-color:transparent;
  animation:chromaShift 2.5s linear infinite;
  font-weight:700;
}
.uc-chev{font-size:9px;color:var(--fg2);transition:transform .2s;}
.uchip.open .uc-chev{transform:rotate(180deg);}

/* dropdown */
.udrop{
  position:absolute;top:calc(100% + 8px);right:0;
  background:var(--s);border:1px solid var(--b);border-radius:14px;
  padding:6px;min-width:210px;box-shadow:var(--sh);z-index:99999;
  opacity:0;pointer-events:none;transform:translateY(-6px) scale(.97);
  transition:all .2s cubic-bezier(.34,1.2,.64,1);
}
.udrop.show{opacity:1;pointer-events:all;transform:translateY(0) scale(1);}
.udrop-head{padding:10px 13px 9px;border-bottom:1px solid var(--b);margin-bottom:4px;}
.udrop-name{font-size:13px;font-weight:700;color:var(--fg);}
.udrop-tg{font-size:11px;color:var(--tg);margin-top:1px;}
.udrop-badge{display:inline-flex;padding:2px 8px;border-radius:100px;font-size:10px;font-weight:700;background:var(--gd);color:var(--gold);margin-top:5px;letter-spacing:.04em;}
.udrop-item{display:flex;align-items:center;gap:8px;padding:8px 13px;border-radius:9px;font-size:13px;font-weight:500;color:var(--fg2);cursor:pointer;transition:all .15s;border:none;background:none;font-family:'Plus Jakarta Sans',sans-serif;width:100%;text-align:left;}
.udrop-item:hover{background:var(--s2);color:var(--fg);}
.udrop-item.danger:hover{background:var(--re2);color:var(--re);}
.umenu-wrap{position:relative;z-index:99999;}

/* ─── HOME (land) ─────────────── */
.land-btn{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:14px 28px;border-radius:12px;font-family:'Outfit',system-ui,sans-serif;
  font-size:15px;font-weight:600;cursor:pointer;pointer-events:auto;
  transition:border-color .2s,background .2s,color .2s;
  border:1px solid transparent;min-width:0;text-decoration:none;line-height:1.2;
  -webkit-appearance:none;appearance:none;
  box-shadow:none;
}
.land-btn--primary{
  background:var(--red) !important;color:#fff !important;
  border:1px solid var(--red) !important;
}
.land-btn--primary:hover{
  background:var(--red-hover) !important;color:#fff !important;
  border-color:var(--red-hover) !important;
}
.land-btn--secondary{
  background:#ffffff !important;color:#111827 !important;
  border:1px solid #d1d5db !important;
}
.land-btn--secondary:hover{
  background:#ffffff !important;
  border-color:var(--red) !important;
  color:#111827 !important;
}
.land-btn--on-dark.land-btn--secondary{
  background:#ffffff !important;color:#111827 !important;
  border:1px solid #ffffff !important;
}
.land-btn--on-dark.land-btn--secondary:hover{
  background:#ffffff !important;
  border-color:var(--red) !important;
  color:#111827 !important;
}

.land-hero{
  position:relative;z-index:1;max-width:1080px;margin:0 auto;
  min-height:calc(100vh - 96px);min-height:calc(100dvh - 96px);
  display:flex;flex-direction:column;justify-content:center;align-items:center;
  padding:48px 32px 56px;text-align:center;box-sizing:border-box;
}
.land-hero-band{
  position:relative;width:100%;min-height:220px;max-height:280px;
  margin:0 auto 56px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.land-band-orbit{
  position:absolute;inset:0;pointer-events:none;
}
.land-float-chip{
  position:absolute;display:inline-flex;align-items:center;gap:7px;
  padding:9px 16px;border-radius:5px;
  font-size:13px;font-weight:600;letter-spacing:.02em;
  border:1px solid var(--chip-border,#e5e7eb);
  background:#ffffff;color:var(--chip-fg,#374151);
  box-shadow:0 4px 16px rgba(15,23,42,.06);
  animation:landFloat 5s ease-in-out infinite;
  animation-delay:var(--delay,0s);
}
.land-float-chip--reading{--chip-border:#fecaca;--chip-fg:#991b1b;--delay:0s;top:10%;left:4%;transform:rotate(-4deg);}
.land-float-chip--listening{--chip-border:#bae6fd;--chip-fg:#075985;--delay:.6s;top:18%;right:2%;transform:rotate(3deg);}
.land-float-chip--writing{--chip-border:#ddd6fe;--chip-fg:#5b21b6;--delay:1.2s;bottom:28%;left:0;transform:rotate(2deg);}
.land-float-chip--vocab{--chip-border:#bbf7d0;--chip-fg:#166534;--delay:.3s;bottom:12%;right:6%;transform:rotate(-3deg);}
.land-float-chip--progress{--chip-border:#fed7aa;--chip-fg:#9a3412;--delay:1.8s;top:42%;right:12%;transform:rotate(2deg);}
@keyframes landFloat{
  0%,100%{translate:0 0;}
  50%{translate:0 -10px;}
}
.land-chip-ico{flex-shrink:0;opacity:.9;}

.land-band-core{position:relative;z-index:2;text-align:center;}
.land-band-num{
  display:block;font-size:clamp(88px,20vw,152px);font-weight:800;
  letter-spacing:-.04em;line-height:.92;color:var(--fg);
}
.land-band-caption{
  margin-top:18px;font-size:12px;font-weight:600;letter-spacing:.14em;
  text-transform:uppercase;color:var(--fg3);
}
.land-hero-main{width:100%;max-width:640px;margin:0 auto;}
.land-kicker{font-size:12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--red);margin:0 0 22px;}
.land-hero-h{
  font-size:clamp(32px,5.5vw,48px);font-weight:800;line-height:1.1;
  letter-spacing:-.03em;color:var(--fg);margin:0 0 24px;min-height:1.15em;
}
.land-type-accent{color:var(--red);}
.land-type-cursor{
  display:inline-block;width:3px;height:.88em;background:var(--red);
  margin-left:2px;vertical-align:-.06em;opacity:1;
}
.land-type-cursor--blink{animation:landCursorBlink .85s step-end infinite;}
@keyframes landCursorBlink{0%,100%{opacity:1;}50%{opacity:0;}}
.land-hero-p{
  font-size:18px;line-height:1.7;color:var(--fg2);
  margin:0 auto 40px;max-width:540px;
}
.land-hero-actions{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;}

.land-stats-wrap{
  position:relative;z-index:1;max-width:min(1320px,calc(100% - 40px));
  margin:0 auto 80px;padding:96px 20px 0;
}
.land-scroll-hint{
  text-align:center;font-size:11px;font-weight:700;letter-spacing:.18em;
  text-transform:uppercase;color:var(--fg3);margin:0 0 18px;
}
.land-stats{
  display:grid;grid-template-columns:repeat(4,1fr);
  background:transparent;border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb;
  box-shadow:none;border-radius:0;overflow:hidden;
}
.land-stat{
  padding:32px 20px 30px;text-align:center;
  border-right:1px solid #e5e7eb;border-left:none;
  transition:background .2s;
}
.land-stat:last-child{border-right:none;}
.land-stat:hover{background:rgba(255,255,255,.55);}
.land-stat-val{
  display:block;font-size:clamp(28px,4vw,36px);font-weight:800;
  color:var(--red);letter-spacing:-.03em;line-height:1;margin-bottom:10px;
}
.land-stat-label{
  display:block;font-size:13px;font-weight:500;color:var(--fg2);
  letter-spacing:0;text-transform:none;line-height:1.35;
}

.land-sec{position:relative;z-index:1;max-width:1120px;margin:0 auto;padding:80px 32px;}
.land-sec--wide{max-width:min(1320px,calc(100% - 40px));padding-left:20px;padding-right:20px;}
.land-sec-p--wide{max-width:640px;}
.land-sec-tag{display:block;font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:12px;}
.land-sec-h{
  font-size:clamp(28px,4.5vw,38px);font-weight:800;line-height:1.15;
  letter-spacing:-.02em;color:var(--fg);margin-bottom:14px;
}
.land-sec-p{font-size:17px;line-height:1.65;color:#4b5563;max-width:560px;margin-bottom:36px;}
body.on-land .land-sec-p{color:#374151;}

.land-offer-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;}
.land-offer-card{
  background:#fff;border:1px solid #e5e7eb;border-radius:10px;
  padding:22px 20px 20px;display:flex;flex-direction:column;gap:0;min-height:100%;
}
.land-offer-ico{
  width:40px;height:40px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  background:rgba(232,72,85,.08);color:var(--red);margin-bottom:16px;
}
.land-offer-title{font-size:16px;font-weight:700;color:var(--fg);margin:0 0 10px;line-height:1.25;}
.land-offer-desc{font-size:14px;line-height:1.6;color:#4b5563;margin:0 0 18px;flex:1;}
.land-offer-badge{
  align-self:flex-start;padding:5px 10px;border-radius:999px;font-size:11px;font-weight:700;
}
.land-offer-badge--live{background:rgba(34,197,94,.12);color:#15803d;}

@keyframes landRainbowBar{
  0%{background-position:0% 50%}
  100%{background-position:200% 50%}
}
.land-rainbow-bar{position:relative;}
.land-rainbow-bar::after{
  content:'';position:absolute;left:0;right:0;bottom:0;height:0;
  border-radius:0 0 10px 10px;pointer-events:none;
  background:linear-gradient(90deg,#e84855,#ec4899,#a78bfa,#2aabee,#5bc4f8,#e84855);
  background-size:200% 100%;
  transition:height .22s ease;
}
.land-rainbow-bar:hover::after,
.land-rainbow-bar.on::after{
  height:3px;
  animation:landRainbowBar 2.4s linear infinite;
}

.land-how-grid{
  display:grid;grid-template-columns:repeat(3,1fr);gap:16px;position:relative;
}
.land-how-card{
  background:#fff;border:1px solid #e5e7eb;border-radius:10px;padding:24px 22px;
  transition:border-color .2s,box-shadow .2s;
}
.land-how-card:hover{
  border-color:#d1d5db;
  box-shadow:0 8px 28px rgba(15,23,42,.07);
}
.land-how-step{
  display:block;font-size:11px;font-weight:700;letter-spacing:.08em;
  text-transform:uppercase;color:var(--red);margin-bottom:12px;
}
.land-how-title{font-size:17px;font-weight:700;color:var(--fg);margin:0 0 10px;line-height:1.25;}
.land-how-desc{font-size:14px;line-height:1.65;color:#4b5563;margin:0;}

.land-bands-table-wrap{
  border:1px solid #e5e7eb;border-radius:10px;overflow:hidden;background:#fff;
}
.land-bands-table{width:100%;border-collapse:collapse;font-size:14px;}
.land-bands-table thead{background:var(--red);color:#fff;}
.land-bands-table th{
  padding:14px 16px;text-align:left;font-size:12px;font-weight:700;
  letter-spacing:.06em;text-transform:uppercase;
}
.land-bands-table td{padding:14px 16px;border-top:1px solid #eef0f3;color:var(--fg2);vertical-align:middle;}
.land-bands-table td:first-child{width:110px;}
.land-bands-table tbody tr:hover{background:#fafbfc;}
.land-band-pill{
  display:inline-block;padding:4px 10px;border-radius:999px;
  font-size:12px;font-weight:800;border:1px solid transparent;
}
.land-band-pill--high{background:rgba(34,197,94,.1);color:#15803d;border-color:rgba(34,197,94,.25);}
.land-band-pill--mid{background:rgba(245,158,11,.1);color:#b45309;border-color:rgba(245,158,11,.25);}
.land-band-pill--low{background:rgba(239,68,68,.08);color:#b91c1c;border-color:rgba(239,68,68,.2);}

.land-faq-h{
  font-size:clamp(32px,4.5vw,42px);margin-bottom:10px;
}
.land-faq-sub{
  font-size:16px;color:#6b7280;margin-bottom:28px;max-width:none;
}
.land-faq-list{border-top:1px solid #e5e7eb;}
.land-faq-item{border-bottom:1px solid #e5e7eb;}
.land-faq-q{
  width:100%;display:flex;align-items:center;justify-content:space-between;gap:24px;
  padding:22px 4px 22px 0;border:none;background:none;text-align:left;
  font-family:'Inter',system-ui,sans-serif;cursor:default;
}
.land-faq-q-text{
  flex:1;font-size:17px;font-weight:700;color:#111827;line-height:1.35;
}
.land-faq-icon{
  flex-shrink:0;display:flex;align-items:center;justify-content:center;
  color:#111827;opacity:.4;transition:transform .28s ease,opacity .2s;
}
.land-faq-item.open .land-faq-icon{
  transform:rotate(180deg);opacity:.65;
}
.land-faq-a{
  display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .32s ease;
}
.land-faq-item.open .land-faq-a{grid-template-rows:1fr;}
.land-faq-a-inner{overflow:hidden;min-height:0;}
.land-faq-a p{
  margin:0;padding:0 0 22px;font-size:15px;line-height:1.75;color:#6b7280;max-width:720px;
}
html[data-theme="dark"] .land-faq-list{border-color:#2a2f3a;}
html[data-theme="dark"] .land-faq-item{border-color:#2a2f3a;}
html[data-theme="dark"] .land-faq-q-text{color:#f3f4f6;}
html[data-theme="dark"] .land-faq-a p{color:#9ca3af;}
html[data-theme="dark"] .land-faq-icon{color:#f3f4f6;}
html[data-theme="dark"] .land-faq-sub{color:#9ca3af;}
html[data-theme="dark"] .land-platform-panel{
  background:linear-gradient(135deg,rgba(40,20,24,.4) 0%,rgba(20,30,40,.35) 50%,rgba(18,20,26,.85) 100%);
  border-color:#2a2f3a;
}
html[data-theme="dark"] .land-feature-row:hover{background:rgba(255,255,255,.04);}
html[data-theme="dark"] .land-prep-shell{
  background:linear-gradient(160deg,#1a1214 0%,#12141a 100%);
  border-color:#2a2f3a;
}
html[data-theme="dark"] .land-prep-side{background:rgba(0,0,0,.2);border-color:#2a2f3a;}
html[data-theme="dark"] .land-prep-choice,html[data-theme="dark"] .land-prep-chip{background:var(--s);}

.land-platform-panel{
  border-radius:20px;padding:48px 40px;
  background:linear-gradient(135deg,rgba(255,237,240,.55) 0%,rgba(240,249,255,.5) 45%,rgba(255,255,255,.9) 100%);
  border:1px solid rgba(229,231,235,.9);
  box-shadow:0 20px 50px rgba(15,23,42,.06);
}
.land-platform-layout{
  display:grid;grid-template-columns:minmax(240px,.9fr) minmax(0,1.15fr);
  gap:56px;align-items:start;
}
.land-platform-intro{position:sticky;top:88px;}
.land-platform-grid{display:grid;grid-template-columns:1.05fr .95fr;gap:48px;align-items:start;margin-top:40px;}
.land-mock-card{
  background:var(--white);border:1px solid var(--b);border-radius:18px;
  box-shadow:0 20px 50px rgba(15,23,42,.08);overflow:hidden;
}
.land-mock-top{display:flex;align-items:center;gap:10px;padding:12px 16px;border-bottom:1px solid var(--b);font-size:11px;color:var(--fg3);}
.land-mock-dots{display:flex;gap:5px;}
.land-mock-dots i{width:8px;height:8px;border-radius:50%;background:var(--b2);display:block;}
.land-mock-meta{flex:1;font-weight:600;}
.land-mock-timer{padding:4px 10px;border-radius:100px;background:var(--red-light);color:var(--red);font-weight:700;font-size:11px;}
.land-mock-body{display:grid;grid-template-columns:1fr 1fr;min-height:200px;}
.land-mock-label{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--fg3);margin-bottom:8px;}
.land-mock-passage,.land-mock-q{padding:16px;font-size:12px;line-height:1.55;color:var(--fg2);}
.land-mock-passage{border-right:1px solid var(--b);background:var(--s);}
.land-mock-passage mark{background:rgba(232,72,85,.15);color:var(--fg);padding:0 2px;border-radius:2px;}
.land-mock-qtext{font-weight:600;color:var(--fg);margin-bottom:10px;}
.land-mock-opt{padding:8px 10px;border:1px solid var(--b);border-radius:8px;margin-bottom:6px;font-size:11px;}
.land-mock-opt.on{border-color:var(--red);background:var(--red-light);color:var(--fg);font-weight:600;}
.land-mock-foot{padding:10px 16px;border-top:1px solid var(--b);font-size:11px;color:var(--fg3);}

.land-feature-list{list-style:none;margin:0;padding:0;}
.land-feature-row{
  display:flex;gap:16px;padding:18px 16px;margin:0 -16px;
  border-bottom:1px solid var(--b);align-items:flex-start;
  border-radius:14px;cursor:pointer;transition:background .18s,border-color .18s;
}
.land-feature-row:last-child{border-bottom:none;}
body.on-land .land-feature-row{cursor:pointer;}
.land-feature-row:hover{background:rgba(255,255,255,.72);border-color:transparent;}
.land-feat-ico{width:48px;height:48px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.land-feat-arrow{
  margin-left:auto;align-self:center;font-size:18px;font-weight:700;
  color:var(--fg3);opacity:0;transform:translateX(-4px);transition:opacity .18s,transform .18s;
}
.land-feature-row:hover .land-feat-arrow{opacity:1;transform:translateX(0);}
.land-feat-ico--blue{background:rgba(42,171,238,.12);color:var(--tg);}
.land-feat-ico--red{background:rgba(232,72,85,.1);color:var(--red);}
.land-feat-ico--purple{background:rgba(167,139,250,.12);color:#a78bfa;}
.land-feat-ico--green{background:rgba(34,197,94,.1);color:#16a34a;}
.land-feat-tag{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--red);display:block;margin-bottom:4px;}
.land-feat-text strong{display:block;font-size:16px;font-weight:700;color:var(--fg);margin-bottom:4px;}
.land-feat-text p{font-size:13px;color:var(--fg3);margin:0;line-height:1.5;}

.land-route-grid{max-width:720px;margin:0 auto;}
.land-steps{list-style:none;margin:28px 0 0;padding:0;}
.land-steps li{display:flex;gap:16px;padding:18px 0;border-bottom:1px solid var(--b);align-items:flex-start;}
.land-steps li:last-child{border-bottom:none;}
.land-step-n{font-size:14px;font-weight:800;color:var(--red);min-width:28px;}
.land-steps strong{display:block;font-size:15px;font-weight:700;color:var(--fg);margin-bottom:4px;}
.land-steps p{font-size:13px;color:var(--fg3);margin:0;}

.land-proof-head{display:flex;align-items:flex-end;justify-content:space-between;gap:20px;flex-wrap:wrap;margin-bottom:32px;}
.land-proof-link{border:none;background:none;color:var(--red);font-family:'Plus Jakarta Sans',sans-serif;font-size:14px;font-weight:700;cursor:pointer;padding:0;}
.land-proof-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;}
.land-proof-card{
  background:var(--white);border:1px solid var(--b);border-radius:16px;padding:20px;
  display:flex;flex-direction:column;gap:14px;transition:box-shadow .2s,transform .2s;
}
.land-proof-card:hover{box-shadow:0 12px 32px rgba(15,23,42,.08);transform:translateY(-2px);}
body.on-land .land-proof-card:hover{transform:none;border-color:var(--red);box-shadow:0 4px 16px rgba(15,23,42,.06);}
.land-proof-scores{display:flex;align-items:center;gap:8px;}
.land-proof-from,.land-proof-to{padding:5px 12px;border-radius:100px;font-size:13px;font-weight:800;}
.land-proof-from{background:var(--s2);color:var(--fg2);}
.land-proof-to{background:var(--red);color:#fff;}
.land-proof-arrow{color:var(--fg3);font-weight:700;}
.land-proof-author{display:flex;align-items:center;gap:10px;}
.land-proof-av{width:36px;height:36px;border-radius:50%;background:var(--red-light);color:var(--red);font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.land-proof-name{font-size:14px;font-weight:700;color:var(--fg);}
.land-proof-meta{font-size:11px;color:var(--fg3);}
.land-proof-stars{margin-left:auto;color:#f59e0b;font-size:12px;letter-spacing:1px;}
.land-proof-q{font-size:13px;line-height:1.6;color:var(--fg2);margin:0;flex:1;}
.land-proof-cta{text-align:center;margin-top:28px;}
.land-proof-btn{
  padding:11px 24px;border-radius:100px;border:1.5px solid var(--b);
  background:var(--white);color:var(--fg2);font-family:'Plus Jakarta Sans',sans-serif;
  font-size:13px;font-weight:600;cursor:pointer;transition:all .18s;
}
.land-proof-btn:hover{border-color:var(--b2);color:var(--fg);}

.land-closing{
  position:relative;z-index:1;max-width:none;margin:48px 0 0;padding:0 20px 56px;
}
.land-closing--wide .land-closing-inner{max-width:none;}
.land-closing-inner{
  background:linear-gradient(135deg,#1a1214 0%,#2a1518 100%);
  border-radius:14px;padding:56px 40px;text-align:center;color:#fff;
  box-shadow:0 24px 60px rgba(15,23,42,.18);
}
.land-closing-h{
  font-size:clamp(26px,4.5vw,36px);font-weight:800;line-height:1.15;
  margin-bottom:14px;color:#fff;letter-spacing:-.02em;
}
.land-closing-p{font-size:16px;color:rgba(255,255,255,.78);max-width:560px;margin:0 auto 28px;line-height:1.6;}
.land-closing-btns{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;}
.land-closing-btns .land-btn--primary:hover{
  background:var(--red-hover) !important;
  border-color:var(--red-hover) !important;
}
/* Prep onboarding — dedicated /onboarding page */
body.on-prep{
  margin:0;min-height:100vh;
  background:linear-gradient(165deg,#fff5f3 0%,#f8fafc 42%,#eef6ff 100%);
  overflow-x:hidden;
}
body.on-prep #grid-canvas,body.on-prep #cursor-glow{display:none !important;}
.land-prep-page{
  min-height:100vh;padding:20px 16px 32px;
  display:flex;align-items:center;justify-content:center;
  box-sizing:border-box;
}
.land-prep-home{
  position:fixed;top:16px;left:16px;z-index:10;
  font-family:'Outfit',sans-serif;font-size:13px;font-weight:600;
  color:var(--fg3);text-decoration:none;padding:8px 12px;
  border-radius:12px;background:rgba(255,255,255,.85);
  border:1px solid var(--b);transition:color .15s,border-color .15s;
}
.land-prep-home:hover{color:var(--fg);border-color:var(--red);}
.land-prep-shell{
  position:relative;display:grid;grid-template-columns:220px minmax(0,1fr);
  width:min(960px,100%);max-height:min(92vh,820px);
  background:linear-gradient(160deg,#fff8f6 0%,#fff 40%,#f8fafc 100%);
  border-radius:20px;border:1px solid rgba(229,231,235,.95);
  box-shadow:0 32px 80px rgba(15,23,42,.12);overflow:hidden;
}
.land-prep-shell--page{max-height:none;min-height:min(640px,92vh);}
.land-prep-side{
  padding:28px 20px;display:flex;flex-direction:column;
  background:rgba(255,255,255,.55);border-right:1px solid rgba(229,231,235,.9);
}
.land-prep-brand{
  display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700;color:var(--red);
  letter-spacing:-.02em;margin-bottom:28px;text-decoration:none;
}
.land-prep-brand-img{border-radius:8px;object-fit:contain;flex-shrink:0;}
.land-prep-trust{display:flex;align-items:flex-start;gap:8px;}
.land-prep-trust-ico{color:var(--fg3);flex-shrink:0;margin-top:1px;}
.land-prep-steps{list-style:none;margin:0;padding:0;flex:1;}
.land-prep-steps li{
  display:flex;align-items:center;gap:10px;font-size:13px;font-weight:600;
  color:var(--fg3);padding:10px 0;
}
.land-prep-steps li.on{color:var(--red);}
.land-prep-n{
  width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:800;background:var(--s2);color:var(--fg3);flex-shrink:0;
}
.land-prep-steps li.on .land-prep-n{background:var(--red);color:#fff;}
.land-prep-trust{font-size:11px;line-height:1.5;color:var(--fg3);margin:0;}
.land-prep-main{
  padding:28px 32px 24px;display:flex;flex-direction:column;min-height:0;overflow:hidden;
}
.land-prep-back{
  align-self:flex-start;border:none;background:none;padding:0;margin-bottom:8px;
  font-family:'Outfit',sans-serif;font-size:13px;font-weight:600;color:var(--fg3);cursor:pointer;
}
.land-prep-panels{
  position:relative;flex:1;overflow:hidden;min-height:300px;
  padding-right:4px;
}
.land-prep-panel{
  display:none;pointer-events:none;
  opacity:0;transform:translateX(20px);
}
.land-prep-panel.on,
.land-prep-panel.is-leaving,
.land-prep-panel.is-leaving-back{
  position:absolute;left:0;right:0;top:0;
  max-height:100%;overflow-y:auto;
}
.land-prep-panel.on{
  display:block;pointer-events:auto;
  opacity:1;transform:translateX(0);
  transition:opacity .32s cubic-bezier(.22,1,.36,1),transform .32s cubic-bezier(.22,1,.36,1);
}
.land-prep-panel.is-leaving{
  display:block;pointer-events:none;
  opacity:0;transform:translateX(-18px);
  transition:opacity .24s ease,transform .24s ease;
}
.land-prep-panel.is-leaving-back{
  display:block;pointer-events:none;
  opacity:0;transform:translateX(18px);
  transition:opacity .24s ease,transform .24s ease;
}
.land-prep-panel.is-entering{
  display:block;pointer-events:auto;
  opacity:0;transform:translateX(20px);
}
.land-prep-panel.is-entering-back{
  display:block;pointer-events:auto;
  opacity:0;transform:translateX(-20px);
}
.land-prep-panel.is-entering,
.land-prep-panel.is-entering-back{
  transition:opacity .32s cubic-bezier(.22,1,.36,1),transform .32s cubic-bezier(.22,1,.36,1);
}
.land-prep-panel.on:not(.is-entering):not(.is-entering-back){
  position:absolute;left:0;right:0;top:0;
}
.land-prep-dots i{transition:width .25s ease,background .25s ease,border-radius .25s ease;}
@keyframes prepFade{from{opacity:0;translate:0 8px;}to{opacity:1;translate:0 0;}}
.land-prep-hero-ico{
  width:56px;height:56px;border-radius:14px;margin-bottom:14px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(232,72,85,.08);color:var(--red);
}
.land-prep-h{font-size:clamp(22px,3vw,28px);font-weight:800;letter-spacing:-.03em;color:var(--fg);margin:0 0 10px;line-height:1.2;}
.land-prep-sub{font-size:14px;color:var(--fg3);margin:0 0 20px;line-height:1.55;}
.land-prep-bullets{margin:0;padding:0 0 0 18px;font-size:14px;color:var(--fg2);line-height:1.7;}
.land-prep-choices{display:flex;flex-direction:column;gap:10px;}
.land-prep-choice{
  display:flex;align-items:center;gap:14px;width:100%;text-align:left;
  padding:14px 16px;border-radius:14px;border:1px solid var(--b);
  background:#fff;cursor:pointer;font-family:inherit;
  transition:border-color .18s,background .18s,transform .18s,box-shadow .18s;
  pointer-events:auto;position:relative;z-index:1;
}
.land-prep-choice:hover{border-color:#d1d5db;box-shadow:0 4px 14px rgba(15,23,42,.06);}
.land-prep-choice:active{transform:scale(.985);}
.land-prep-choice strong{display:block;font-size:14px;font-weight:700;color:var(--fg);}
.land-prep-choice small{display:block;font-size:12px;color:var(--fg3);margin-top:2px;}
.land-prep-choice-body{flex:1;min-width:0;}
.land-prep-choice-ico--svg{
  width:40px;height:40px;border-radius:11px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--s);color:var(--red);
}
.land-prep-choice.on .land-prep-choice-ico--svg{background:rgba(232,72,85,.1);}
.land-prep-radio{
  width:20px;height:20px;border-radius:50%;border:2px solid var(--b2);flex-shrink:0;
}
.land-prep-choice.on{border-color:var(--red);background:rgba(232,72,85,.06);}
.land-prep-choice.on .land-prep-radio{border-color:var(--red);background:var(--red);box-shadow:inset 0 0 0 4px #fff;}
.land-prep-band-wrap{text-align:center;margin:8px 0 16px;}
.land-prep-band-num{
  font-size:64px;font-weight:800;letter-spacing:-.04em;color:var(--fg);line-height:1;
  transition:transform .25s cubic-bezier(.34,1.2,.64,1);
}
.land-prep-band-num--pulse{animation:prepBandPop .35s ease;}
@keyframes prepBandPop{
  0%{transform:scale(1);}
  45%{transform:scale(1.06);}
  100%{transform:scale(1);}
}
.land-prep-band-label{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--fg3);}
.land-prep-slider{width:100%;accent-color:var(--red);margin:8px 0;}
.land-prep-slider-labels{display:flex;justify-content:space-between;font-size:12px;color:var(--fg3);margin-bottom:16px;}
.land-prep-mini-steps{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px;}
.land-prep-mini-steps li{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--fg2);}
.land-prep-mini-steps span{
  width:22px;height:22px;border-radius:50%;background:var(--red-light);color:var(--red);
  font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;
}
.land-prep-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:10px;}
.land-prep-chip{
  display:flex;align-items:center;gap:10px;
  padding:14px 12px;border-radius:12px;border:1px solid var(--b);background:#fff;
  font-family:'Outfit',sans-serif;font-size:13px;font-weight:600;color:var(--fg);
  cursor:pointer;text-align:left;pointer-events:auto;position:relative;z-index:1;
  transition:border-color .18s,background .18s,transform .18s,box-shadow .18s;
}
.land-prep-chip:hover{border-color:#d1d5db;box-shadow:0 4px 12px rgba(15,23,42,.05);}
.land-prep-chip:active{transform:scale(.98);}
.land-prep-chip-ico{
  width:36px;height:36px;border-radius:10px;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  background:var(--s);color:var(--red);
}
.land-prep-chip.on{
  border-color:var(--red);background:rgba(232,72,85,.14);color:var(--red);
  box-shadow:0 0 0 2px rgba(232,72,85,.2);
}
.land-prep-chip.on .land-prep-chip-ico{background:rgba(232,72,85,.18);}
.land-prep-summary{
  padding:14px 16px;border-radius:12px;background:var(--s);border:1px solid var(--b);
  font-size:13px;color:var(--fg2);line-height:1.55;margin-bottom:16px;
}
.land-prep-cta{width:100%;margin-bottom:10px;}
.land-prep-cta.google-signin-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;}
.land-prep-cta.google-signin-btn svg{flex-shrink:0;}
.land-prep-foot{font-size:12px;color:var(--fg3);text-align:center;margin:12px 0 0;}
.land-prep-foot--welcome{margin-top:20px;text-align:left;}
.land-prep-link,
button.land-prep-link,
a.land-prep-link{
  display:inline;border:none !important;background:none !important;box-shadow:none !important;
  outline:none;padding:0;margin:0;color:var(--red);font-weight:700;cursor:pointer;
  font-family:inherit;font-size:inherit;line-height:inherit;
  -webkit-appearance:none;appearance:none;border-radius:0;min-width:0;
  text-decoration:none;
}
.land-prep-link:hover{text-decoration:underline;color:var(--red-hover);}
.land-prep-continue{
  width:100%;margin-top:16px;
  transition:opacity .2s,transform .2s,background .2s;
}
.land-prep-continue:disabled{
  opacity:.4;cursor:not-allowed;transform:none !important;
}
.land-prep-continue--ready:not(:disabled):hover{transform:translateY(-1px);}
.land-prep-steps li.is-done .land-prep-n{background:rgba(232,72,85,.15);color:var(--red);}
.land-prep-dots{display:flex;justify-content:center;gap:6px;margin-top:14px;}
.land-prep-dots i{width:7px;height:7px;border-radius:50%;background:var(--b2);display:block;}
.land-prep-dots i.on{width:22px;border-radius:100px;background:var(--red);}
body.on-prep .land-btn,
body.on-prep .land-prep-choice,
body.on-prep .land-prep-chip,
body.on-prep .land-prep-back,
body.on-prep .land-prep-link{cursor:pointer !important;pointer-events:auto !important;}

/* Sign-in sheet on onboarding */
.prep-signin-overlay{
  position:fixed;inset:0;z-index:100001;
  display:flex;align-items:center;justify-content:center;padding:20px;
}
.prep-signin-overlay[hidden]{display:none !important;}
.prep-signin-backdrop{
  position:absolute;inset:0;background:rgba(17,24,39,.5);
  backdrop-filter:blur(6px);animation:prepFadeIn .25s ease;
}
.prep-signin-card{
  position:relative;z-index:1;width:min(400px,100%);
  background:#fff;border-radius:18px;border:1px solid var(--b);
  padding:28px 24px 24px;box-shadow:0 28px 70px rgba(15,23,42,.2);
  animation:prepSignInUp .32s cubic-bezier(.22,1,.36,1);
}
@keyframes prepFadeIn{from{opacity:0;}to{opacity:1;}}
@keyframes prepSignInUp{
  from{opacity:0;transform:translateY(16px) scale(.98);}
  to{opacity:1;transform:translateY(0) scale(1);}
}
.prep-signin-close{
  position:absolute;top:12px;right:12px;width:34px;height:34px;
  border-radius:10px;border:1px solid var(--b);background:var(--s);
  color:var(--fg2);cursor:pointer;display:flex;align-items:center;justify-content:center;
  transition:background .15s,border-color .15s;
}
.prep-signin-close:hover{background:var(--s2);border-color:var(--b2);}
.prep-signin-tag{
  display:inline-block;font-size:10px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--red);background:rgba(232,72,85,.1);
  padding:5px 10px;border-radius:100px;margin-bottom:12px;
}
.prep-signin-title{font-size:22px;font-weight:800;letter-spacing:-.03em;margin:0 0 8px;color:var(--fg);}
.prep-signin-sub{font-size:13px;color:var(--fg3);line-height:1.55;margin:0 0 16px;}
.prep-signin-summary{
  font-size:12px;color:var(--fg2);line-height:1.5;padding:12px 14px;
  background:var(--s);border-radius:11px;border:1px solid var(--b);margin-bottom:16px;
}
.prep-signin-google{
  width:100%;display:inline-flex;align-items:center;justify-content:center;gap:10px;
}
.prep-signin-google svg{flex-shrink:0;}
.prep-signin-or{
  display:flex;align-items:center;gap:12px;margin:14px 0;
  font-size:11px;font-weight:600;color:var(--fg3);text-transform:uppercase;
}
.prep-signin-or::before,.prep-signin-or::after{
  content:'';flex:1;height:1px;background:var(--b);
}
.prep-signin-hint{font-size:11px;color:var(--fg3);text-align:center;margin:12px 0 0;line-height:1.5;}
body.prep-signin-open{overflow:hidden;}

@media(max-width:768px){
  .land-prep-shell,.land-prep-shell--page{grid-template-columns:1fr;max-height:none;}
  .land-prep-side{display:none;}
  .land-prep-main{padding:24px 20px 20px;}
  .land-prep-grid{grid-template-columns:1fr;}
  .land-prep-home{top:10px;left:10px;}
}

.land-closing-btns .land-btn--secondary.land-btn--on-dark:hover{
  border-color:var(--red) !important;
}

.footer-brand-img{width:32px;height:32px;object-fit:contain;border-radius:8px;flex-shrink:0;}

@media(max-width:960px){
  body.on-land #page-land{padding-top:88px;}
  .land-hero{
    min-height:calc(100vh - 88px);min-height:calc(100dvh - 88px);
    padding:36px 24px 44px;
  }
  .land-hero-band{min-height:180px;margin-bottom:44px;}
  .land-hero-p{margin-bottom:36px;font-size:17px;}
  .land-stats-wrap{padding-top:72px;}
  .land-float-chip{font-size:12px;padding:8px 14px;}
  body.on-land .nav-links--float .nl{font-size:13px;padding:8px 9px 10px;}
  .land-stats{grid-template-columns:repeat(2,1fr);}
  .land-stat{border-right:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb;}
  .land-stat:nth-child(2n){border-right:none;}
  .land-stat:nth-child(3),.land-stat:nth-child(4){border-bottom:none;}
  .land-offer-grid{grid-template-columns:repeat(2,1fr);}
  .land-how-grid{grid-template-columns:1fr;}
  .land-bands-table-wrap{overflow-x:auto;}
  .land-bands-table{min-width:640px;}
  .land-closing{padding:0 16px 48px;}
  .land-closing-inner{padding:40px 24px;}
  body.on-land .nav-links--float{display:none !important;}
  .land-platform-panel{padding:28px 20px;}
  .land-platform-layout{grid-template-columns:1fr;gap:32px;}
  .land-platform-intro{position:static;}
  .land-feature-row{margin:0;padding:16px 8px;}
  .land-feat-arrow{opacity:1;transform:none;}
  .land-proof-grid{grid-template-columns:1fr;}
  body.on-land .nav-links--float{display:none;}
}
@media(max-width:600px){
  .land-hero-actions{flex-direction:column;align-items:stretch;}
  .land-hero-actions .land-btn{width:100%;}
  .land-float-chip--progress{display:none;}
  .land-offer-grid{grid-template-columns:1fr;}
}

/* ─── HERO + GEMINI SPLASH ───────────────── */
#page-land{position:relative;overflow-x:hidden;}
#page-land::before{
  content:'';position:fixed;left:0;right:0;top:0;height:min(95vh,860px);pointer-events:none;z-index:0;
  background:
    linear-gradient(180deg, rgba(250,251,252,0.35) 0%, rgba(250,251,252,0.12) 12%, transparent 30%),
    radial-gradient(ellipse 100% 78% at 50% 2%, rgba(42,171,238,0.34) 0%, rgba(91,196,247,0.16) 32%, rgba(42,171,238,0.04) 55%, transparent 78%),
    radial-gradient(ellipse 55% 55% at 10% 28%, rgba(232,72,85,0.28) 0%, rgba(236,72,153,0.12) 48%, transparent 78%),
    radial-gradient(ellipse 52% 54% at 90% 32%, rgba(236,72,153,0.26) 0%, rgba(167,139,250,0.14) 46%, transparent 76%),
    radial-gradient(ellipse 48% 46% at 50% 68%, rgba(42,171,238,0.14) 0%, rgba(232,72,85,0.08) 50%, transparent 82%),
    radial-gradient(ellipse 44% 42% at 28% 52%, rgba(167,139,250,0.20) 0%, transparent 72%);
  filter:blur(8px);
  animation:heroSplash 14s ease-in-out infinite alternate;
}
@keyframes heroSplash{
  0%{opacity:.9;transform:scale(1) translateY(0);}
  100%{opacity:1;transform:scale(1.05) translateY(-10px);}
}
.hero{
  min-height:calc(100vh - 96px);display:flex;flex-direction:column;
  align-items:center;justify-content:center;text-align:center;
  padding:120px 56px 48px;
  max-width:900px;margin:0 auto;
  position:relative;z-index:2;
}
.hero::after{
  content:'';position:absolute;left:50%;top:48%;width:min(720px,92vw);height:300px;
  transform:translate(-50%,-50%);pointer-events:none;z-index:-1;
  background:radial-gradient(ellipse at center,rgba(255,255,255,0.75) 0%,rgba(255,255,255,0.22) 55%,transparent 85%);
  border-radius:50%;
}

.hero-eyebrow{
  display:inline-flex;align-items:center;gap:7px;
  padding:5px 16px;background:var(--gd);border:1px solid var(--b2);
  border-radius:100px;font-size:11px;font-weight:600;
  letter-spacing:.12em;text-transform:uppercase;color:var(--gold);margin-bottom:32px;
  opacity:0;animation:fadeUp .6s .1s ease forwards;
}
.eyebrow-dot{width:5px;height:5px;background:var(--gold);border-radius:50%;animation:blink 2s ease infinite;}
@keyframes blink{0%,100%{opacity:1;}50%{opacity:.3;}}

.hero-h{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:clamp(56px,7vw,96px);font-weight:800;
  line-height:1.02;letter-spacing:-.03em;color:var(--fg);
  margin-bottom:24px;
  opacity:0;animation:fadeUp .7s .2s ease forwards;
}
.hero-h em{font-style:italic;color:var(--red);}

.hero-p{
  font-size:17px;color:var(--fg2);line-height:1.8;max-width:540px;
  margin:0 auto 44px;font-weight:400;
  opacity:0;animation:fadeUp .7s .35s ease forwards;
}

.hero-btns{
  display:flex;gap:12px;flex-wrap:wrap;justify-content:center;
  opacity:0;animation:fadeUp .7s .48s ease forwards;
  margin-bottom:72px;
}

.btn-primary{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-width:220px;padding:13px 40px;
  background:var(--red);
  color:#fff;
  border:1px solid var(--red);
  border-radius:var(--btn-outline-radius);
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:15px;font-weight:700;cursor:default;
  transition:background .15s,box-shadow .15s;
  position:relative;overflow:hidden;
  box-shadow:0 4px 16px rgba(232,72,85,0.28);
}
.btn-primary:hover{background:var(--red-hover);border-color:var(--red-hover);color:#fff;box-shadow:0 6px 20px rgba(232,72,85,0.32);}
.btn-primary svg{stroke:#fff;}


.btn-ghost{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  min-width:200px;padding:12px 36px;
  background:var(--white);
  color:var(--fg);
  border:1px solid var(--btn-outline-border);
  border-radius:var(--btn-outline-radius);
  font-family:'Plus Jakarta Sans',sans-serif;font-size:15px;font-weight:600;
  cursor:default;
  transition:background .15s,border-color .15s,color .15s;
  box-shadow:none;
}
.btn-ghost:hover{background:var(--btn-outline-hover);border-color:rgba(42,171,238,0.35);}


/* ── HERO PROOF STRIP ── */
.hero-proof{
  display:flex;gap:10px;flex-wrap:wrap;justify-content:center;
  opacity:0;animation:fadeUp .7s .62s ease forwards;
}
.hp-card{
  display:flex;align-items:center;gap:10px;
  padding:12px 18px;
  background:var(--s);border:1px solid var(--b);border-radius:14px;
  transition:border-color .2s,transform .2s;
}
.hp-card:hover{border-color:var(--b2);transform:translateY(-2px);}
.hp-ico{font-size:20px;flex-shrink:0;display:flex;align-items:center;justify-content:center;}
.hp-text{text-align:left;}
.hp-val{font-family:'Plus Jakarta Sans',sans-serif;font-size:22px;color:var(--gold);line-height:1;}
.hp-lbl{font-size:11px;color:var(--fg3);font-weight:500;margin-top:1px;}

/* ── SCROLL ARROW ── */
.hero-scroll{
  position:absolute;bottom:32px;left:50%;transform:translateX(-50%);
  display:flex;flex-direction:column;align-items:center;gap:6px;
  opacity:0;animation:fadeUp .7s 1.1s ease forwards;
  cursor:pointer;
}
.hero-scroll-line{width:1px;height:36px;background:linear-gradient(to bottom,var(--gold),transparent);}
.hero-scroll-dot{width:6px;height:6px;border-radius:50%;background:var(--gold);animation:scrollBounce 1.8s ease-in-out infinite;}
@keyframes scrollBounce{0%,100%{transform:translateY(0);}50%{transform:translateY(8px);}}

/* ─── STATS ───────────────────────────────── */
.stats-wrap{border-top:1px solid var(--b);border-bottom:1px solid var(--b);}
.stats{max-width:1280px;margin:0 auto;padding:0 56px;display:grid;grid-template-columns:repeat(4,1fr);}
.stat{padding:40px 20px;text-align:center;border-right:1px solid var(--b);transition:background .25s;}
.stat:last-child{border-right:none;}
.stat:hover{background:var(--s);}
.stat-n{font-family:'Plus Jakarta Sans',sans-serif;font-size:48px;color:var(--gold);line-height:1;}
.stat-l{font-size:11px;font-weight:600;letter-spacing:.09em;text-transform:uppercase;color:var(--fg3);margin-top:8px;}

/* ─── SECTIONS ────────────────────────────── */
.sec{max-width:1280px;margin:0 auto;padding:96px 56px;}
.sec-label{display:inline-flex;align-items:center;gap:9px;font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--red);margin-bottom:16px;}
.sec-label::before{content:'';width:18px;height:2px;background:var(--red);border-radius:1px;}
.sec-h{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:clamp(38px,4vw,58px);line-height:1.08;letter-spacing:-.03em;color:var(--fg);margin-bottom:14px;}
.sec-h em{font-style:italic;color:var(--gold);}
.sec-p{font-size:15px;color:var(--fg2);max-width:480px;line-height:1.8;margin-bottom:56px;}

/* divider */
.divider{height:1px;background:var(--b);max-width:1280px;margin:0 auto;}

/* ─── STEPS ───────────────────────────────── */
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--b);border-radius:18px;overflow:hidden;}
.step{background:var(--s);padding:40px 36px;position:relative;overflow:hidden;transition:background .22s;}
.step:hover{background:var(--s2);}
.step::after{content:'';position:absolute;top:0;left:0;right:0;height:2px;background:linear-gradient(90deg,transparent,var(--gold),transparent);opacity:0;transition:opacity .22s;}
.step:hover::after{opacity:1;}
.step-num{font-family:'Plus Jakarta Sans',sans-serif;font-size:80px;color:var(--b2);line-height:1;margin-bottom:20px;transition:color .22s;}
.step:hover .step-num{color:rgba(201,168,76,.15);}
.step-ico{width:46px;height:46px;background:var(--s2);border:1px solid var(--b);border-radius:12px;display:flex;align-items:center;justify-content:center;margin-bottom:16px;color:var(--fg2);}
.step-t{font-size:16px;font-weight:700;color:var(--fg);margin-bottom:9px;}
.step-d{font-size:13.5px;color:var(--fg2);line-height:1.72;}

/* ─── FEATURES ────────────────────────────── */
.feat-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--b);}
.feat{background:var(--s);padding:34px 30px;transition:background .2s;position:relative;overflow:hidden;}
.feat:hover{background:var(--s2);}
.feat::before{content:'';position:absolute;inset:0;background:radial-gradient(circle at 80% 20%,rgba(201,168,76,.04),transparent 55%);opacity:0;transition:opacity .3s;}
.feat:hover::before{opacity:1;}
.feat-ico{width:46px;height:46px;background:var(--s2);border:1px solid var(--b);border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:20px;margin-bottom:20px;color:var(--fg2);}
.feat-t{font-size:15px;font-weight:700;color:var(--fg);margin-bottom:8px;}
.feat-d{font-size:13px;color:var(--fg2);line-height:1.74;}
.feat-new{position:absolute;top:20px;right:20px;background:var(--red);color:#fff;font-size:9px;font-weight:800;letter-spacing:.07em;text-transform:uppercase;padding:3px 8px;border-radius:var(--btn-outline-radius);}

/* ─── TESTIMONIALS ────────────────────────── */
.testi-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.testi{background:var(--s);border:1px solid var(--b);border-radius:16px;padding:28px;transition:all .22s;}
.testi:hover{border-color:var(--b2);box-shadow:var(--shsm);}
.testi-stars{color:var(--gold);font-size:12px;letter-spacing:2px;margin-bottom:14px;}
.testi-q{font-size:14px;color:var(--fg2);line-height:1.78;margin-bottom:18px;font-style:italic;}
.testi-author{display:flex;align-items:center;gap:11px;}
.testi-av{width:36px;height:36px;border-radius:50%;background:var(--gd);border:1.5px solid var(--b2);display:flex;align-items:center;justify-content:center;font-size:14px;font-weight:700;color:var(--gold);}
.testi-name{font-size:13px;font-weight:700;color:var(--fg);}
.testi-score{font-size:11px;color:var(--gold);margin-top:1px;}

/* ─── CTA ─────────────────────────────────── */
.cta-wrap{max-width:1280px;margin:0 auto;padding:0 56px 80px;}
.premium-section.sec{padding-bottom:60px;}

/* ── NEW PRICING DESIGN ── */
.pricing-outer{
  background:var(--white);
  position:relative;overflow:hidden;padding:100px 0 80px;
}
.pricing-outer::before{content:'';position:absolute;top:-100px;right:10%;width:800px;height:800px;background:radial-gradient(circle,rgba(42,171,238,.10),transparent 60%);pointer-events:none;}
.pricing-outer::after{content:'';position:absolute;bottom:-120px;left:5%;width:600px;height:600px;background:radial-gradient(circle,rgba(232,72,85,.08),transparent 60%);pointer-events:none;}
.pricing-outer .floating-orb{position:absolute;border-radius:50%;filter:blur(40px);pointer-events:none;animation:orbFloat 8s ease-in-out infinite;}
@keyframes orbFloat{0%,100%{transform:translateY(0) scale(1)}33%{transform:translateY(-20px) scale(1.05)}66%{transform:translateY(10px) scale(.95)}}
.pricing-inner{max-width:900px;margin:0 auto;padding:0 40px;}
.pricing-header{text-align:center;margin-bottom:60px;}
.pricing-title{font-family:'Plus Jakarta Sans',sans-serif;font-size:clamp(36px,5vw,56px);font-weight:800;letter-spacing:-.03em;color:var(--fg);line-height:1.1;margin:12px 0 16px;}
.pricing-title em{font-style:italic;color:var(--gold);}
.pricing-sub{font-size:16px;color:var(--fg3);font-weight:400;}
.pricing-cards-wrap{display:grid;grid-template-columns:1fr 1.08fr;gap:20px;align-items:start;}
/* Free card */
.pc2{
  background:var(--s);border:1px solid var(--b);border-radius:24px;
  padding:36px 32px;position:relative;display:flex;flex-direction:column;
  transition:transform .25s,box-shadow .25s;
}
.pc2:hover{box-shadow:0 12px 40px rgba(0,0,0,.15);}
/* Premium card */
.pc2.pc2-featured{
  background:var(--white);
  border:1.5px solid rgba(232,72,85,.28);
  box-shadow:0 8px 32px rgba(232,72,85,.10),0 2px 8px rgba(0,0,0,.04);
}
.pc2.pc2-featured:hover{box-shadow:0 12px 40px rgba(232,72,85,.14),0 4px 12px rgba(0,0,0,.06);}
.pc2-badge{
  position:absolute;top:-1px;left:50%;transform:translateX(-50%);
  background:var(--red);
  color:#fff;font-size:10px;font-weight:800;letter-spacing:.12em;
  padding:5px 18px;border-radius:0 0 8px 8px;white-space:nowrap;
}
.pc2-top{margin-bottom:4px;}
.pc2-plan-name{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--fg3);margin-bottom:14px;display:flex;align-items:center;gap:6px;}
.pc2-plan-name.gold{color:var(--gold);}
.pc2-plan-name svg{stroke:var(--gold);}
.pc2-price-wrap{display:flex;align-items:flex-end;gap:6px;margin-bottom:10px;}
.pc2-price{font-family:'Plus Jakarta Sans',sans-serif;font-size:48px;font-weight:800;color:var(--fg);letter-spacing:-.03em;line-height:1;}
.pc2-curr{font-size:16px;color:var(--fg2);font-weight:600;}
.pc2-price-meta{display:flex;flex-direction:column;}
.pc2-per{font-size:12px;color:var(--fg3);}
.pc2-desc{font-size:13px;color:var(--fg3);margin-bottom:0;}
.pc2-divider{height:1px;background:var(--b);margin:24px 0;}
.pc2-divider.gold{background:linear-gradient(90deg,transparent,rgba(201,168,76,.3),transparent);}
.pc2-list{list-style:none;padding:0;margin:0 0 32px;display:flex;flex-direction:column;gap:11px;}
.pc2-item{display:flex;align-items:center;gap:10px;font-size:13.5px;color:var(--fg2);}
.pc2-item::before{content:'';width:18px;height:18px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;background-size:10px 10px;background-repeat:no-repeat;background-position:center;}
.pc2-item.yes::before{content:'✓';background:rgba(22,163,74,.1);color:#16a34a;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;width:18px;height:18px;}
.pc2-item.no{color:var(--fg3);}
.pc2-item.no::before{content:'–';background:rgba(150,150,150,.08);color:var(--fg3);font-size:13px;font-weight:600;display:flex;align-items:center;justify-content:center;width:18px;height:18px;}
.pc2-item.yes.gold{color:var(--fg);}
.pc2-item.yes.gold::before{background:rgba(201,168,76,.15);color:var(--gold);}
.pc2-item.yes.gold svg{stroke:var(--gold);opacity:.8;margin-left:-2px;}
.pc2-btn{width:100%;padding:14px;border-radius:var(--btn-outline-radius);font-family:'Plus Jakarta Sans',sans-serif;font-size:14px;font-weight:700;cursor:pointer;transition:background .15s,border-color .15s;letter-spacing:-.01em;margin-top:auto;background:transparent;border:1.5px solid var(--btn-outline-border);color:var(--fg);box-shadow:none;}
.pc2-btn-free{background:var(--white);border:1px solid var(--btn-outline-border);color:var(--fg);}
.pc2-btn-free:hover{background:var(--bg);}
.pc2-btn-gold{background:var(--red);border:1px solid var(--red);color:#fff;box-shadow:0 4px 14px rgba(232,72,85,.22);}
.pc2-btn-gold:hover{background:var(--red-hover);border-color:var(--red-hover);}
.pricing-trust{display:flex;align-items:center;justify-content:center;gap:16px;margin-top:48px;flex-wrap:wrap;font-size:13px;color:var(--fg3);}
.pt-dot{opacity:.35;}
@media(max-width:640px){.pricing-cards-wrap{grid-template-columns:1fr;}.pricing-inner{padding:0 20px;}.pc2{padding:28px 22px;}}

.cta{
  background:var(--s);border:1px solid var(--b);border-radius:24px;
  padding:90px 60px;text-align:center;position:relative;overflow:hidden;
}
.cta::before{content:'';position:absolute;top:-120px;left:50%;transform:translateX(-50%);width:600px;height:500px;background:radial-gradient(ellipse,rgba(201,168,76,.06),transparent 65%);pointer-events:none;}
.cta-h{font-family:'Plus Jakarta Sans',sans-serif;font-weight:800;font-size:clamp(40px,4vw,62px);line-height:1.08;letter-spacing:-.03em;color:var(--fg);margin-bottom:18px;}
.cta-h em{font-style:italic;color:var(--gold);}
.cta-p{font-size:16px;color:var(--fg2);max-width:420px;margin:0 auto 36px;line-height:1.78;}
.cta-btns{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;}

/* ─── FOOTER ──────────────────────────────── */
.footer{border-top:1px solid var(--b);padding:32px 56px;}
.footer-inner{max-width:1280px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:14px;}
.footer-brand{font-family:'Plus Jakarta Sans',sans-serif;font-size:17px;color:var(--fg);}
.footer-links{display:flex;gap:22px;}
.footer-link{font-size:12px;font-weight:500;color:var(--fg3);text-decoration:none;cursor:pointer;transition:color .18s;}
.footer-link:hover{color:var(--gold);}
.footer-copy{font-size:12px;color:var(--fg3);}
.footer-copy a{color:var(--gold);text-decoration:none;}

/* ─── LIBRARY ─────────────────────────────── */
.lib-wrap{display:flex;min-height:calc(100vh - 64px);padding-top:64px;}
/* ── Fix page sections under fixed nav ── */
#page-history,#page-calculator,#page-settings,#page-leaderboard{padding-bottom:100px;}
#page-vocab{padding-bottom:160px;}
/* VOCAB GAME */
.vocab-wrap{max-width:680px;margin:0 auto;padding:90px 24px 120px;}
.vocab-hero{text-align:center;padding:20px 0 32px;}
.vocab-hero-icon{width:72px;height:72px;border-radius:22px;background:linear-gradient(135deg,#6366f1,#a78bfa);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;}
.vocab-hero-h{font-family:"Plus Jakarta Sans",sans-serif;font-size:26px;font-weight:800;color:var(--fg);letter-spacing:-.02em;margin-bottom:6px;}
.vocab-hero-p{font-size:13px;color:var(--fg3);margin-bottom:24px;}
.vocab-levels{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-bottom:28px;}
.vocab-level-btn{padding:14px 10px;border-radius:14px;border:1.5px solid var(--btn-outline-border);background:transparent;cursor:pointer;transition:background .15s,border-color .15s;text-align:center;font-family:inherit;color:var(--fg);}
.vocab-level-btn:hover{background:var(--btn-outline-hover);transform:none;}
.vocab-level-btn.selected{border-color:var(--fg);background:var(--btn-outline-hover);}
.vocab-level-name{font-size:13px;font-weight:700;color:var(--fg);margin-bottom:3px;}
.vocab-level-desc{font-size:10px;color:var(--fg3);}
.vocab-modes{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:24px;}
.vocab-mode-btn{padding:12px;border-radius:12px;border:1.5px solid var(--b);background:var(--s);cursor:pointer;transition:all .15s;text-align:left;font-family:inherit;display:flex;align-items:center;gap:10px;}
.vocab-mode-btn:hover{border-color:#6366f1;}
.vocab-mode-btn.selected{border-color:#6366f1;background:rgba(99,102,241,.08);}
.vocab-mode-icon{width:32px;height:32px;border-radius:9px;background:rgba(99,102,241,.12);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.vocab-mode-label{font-size:12px;font-weight:700;color:var(--fg);}
.vocab-start-btn{width:100%;padding:15px;background:transparent;color:var(--fg);border:1.5px solid var(--btn-outline-border);border-radius:var(--btn-outline-radius);font-family:"Plus Jakarta Sans",sans-serif;font-size:15px;font-weight:700;cursor:pointer;transition:background .15s;box-shadow:none;}
.vocab-start-btn:hover{background:var(--btn-outline-hover);}
.vocab-start-btn:disabled{background:transparent;color:var(--fg3);border-color:var(--b);cursor:not-allowed;transform:none;box-shadow:none;}
.vocab-quota{text-align:center;font-size:12px;color:var(--fg3);margin-bottom:16px;}
.vocab-quota span{font-weight:700;color:#6366f1;}
/* Game screen */
.vocab-game{display:none;}
.vocab-game.active{display:block;}
.vocab-progress{display:flex;align-items:center;gap:12px;margin-bottom:24px;}
.vocab-prog-bar{flex:1;height:8px;background:var(--b);border-radius:100px;overflow:hidden;}
.vocab-prog-fill{height:100%;background:linear-gradient(90deg,#6366f1,#a78bfa);border-radius:100px;transition:width .4s ease;}
.vocab-score-pill{font-size:12px;font-weight:700;color:#6366f1;background:rgba(99,102,241,.1);border-radius:100px;padding:4px 12px;white-space:nowrap;}
.vocab-card{background:var(--s);border:1.5px solid var(--b);border-radius:20px;padding:28px 24px;margin-bottom:20px;transition:border-color .2s;}
.vocab-card.correct{border-color:#16a34a;background:rgba(22,163,74,.04);}
.vocab-card.wrong{border-color:#ef4444;background:rgba(239,68,68,.04);}
.vocab-card-mode{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:#6366f1;margin-bottom:12px;}
.vocab-card-q{font-size:17px;font-weight:600;color:var(--fg);line-height:1.6;margin-bottom:20px;}
.vocab-card-q em{color:#6366f1;font-style:normal;font-weight:800;}
.vocab-input{width:100%;padding:13px 16px;border:1.5px solid var(--b);border-radius:12px;background:var(--bg);color:var(--fg);font-family:"Plus Jakarta Sans",sans-serif;font-size:15px;font-weight:600;outline:none;transition:border-color .18s;box-sizing:border-box;}
.vocab-input:focus{border-color:#6366f1;}
.vocab-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
.vocab-opt{padding:12px 16px;border-radius:12px;border:1.5px solid var(--b);background:var(--s);cursor:pointer;font-family:inherit;font-size:13px;font-weight:600;color:var(--fg);transition:all .15s;text-align:left;}
.vocab-opt:hover{border-color:#6366f1;background:rgba(99,102,241,.06);}
.vocab-opt.correct{border-color:#16a34a;background:rgba(22,163,74,.1);color:#16a34a;}
.vocab-opt.wrong{border-color:#ef4444;background:rgba(239,68,68,.1);color:#ef4444;}
.vocab-feedback{margin-top:14px;padding:12px 16px;border-radius:12px;font-size:13px;line-height:1.6;}
.vocab-feedback.correct{background:rgba(22,163,74,.08);color:#16a34a;border:1px solid rgba(22,163,74,.2);}
.vocab-feedback.wrong{background:rgba(239,68,68,.08);color:#ef4444;border:1px solid rgba(239,68,68,.2);}
.vocab-next-btn{width:100%;padding:13px;background:transparent;color:var(--fg);border:1.5px solid var(--btn-outline-border);border-radius:var(--btn-outline-radius);font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;margin-top:14px;transition:background .15s;box-shadow:none;}
.vocab-next-btn:hover{background:var(--btn-outline-hover);}
/* Results */
.vocab-results{text-align:center;padding:20px;}
.vocab-result-score{font-size:64px;font-weight:800;color:#6366f1;font-family:"Plus Jakarta Sans",sans-serif;margin-bottom:4px;}
.vocab-result-label{font-size:13px;color:var(--fg3);margin-bottom:24px;}
.vocab-result-grade{font-size:18px;font-weight:700;color:var(--fg);margin-bottom:20px;}
/* Loading */
.vocab-loading{text-align:center;padding:48px 20px;}
.vocab-loading-spinner{width:48px;height:48px;border-radius:50%;border:3px solid var(--b);border-top-color:#6366f1;animation:ldrSpin .9s linear infinite;margin:0 auto 16px;}
.vocab-loading-text{font-size:14px;color:var(--fg3);}
.vocab-gen-loader{text-align:center;padding:56px 24px 48px;max-width:340px;margin:0 auto;}
.vocab-gen-dots{display:flex;gap:8px;justify-content:center;margin-bottom:22px;}
.vocab-gen-dots span{
  width:10px;height:10px;border-radius:50%;background:var(--red);
  animation:vocabDot 1.2s ease-in-out infinite;
}
.vocab-gen-dots span:nth-child(2){animation-delay:.15s;}
.vocab-gen-dots span:nth-child(3){animation-delay:.3s;}
@keyframes vocabDot{
  0%,80%,100%{opacity:.22;transform:scale(.82);}
  40%{opacity:1;transform:scale(1);}
}
.vocab-gen-title{font-size:16px;font-weight:700;color:var(--fg);margin-bottom:8px;letter-spacing:-.01em;}
.vocab-gen-sub{font-size:13px;color:var(--fg3);line-height:1.5;min-height:2.8em;transition:opacity .25s ease;}
.vocab-gen-sub.is-busy{color:var(--red);}
.vocab-gen-cancel{
  margin-top:26px;padding:10px 22px;border-radius:12px;border:1.5px solid var(--b)!important;
  background:var(--s)!important;color:var(--fg3)!important;font-family:inherit;font-size:13px;font-weight:600;cursor:pointer;
}
.vocab-gen-cancel:hover{border-color:rgba(232,72,85,.35)!important;color:var(--red)!important;}
/* PROGRESS PAGE REDESIGN */
.prog-wrap{max-width:1000px;margin:0 auto;padding:90px 24px 40px;}
.prog-header{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:28px;gap:16px;}
.prog-header-left{}
.prog-label{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--tg);margin-bottom:8px;}
.prog-title{font-family:'Plus Jakarta Sans',sans-serif;font-size:28px;font-weight:800;color:var(--fg);letter-spacing:-.02em;margin-bottom:4px;}
.prog-sub{font-size:13px;color:var(--fg3);}
.prog-streak-pill{display:inline-flex;align-items:center;gap:6px;background:rgba(249,115,22,.1);border:1px solid rgba(249,115,22,.2);border-radius:100px;padding:7px 14px;font-size:12px;font-weight:700;color:#f97316;white-space:nowrap;}
.prog-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px;}
.prog-stat{background:var(--s);border:1px solid var(--b);border-radius:14px;padding:16px;text-align:center;}
.prog-stat-val{font-family:'Plus Jakarta Sans',sans-serif;font-size:26px;font-weight:800;color:var(--fg);margin-bottom:4px;}
.prog-stat-label{font-size:11px;color:var(--fg3);font-weight:500;}
.prog-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;}
.prog-col{display:flex;flex-direction:column;gap:14px;}
.prog-card{background:var(--s);border:1px solid var(--b);border-radius:16px;padding:18px 20px;margin-bottom:16px;}
.prog-card-head{display:flex;align-items:center;gap:8px;font-size:13px;font-weight:700;color:var(--fg);}
.prog-card-head svg{color:var(--tg);flex-shrink:0;}
@media(max-width:600px){
  .vocab-levels{grid-template-columns:repeat(2,1fr);}
  .vocab-modes{grid-template-columns:1fr;}
  .vocab-opts{grid-template-columns:1fr;}
  .vocab-wrap{padding:80px 16px 40px;}
  .vocab-hero-h{font-size:22px;}
}
@media(max-width:700px){
  .prog-wrap{padding:80px 16px 40px;}
  .prog-grid{grid-template-columns:1fr;}
  .prog-stats{grid-template-columns:repeat(2,1fr);}
  .prog-header{flex-direction:column;}
  .prog-title{font-size:22px;}
}
/* XP + LEVEL SYSTEM */
.xp-bar-wrap{background:var(--s);border:1px solid var(--b);border-radius:14px;padding:16px 18px;margin-bottom:16px;}
.xp-bar-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.xp-level-badge{display:inline-flex;align-items:center;gap:6px;background:linear-gradient(135deg,#f59e0b,#ef4444);color:#fff;font-size:11px;font-weight:800;padding:4px 12px;border-radius:100px;letter-spacing:.04em;}
.xp-level-name{font-size:13px;font-weight:700;color:var(--fg);}
.xp-amount{font-size:11px;color:var(--fg3);}
.xp-bar-track{height:8px;background:var(--b);border-radius:100px;overflow:hidden;}
.xp-bar-fill{height:100%;background:linear-gradient(90deg,#f59e0b,#ef4444);border-radius:100px;transition:width .6s cubic-bezier(.34,1.3,.64,1);}
.xp-bar-labels{display:flex;justify-content:space-between;font-size:10px;color:var(--fg3);margin-top:4px;}

/* RANK TITLE */
.rank-title-badge{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:700;padding:2px 8px;border-radius:100px;letter-spacing:.05em;margin-left:6px;}
.rank-newcomer{background:rgba(156,163,175,.15);color:#9ca3af;}
.rank-apprentice{background:rgba(34,197,94,.12);color:#16a34a;}
.rank-scholar{background:rgba(59,130,246,.12);color:#3b82f6;}
.rank-practitioner{background:rgba(99,102,241,.12);color:#6366f1;}
.rank-intermediate{background:rgba(168,85,247,.12);color:#a855f7;}
.rank-advanced{background:rgba(236,72,153,.12);color:#ec4899;}
.rank-expert{background:rgba(245,158,11,.12);color:#f59e0b;}
.rank-master{background:rgba(239,68,68,.12);color:#ef4444;}
.rank-champion{background:rgba(201,168,76,.15);color:var(--gold);}
.rank-legend{background:linear-gradient(135deg,rgba(245,158,11,.2),rgba(239,68,68,.2));color:#f97316;border:1px solid rgba(249,115,22,.3);}

/* ACHIEVEMENTS */
.ach-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:10px;margin-top:4px;}
.ach-card{background:var(--s);border:1px solid var(--b);border-radius:14px;padding:14px 12px;text-align:center;position:relative;transition:all .2s;cursor:pointer;}
.ach-card.unlocked{border-color:var(--tg);background:rgba(42,171,238,.04);}
.ach-card.unlocked:hover{box-shadow:0 6px 20px rgba(42,171,238,.15);}
.ach-card.equipped{border-color:var(--gold);background:rgba(201,168,76,.06);}
.ach-card.locked{opacity:.45;cursor:default;}
.ach-icon{margin-bottom:0;line-height:1;}
.ach-name{font-size:11px;font-weight:700;color:var(--fg);margin-bottom:3px;}
.ach-desc{font-size:10px;color:var(--fg3);line-height:1.4;}
.ach-equipped-tag{position:absolute;top:6px;right:6px;font-size:8px;font-weight:800;color:var(--gold);background:rgba(201,168,76,.15);border-radius:100px;padding:1px 5px;}
.ach-locked-icon{position:absolute;top:6px;right:6px;color:var(--fg3);}

/* BAND JOURNEY */
.band-journey{background:var(--s);border:1px solid var(--b);border-radius:14px;padding:16px 18px;margin-bottom:16px;}
.bj-head{font-size:13px;font-weight:700;color:var(--fg);margin-bottom:14px;display:flex;align-items:center;justify-content:space-between;}
.bj-chart{height:80px;position:relative;display:flex;align-items:flex-end;gap:6px;}
.bj-bar-wrap{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px;}
.bj-bar{width:100%;border-radius:4px 4px 0 0;background:linear-gradient(180deg,var(--tg),rgba(42,171,238,.3));transition:height .4s ease;min-height:4px;}
.bj-bar-label{font-size:9px;color:var(--fg3);white-space:nowrap;}
.bj-bar-val{font-size:9px;font-weight:700;color:var(--tg);}

/* STUDY GOAL */
.goal-wrap{background:var(--s);border:1px solid var(--b);border-radius:14px;padding:16px 18px;margin-bottom:16px;}
.goal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;}
.goal-title{font-size:13px;font-weight:700;color:var(--fg);}
.goal-edit-btn{
  font-size:11px;color:var(--fg2);background:var(--white);border:1px solid var(--b);
  border-radius:8px;padding:4px 12px;cursor:default;font-family:inherit;font-weight:500;
  transition:background .14s,border-color .14s,color .14s;
}
.goal-edit-btn:hover{background:var(--red);border-color:var(--red);color:#fff;}
.goal-track{height:10px;background:var(--b);border-radius:100px;overflow:hidden;margin-bottom:6px;}
.goal-fill{height:100%;border-radius:100px;transition:width .5s ease;}
.goal-labels{display:flex;justify-content:space-between;font-size:10px;color:var(--fg3);}

/* DAILY CHALLENGE */
/* Particle canvas for sections */
.section-particles{position:absolute;inset:0;pointer-events:none;overflow:hidden;z-index:0;}
.section-particles canvas{position:absolute;inset:0;}
#home-daily-challenges{position:relative;overflow:hidden;}
#home-daily-challenges::before{content:'';position:absolute;top:-80px;right:10%;width:400px;height:400px;background:radial-gradient(circle,rgba(42,171,238,.06),transparent 60%);pointer-events:none;}
#home-daily-challenges::after{content:'';position:absolute;bottom:-60px;left:5%;width:300px;height:300px;background:radial-gradient(circle,rgba(167,139,250,.05),transparent 60%);pointer-events:none;}
.dc-wrap{background:var(--s);border:1px solid var(--b);border-radius:18px;overflow:hidden;margin-bottom:20px;}
.dc-head{padding:14px 18px;display:flex;align-items:center;gap:10px;border-bottom:1px solid var(--b);background:linear-gradient(135deg,rgba(42,171,238,.05),transparent);}
.dc-head-icon{width:36px;height:36px;border-radius:10px;background:rgba(42,171,238,.12);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.dc-head-title{font-size:14px;font-weight:700;color:var(--fg);}
.dc-head-sub{font-size:11px;color:var(--fg3);}
.dc-head-timer{margin-left:auto;font-size:11px;font-weight:700;color:var(--tg);background:rgba(42,171,238,.1);border-radius:100px;padding:3px 10px;}
.dc-body{padding:16px 18px;}
.dc-challenge{display:flex;align-items:flex-start;gap:12px;padding:12px;background:var(--bg);border-radius:12px;border:1px solid var(--b);margin-bottom:10px;cursor:pointer;transition:all .15s;}
.dc-challenge:hover{border-color:var(--tg);background:rgba(42,171,238,.03);}
.dc-challenge.done{opacity:.6;cursor:default;}
.dc-challenge.done:hover{border-color:var(--b);}
.dc-ch-icon{font-size:22px;flex-shrink:0;margin-top:1px;}
.dc-ch-info{flex:1;}
.dc-ch-title{font-size:13px;font-weight:700;color:var(--fg);margin-bottom:3px;}
.dc-ch-desc{font-size:12px;color:var(--fg3);line-height:1.5;}
.dc-ch-reward{font-size:11px;font-weight:700;color:#16a34a;margin-top:4px;}
.dc-ch-status{flex-shrink:0;display:flex;align-items:center;}
.dc-ch-check{width:22px;height:22px;border-radius:50%;border:2px solid var(--b);display:flex;align-items:center;justify-content:center;}
.dc-ch-check.done{background:#16a34a;border-color:#16a34a;}
.dc-progress-bar{height:6px;background:var(--b);border-radius:100px;margin-top:12px;overflow:hidden;}
.dc-progress-fill{height:100%;background:linear-gradient(90deg,var(--tg),#a78bfa);border-radius:100px;transition:width .4s ease;}
.dc-progress-label{font-size:11px;color:var(--fg3);margin-top:5px;text-align:right;}
/* LEADERBOARD */
.lb-wrap{max-width:600px;margin:0 auto;padding:32px 20px;}
.lb-hero{text-align:center;padding:32px 0 24px;}
.lb-hero-h{font-family:'Plus Jakarta Sans',sans-serif;font-size:26px;font-weight:800;color:var(--fg);letter-spacing:-.02em;margin-bottom:4px;}
.lb-hero-p{font-size:13px;color:var(--fg3);}
.lb-tabs{display:flex;gap:6px;background:var(--s);border:1px solid var(--b);border-radius:12px;padding:4px;margin-bottom:20px;}
.lb-tab{
  flex:1;padding:8px;border-radius:9px;border:1px solid transparent;background:none;
  font-family:inherit;font-size:13px;font-weight:500;color:var(--fg3);cursor:default;
  transition:background .14s,border-color .14s,color .14s;
}
.lb-tab:hover:not(.on){background:rgba(232,72,85,.1);border-color:rgba(232,72,85,.22);color:var(--red);}
.lb-tab.on{background:var(--red);border-color:var(--red);color:#fff;}
.lb-row{display:flex;align-items:center;gap:14px;padding:13px 16px;background:var(--s);border:1px solid var(--b);border-radius:14px;margin-bottom:8px;transition:border-color .15s;}
.lb-row.me{border-color:var(--tg);background:rgba(42,171,238,.04);}
.lb-row.top1{border-color:#f59e0b;background:rgba(245,158,11,.04);}
.lb-rank{font-size:18px;font-weight:800;min-width:36px;text-align:center;}
.lb-rank.r1{color:#f59e0b;}
.lb-rank.r2{color:#9ca3af;}
.lb-rank.r3{color:#b45309;}
.lb-avatar{width:38px;height:38px;border-radius:50%;object-fit:cover;flex-shrink:0;}
.lb-avatar-fb{width:38px;height:38px;border-radius:50%;background:var(--tg);color:#fff;display:flex;align-items:center;justify-content:center;font-size:15px;font-weight:700;flex-shrink:0;}
.lb-info{flex:1;min-width:0;}
.lb-name{font-size:13px;font-weight:700;color:var(--fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lb-sub{font-size:11px;color:var(--fg3);}
.lb-score{font-size:18px;font-weight:800;color:var(--tg);}
.lb-score-label{font-size:10px;color:var(--fg3);text-align:right;}
/* STREAK REWARDS */
.streak-rewards{background:var(--s);border:1px solid var(--b);border-radius:16px;overflow:hidden;margin-top:16px;}
.sr-head{padding:14px 16px;border-bottom:1px solid var(--b);display:flex;align-items:center;gap:8px;}
.sr-head-title{font-size:14px;font-weight:700;color:var(--fg);}
.sr-row{display:flex;align-items:center;gap:12px;padding:11px 16px;border-bottom:1px solid var(--b);}
.sr-row:last-child{border-bottom:none;}
.sr-row.claimed{opacity:.5;}
.sr-row.available{background:rgba(42,171,238,.04);}
.sr-icon{font-size:20px;width:36px;text-align:center;flex-shrink:0;}
.sr-info{flex:1;}
.sr-title{font-size:13px;font-weight:600;color:var(--fg);}
.sr-sub{font-size:11px;color:var(--fg3);}
.sr-badge{font-size:10px;font-weight:700;padding:3px 8px;border-radius:100px;}
.sr-badge.claimed{background:var(--s2);color:var(--fg3);}
.sr-badge.available{background:rgba(42,171,238,.15);color:var(--tg);}
.sr-badge.locked{background:var(--s2);color:var(--fg3);}
/* ── SETTINGS PAGE ── */
.sett-wrap{max-width:640px;margin:0 auto;padding:32px 20px;}
.sett-hero{text-align:center;padding:40px 20px 32px;}
.sett-hero-icon{font-size:48px;margin-bottom:12px;}
.sett-hero-h{font-family:'Plus Jakarta Sans',sans-serif;font-size:26px;font-weight:800;color:var(--fg);letter-spacing:-.02em;margin-bottom:6px;}
.sett-hero-p{font-size:13px;color:var(--fg3);}
.sett-section{margin-bottom:28px;}
.sett-section-label{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--fg3);margin-bottom:10px;padding:0 4px;}
.sett-card{background:var(--s);border:1px solid var(--b);border-radius:16px;overflow:hidden;}
.sett-row{display:flex;align-items:center;gap:14px;padding:15px 18px;border-bottom:1px solid var(--b);transition:background .15s;cursor:default;}
.sett-row:last-child{border-bottom:none;}
.sett-row.clickable{cursor:pointer;}
.sett-row.clickable:hover{background:var(--s2);}
.sett-row-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:16px;}
.sett-row-icon.blue{background:rgba(42,171,238,.12);}
.sett-row-icon.gold{background:rgba(201,168,76,.12);}
.sett-row-icon.green{background:rgba(22,163,74,.12);}
.sett-row-icon.red{background:rgba(239,68,68,.12);}
.sett-row-icon.purple{background:rgba(139,92,246,.12);}
.sett-row-info{flex:1;min-width:0;}
.sett-row-title{font-size:14px;font-weight:600;color:var(--fg);margin-bottom:2px;}
.sett-row-sub{font-size:12px;color:var(--fg3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.sett-row-right{flex-shrink:0;font-size:12px;color:var(--fg3);}
.sett-toggle{width:44px;height:26px;border-radius:100px;background:var(--b2);border:none;cursor:pointer;position:relative;transition:background .2s;flex-shrink:0;}
.sett-toggle.on{background:var(--tg);}
.sett-toggle::after{content:'';position:absolute;width:20px;height:20px;border-radius:50%;background:#fff;top:3px;left:3px;transition:transform .2s;}
.sett-toggle.on::after{transform:translateX(18px);}
/* Device card */
.dev-card{background:var(--s);border:1px solid var(--b);border-radius:14px;padding:15px 16px;display:flex;align-items:center;gap:12px;margin-bottom:8px;transition:border-color .15s;}
.dev-card.current{border-color:var(--tg);}
.dev-card-icon{width:40px;height:40px;border-radius:11px;background:var(--s2);display:flex;align-items:center;justify-content:center;font-size:20px;flex-shrink:0;}
.dev-card-info{flex:1;min-width:0;}
.dev-card-name{font-size:13px;font-weight:500;color:var(--fg);}
.dev-card-icon--svg{color:var(--fg2);}
.dev-card-icon--svg svg{display:block;}
.dev-card-sub{font-size:11px;color:var(--fg3);margin-top:2px;}
.dev-card-badge{font-size:9px;font-weight:800;letter-spacing:.08em;padding:2px 7px;border-radius:100px;text-transform:uppercase;}
.dev-card-badge.current{background:rgba(42,171,238,.1);color:#2aabee;}
.dev-card-badge.primary{background:rgba(201,168,76,.1);color:var(--gold);}
.sett-danger-btn{width:100%;padding:13px;background:transparent;color:var(--re);border:1.5px solid rgba(239,68,68,.35);border-radius:var(--btn-outline-radius);font-family:inherit;font-size:14px;font-weight:700;cursor:pointer;transition:background .15s;box-shadow:none;}
.sett-danger-btn:hover{background:rgba(239,68,68,.1);}
/* Locked state */
.sett-locked{text-align:center;padding:40px 20px;color:var(--fg3);}
.sett-locked-icon{font-size:40px;margin-bottom:12px;}

/* ── History page redesign ── */
.hist-hero{
  padding:96px 56px 32px;
}
.hist-hero-label{
  font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;
  color:var(--tg);margin-bottom:12px;display:flex;align-items:center;gap:8px;
}
.hist-hero-label::before{content:'';width:24px;height:2px;background:var(--tg);border-radius:1px;}
.hist-hero-h{
  font-family:'Plus Jakarta Sans',sans-serif;font-size:clamp(32px,5vw,52px);
  font-weight:800;color:var(--fg);line-height:1.1;letter-spacing:-.03em;margin-bottom:14px;
}
.hist-hero-h em{font-style:italic;color:var(--tg);}
.hist-hero-p{font-size:15px;color:var(--fg2);line-height:1.6;max-width:480px;}

.hist-stats-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;
  padding:0 56px 32px;
}
.hist-stat-card{
  background:var(--s);border:1px solid var(--b);border-radius:16px;
  padding:20px 16px;text-align:center;
  transition:transform .15s,box-shadow .15s;
}
.hist-stat-card:hover{box-shadow:0 6px 20px rgba(0,0,0,.08);}
.hist-stat-n{
  font-family:'Plus Jakarta Sans',sans-serif;font-size:36px;font-weight:800;
  color:var(--tg);line-height:1;margin-bottom:6px;
}
.hist-stat-l{font-size:10px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--fg3);}

.hist-section{padding:0 56px 20px;}
.hist-card{
  background:var(--s);border:1px solid var(--b);border-radius:18px;
  padding:24px;overflow:hidden;
}
.hist-card-title{font-family:'Plus Jakarta Sans',sans-serif;font-size:16px;font-weight:700;color:var(--fg);margin-bottom:2px;}
.hist-card-sub{font-size:12px;color:var(--fg3);}

/* Mobile */
@media(max-width:600px){
  .hist-hero{padding:76px 16px 24px !important;}
  .hist-hero-h{font-size:32px !important;}
  .hist-hero-p{font-size:14px !important;}
  .hist-stats-grid{
    grid-template-columns:repeat(2,1fr) !important;
    gap:10px !important;
    padding:0 16px 20px !important;
  }
  .hist-stat-card{padding:16px 12px !important;border-radius:14px !important;}
  .hist-stat-n{font-size:28px !important;}
  .hist-section{padding:0 16px 16px !important;}
  .hist-card{padding:18px 16px !important;border-radius:16px !important;}
  #page-history{padding-bottom:90px !important;}
}


/* ── Sidebar ── */
.lib-sidebar{
  width:230px;flex-shrink:0;
  background:var(--bg);
  border-right:1px solid var(--b);
  padding:28px 12px 40px;
  display:flex;flex-direction:column;gap:2px;
  position:sticky;top:64px;
  height:calc(100vh - 64px);overflow-y:auto;
}
.lib-sb-label{
  font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;
  color:var(--fg3);padding:4px 12px 4px;margin-top:18px;margin-bottom:4px;
}
.lib-sb-label:first-child{margin-top:0;}
.lib-nav-btn{
  display:flex;align-items:center;gap:11px;
  padding:9px 12px;border-radius:8px;border:none;
  background:transparent;color:var(--fg2);
  font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:500;
  cursor:pointer;transition:all .15s;width:100%;text-align:left;
}
.lib-nav-btn:hover{background:var(--s);color:var(--fg);}
.lib-nav-btn.active{background:var(--gd);color:var(--gold);font-weight:600;}
.lib-nav-ico{width:18px;height:18px;display:flex;align-items:center;justify-content:center;flex-shrink:0;opacity:.7;}
.lib-nav-btn.active .lib-nav-ico{opacity:1;}
.lib-nav-count{
  margin-left:auto;font-size:10px;font-weight:600;
  color:var(--fg3);background:var(--s2);
  padding:1px 7px;border-radius:100px;min-width:22px;text-align:center;
}
.lib-nav-btn.active .lib-nav-count{color:var(--gold);background:rgba(42,171,238,.15);}
.lib-nav-soon{
  margin-left:auto;font-size:9px;font-weight:600;letter-spacing:.04em;
  color:var(--fg3);background:var(--s2);padding:1px 7px;border-radius:100px;text-transform:uppercase;
}

/* ── Main Content ── */
.lib-main{flex:1;min-width:0;padding:32px 36px 100px;background:var(--bg);}
.lib-topbar{display:flex;align-items:center;gap:10px;margin-bottom:6px;flex-wrap:wrap;}
.lib-topbar-titlerow{display:flex;align-items:center;gap:10px;width:100%;flex-wrap:wrap;}
#mob-section-tabs{display:none;}

.lib-title{font-family:'Plus Jakarta Sans',sans-serif;font-size:24px;font-weight:700;color:var(--fg);letter-spacing:-.02em;}
.lib-title-count{font-size:13px;color:var(--fg3);font-weight:400;margin-left:8px;}

/* ── Tabs — full-width border-style ── */
.lib-tabs{
  display:grid;grid-template-columns:repeat(3,1fr);
  border:1px solid var(--b);border-radius:10px;overflow:hidden;
  margin-bottom:20px;background:var(--s);
}
.lib-tab{
  padding:10px 16px;border:none;background:transparent;
  color:var(--fg3);font-family:'Plus Jakarta Sans',sans-serif;
  font-size:13px;font-weight:500;cursor:pointer;
  transition:all .15s;display:flex;align-items:center;justify-content:center;gap:7px;
  border-right:1px solid var(--b);
}
.lib-tab:last-child{border-right:none;}
.lib-tab:hover{background:var(--s2);color:var(--fg);}
.lib-tab.active{background:var(--s2);color:var(--fg);font-weight:600;}
.lib-tab.active.free{color:var(--gr);}
.lib-tab.active.premium{color:var(--gold);}

/* ── Search + Filters ── */
.lib-filters-row{display:flex;align-items:center;gap:8px;margin-bottom:28px;flex-wrap:wrap;}
.lib-search-wrap{flex:1;min-width:200px;max-width:340px;position:relative;}
.lib-search-ico{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--fg3);pointer-events:none;display:flex;}
.lib-search-in{
  width:100%;padding:9px 12px 9px 38px;
  background:var(--s);border:1px solid var(--b);border-radius:8px;
  color:var(--fg);font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;
  outline:none;transition:border-color .15s;
}
.lib-search-in:focus{border-color:var(--b2);}
.lib-search-in::placeholder{color:var(--fg3);}
.lib-filter-sel{
  padding:9px 12px;background:var(--s);border:1px solid var(--b);
  border-radius:8px;color:var(--fg2);font-family:'Plus Jakarta Sans',sans-serif;
  font-size:12.5px;font-weight:500;cursor:pointer;outline:none;transition:border-color .15s;
}
.lib-filter-sel:focus{border-color:var(--b2);}

/* ── Section Label ── */
.lib-section-label{
  font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;
  color:var(--fg3);margin-bottom:12px;margin-top:4px;
  display:flex;align-items:center;gap:8px;
}
.lib-section-label svg{opacity:.5;}
.lib-section-label::after{content:'';flex:1;height:1px;background:var(--b);}
.lib-list{display:flex;flex-direction:column;gap:8px;margin-bottom:32px;}

/* ── Test Row ── */
.lib-row{
  background:var(--s);
  border:1px solid var(--b);
  border-radius:14px;
  padding:16px 20px;
  display:flex;align-items:center;gap:16px;
  cursor:default;transition:background .15s,border-color .15s;
  position:relative;
}
.lib-list .lib-row:first-child{border-radius:14px;}
.lib-list .lib-row:last-child{border-radius:14px;}
.lib-list .lib-row:only-child{border-radius:14px;}
.lib-list .lib-row+.lib-row{border-top:1px solid var(--b);}
.lib-row:hover{background:var(--s2);border-color:var(--b2);}
.lib-row-ico{
  width:44px;height:44px;border-radius:12px;
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
  border:1px solid var(--b);background:var(--bg);
}
.lib-row-ico.reading{background:rgba(42,100,200,.1);border-color:rgba(42,100,200,.2);}
.lib-row-ico.reading svg{stroke:#6090e0;}
.lib-row-ico.listening{background:rgba(100,50,200,.08);border-color:rgba(100,50,200,.15);}
.lib-row-ico.listening svg{stroke:#9070d8;}
.lib-row-body{flex:1;min-width:0;}
.lib-row-title{font-size:14.5px;font-weight:700;color:var(--fg);line-height:1.3;margin-bottom:6px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.lib-row-meta{display:flex;align-items:center;gap:10px;font-size:12px;color:var(--fg3);flex-wrap:wrap;}
.lib-row-diff{display:inline-flex;align-items:center;gap:5px;font-size:11.5px;font-weight:600;}
.lib-row-diff.easy{color:#16a34a;}.lib-row-diff.medium{color:#d97706;}.lib-row-diff.hard{color:#dc2626;}
.lib-row-meta-sep{opacity:.4;}
.lib-row-meta-item{display:inline-flex;align-items:center;gap:4px;}
.lib-row-meta-item svg{opacity:.6;}
.lib-meta-ico{display:inline-flex;align-items:center;gap:4px;}
.lib-meta-ico svg{opacity:.55;}
.lib-row-right{display:flex;align-items:center;gap:10px;flex-shrink:0;}
.lib-row-tag{
  font-size:11px;font-weight:600;
  padding:3px 10px;border-radius:6px;
  display:inline-flex;align-items:center;gap:4px;
}
.lib-row-tag.free{background:rgba(22,163,74,.08);color:#16a34a;border:1px solid rgba(22,163,74,.2);}
.lib-row-tag.premium{background:rgba(42,171,238,.08);color:var(--tg);border:1px solid rgba(42,171,238,.2);}
.lib-start-btn{
  min-width:120px;padding:10px 28px;
  background:transparent;
  color:var(--fg);
  border:1.5px solid var(--btn-outline-border);
  border-radius:var(--btn-outline-radius);
  font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:700;
  cursor:pointer;transition:background .15s,border-color .15s;
  white-space:nowrap;letter-spacing:-.01em;
  position:relative;overflow:hidden;
  box-shadow:none;
}
.lib-start-btn:hover{background:var(--btn-outline-hover);}

.lib-lock-btn{
  padding:8px 16px;background:transparent;color:var(--fg);
  border:1.5px solid var(--btn-outline-border);border-radius:var(--btn-outline-radius);
  font-family:'Plus Jakarta Sans',sans-serif;font-size:12px;font-weight:600;
  cursor:pointer;transition:background .15s,border-color .15s,color .15s;
  display:inline-flex;align-items:center;gap:5px;
  box-shadow:none;
}
.lib-lock-btn:hover{background:var(--btn-outline-hover);color:var(--fg);}
.lib-empty{text-align:center;padding:80px 20px;color:var(--fg3);font-size:14px;}
.calc-inp{width:100%;padding:10px 14px;background:var(--bg);border:1.5px solid var(--b);border-radius:10px;font-family:'Plus Jakarta Sans',sans-serif;font-size:18px;font-weight:700;color:var(--fg);outline:none;transition:border-color .18s;}
.calc-inp:focus{border-color:var(--gold);}
.calc-inp::placeholder{color:var(--fg3);font-weight:400;font-size:15px;}

/* Writing section */
.wr-mode-btn{display:flex;align-items:center;gap:8px;padding:10px 20px;background:var(--s);border:1.5px solid var(--b);border-radius:12px;font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:600;color:var(--fg2);cursor:pointer;transition:all .18s;}
.wr-mode-btn.active{background:var(--blue);color:#fff;border-color:var(--blue);}
.wr-mode-btn:not(.active):hover{border-color:var(--b2);color:var(--fg);}
.wr-test-card{background:var(--s);border:1px solid var(--b);border-radius:16px;padding:20px 24px;display:flex;align-items:center;gap:18px;cursor:pointer;transition:all .18s;}
.wr-test-card:hover{border-color:var(--b2);transform:translateY(-1px);box-shadow:0 4px 20px rgba(0,0,0,.08);}
.wr-test-ico{width:46px;height:46px;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-shrink:0;font-size:20px;}
.wr-test-ico.t1{background:rgba(42,171,238,.1);}
.wr-test-ico.t2{background:rgba(201,168,76,.1);}
.wr-test-title{font-size:14.5px;font-weight:700;color:var(--fg);margin-bottom:4px;}
.wr-test-meta{font-size:12px;color:var(--fg3);}
.wr-task-btn{flex:1;padding:10px 16px;background:var(--s2);border:1.5px solid var(--b);border-radius:10px;font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:600;color:var(--fg2);cursor:pointer;transition:all .18s;text-align:center;}
.wr-task-btn.active{background:var(--blue);color:#fff;border-color:var(--blue);}
.wr-upload-zone{display:flex;flex-direction:column;align-items:center;justify-content:center;border:2px dashed var(--b2);border-radius:14px;padding:32px;cursor:pointer;transition:all .18s;text-align:center;}
.wr-upload-zone:hover{border-color:var(--gold);background:rgba(201,168,76,.03);}
.wr-textarea{width:100%;background:var(--bg);border:1.5px solid var(--b);border-radius:12px;padding:14px 16px;font-family:'Plus Jakarta Sans',sans-serif;font-size:14px;line-height:1.7;color:var(--fg);outline:none;resize:vertical;transition:border-color .18s;box-sizing:border-box;}
.wr-textarea:focus{border-color:var(--gold);}
.wr-select{padding:8px 14px;background:var(--s2);border:1.5px solid var(--b);border-radius:10px;font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:600;color:var(--fg);outline:none;cursor:pointer;}
.wr-type-btn{padding:7px 14px;background:var(--s2);border:1px solid var(--b);border-radius:8px;font-family:'Plus Jakarta Sans',sans-serif;font-size:12px;font-weight:600;color:var(--fg2);cursor:pointer;transition:all .15s;}
.wr-type-btn.active{background:rgba(42,171,238,.12);color:var(--tg);border-color:rgba(42,171,238,.3);}
.wr-feedback-band{font-family:'Plus Jakarta Sans',sans-serif;font-size:72px;font-weight:800;color:var(--gold);line-height:1;}
.wr-criterion{background:var(--s);border:1px solid var(--b);border-radius:14px;padding:20px;margin-bottom:12px;}
.wr-criterion-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.wr-criterion-name{font-size:13px;font-weight:700;color:var(--fg);}
.wr-criterion-score{font-family:'Plus Jakarta Sans',sans-serif;font-size:22px;font-weight:800;color:var(--gold);}
.wr-criterion-bar{height:6px;background:var(--b);border-radius:3px;margin-bottom:12px;}
.wr-criterion-fill{height:6px;background:linear-gradient(90deg,var(--gold),#e8c84a);border-radius:3px;transition:width .6s ease;}
.wr-criterion-text{font-size:13px;color:var(--fg2);line-height:1.7;}

/* ── diff bars ── */
.diff-bars{display:inline-flex;gap:2px;align-items:flex-end;height:13px;vertical-align:middle;}
.diff-bar{width:3px;border-radius:2px;}
.diff-bar.lit{opacity:1;}.diff-bar.dim{opacity:.18;}

/* ── icon utils ── */
.lib-meta-ico{display:inline-flex;align-items:center;gap:3px;}
.lib-meta-ico svg{flex-shrink:0;vertical-align:middle;}
.lib-row-ico svg{display:block;}
.asb-ico svg,.lib-nav-ico svg{display:inline-block;vertical-align:middle;}
/* ─── ADMIN ───────────────────────────────── */
.admin-wall{position:absolute;inset:0;min-height:100vh;background:var(--bg);z-index:50;display:flex;align-items:center;justify-content:center;}
.aw-box{background:var(--s);border:1px solid var(--b2);border-radius:22px;padding:56px 48px;max-width:400px;width:90%;text-align:center;}
.aw-ico{font-size:44px;margin-bottom:18px;}
.aw-h{font-family:'Plus Jakarta Sans',sans-serif;font-size:30px;color:var(--fg);margin-bottom:8px;}
.aw-p{font-size:13.5px;color:var(--fg2);margin-bottom:28px;line-height:1.65;}
.aw-err{font-size:12.5px;color:var(--re);padding:11px 15px;background:var(--re2);border:1px solid rgba(239,68,68,.2);border-radius:9px;margin-top:12px;display:none;line-height:1.5;}
.aw-err.show{display:block;}
.admin-wrap{display:flex;min-height:100vh;}
.adm-sb{width:240px;background:var(--bg);border-right:1px solid var(--b);display:flex;flex-direction:column;flex-shrink:0;}
.asb-head{padding:20px 18px 14px;border-bottom:1px solid var(--b);}
.asb-logo{font-family:'Plus Jakarta Sans',sans-serif;font-size:15px;font-weight:700;color:var(--fg);display:flex;align-items:center;gap:8px;overflow:hidden;}
.asb-sub{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--gold);margin-top:4px;padding-left:34px;}
.asb-sec{padding:20px 16px 5px;font-size:9px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--fg3);opacity:.5;}
.asb-item{display:flex;align-items:center;gap:10px;padding:9px 14px;margin:2px 8px;border-radius:10px;cursor:pointer;transition:all .15s;font-size:13px;font-weight:500;color:var(--fg2);border:1px solid transparent;}
.asb-item:hover{background:var(--s);color:var(--fg);}
.asb-item.on{background:rgba(42,171,238,.1);color:#2aabee;border-color:rgba(42,171,238,.2);font-weight:700;}
.asb-ico{width:16px;text-align:center;font-size:14px;flex-shrink:0;}
.asb-bot{margin-top:auto;padding:12px 10px;border-top:1px solid var(--b);}
.asb-user{display:flex;align-items:center;gap:9px;padding:8px 8px 5px;}
.asb-av{width:30px;height:30px;border-radius:50%;background:var(--gd);border:1.5px solid var(--b2);display:flex;align-items:center;justify-content:center;font-size:12px;flex-shrink:0;}
.asb-av img{width:100%;height:100%;border-radius:50%;object-fit:cover;}
.asb-name{font-size:12.5px;font-weight:700;color:var(--fg);}
.asb-role{font-size:10px;font-weight:700;color:var(--gold);text-transform:uppercase;letter-spacing:.05em;}
.asb-so{display:flex;align-items:center;gap:7px;padding:8px 14px;margin:2px 10px;border-radius:8px;cursor:pointer;font-size:13px;font-weight:500;color:var(--fg2);background:none;border:none;font-family:'Plus Jakarta Sans',sans-serif;transition:all .18s;width:calc(100% - 20px);text-align:left;}
.asb-so:hover{color:var(--re);background:var(--re2);}
.adm-main{flex:1;overflow-y:auto;background:var(--bg2);}
.adm-panel{display:none;padding:32px 36px 100px;max-width:1100px;}
.adm-panel.on{display:block;}
.adm-h{font-family:'Plus Jakarta Sans',sans-serif;font-size:26px;font-weight:800;color:var(--fg);margin-bottom:4px;letter-spacing:-.02em;}
.adm-sub{font-size:13px;color:var(--fg2);margin-bottom:24px;line-height:1.6;}
.adm-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:24px;}
.adm-stat{background:var(--s);border:1px solid var(--b);border-radius:14px;padding:18px 20px;transition:border-color .15s;}
.adm-stat:hover{border-color:rgba(42,171,238,.25);}
.adm-stat-n{font-family:'Plus Jakarta Sans',sans-serif;font-size:32px;color:var(--tg);font-weight:800;letter-spacing:-.02em;}
.adm-stat-l{font-size:10px;font-weight:700;letter-spacing:.07em;text-transform:uppercase;color:var(--fg3);margin-top:4px;}
.adm-card{background:var(--s);border:1px solid var(--b);border-radius:16px;padding:24px;margin-bottom:16px;transition:border-color .15s;}.adm-card:hover{border-color:rgba(42,171,238,.2);}
.adm-card-h{font-size:14px;font-weight:700;color:var(--fg);margin-bottom:3px;}
.adm-card-sub{font-size:12px;color:var(--fg2);margin-bottom:18px;line-height:1.5;}
.uz{border:2px dashed var(--b2);border-radius:13px;padding:46px;text-align:center;cursor:pointer;transition:all .2s;margin-bottom:18px;}
.uz:hover{border-color:var(--gold);background:var(--gd);}
.uz-ico{font-size:38px;margin-bottom:11px;}
.uz-t{font-size:15px;font-weight:700;color:var(--fg);margin-bottom:5px;}
.uz-s{font-size:12px;color:var(--fg2);}
.frow{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:12px;}
.fg{display:flex;flex-direction:column;gap:5px;}
.fg.full{grid-column:1/-1;}
.flbl{font-size:11px;font-weight:700;color:var(--fg2);letter-spacing:.07em;text-transform:uppercase;}
.fi,.fs{padding:10px 13px;background:var(--s2);border:1px solid var(--b);border-radius:9px;color:var(--fg);font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;outline:none;transition:border-color .18s;}
.fi:focus,.fs:focus{border-color:var(--b2);}
.fs option{background:var(--bg2);}
.prog{height:4px;background:var(--s3);border-radius:2px;overflow:hidden;margin-top:10px;}
.prog-f{height:100%;background:linear-gradient(90deg,var(--gold),var(--gold2));border-radius:2px;transition:width .4s;width:0;}
.sbar{padding:11px 15px;border-radius:9px;font-size:12.5px;margin-top:10px;display:none;align-items:center;gap:7px;}
.sbar.show{display:flex;}
.sbar.ok{background:rgba(42,171,238,.08);border:1px solid rgba(42,171,238,.22);color:#0d85cc;}
.sbar.err{background:var(--re2);border:1px solid rgba(232,72,85,.28);color:var(--red);}
.sbar.inf{background:var(--gd);border:1px solid var(--b2);color:var(--gold);}
.adm-table{background:var(--s);border:1px solid var(--b);border-radius:14px;overflow:hidden;}
.adm-thead{display:grid;gap:12px;padding:12px 18px;background:var(--s2);font-size:10.5px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--fg3);}
.adm-trow{display:grid;gap:12px;padding:12px 18px;border-top:1px solid var(--b);align-items:center;transition:background .15s;}
.adm-trow:hover{background:var(--s2);}
.adm-tc{font-size:13px;color:var(--fg);font-weight:500;}
.adm-badge{padding:3px 9px;border-radius:100px;font-size:10px;font-weight:700;text-transform:uppercase;display:inline-flex;letter-spacing:.04em;}
.adm-badge.reading{background:rgba(26,53,120,.25);color:#7090e0;}
.adm-badge.listening{background:rgba(120,26,120,.2);color:#c070e0;}
.adm-del{padding:5px 11px;border-radius:7px;font-size:11px;font-weight:700;cursor:pointer;border:none;background:var(--re2);color:var(--re);font-family:'Plus Jakarta Sans',sans-serif;transition:all .15s;}
.adm-del:hover{background:rgba(239,68,68,.18);}
.abtn{padding:10px 22px;border-radius:var(--btn-outline-radius);font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:700;cursor:pointer;background:transparent;border:1.5px solid var(--btn-outline-border);color:var(--fg);transition:background .15s;box-shadow:none;}
.abtn-gold{background:transparent;border:1.5px solid var(--btn-outline-border);color:var(--fg);}
.abtn-gold:hover{background:var(--btn-outline-hover);}
.abtn-gold:disabled{background:transparent;color:var(--fg3);border-color:var(--b);cursor:not-allowed;}
.abtn-out{background:transparent;border:1.5px solid var(--btn-outline-border);color:var(--fg);}
.abtn-out:hover{background:var(--btn-outline-hover);}
.abtn-danger{background:transparent;border:1.5px solid rgba(239,68,68,.35);color:var(--re);}
.abtn-danger:hover{background:rgba(239,68,68,.1);}

/* ─── TG MODAL ────────────────────────────── */
.overlay{position:fixed;inset:0;background:rgba(250,251,252,.72);backdrop-filter:blur(14px);z-index:1000;display:none;align-items:center;justify-content:center;}
.overlay.show{display:flex;}
.tgmodal{background:var(--s);border:1px solid var(--b2);border-radius:22px;width:360px;overflow:hidden;box-shadow:var(--sh);animation:popIn .26s cubic-bezier(.34,1.3,.64,1);}
@keyframes popIn{from{opacity:0;transform:scale(.88);}to{opacity:1;transform:scale(1);}}

/* ── MARQUEE ── */
.marquee-wrap{overflow:hidden;mask-image:linear-gradient(to right,transparent,black 8%,black 92%,transparent);}
.marquee-track{display:flex;gap:14px;width:max-content;animation:marqueeScroll 40s linear infinite;}
.marquee-reverse{animation-direction:reverse;}
.marquee-track:hover{animation-play-state:paused;}
.marquee-card{background:var(--s);border:1px solid var(--b);border-radius:16px;padding:20px 22px;width:300px;flex-shrink:0;}
.marquee-card-q{font-size:13.5px;color:var(--fg2);line-height:1.7;margin-bottom:14px;font-style:italic;}
.marquee-card-author{display:flex;align-items:center;gap:10px;}
.marquee-card-av{width:32px;height:32px;border-radius:50%;background:var(--gd);border:1.5px solid var(--b2);display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:700;color:var(--gold);flex-shrink:0;}
.marquee-card-name{font-size:13px;font-weight:700;color:var(--fg);}
.marquee-card-score{font-size:11px;color:var(--gold);margin-top:1px;}
@keyframes marqueeScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

/* ── LOOP ANIMATIONS (landing page alive) ── */
/* Floating pulse on hero band score badge */
@keyframes floatPulse{0%,100%{transform:translateY(0);}50%{transform:translateY(-8px);}}
/* Glow shimmer on CTA button */
@keyframes glowPulse{0%,100%{box-shadow:0 0 0 0 rgba(42,171,238,0);}50%{box-shadow:0 0 22px 6px rgba(42,171,238,0.35);}}
.btn-cta-shine::after{display:none;}
@keyframes ctaSweep{0%,100%{left:-80%;opacity:0;}10%{opacity:1;}40%{left:140%;opacity:1;}50%,99%{left:140%;opacity:0;}}
/* Subtle rotate for decorative elements */
@keyframes spinSlow{from{transform:rotate(0deg);}to{transform:rotate(360deg);}}
/* Typewriter blink */
/* Bouncing arrow */
@keyframes bounceDown{0%,100%{transform:translateY(0);}50%{transform:translateY(6px);}}
.tgm-head{padding:30px 28px 24px;text-align:center;background:linear-gradient(160deg,rgba(201,168,76,.06),transparent);border-bottom:1px solid var(--b);}
.tgm-logo{width:58px;height:58px;background:var(--tg);border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:26px;margin:0 auto 14px;}
.tgm-h{font-family:'Plus Jakarta Sans',sans-serif;font-size:22px;color:var(--fg);margin-bottom:4px;}
.tgm-s{font-size:12.5px;color:var(--fg2);}
.tgm-body{padding:24px;}
.tgm-widget-wrap{display:flex;flex-direction:column;align-items:center;min-height:56px;margin-bottom:14px;}
.tgm-loading{display:flex;flex-direction:column;align-items:center;padding:14px 0;gap:8px;}
.tgm-spinner{width:28px;height:28px;border:3px solid var(--b2);border-top-color:var(--tg);border-radius:50%;animation:tgspin .75s linear infinite;}
@keyframes tgspin{to{transform:rotate(360deg);}}
/* ─── PREMIUM BADGE ─────────────────────── */
.prem-badge{display:inline-flex;align-items:center;gap:4px;background:rgba(201,168,76,.12);color:var(--gold);border:1px solid rgba(201,168,76,.3);font-size:10px;font-weight:800;letter-spacing:.06em;padding:2px 7px;border-radius:6px;}
.ban-badge{display:inline-flex;align-items:center;gap:4px;background:rgba(239,68,68,.12);color:var(--re);border:1px solid rgba(239,68,68,.25);font-size:10px;font-weight:800;letter-spacing:.06em;padding:2px 7px;border-radius:6px;}
/* ─── ADMIN TABLE ACTIONS ─────────────────── */
.adm-act{display:flex;gap:5px;align-items:center;flex-wrap:wrap;}
.abtn-sm{font-size:11px;padding:4px 11px;border-radius:8px;border:1.5px solid var(--btn-outline-border);background:transparent;color:var(--fg);cursor:pointer;font-family:inherit;font-weight:700;transition:background .15s;display:inline-flex;align-items:center;gap:4px;white-space:nowrap;box-shadow:none;}
.abtn-sm:hover{background:var(--btn-outline-hover);transform:none;}
.abtn-sm.gold,.abtn-sm.red,.abtn-sm.blue,.abtn-sm.green{background:transparent;border:1.5px solid var(--btn-outline-border);color:var(--fg);}
.abtn-sm.gold:hover,.abtn-sm.red:hover,.abtn-sm.blue:hover,.abtn-sm.green:hover{background:var(--btn-outline-hover);}
.abtn-sm.red{border-color:rgba(239,68,68,.35);color:var(--re);}
.abtn-sm.red:hover{background:rgba(239,68,68,.1);}
.abtn-sm.green{border-color:rgba(34,197,94,.35);color:#16a34a;}
.abtn-sm.green:hover{background:rgba(34,197,94,.1);}
/* ─── ANALYTICS CHART AREA ──────────────── */
.anal-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px;}
@media(max-width:680px){.anal-grid{grid-template-columns:1fr;}}
.anal-stat{background:var(--s);border:1px solid var(--b);border-radius:13px;padding:22px 20px;display:flex;flex-direction:column;gap:4px;}
.anal-stat-n{font-family:'Plus Jakarta Sans',sans-serif;font-size:36px;color:var(--gold);line-height:1;}
.anal-stat-l{font-size:12px;color:var(--fg3);font-weight:600;letter-spacing:.04em;text-transform:uppercase;}
/* ─── PRICING UZS ───────────────────────── */
.pc-price-uzs{font-family:'Plus Jakarta Sans',sans-serif;font-size:36px;color:var(--fg);line-height:1;margin-bottom:4px;font-weight:800;}
.pc-period-uzs{font-size:13px;color:var(--fg2);margin-bottom:16px;}
.pc-yearly{font-size:12px;color:var(--fg3);background:var(--s2);border-radius:8px;padding:6px 12px;margin-bottom:16px;display:inline-block;}
/* ─── ANNOUNCE CARD ─────────────────────── */
.ann-card{background:var(--s);border:1px solid var(--b);border-radius:12px;padding:18px;margin-bottom:10px;display:flex;justify-content:space-between;align-items:flex-start;gap:12px;}
.ann-card-title{font-size:14px;font-weight:700;color:var(--fg);margin-bottom:4px;}
.ann-card-body{font-size:12px;color:var(--fg2);line-height:1.55;}
.ann-card-meta{font-size:11px;color:var(--fg3);margin-top:6px;}
.tgm-note{font-size:11.5px;color:var(--fg3);text-align:center;line-height:1.6;}
.tgm-switch{background:none;border:none;color:var(--tg);font-size:12px;font-family:'Plus Jakarta Sans',sans-serif;cursor:pointer;margin-top:6px;padding:4px 8px;border-radius:6px;transition:background .15s;display:block;width:100%;text-align:center;}
.tgm-switch:hover{background:rgba(42,171,238,.1);}
.tgm-note a{color:var(--tg);text-decoration:none;}
.tgm-cancel{width:100%;padding:11px;background:transparent;border:1.5px solid var(--btn-outline-border);border-radius:var(--btn-outline-radius);color:var(--fg);font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:600;cursor:pointer;margin-top:10px;transition:background .15s;box-shadow:none;}
.tgm-cancel:hover{background:var(--btn-outline-hover);color:var(--fg);}

/* tg btn shared */
.tg-btn{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;padding:13px;background:transparent;color:var(--fg);border:1.5px solid var(--btn-outline-border);border-radius:var(--btn-outline-radius);font-family:'Plus Jakarta Sans',sans-serif;font-size:14px;font-weight:700;cursor:pointer;transition:background .15s;box-shadow:none;}
.tg-btn:hover{background:var(--btn-outline-hover);transform:none;}

/* login gate */
/* Practice auth gate */
.prac-gate{
  display:none;flex-direction:column;align-items:center;justify-content:flex-start;
  width:100%;min-height:calc(100vh - 64px);padding:88px 24px 48px;
  position:relative;z-index:1;background:transparent;
}
#page-lib.prac-guest{overflow-x:hidden;}
#page-lib.prac-guest::before{
  content:'';position:fixed;left:0;right:0;top:0;height:min(560px,60vh);pointer-events:none;z-index:0;
  background:
    linear-gradient(180deg, rgba(250,251,252,0.4) 0%, rgba(250,251,252,0.12) 14%, transparent 34%),
    radial-gradient(ellipse 100% 78% at 50% 0%, rgba(42,171,238,0.26) 0%, rgba(91,196,247,0.10) 40%, transparent 78%),
    radial-gradient(ellipse 48% 50% at 88% 22%, rgba(236,72,153,0.20) 0%, rgba(167,139,250,0.08) 45%, transparent 74%),
    radial-gradient(ellipse 45% 48% at 12% 26%, rgba(232,72,85,0.18) 0%, transparent 72%);
  filter:blur(6px);
}
#page-lib.prac-guest .lib-wrap{display:none;}
#page-lib.prac-guest .prac-gate{position:relative;z-index:1;}
.prac-gate-inner{display:flex;flex-direction:column;align-items:center;text-align:center;max-width:440px;padding:0 24px;width:100%;}
.prac-gate-emoji{font-size:56px;margin-bottom:16px;animation:gateFloat 3s ease-in-out infinite;}
@keyframes gateFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-10px)}}
.prac-gate-h{font-family:'Plus Jakarta Sans',sans-serif;font-size:28px;font-weight:800;color:var(--fg);letter-spacing:-.02em;margin-bottom:8px;}
.prac-gate-p{font-size:14px;color:var(--fg3);line-height:1.6;margin-bottom:28px;}
.prac-gate-btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:14px 32px;background:transparent;color:var(--fg);border:1.5px solid var(--btn-outline-border);border-radius:var(--btn-outline-radius);font-family:'Plus Jakarta Sans',sans-serif;font-size:15px;font-weight:700;cursor:pointer;transition:background .15s;box-shadow:none;margin:0 auto;}
.prac-gate-btn:hover{background:var(--btn-outline-hover);transform:none;}
.prac-gate-btn svg{flex-shrink:0;}
.prac-gate-arrow{margin-top:32px;display:flex;flex-direction:column;align-items:center;gap:6px;color:var(--fg3);font-size:12px;}
.prac-gate-arrow svg{animation:arrowBounce 1.2s ease-in-out infinite;}
@keyframes arrowBounce{0%,100%{transform:translateY(0)}50%{transform:translateY(8px)}}
.prac-gate-perks{display:flex;gap:12px;justify-content:center;flex-wrap:wrap;margin-bottom:28px;}
.prac-gate-perk{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--fg2);background:var(--s);border:1px solid var(--btn-outline-border);border-radius:100px;padding:5px 12px;}
.prac-gate-icon-wrap{width:72px;height:72px;border-radius:20px;background:rgba(94,181,247,.1);border:1px solid rgba(94,181,247,.2);display:flex;align-items:center;justify-content:center;margin:0 auto 20px;animation:gateFloat 3s ease-in-out infinite;}
/* Nav sign-in arrow */
.nav-signin-hint{position:absolute;top:calc(100% + 10px);right:0;display:flex;flex-direction:column;align-items:flex-end;gap:4px;pointer-events:none;animation:hintFadeIn .5s ease forwards;z-index:9999;}
@keyframes hintFadeIn{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}
.nav-signin-hint-text{font-family:'Plus Jakarta Sans',sans-serif;font-size:12px;font-weight:700;color:var(--tg);background:rgba(42,171,238,.1);border:1px solid rgba(42,171,238,.25);border-radius:10px;padding:5px 10px;white-space:nowrap;}
.nav-signin-hint-arrow{color:var(--tg);animation:arrowBounce 1s ease-in-out infinite;}
.lg-overlay{position:fixed;inset:0;background:rgba(6,8,16,.8);backdrop-filter:blur(10px);z-index:500;display:none;align-items:center;justify-content:center;}
.lg-overlay.show{display:flex;}
.lg-card{background:var(--s);border:1px solid var(--b2);border-radius:22px;padding:46px;max-width:380px;width:90%;text-align:center;animation:popIn .26s ease;box-shadow:var(--sh);}
.lg-ico{font-size:40px;margin-bottom:15px;}
.lg-h{font-family:'Plus Jakarta Sans',sans-serif;font-size:26px;color:var(--fg);margin-bottom:8px;}
.lg-p{font-size:13.5px;color:var(--fg2);margin-bottom:26px;line-height:1.65;}
.lg-skip{margin-top:12px;font-size:12px;color:var(--fg3);cursor:pointer;}
.lg-skip:hover{color:var(--fg2);}

/* toast */
.toast{position:fixed;bottom:76px;left:50%;transform:translateX(-50%) translateY(6px);background:var(--s2);border:1px solid var(--b);border-radius:8px;padding:10px 20px;font-size:12.5px;font-weight:500;color:var(--fg);z-index:9000;opacity:0;transition:all .22s cubic-bezier(.4,0,.2,1);pointer-events:none;white-space:nowrap;box-shadow:0 4px 20px rgba(0,0,0,.2);}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* Bottom nav — replaced by app sidebar */
#pnav{display:none !important;visibility:hidden !important;pointer-events:none !important;}
.pnav{
  position:fixed;bottom:24px;left:50%;
  transform:translateX(-50%);z-index:8000;
  background:var(--white);border:1px solid var(--b);border-radius:100px;
  padding:6px 10px;display:none;gap:4px;
  box-shadow:0 8px 28px rgba(0,0,0,.10);backdrop-filter:blur(20px);
  -webkit-backdrop-filter:blur(20px);
}
html.guest #pnav,body.guest #pnav,body:not(.user-signed-in) #pnav{
  display:none !important;visibility:hidden !important;pointer-events:none !important;
}
body.user-signed-in #pnav{display:none !important;visibility:hidden !important;pointer-events:none !important;}
.dp{padding:13px 32px;border-radius:100px;font-family:'Plus Jakarta Sans',sans-serif;font-size:15.5px;font-weight:500;cursor:pointer;border:none;background:transparent;color:var(--fg2);transition:all .15s;letter-spacing:-.01em;white-space:nowrap;}
.dp:hover{color:var(--fg);}
.dp.on{background:var(--blue);color:#fff;font-weight:600;}

/* ── MOBILE BOTTOM NAV (phones only) ── */
@media(max-width:768px){
  body.user-signed-in #pnav{
    bottom:0 !important;left:0 !important;right:0 !important;
    transform:none !important;
    border-radius:0 !important;
    padding:0 !important;
    width:100% !important;
    border:none !important;
    border-top:1px solid rgba(0,0,0,.08) !important;
    background:rgba(255,255,255,0.97) !important;
    backdrop-filter:blur(20px) saturate(1.2) !important;
    -webkit-backdrop-filter:blur(20px) saturate(1.2) !important;
    box-shadow:0 -2px 16px rgba(0,0,0,.08) !important;
    gap:0 !important;
    display:flex !important;
    align-items:stretch !important;
    min-height:62px;
    height:auto;
    padding-bottom:env(safe-area-inset-bottom) !important;
  }
  .dp{
    flex:1 !important;min-width:0 !important;
    padding:8px 2px 6px !important;
    border-radius:0 !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:4px !important;
    font-size:10px !important;
    font-weight:600 !important;
    color:#4b5563 !important;
    height:auto !important;
    min-height:62px;
    border-top:2px solid transparent !important;
    background:transparent !important;
    transition:color .15s,background .15s !important;
    -webkit-tap-highlight-color:transparent;
  }
  .dp::before{
    content:'';display:block;flex-shrink:0;
    width:24px;height:24px;
    background-position:center;background-repeat:no-repeat;
    background-size:24px 24px;
    opacity:1 !important;
  }
  .dp.on{
    color:var(--blue) !important;
    border-top-color:var(--blue) !important;
    font-weight:700 !important;
    background:rgba(42,171,238,0.08) !important;
  }
  /* Inactive icons — dark gray, full opacity */
  #dp-land:not(.on)::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23374151' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 01-2 2H5a2 2 0 01-2-2z'/%3E%3Cpolyline points='9 22 9 12 15 12 15 22'/%3E%3C/svg%3E");}
  #dp-lib:not(.on)::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23374151' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5A2.5 2.5 0 016.5 17H20'/%3E%3Cpath d='M6.5 2H20v20H6.5A2.5 2.5 0 014 19.5v-15A2.5 2.5 0 016.5 2z'/%3E%3C/svg%3E");}
  #dp-history:not(.on)::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23374151' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='20' x2='18' y2='10'/%3E%3Cline x1='12' y1='20' x2='12' y2='4'/%3E%3Cline x1='6' y1='20' x2='6' y2='14'/%3E%3C/svg%3E");}
  #dp-admin:not(.on)::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23374151' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 20c0-4 3.6-7 8-7s8 3 8 7'/%3E%3C/svg%3E");}
  #dp-calculator:not(.on)::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23374151' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='2' width='16' height='20' rx='2'/%3E%3Cline x1='8' y1='6' x2='16' y2='6'/%3E%3Cline x1='8' y1='10' x2='16' y2='10'/%3E%3Cline x1='8' y1='14' x2='16' y2='14'/%3E%3Cline x1='8' y1='18' x2='16' y2='18'/%3E%3C/svg%3E");}
  #dp-leaderboard:not(.on)::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23374151' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 21h8M12 17v4M17 3H7l-2 7h14z'/%3E%3Cpath d='M12 10a3 3 0 110-6 3 3 0 010 6z'/%3E%3C/svg%3E");}
  #dp-vocab:not(.on)::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23374151' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2L3 14h9l-1 8 10-12h-9l1-8z'/%3E%3C/svg%3E");}
  #dp-settings:not(.on)::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23374151' stroke-width='2.25' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 010 2.83 2 2 0 01-2.83 0l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 01-4 0v-.09A1.65 1.65 0 009 19.4a1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 01-2.83-2.83l.06-.06A1.65 1.65 0 004.68 15a1.65 1.65 0 00-1.51-1H3a2 2 0 010-4h.09A1.65 1.65 0 004.6 9a1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 012.83-2.83l.06.06A1.65 1.65 0 009 4.68a1.65 1.65 0 001-1.51V3a2 2 0 014 0v.09a1.65 1.65 0 001 1.51 1.65 1.65 0 001.82-.33l.06-.06a2 2 0 012.83 2.83l-.06.06A1.65 1.65 0 0019.4 9a1.65 1.65 0 001.51 1H21a2 2 0 010 4h-.09a1.65 1.65 0 00-1.51 1z'/%3E%3C/svg%3E");}
  /* Active icons — telegram blue */
  #dp-land.on::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232AABEE' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M3 9l9-7 9 7v11a2 2 0 01-2 2H5a2 2 0 01-2-2z'/%3E%3Cpolyline points='9 22 9 12 15 12 15 22'/%3E%3C/svg%3E");}
  #dp-lib.on::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232AABEE' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 19.5A2.5 2.5 0 016.5 17H20'/%3E%3Cpath d='M6.5 2H20v20H6.5A2.5 2.5 0 014 19.5v-15A2.5 2.5 0 016.5 2z'/%3E%3C/svg%3E");}
  #dp-history.on::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232AABEE' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cline x1='18' y1='20' x2='18' y2='10'/%3E%3Cline x1='12' y1='20' x2='12' y2='4'/%3E%3Cline x1='6' y1='20' x2='6' y2='14'/%3E%3C/svg%3E");}
  #dp-admin.on::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232AABEE' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='8' r='4'/%3E%3Cpath d='M4 20c0-4 3.6-7 8-7s8 3 8 7'/%3E%3C/svg%3E");}
  #dp-calculator.on::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232AABEE' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='2' width='16' height='20' rx='2'/%3E%3Cline x1='8' y1='6' x2='16' y2='6'/%3E%3Cline x1='8' y1='10' x2='16' y2='10'/%3E%3Cline x1='8' y1='14' x2='16' y2='14'/%3E%3Cline x1='8' y1='18' x2='16' y2='18'/%3E%3C/svg%3E");}
  #dp-leaderboard.on::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232AABEE' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M8 21h8M12 17v4M17 3H7l-2 7h14z'/%3E%3Cpath d='M12 10a3 3 0 110-6 3 3 0 010 6z'/%3E%3C/svg%3E");}
  #dp-vocab.on::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232AABEE' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M13 2L3 14h9l-1 8 10-12h-9l1-8z'/%3E%3C/svg%3E");}
  #dp-settings.on::before{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%232AABEE' stroke-width='2.5' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='3'/%3E%3Cpath d='M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 010 2.83 2 2 0 01-2.83 0l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 01-4 0v-.09A1.65 1.65 0 009 19.4a1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 01-2.83-2.83l.06-.06A1.65 1.65 0 004.68 15a1.65 1.65 0 00-1.51-1H3a2 2 0 010-4h.09A1.65 1.65 0 004.6 9a1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 012.83-2.83l.06.06A1.65 1.65 0 009 4.68a1.65 1.65 0 001-1.51V3a2 2 0 014 0v.09a1.65 1.65 0 001 1.51 1.65 1.65 0 001.82-.33l.06-.06a2 2 0 012.83 2.83l-.06.06A1.65 1.65 0 0019.4 9a1.65 1.65 0 001.51 1H21a2 2 0 010 4h-.09a1.65 1.65 0 00-1.51 1z'/%3E%3C/svg%3E");}
}

/* ─── SCROLL ANIMATIONS ───────────────────── */
.reveal{opacity:0;transform:translateY(32px);transition:opacity .7s ease,transform .7s ease;}
.reveal.revealed{opacity:1;transform:translateY(0);}
.reveal-left{opacity:0;transform:translateX(-32px);transition:opacity .7s ease,transform .7s ease;}
.reveal-left.revealed{opacity:1;transform:translateX(0);}
.reveal-right{opacity:0;transform:translateX(32px);transition:opacity .7s ease,transform .7s ease;}
.reveal-right.revealed{opacity:1;transform:translateX(0);}
.reveal-scale{opacity:0;transform:scale(.94);transition:opacity .6s ease,transform .6s ease;}
.reveal-scale.revealed{opacity:1;transform:scale(1);}

/* stagger children */
.stagger > *{opacity:0;transform:translateY(24px);transition:opacity .55s ease,transform .55s ease;}
.stagger.revealed > *{opacity:1;transform:translateY(0);}
.stagger.revealed > *:nth-child(1){transition-delay:.05s;}
.stagger.revealed > *:nth-child(2){transition-delay:.12s;}
.stagger.revealed > *:nth-child(3){transition-delay:.19s;}
.stagger.revealed > *:nth-child(4){transition-delay:.26s;}
.stagger.revealed > *:nth-child(5){transition-delay:.33s;}
.stagger.revealed > *:nth-child(6){transition-delay:.40s;}
.stagger.revealed > *:nth-child(7){transition-delay:.47s;}
.stagger.revealed > *:nth-child(8){transition-delay:.54s;}
.stagger.revealed > *:nth-child(9){transition-delay:.61s;}

/* ─── RESPONSIVE ──────────────────────────── */
/* ── TABLET 960px ── */
@media(max-width:960px){
  .nav{padding:0 16px;}
  .nav-links{display:none;}
  .hero{padding:90px 20px 52px;min-height:auto;}
  .hero-h{font-size:clamp(40px,8vw,72px);}
  .hero-proof{gap:8px;flex-wrap:wrap;justify-content:center;}
  .hp-card{padding:10px 14px;}
  .stats{grid-template-columns:repeat(2,1fr);gap:12px;}
  .sec,.adm-panel,.cta-wrap,.footer{padding-left:20px;padding-right:20px;}
  .steps-grid,.feat-grid{grid-template-columns:1fr;}
  .testi-grid{grid-template-columns:1fr;}
  .adm-stats{grid-template-columns:repeat(2,1fr);}
  .admin-wrap{flex-direction:column;}
  .adm-sb{width:100%;}
  .cta{padding:52px 24px;}
}

/* ── MOBILE 600px ── */
@media(max-width:600px){
  /* NAV */
  .nav{padding:0 14px;height:52px;}
  .logo-text{font-size:15px;}
  .nav-right{gap:6px;}
  .uchip{padding:5px 10px;font-size:12px;gap:5px;}
  .uchip-name{display:none;}
  .theme-btn{width:32px;height:32px;}
  /* hide logo image+text when back btn is visible to save space */
  .nav.back-visible .logo-svg,
  .nav.back-visible .logo-text{display:none !important;}
  /* truncate user name on mobile */
  .uc-name{max-width:60px;font-size:12px;}

  /* HERO */
  .hero{padding:78px 16px 48px;text-align:center;}
  .hero-eyebrow{font-size:10px;padding:6px 14px;}
  .hero-h{font-size:clamp(32px,9vw,52px);letter-spacing:-.02em;}
  .hero-p{font-size:14px;max-width:100%;}
  .hero-cta{flex-direction:column;align-items:center;gap:10px;}
  .hero-cta .btn-primary,.hero-cta .btn-ghost{width:100%;max-width:300px;justify-content:center;}
  .hero-proof{flex-direction:column;align-items:center;gap:8px;}
  .hp-card{width:100%;max-width:260px;justify-content:center;}

  /* STATS */
  .stats{grid-template-columns:repeat(2,1fr);gap:10px;padding:20px 16px;}
  .stat-n{font-size:34px;}

  /* SECTIONS */
  .sec{padding:52px 16px;}
  .sec-h{font-size:clamp(28px,7vw,44px);}
  .sec-label{font-size:10px;}

  /* STEPS */
  .steps-grid{grid-template-columns:1fr;gap:20px;}
  .step-num{font-size:52px;}

  /* FEATURES */
  .feat-grid{grid-template-columns:1fr;gap:16px;}
  .feat-card{padding:20px;}

  /* TESTIMONIALS */
  .testi-grid{grid-template-columns:1fr;gap:14px;}

  /* PRICING */
  .pricing-grid{grid-template-columns:1fr;gap:24px;max-width:400px;margin:0 auto;}

  /* CTA */
  .cta{padding:44px 16px;}
  .cta-h{font-size:clamp(26px,7vw,40px);}
  .cta-btns{flex-direction:column;align-items:center;gap:10px;}
  .cta-btns .btn-primary,.cta-btns .btn-ghost{width:100%;max-width:280px;justify-content:center;}

  /* FOOTER */
  .footer{padding:32px 16px 90px !important;}
  .footer-grid{grid-template-columns:1fr;gap:28px;}
  .footer-bottom{flex-direction:column;align-items:flex-start;gap:10px;}
  .footer-badges{gap:8px;}

  /* LIBRARY */
  .lib-wrap{flex-direction:column;}
  .lib-sidebar{width:100%;height:auto;position:static;flex-direction:row;flex-wrap:wrap;padding:12px 16px;gap:4px;border-right:none;border-bottom:1px solid var(--b);}
  .lib-sb-label{display:none;}
  .lib-nav-btn{width:auto;padding:7px 12px;font-size:12px;}
  .lib-nav-btn.active::before{display:none;}
  .lib-main{padding:16px 16px 80px;}
  .lib-topbar{gap:6px;}
  .lib-tabs{overflow-x:auto;white-space:nowrap;}
  .lib-filters-row{flex-wrap:wrap;}
  .lib-search-wrap{max-width:100%;flex:1 1 200px;}
  .lib-row{flex-wrap:wrap;gap:10px;}
  .lib-row-right{flex:1;justify-content:flex-end;}
  .lib-row-title{white-space:normal;}

  /* PROGRESS PAGE */
  .hist-stats{grid-template-columns:repeat(2,1fr);gap:10px;}

  /* ADMIN */
  .admin-wrap{flex-direction:column;}
  .adm-sb{width:100%;flex-direction:row;flex-wrap:wrap;padding:8px;}
  .asb-head{display:none;}
  .asb-sec{display:none;}
  .adm-sb .asb-item{padding:6px 10px;font-size:12px;border-radius:8px;}
  .adm-stats{grid-template-columns:repeat(2,1fr);gap:10px;}
  .adm-panel{padding:16px;}
  .adm-h{font-size:24px;}

  /* TEST RUNNER */
  .tr-head{padding:0 12px;height:50px;}
  .tr-title{font-size:12px;max-width:160px;}
  .tr-timer{font-size:14px;padding:5px 12px;}
  .tr-submit{padding:7px 14px;font-size:12px;}
  .tr-body{display:flex;flex-direction:column !important;flex:1 !important;overflow:hidden !important;min-height:0 !important;}
  .tr-body.hidden{display:none !important;}
  .tr-passage{border-right:none;border-bottom:1px solid var(--b);padding:16px;font-size:14px;max-height:40vh;overflow-y:auto;}
  .tr-qs{padding:16px;overflow-y:auto;}
  .tr-q{padding:12px;}
  .tr-q-text{font-size:13px;}

  /* MODALS */
  .tgmodal{margin:16px;padding:0;max-width:calc(100% - 32px);}
  .tgm-head{padding:24px 20px 16px;}
  .tgm-body{padding:16px 20px 20px;}
  .username-modal{margin:16px;max-width:calc(100% - 32px);}

  /* CALCULATOR */
  .calc-wrap{padding:24px 16px;}

}

/* ══════════════════════════════════════
   COMPREHENSIVE MOBILE OVERHAUL ≤600px
══════════════════════════════════════ */
@media(max-width:600px){

  /* Reading layout handled by dedicated mobile block below */

  /* ── CALCULATOR ── */
  #calc-inner{flex-direction:column !important;padding:80px 16px 100px !important;}
  #calc-inner > div:first-child{grid-template-columns:1fr !important;}
  #calc-inner > div:nth-child(2){order:3;}
  #calc-inner > div:last-child > div{grid-template-columns:repeat(3,1fr) !important;gap:6px !important;}

  /* ── WRITING PAGE (before exam) ── */
  #page-writing .lib-head{padding:90px 16px 20px !important;}
  #page-writing > div[style*="padding:0 56px"]{padding:0 16px 20px !important;}
  #page-writing #wr-preset-panel,#page-writing #wr-custom-panel{padding:0 16px 80px !important;}
  .wr-test-card{padding:14px !important;}
  .wr-mode-btn{padding:9px 14px !important;font-size:12px !important;}
}

@media(max-width:600px){
  /* ── WRITING EXAM ── */
  #we-tab-bar{display:block !important;}
  #we-question-pane{width:100% !important;border-right:none !important;padding:20px 16px !important;}
  #we-answer-pane{padding:16px !important;}
  #we-answer{font-size:16px !important;padding:16px !important;border-radius:10px !important;height:100% !important;min-height:0 !important;}
  #writing-exam > div:first-child{padding:0 12px !important;height:52px !important;gap:8px !important;}
  #writing-exam > div:first-child button:first-child{padding:6px 10px !important;font-size:12px !important;}
  #we-title{font-size:13px !important;}
  #we-timer{font-size:14px !important;}
  #we-wordcount{font-size:11px !important;padding:4px 8px !important;}
  #we-submit-btn{padding:7px 14px !important;font-size:12px !important;}

  /* ── WRITING FEEDBACK ── */
  #writing-feedback > div{padding:16px !important;}
  #writing-feedback-content > div:first-child{padding:24px 16px !important;}
  #writing-feedback-content > div:first-child > div:nth-child(2){font-size:60px !important;}

  /* Reading layout handled by dedicated mobile block */

  /* ── LISTENING TEST ── */
  .tr-listen-body{padding:16px 16px 80px !important;}
  .tr-listen-note-body{font-size:14px !important;line-height:2.4 !important;}
  .tr-note-box{min-width:70px !important;font-size:12px !important;}
  .tr-listen-bottom{padding:6px 10px !important;flex-wrap:wrap;gap:4px !important;}
  .tr-listen-ptab{font-size:11px !important;padding:4px 7px !important;}
  .tr-listen-qnum-btn{width:22px !important;height:22px !important;font-size:10px !important;}
  .tr-listen-mcq-text{font-size:13px !important;}
  .tr-audio-overlay-box{padding:24px 20px !important;margin:16px !important;}
  .tr-overlay-icon{font-size:44px !important;}
  .tr-overlay-warn{font-size:13px !important;}

  /* ── LIBRARY ── */
  .lib-wrap{flex-direction:column;}
  .lib-sidebar{width:100%;height:auto;position:static;flex-direction:row;flex-wrap:wrap;padding:8px 12px;gap:4px;border-right:none;border-bottom:1px solid var(--b);}
  .lib-sb-label{display:none;}
  .lib-nav-btn{width:auto;padding:6px 10px;font-size:11px;}
  .lib-main{padding:12px 12px 100px;}
  .lib-topbar{flex-wrap:wrap;gap:6px;}
  .lib-title{font-size:16px !important;}
  .lib-tabs{overflow-x:auto;white-space:nowrap;-webkit-overflow-scrolling:touch;}
  .lib-filters-row{flex-wrap:wrap;gap:8px;}
  .lib-search-wrap{max-width:100%;flex:1;}
  .lib-row{padding:12px !important;gap:10px;}
  .lib-row-ico{width:36px !important;height:36px !important;min-width:36px !important;}
  .lib-row-title{font-size:13px !important;white-space:normal;}
  .lib-row-meta{font-size:11px !important;flex-wrap:wrap;gap:4px !important;}
  .lib-start-btn{padding:8px 14px !important;font-size:12px !important;}
  .lib-row-right{gap:6px !important;}
  .lib-row-tag{font-size:10px !important;padding:3px 7px !important;}

  /* ── HOME PAGE ── */
  .hero{padding:70px 16px 40px !important;}
  .sec,.adm-panel,.cta-wrap,.footer{padding-left:16px !important;padding-right:16px !important;}

  /* ── PROGRESS PAGE ── */
  .hist-stats{grid-template-columns:repeat(2,1fr);gap:8px;}
  .anal-grid{grid-template-columns:1fr !important;}

  /* ── ADMIN ── */
  .admin-wrap{flex-direction:column;}
  .adm-sb{width:100%;flex-direction:row;flex-wrap:wrap;padding:8px;}
  .asb-head,.asb-sec{display:none;}
  .adm-sb .asb-item{padding:6px 10px;font-size:12px;border-radius:8px;}
  .adm-stats{grid-template-columns:repeat(2,1fr);gap:8px;}
  .adm-panel{padding:12px;}

  /* pnav handled by dedicated mobile block above */

  /* ── MODALS ── */
  .tgmodal{margin:12px;max-width:calc(100% - 24px);}
  .tgm-head{padding:20px 16px 12px;}
  .tgm-body{padding:12px 16px 16px;}
  .username-modal{margin:12px;max-width:calc(100% - 24px);}
  .overlay,.username-overlay{align-items:flex-end !important;}
  .tgmodal,.username-modal{border-radius:20px 20px 0 0 !important;margin:0 !important;max-width:100% !important;width:100% !important;}
}
@keyframes fadeUp{from{opacity:0;transform:translateY(22px);}to{opacity:1;transform:translateY(0);}}
@keyframes slideUpSheet{from{transform:translateY(100%);}to{transform:translateY(0);}}
@keyframes we-progress{0%{width:0}90%{width:90%}100%{width:95%}}
@keyframes shimmer{0%{background-position:-600px 0}100%{background-position:600px 0}}
.skel{background:linear-gradient(90deg,var(--b) 25%,var(--b2) 50%,var(--b) 75%);background-size:600px 100%;animation:shimmer 1.4s infinite;border-radius:6px;}

/* ════════════════════════════════════════════════
   MOBILE OVERHAUL ≤600px
════════════════════════════════════════════════ */
@media(max-width:600px){

  /* NAV */
  .nav{padding:0 14px !important;height:52px !important;}
  .nav-links{display:none !important;}
  .logo-text{font-size:15px !important;font-weight:800 !important;}
  /* Name chip — tiny on mobile */
  .uchip{padding:4px 8px !important;font-size:11px !important;gap:4px !important;}
  .uchip-name,.uchip-badge{display:none !important;}
  .uchip-fb{width:24px !important;height:24px !important;font-size:10px !important;}
  /* Theme button — small, visible */
  .theme-btn{width:30px !important;height:30px !important;flex-shrink:0 !important;}
  .nav-right{gap:6px !important;}

  /* HERO */
  .hero{padding:68px 18px 32px !important;text-align:center !important;min-height:auto !important;justify-content:flex-start !important;padding-top:140px !important;}
  .hero-eyebrow{display:none !important;}
  .hero-h{font-size:clamp(26px,7.5vw,38px) !important;line-height:1.1 !important;margin-bottom:10px !important;}
  .hero-p{font-size:14px !important;margin-bottom:36px !important;max-width:100% !important;}
  .hero-cta{flex-direction:column !important;align-items:stretch !important;gap:10px !important;width:100% !important;max-width:100% !important;}
  .hero-cta .btn-primary,.hero-cta .btn-ghost{width:100% !important;justify-content:center !important;padding:13px 18px !important;font-size:15px !important;border-radius:12px !important;}
  .hero-proof{display:none !important;}
  /* Proof strip — horizontal scroll mini cards */
  .hp-cards{display:flex !important;flex-direction:row !important;overflow-x:auto !important;gap:8px !important;padding:2px 0 8px !important;scrollbar-width:none !important;}
  .hp-cards::-webkit-scrollbar{display:none !important;}
  .hp-card{min-width:140px !important;flex-shrink:0 !important;padding:10px 12px !important;border-radius:12px !important;}

  /* Simplify desktop sections on mobile */
  .stats,.testi-grid,.pc2-grid,.cta-wrap{display:none !important;}
  /* Keep steps and features but single column */
  .steps-grid{grid-template-columns:1fr !important;gap:16px !important;}
  .feat-grid{grid-template-columns:1fr !important;gap:12px !important;}
  .feat-card{padding:18px !important;}
  .step-num{font-size:48px !important;}
  .sec{padding:32px 16px !important;}
  .sec-h{font-size:clamp(22px,6vw,32px) !important;margin-bottom:10px !important;}
  .sec-p{font-size:14px !important;}

  /* LIBRARY wrapper */
  .lib-wrap{flex-direction:column !important;}
  .lib-sidebar{display:none !important;}
  .lib-main{padding:0 0 80px !important;}

  /* Library topbar */
  .lib-topbar{padding:0 !important;flex-direction:column !important;gap:0 !important;margin-bottom:0 !important;}
  .lib-topbar-titlerow{display:flex !important;align-items:center !important;justify-content:space-between !important;width:100% !important;padding:10px 14px 6px !important;}
  .lib-title{font-size:18px !important;font-weight:800 !important;}
  .lib-search-wrap{max-width:100% !important;width:100% !important;}
  .lib-search{width:100% !important;padding:9px 14px 9px 36px !important;font-size:14px !important;border-radius:10px !important;}

  /* Type filter tabs — ALL / Reading / Listening pills */
  .lib-tabs{display:flex !important;gap:6px !important;overflow-x:auto !important;padding:0 14px 8px !important;margin-bottom:0 !important;scrollbar-width:none !important;}
  .lib-tabs::-webkit-scrollbar{display:none !important;}
  .lib-tab{flex-shrink:0 !important;padding:7px 14px !important;border-radius:100px !important;font-size:13px !important;font-weight:700 !important;}
  .lib-tab.active{background:var(--tg) !important;border-color:var(--tg) !important;color:#fff !important;}

  /* Filter row */
  .lib-filters-row{display:none !important;}

  /* Section label */
  .lib-section-label{
    padding:20px 16px 8px !important;
    font-size:10px !important;
    font-weight:800 !important;
    letter-spacing:.12em !important;
    color:var(--fg3) !important;
    margin-bottom:0 !important;
    text-transform:uppercase !important;
  }

  /* === MODERN STANDALONE CARDS === */
  .lib-list{
    padding:0 12px 4px !important;
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
    margin-bottom:4px !important;
    background:transparent !important;
    border-radius:0 !important;
    border:none !important;
  }
  .lib-row{
    background:var(--s) !important;
    border:1px solid var(--b) !important;
    border-radius:16px !important;
    padding:0 !important;
    display:flex !important;
    flex-direction:column !important;
    gap:0 !important;
    transform:none !important;
    box-shadow:0 2px 8px rgba(0,0,0,.06) !important;
    overflow:hidden !important;
    position:relative !important;
  }
  /* Left accent bar by type */
  .lib-row::before{
    content:'' !important;
    position:absolute !important;
    left:0 !important; top:0 !important; bottom:0 !important;
    width:3px !important;
    background:var(--tg) !important;
    border-radius:0 !important;
  }
  .lib-row:has(.lib-row-ico.listening)::before{
    background:#9070d8 !important;
  }
  .lib-row.writing-row::before{
    background:#16a34a !important;
  }
  .lib-row:hover{background:var(--s2) !important;transform:none !important;box-shadow:0 4px 16px rgba(0,0,0,.1) !important;}

  /* Card top: icon + title + tags */
  .lib-row-ico{
    display:none !important;
  }
  .lib-row-body{
    flex:1 !important;
    min-width:0 !important;
    padding:14px 14px 0 18px !important;
  }
  .lib-row-title{
    font-size:14px !important;
    font-weight:700 !important;
    line-height:1.35 !important;
    white-space:normal !important;
    overflow:visible !important;
    text-overflow:unset !important;
    margin-bottom:6px !important;
    color:var(--fg) !important;
  }
  .lib-row-meta{
    display:flex !important;
    flex-wrap:wrap !important;
    align-items:center !important;
    gap:4px 8px !important;
    font-size:11px !important;
    color:var(--fg3) !important;
  }
  .lib-row-meta-sep{display:none !important;}

  /* Card bottom row: band + tag + button */
  .lib-row-right{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:8px !important;
    padding:10px 12px 12px 18px !important;
    border-top:1px solid var(--b) !important;
    margin-top:10px !important;
    flex-wrap:nowrap !important;
  }
  .lib-row-tag{
    font-size:10px !important;
    font-weight:700 !important;
    padding:3px 9px !important;
    border-radius:6px !important;
    letter-spacing:.04em !important;
  }

  /* Start / Redo button */
  .lib-start-btn{
    padding:7px 16px !important;
    font-size:12px !important;
    font-weight:700 !important;
    border-radius:var(--btn-outline-radius) !important;
    white-space:nowrap !important;
    background:transparent !important;
    color:var(--fg) !important;
    border:1.5px solid var(--btn-outline-border) !important;
    box-shadow:none !important;
    margin-left:auto !important;
  }
  .lib-lock-btn{
    padding:7px 14px !important;
    font-size:11px !important;
    border-radius:8px !important;
    margin-left:auto !important;
  }

  /* Progress page */
  .hist-stats{grid-template-columns:repeat(2,1fr) !important;gap:8px !important;}

  /* Footer — mobile friendly */
  .footer{padding:32px 16px 90px !important;}
  .footer-grid{grid-template-columns:1fr !important;gap:20px !important;}
  .footer-bottom{flex-direction:column !important;gap:8px !important;font-size:12px !important;}
  .footer-links{flex-wrap:wrap !important;gap:8px !important;}

  /* Modals — bottom sheet */
  .overlay,.username-overlay{align-items:flex-end !important;}
  .tgmodal,.username-modal{
    margin:0 !important;
    border-radius:20px 20px 0 0 !important;
    max-width:100% !important;
    width:100% !important;
  }

  /* Admin */
  .admin-wrap{flex-direction:column !important;}
  .adm-sb{width:100% !important;flex-direction:row !important;flex-wrap:wrap !important;padding:8px !important;}
  .asb-head,.asb-sec{display:none !important;}
  .adm-sb .asb-item{padding:6px 10px !important;font-size:12px !important;border-radius:8px !important;}
  .adm-stats{grid-template-columns:repeat(2,1fr) !important;gap:8px !important;}
  .adm-panel{padding:14px !important;}
}

/* ════ TEST RUNNER MOBILE FIX ════════════════════ */
@media(max-width:600px){
  /* Hide bottom nav during test */
  #test-runner.open ~ .pnav,
  body:has(#test-runner.open) .pnav{display:none !important;}

  /* Head */
  #test-runner .tr-head{padding:0 10px !important;height:48px !important;}
  #test-runner .tr-ielts-badge{display:none !important;}
  #test-runner .tr-test-id{font-size:10px !important;}
  #test-runner .tr-timer{font-size:12px !important;padding:4px 8px !important;}
  #test-runner .tr-submit{padding:6px 12px !important;font-size:12px !important;}
  #test-runner .tr-head-icons button:not(#tr-submit-btn){display:none !important;}
  #test-runner .tr-passage-inner h2{font-size:16px !important;margin-bottom:8px !important;}

  /* Questions */
  #test-runner .tr-question{padding:12px !important;border-radius:10px !important;margin-bottom:8px !important;}
  #test-runner .tr-qtext{font-size:13px !important;line-height:1.5 !important;margin-bottom:10px !important;}
  #test-runner .tr-opt{padding:8px 10px !important;border-radius:8px !important;}
  #test-runner .tr-opt-text{font-size:13px !important;}

  /* Bottom nav — keep it small */
  #test-runner .tr-bottom-nav{
    padding:4px 8px !important;
    min-height:44px !important;
    gap:0 !important;
  }
  #test-runner .tr-part-tabs{flex-shrink:0 !important;}
  #test-runner .tr-part-tab{
    padding:0 10px !important;
    font-size:11px !important;
    height:44px !important;
    border-right:1px solid #333 !important;
  }
  #test-runner .tr-qnav{display:none !important;}
  #test-runner .tr-listen-qnums{display:none !important;}
  #test-runner .tr-nav-arrows{flex-shrink:0 !important;gap:2px !important;margin-left:4px !important;}

  /* LISTENING */
  #test-runner .tr-listen-body{padding:12px 12px 90px !important;}
  #test-runner .tr-listen-note-body{padding:6px 12px 16px !important;font-size:13.5px !important;line-height:2.4 !important;}
  #test-runner .tr-note-box{min-width:80px !important;font-size:13px !important;}
  #test-runner .tr-listen-mcq-list{padding:6px 12px 16px !important;gap:14px !important;}
  #test-runner .tr-listen-mcq-text{font-size:13px !important;}
  #test-runner .tr-listen-part-header{padding:8px 14px !important;}
  #test-runner .tr-listen-bottom{
    padding:4px 8px !important;
    min-height:44px !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
  }
  #test-runner .tr-listen-ptab{font-size:11px !important;margin-right:8px !important;padding:4px 0 !important;}
  #test-runner .tr-listen-qnum-btn{width:20px !important;height:20px !important;font-size:10px !important;border-radius:2px !important;}
  #test-runner .tr-listen-arrow{width:28px !important;height:28px !important;font-size:13px !important;}

  /* Highlight picker */
  #tr-hl-picker{bottom:50px !important;right:8px !important;padding:6px 10px !important;gap:6px !important;border-radius:10px !important;}
  .hl-swatch{width:20px !important;height:20px !important;}

  /* Review screen mobile */
  #test-runner .tr-review-wrap{padding:0 !important;}
  #test-runner #tr-review.active{
    display:flex !important;
    flex-direction:column !important;
    height:100% !important;
    overflow:hidden !important;
  }
  /* Review header */
  #test-runner #tr-review > div:first-child{flex-shrink:0 !important;}
  /* Review split - stack vertically on mobile */
  #rev-passage-col{
    display:none !important;
  }
  #rev-answers{
    width:100% !important;
    padding:12px !important;
    overflow-y:auto !important;
    flex:1 !important;
  }
  /* Answer cards in review */
  #tr-review div[style*="border-left"]{
    margin-bottom:10px !important;
    padding:12px !important;
  }

  /* Results */
  #test-runner .tr-results{padding:20px 16px !important;}
  #test-runner .tr-result-band{font-size:68px !important;}
  #test-runner .tr-result-stats{gap:12px !important;flex-wrap:wrap !important;justify-content:center !important;}
  #test-runner .tr-result-stat{min-width:80px !important;}
  #test-runner .tr-result-btns{flex-direction:column !important;align-items:stretch !important;gap:8px !important;width:100% !important;max-width:320px !important;}
  #test-runner .tr-result-btns button{width:100% !important;justify-content:center !important;}
}

/* ── MOBILE LIBRARY CARDS — only applies on phones ── */
@media(max-width:768px){
  .lib-sidebar{display:none !important;}
  .lib-wrap{display:block !important;}
  .lib-main{padding:0 0 80px !important;}

  /* ── STICKY HEADER BLOCK (title + section tabs + search) ── */
  .lib-topbar{
    position:sticky;
    top:52px;
    z-index:100;
    background:var(--bg);
    padding:0;
    border-bottom:1px solid var(--b);
    -webkit-transform:translateZ(0);
    transform:translateZ(0);
    will-change:transform;
    backface-visibility:hidden;
  }
  .lib-topbar-titlerow{display:none !important;}
  #mob-section-tabs{display:flex !important;}

  /* Title row */
  .lib-title{font-size:17px !important;font-weight:800 !important;}
  .lib-completed-btn{font-size:11px !important;padding:5px 10px !important;}

  /* ── MOBILE SECTION SWITCHER (All/Reading/Listening/Writing) ── */
  /* Hide the old All/Free/Premium access tabs on mobile */
  .lib-tabs{display:none !important;}

  /* Show a new section switcher row inside topbar */
  #mob-section-tabs{
    display:flex !important;
    gap:0;
    padding:0;
    overflow-x:visible;
    width:100%;
    box-sizing:border-box;
    background:var(--s);
    border-top:1px solid var(--b);
    border-bottom:1px solid var(--b);
    margin-left:0;
    margin-right:0;
  }
  .mob-stab{
    flex:1;
    display:flex;flex-direction:column;align-items:center;gap:3px;
    padding:8px 4px;
    border-radius:0;
    font-family:'Plus Jakarta Sans',sans-serif;
    font-size:11px;font-weight:600;
    border:none;
    border-bottom:2px solid transparent;
    background:transparent;
    color:var(--fg3);
    cursor:pointer;
    transition:all .15s;
    white-space:nowrap;
  }
  .mob-stab svg{opacity:.5;transition:opacity .15s;}
  .mob-stab.active{
    color:#2aabee;
    border-bottom-color:#2aabee;
    font-weight:700;
  }
  .mob-stab.active svg{opacity:1;}

  /* ── FILTERS ROW — hide on mobile, section tabs handle it ── */
  .lib-filters-row{display:none !important;}
  .lib-search-wrap{max-width:100% !important;flex:1;}

  /* ── SECTION LABEL ── */
  .lib-section-label{
    padding:16px 14px 8px !important;
    font-size:11px !important;
    font-weight:700 !important;
    letter-spacing:.06em !important;
    text-transform:uppercase !important;
    color:var(--fg3) !important;
  }

  /* ── LIST CONTAINER ── */
  .lib-list{padding:0 12px 4px !important;display:flex;flex-direction:column;gap:10px !important;margin-bottom:8px !important;}
  .lib-list .lib-row+.lib-row{border-top:none !important;}

  /* ── CARD REDESIGN ── */
  .lib-row{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    padding:16px !important;
    border-radius:16px !important;
    border:1px solid var(--b) !important;
    background:var(--s) !important;
    gap:12px !important;
    box-shadow:0 2px 8px rgba(0,0,0,.04) !important;
    transform:none !important;
    flex-wrap:nowrap !important;
  }
  .lib-row:hover{transform:none !important;}

  /* Icon */
  .lib-row-ico{
    width:44px !important;height:44px !important;min-width:44px !important;
    border-radius:12px !important;
    flex-shrink:0 !important;
  }

  /* Body fills remaining space */
  .lib-row-body{
    flex:1 !important;
    min-width:0 !important;
    display:flex !important;
    flex-direction:column !important;
    gap:5px !important;
  }

  /* Title */
  .lib-row-title{
    font-size:14px !important;
    font-weight:700 !important;
    white-space:normal !important;
    line-height:1.3 !important;
    color:var(--fg) !important;
  }

  /* Meta row */
  .lib-row-meta{
    font-size:11.5px !important;
    flex-wrap:wrap !important;
    gap:4px 8px !important;
    color:var(--fg3) !important;
  }

  /* Right side — tag + button stacked */
  .lib-row-right{
    display:flex !important;
    flex-direction:column !important;
    align-items:flex-end !important;
    gap:6px !important;
    flex-shrink:0 !important;
    width:auto !important;
  }

  /* Free/Premium tag */
  .lib-row-tag{
    font-size:10px !important;
    padding:3px 8px !important;
    border-radius:20px !important;
    font-weight:600 !important;
    white-space:nowrap !important;
  }

  .lib-start-btn{
    padding:9px 18px !important;
    font-size:12px !important;
    font-weight:700 !important;
    border-radius:var(--btn-outline-radius) !important;
    background:transparent !important;
    color:var(--fg) !important;
    border:1.5px solid var(--btn-outline-border) !important;
    box-shadow:none !important;
  }
  .lib-start-btn:hover{background:var(--btn-outline-hover) !important;}
}

/* ── MOBILE READING TEST LAYOUT ── */
@media(max-width:768px){
  /* Tablet: single scroll (overridden again at 600px for split panel) */
  .tr-reading-wrap{display:block !important;width:100% !important;}
  .tr-passage-col{display:block !important;width:100% !important;height:auto !important;overflow:visible !important;border-right:none !important;border-bottom:3px solid #2aabee !important;}
  .tr-passage-inner{padding:14px 16px 20px !important;font-size:13.5px !important;line-height:1.8 !important;}
  .tr-resize-bar,.tr-resize-handle{display:none !important;}
  .tr-qpanel-col{display:block !important;width:100% !important;height:auto !important;overflow:visible !important;border-left:none !important;}
  .tr-qpanel-inner{display:block !important;padding:14px 16px 100px !important;}
  .tr-qnav-btn{width:28px !important;height:28px !important;font-size:11px !important;}
  .tr-part-tabs{gap:3px !important;}
  .tr-part-tab{padding:5px 10px !important;font-size:11px !important;}
  .tr-bottom-nav{padding:6px 10px !important;gap:8px !important;}
}

/* ── PHONE READING TEST: SPLIT PANEL with drag handle ── */
@media(max-width:600px){
  .tr-reading-wrap{display:flex !important;flex-direction:column !important;width:100% !important;flex:1 !important;min-height:0 !important;overflow:hidden !important;}
  /* NO !important on height — JS needs to override it */
  .tr-passage-col{display:flex !important;flex-direction:column !important;width:100% !important;height:45%;min-height:80px !important;overflow-y:auto !important;border-right:none !important;border-bottom:none !important;flex-shrink:0 !important;}
  .tr-passage-inner{padding:14px 16px 10px !important;font-size:13.5px !important;line-height:1.8 !important;}
  /* DRAG HANDLE */
  .tr-resize-bar{
    display:flex !important;
    width:100% !important;
    height:28px !important;
    background:#f0f0f0 !important;
    border-top:1px solid #ddd !important;
    border-bottom:1px solid #ddd !important;
    cursor:row-resize !important;
    flex-shrink:0 !important;
    align-items:center !important;
    justify-content:center !important;
    touch-action:none !important;
    -webkit-user-select:none !important;
    user-select:none !important;
    position:relative !important;
    z-index:10 !important;
  }
  .tr-resize-bar::after{
    content:'' !important;
    width:44px !important;
    height:4px !important;
    border-radius:2px !important;
    background:#bbb !important;
    top:auto !important;left:auto !important;transform:none !important;
  }
  .tr-resize-handle{display:none !important;}
  /* NO !important on flex — JS needs to set flex:none + height */
  .tr-qpanel-col{display:flex !important;flex-direction:column !important;width:100% !important;flex:1;min-height:0 !important;overflow-y:auto !important;border-left:none !important;}
  .tr-qpanel-inner{display:block !important;padding:14px 16px 100px !important;}
}

/* ══════════════════════════════════════════
   TEST RUNNER
══════════════════════════════════════════ */
#test-runner{
  position:fixed;inset:0;z-index:9000;
  background:#ffffff;
  display:none;flex-direction:column;
  animation:fadeIn .25s ease;
  /* Always light mode by default in test runner */
  --bg:#ffffff;--bg2:#f5f5f5;--s:#ffffff;--s2:#f7f7f8;--s3:#e8e8ec;
  --gold:#d32f2f;--gold2:#e53935;
  --gd:rgba(211,47,47,0.06);--gg:rgba(211,47,47,0.14);
  --fg:#1a1a1a;--fg2:#444444;--fg3:#999999;
  --b:rgba(0,0,0,0.08);--b2:rgba(42,171,238,0.2);--b3:rgba(42,171,238,0.35);
  --glass:rgba(255,255,255,0.92);
  --sh:0 4px 20px rgba(0,0,0,0.08);
  --gr:#22c55e;--re:#ef4444;--re2:rgba(239,68,68,0.08);
  --gr2:rgba(34,197,94,0.08);
  color:#1a1a1a;
}
#test-runner.open{display:flex;}

/* ── TEST RUNNER — LIGHT THEME (always default, dark only via contrast toggle) ── */
[data-theme="light"] #test-runner{
  --bg:#ffffff;--bg2:#f5f5f5;--s:#ffffff;--s2:#f7f7f8;--s3:#e8e8ec;
  --gold:#d32f2f;--gold2:#e53935;
  --gd:rgba(211,47,47,0.06);--gg:rgba(211,47,47,0.14);
  --fg:#1a1a1a;--fg2:#444444;--fg3:#999999;
  --b:rgba(0,0,0,0.08);--b2:rgba(42,171,238,0.2);--b3:rgba(42,171,238,0.35);
  --glass:rgba(255,255,255,0.92);
  --sh:0 4px 20px rgba(0,0,0,0.08);
  --gr:#22c55e;--re:#ef4444;--re2:rgba(239,68,68,0.08);
  --gr2:rgba(34,197,94,0.08);
  color:#1a1a1a;
}
[data-theme="light"] #test-runner .tr-head{background:#fff;border-bottom:1px solid #e0e0e0;}
#test-runner .tr-timer{color:#d32f2f;background:rgba(211,47,47,0.06);border-color:rgba(211,47,47,0.2);}
#test-runner .tr-submit{background:transparent !important;color:#333 !important;border:1.5px solid rgba(0,0,0,.18) !important;border-radius:10px;padding:8px 24px;box-shadow:none !important;}
#test-runner .tr-submit:hover{background:rgba(0,0,0,.05) !important;}
[data-theme="light"] #test-runner .tr-prog{background:#eee;}
#test-runner .tr-prog-fill{background:linear-gradient(90deg,#d32f2f,#e53935);}

/* Scrollbar styling */
#test-runner ::-webkit-scrollbar{width:8px;}
[data-theme="light"] #test-runner ::-webkit-scrollbar-track{background:#f5f5f5;}
[data-theme="light"] #test-runner ::-webkit-scrollbar-thumb{background:#ccc;border-radius:4px;}
[data-theme="light"] #test-runner ::-webkit-scrollbar-thumb:hover{background:#aaa;}

/* Passage & question styling overrides for light mode */
[data-theme="light"] #test-runner .tr-passage-inner{color:#333;font-size:15.5px;line-height:1.85;}
[data-theme="light"] #test-runner .tr-passage-inner h2{color:#111;font-size:21px;}
#test-runner .tr-passage-inner .tr-pasub{color:#d32f2f;}
[data-theme="light"] #test-runner .tr-passage-inner p{color:#333;}
[data-theme="light"] #test-runner .tr-passage-inner p strong{color:#111;font-weight:700;}
#test-runner .tr-passage-inner .user-highlight,
#test-runner .tr-passage-inner .user-highlight[data-color="yellow"]{background:rgba(255,213,79,.5);}
#test-runner .tr-passage-inner .user-highlight[data-color="green"]{background:rgba(34,197,94,0.3);}
#test-runner .tr-passage-inner .user-highlight[data-color="red"]{background:rgba(239,68,68,0.3);}
#test-runner .tr-passage-inner .user-highlight[data-color="blue"]{background:rgba(59,130,246,0.3);}
#tr-hl-picker{position:absolute;bottom:56px;right:16px;z-index:200;background:var(--s);border:1px solid var(--b2);border-radius:10px;padding:8px 12px;display:flex;align-items:center;gap:8px;box-shadow:0 4px 20px rgba(0,0,0,.2);}
#tr-hl-picker.hidden{display:none;}
.hl-swatch{width:22px;height:22px;border-radius:50%;cursor:pointer;border:2px solid transparent;transition:all .15s;}
.hl-swatch:hover,.hl-swatch.active{border-color:var(--fg);transform:scale(1.2);}
.hl-swatch-y{background:#ffd600;}.hl-swatch-g{background:#22c55e;}.hl-swatch-r{background:#ef4444;}.hl-swatch-b{background:#3b82f6;}
.hl-sep{width:1px;height:18px;background:var(--b2);}
.hl-close-btn{width:20px;height:20px;border-radius:50%;border:1px solid var(--b);background:var(--s2);color:var(--fg2);font-size:11px;cursor:pointer;display:flex;align-items:center;justify-content:center;font-weight:700;}

[data-theme="light"] #test-runner .tr-qpanel-col{border-left:none;}
[data-theme="light"] #test-runner .tr-question{background:#fff;border:1px solid #e8e8e8;border-radius:10px;}
#test-runner .tr-qnum{color:#d32f2f;}
[data-theme="light"] #test-runner .tr-qtext{color:#111;}
#test-runner .tr-qgroup-head{color:#d32f2f;background:rgba(211,47,47,0.04);border-color:rgba(211,47,47,0.15);}
[data-theme="light"] #test-runner .tr-qgroup-instructions{color:#555;}

/* T/F/NG radio overrides handled by base styles above */

/* ── Blue Telegram accents in test ── */
#test-runner .tr-timer{color:#2aabee;background:rgba(42,171,238,0.06);border-color:rgba(42,171,238,0.2);}
#test-runner .tr-timer.warn{color:#f97316;background:rgba(249,115,22,.08);border-color:rgba(249,115,22,.2);}
#test-runner .tr-timer.danger{color:#ef4444;background:rgba(239,68,68,.06);border-color:rgba(239,68,68,.2);}
#test-runner .tr-qnum{color:#2aabee;}
#test-runner .tr-qgroup-head{color:#2aabee;background:rgba(42,171,238,0.04);border-color:rgba(42,171,238,0.15);}
#test-runner .tr-part-tab.active{background:rgba(42,171,238,0.06);border-color:rgba(42,171,238,0.25);color:#2aabee;}
#test-runner .tr-qnav-btn.answered{background:rgba(42,171,238,0.06);border-color:rgba(42,171,238,0.2);color:#2aabee;}
#test-runner .tr-qnav-btn.current{background:#2aabee;border-color:#2aabee;color:#fff;}
#test-runner .tr-nav-arrow:hover{border-color:#2aabee;color:#2aabee;}
#test-runner .tr-prog-fill{background:linear-gradient(90deg,#2aabee,#54c4f8);}
#test-runner .tr-result-band{color:#2aabee;}
#test-runner .tr-passage-inner .tr-pasub{color:#2aabee;}


/* MCQ options */
[data-theme="light"] #test-runner .tr-opt{border-color:#e0e0e0;background:#fff;}
[data-theme="light"] #test-runner .tr-opt:hover{background:#f9f9f9;border-color:#ccc;}
#test-runner .tr-opt.selected{background:rgba(42,171,238,0.06);border-color:rgba(42,171,238,0.25);}
#test-runner .tr-select-drop{
  width:100%;padding:12px 14px;border:1.5px solid var(--b2);border-radius:10px;
  background:var(--s);color:var(--fg);font-size:14px;font-family:inherit;
  cursor:pointer;margin-top:8px;outline:none;transition:border-color .2s;
  appearance:none;-webkit-appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23888' stroke-width='2'%3E%3Cpolyline points='6 9 12 15 18 9'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 12px center;padding-right:36px;
}
.tr-select-drop:focus{border-color:var(--tg);}
.tr-select-drop option{background:var(--s);color:var(--fg);}
[data-theme="light"] .tr-opt-letter{background:#f5f5f5;border-color:#ddd;color:#666;}
#test-runner .tr-opt.selected .tr-opt-letter{background:#2aabee;border-color:#2aabee;color:#fff;}
[data-theme="light"] #test-runner .tr-opt-text{color:#444;}
[data-theme="light"] #test-runner .tr-opt.selected .tr-opt-text{color:#111;}

/* Bottom nav */
/* bottom nav is always dark — no light override needed */
[data-theme="light"] #test-runner .tr-nav-arrow{border-color:#ddd;background:#fff;color:#666;}
[data-theme="light"] #test-runner .tr-nav-arrow:hover{border-color:#2aabee;color:#2aabee;}

/* Resize handle */
.tr-resize-bar{width:6px;cursor:col-resize;flex-shrink:0;position:relative;background:#e8e8e8;transition:background .2s;}
.tr-resize-bar:hover,.tr-resize-bar.dragging{background:#d32f2f;}
.tr-resize-bar::after{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:2px;height:32px;background:#ccc;border-radius:1px;transition:background .2s;}
.tr-resize-bar:hover::after,.tr-resize-bar.dragging::after{background:#fff;}

/* Notes panel light mode */
#test-runner .tr-notes-panel{background:#fff;border-left:1px solid #e0e0e0;}
#test-runner .tr-notes-head{border-bottom:1px solid #eee;}
#test-runner .tr-notes-head-title{color:#111;}
#test-runner .tr-notes-textarea{background:#f9f9f9;border-color:#e0e0e0;color:#333;}
#test-runner .tr-notes-textarea:focus{border-color:#d32f2f;}

/* Results & Review light mode */
#test-runner .tr-results{background:#fff;}
#test-runner .tr-result-band{color:#d32f2f;}
#test-runner .tr-result-label{color:#999;}
#test-runner .tr-result-stat-n{color:#111;}
#test-runner .tr-result-stat-l{color:#999;}
#test-runner .tr-review-wrap{background:#fff;}


/* ── New IELTS Header ── */
.tr-head-left{display:flex;align-items:center;gap:12px;}
.tr-back-btn{
  display:flex;align-items:center;gap:5px;
  padding:7px 14px 7px 10px;border-radius:8px;border:1px solid #e0e0e0;
  background:#fff;color:#333;font-family:'Plus Jakarta Sans',sans-serif;
  font-size:13px;font-weight:600;cursor:pointer;transition:all .15s;
}
.tr-back-btn:hover{background:#f5f5f5;border-color:#ccc;}
.tr-back-btn svg{width:16px;height:16px;}
.tr-ielts-badge{
  background:#d32f2f;color:#fff;padding:5px 14px;border-radius:6px;
  font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:800;
  letter-spacing:.05em;user-select:none;
}
.tr-test-id{font-size:13px;color:#888;font-weight:500;font-family:'Plus Jakarta Sans',sans-serif;}

/* ── Context Menu for Highlight ── */
.tr-ctx-menu{
  position:fixed;z-index:9999;
  background:#fff;border:1px solid #e0e0e0;border-radius:10px;
  box-shadow:0 8px 30px rgba(0,0,0,0.12);
  padding:6px 0;min-width:160px;
  animation:ctxPop .15s ease;
  font-family:'Plus Jakarta Sans',sans-serif;
}
@keyframes ctxPop{from{opacity:0;transform:scale(.95);}to{opacity:1;transform:scale(1);}}
.tr-ctx-item{
  display:flex;align-items:center;gap:10px;
  padding:10px 16px;cursor:pointer;font-size:13px;font-weight:500;
  color:#333;transition:background .12s;
}
.tr-ctx-item:hover{background:#f5f5f5;}
.tr-ctx-item svg{width:16px;height:16px;flex-shrink:0;}
.tr-ctx-item.highlight-item svg{stroke:#f59e0b;}
.tr-ctx-item.note-item svg{stroke:#3b82f6;}
.tr-ctx-item.remove-hl svg{stroke:#ef4444;}
.tr-ctx-sep{height:1px;background:#eee;margin:4px 0;}

/* ── Header icons (fullscreen, notifications, options) ── */
.tr-head-icons{display:flex;align-items:center;gap:2px;}
.tr-head-icon{
  width:36px;height:36px;border:none;background:transparent;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  color:#666;border-radius:8px;transition:all .15s;
}
.tr-head-icon:hover{background:#f0f0f0;color:#333;}
.tr-head-icon svg{width:20px;height:20px;}

/* ── Options Modal ── */
.tr-options-modal{
  position:fixed;top:0;right:0;bottom:0;width:340px;z-index:9998;
  background:#fff;box-shadow:-8px 0 40px rgba(0,0,0,0.1);
  display:none;flex-direction:column;
  animation:slideInRight .2s ease;
}
.tr-options-modal.open{display:flex;}
.tr-options-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:20px 24px;border-bottom:1px solid #eee;
}
.tr-options-head h3{font-size:18px;font-weight:700;color:#111;margin:0;}
.tr-options-close{
  width:32px;height:32px;border:none;background:transparent;
  cursor:pointer;font-size:18px;color:#999;display:flex;
  align-items:center;justify-content:center;border-radius:8px;
}
.tr-options-close:hover{background:#f0f0f0;color:#333;}
.tr-options-body{padding:8px 0;flex:1;}
.tr-options-item{
  display:flex;align-items:center;justify-content:space-between;
  padding:16px 24px;cursor:pointer;transition:background .12s;
  border-bottom:1px solid #f5f5f5;
}
.tr-options-item:hover{background:#fafafa;}
.tr-options-item-left{display:flex;align-items:center;gap:14px;}
.tr-options-item-icon{
  width:36px;height:36px;border-radius:50%;background:#f5f5f5;
  display:flex;align-items:center;justify-content:center;
}
.tr-options-item-icon svg{width:18px;height:18px;color:#333;}
.tr-options-item-label{font-size:15px;font-weight:500;color:#111;}
.tr-options-item-arrow{color:#ccc;font-size:18px;}

/* Contrast sub-panel */
.tr-contrast-panel{display:none;padding:16px 24px;}
.tr-contrast-panel.open{display:block;}
.tr-contrast-opt{
  display:flex;align-items:center;gap:12px;
  padding:12px 16px;border-radius:10px;cursor:pointer;
  border:2px solid transparent;margin-bottom:8px;transition:all .15s;
}
.tr-contrast-opt:hover{background:#f9f9f9;}
.tr-contrast-opt.active{border-color:#d32f2f;background:rgba(211,47,47,0.04);}
.tr-contrast-swatch{width:32px;height:20px;border-radius:4px;border:1px solid #ddd;}

/* Text size slider */
.tr-textsize-panel{display:none;padding:16px 24px;}
.tr-textsize-panel.open{display:block;}
.tr-textsize-slider{width:100%;margin:12px 0;accent-color:#d32f2f;}
.tr-textsize-label{display:flex;justify-content:space-between;font-size:12px;color:#999;}
@keyframes fadeIn{from{opacity:0;}to{opacity:1;}}

/* header */
.tr-head{
  display:flex;align-items:center;justify-content:space-between;
  padding:0 28px;height:58px;flex-shrink:0;
  background:var(--glass);
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--b);
}
.tr-title{font-size:14px;font-weight:700;color:var(--fg);max-width:400px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tr-timer{
  font-variant-numeric:tabular-nums;
  font-size:18px;font-weight:700;color:var(--gold);
  font-family:'Plus Jakarta Sans',monospace;letter-spacing:.04em;
  background:var(--gd);border:1px solid var(--b2);
  padding:6px 18px;border-radius:100px;
}
.tr-timer.warn{color:#f97316;background:rgba(249,115,22,.1);border-color:rgba(249,115,22,.25);}
.tr-timer.danger{color:var(--re);background:var(--re2);border-color:rgba(239,68,68,.25);animation:timerPulse .6s ease infinite;}
@keyframes timerPulse{0%,100%{opacity:1;}50%{opacity:.6;}}
.tr-head-r{display:flex;align-items:center;gap:10px;}
.tr-submit{
  padding:8px 22px;background:transparent;color:var(--fg);
  border:1.5px solid var(--btn-outline-border);border-radius:var(--btn-outline-radius);
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:13px;font-weight:700;cursor:pointer;transition:background .15s;
  box-shadow:none;
}
.tr-submit:hover{background:var(--btn-outline-hover);}
.tr-close{
  width:36px;height:36px;border-radius:9px;border:1px solid var(--b);
  background:var(--s);cursor:pointer;display:flex;align-items:center;
  justify-content:center;font-size:18px;color:var(--fg2);transition:all .18s;
}
.tr-close:hover{border-color:var(--re);color:var(--re);}

/* progress bar */
.tr-prog{height:3px;background:var(--s3);position:relative;flex-shrink:0;}
.tr-prog-fill{height:100%;background:linear-gradient(90deg,var(--gold),var(--gold2));transition:width .4s;width:0%;}

/* body */
.tr-body{display:flex;flex:1;overflow:hidden;}

/* READING layout */
.tr-passage{
  flex:1;overflow-y:auto;padding:32px 40px;
  border-right:1px solid var(--b);
  font-size:15px;line-height:1.9;color:var(--fg);
}
.tr-passage h2{
  font-family:'Plus Jakarta Sans',sans-serif;font-size:22px;color:var(--fg);
  margin-bottom:8px;
}
.tr-passage .tr-pasub{font-size:12px;color:var(--gold);font-weight:600;letter-spacing:.08em;text-transform:uppercase;margin-bottom:20px;}
.tr-passage p{margin-bottom:14px;color:var(--fg2);}
.tr-passage p strong,.tr-passage .tr-highlight{color:var(--fg);}
.highlight-mode .tr-passage::selection,
.highlight-mode .tr-passage *::selection{background:rgba(201,168,76,.28);}


/* ── IELTS Reading Test UI ── */
.tr-reading-wrap{display:flex;flex:1;overflow:hidden;position:relative;}
.tr-passage-col{flex:1;overflow-y:auto;display:flex;flex-direction:column;}
.tr-passage-inner{flex:1;padding:28px 36px 100px;font-size:15px;line-height:1.95;color:var(--fg2);}
.tr-passage-inner h2{font-size:20px;color:var(--fg);margin-bottom:4px;font-weight:700;}
.tr-passage-inner .tr-pasub{font-size:11px;color:var(--gold);font-weight:600;letter-spacing:.08em;text-transform:uppercase;margin-bottom:18px;}
.tr-passage-inner p{margin-bottom:13px;}
.tr-passage-inner p strong{color:var(--fg);}
.tr-passage-inner .user-highlight{background:rgba(255,213,79,.28);border-radius:2px;padding:0 1px;}
.tr-passage-col .tr-resize-handle{width:5px;background:var(--b);cursor:col-resize;flex-shrink:0;transition:background .2s;}
.tr-passage-col .tr-resize-handle:hover{background:var(--b2);}
.tr-qpanel-col{width:440px;flex-shrink:0;overflow-y:auto;display:flex;flex-direction:column;border-left:1px solid var(--b);}
.tr-qpanel-inner{flex:1;padding:24px 24px 100px;display:flex;flex-direction:column;gap:20px;}
.tr-qgroup-head{font-size:13px;font-weight:700;color:var(--gold);letter-spacing:.06em;text-transform:uppercase;margin-bottom:6px;padding:10px 14px;background:var(--gd);border:1px solid var(--b2);border-radius:10px;}
.tr-qgroup-instructions{font-size:12.5px;color:var(--fg2);line-height:1.6;margin-bottom:8px;padding:0 4px;font-style:italic;}

/* Question cards */
.tr-question{background:var(--s);border:1px solid var(--b);border-radius:10px;padding:16px 18px;transition:border-color .2s;}
.tr-question.active-q{border-color:var(--b2);}
.tr-qnum{font-size:11px;font-weight:700;color:var(--gold);letter-spacing:.07em;text-transform:uppercase;margin-bottom:5px;}
.tr-qtext{font-size:13.5px;font-weight:600;color:var(--fg);line-height:1.55;margin-bottom:12px;}

/* T/F/NG and Y/N/NG options */
.tr-tfng-opts{display:flex;flex-direction:column;gap:0;}
.tr-radio-row{
  display:flex;align-items:center;gap:12px;
  padding:12px 4px;cursor:pointer;transition:background .12s;
  border-bottom:1px solid #f0f0f0;
}
.tr-radio-row:last-child{border-bottom:none;}
.tr-radio-row:hover{background:#fafafa;}
.tr-radio-circle{
  width:20px;height:20px;border-radius:50%;
  border:2px solid #ccc;background:#fff;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;transition:all .15s;
}
.tr-radio-row.selected .tr-radio-circle{border-color:#d32f2f;}
.tr-radio-row.selected .tr-radio-circle::after{
  content:'';width:10px;height:10px;border-radius:50%;background:#d32f2f;
}
.tr-radio-label{font-size:14px;font-weight:500;color:#333;user-select:none;}
.tr-radio-row.selected .tr-radio-label{color:#111;font-weight:600;}
/* Review states */
.tr-radio-row.correct .tr-radio-circle{border-color:#22c55e;}
.tr-radio-row.correct .tr-radio-circle::after{content:'';width:10px;height:10px;border-radius:50%;background:#22c55e;}
.tr-radio-row.correct .tr-radio-label{color:#22c55e;font-weight:600;}
.tr-radio-row.wrong .tr-radio-circle{border-color:#ef4444;}
.tr-radio-row.wrong .tr-radio-circle::after{content:'';width:10px;height:10px;border-radius:50%;background:#ef4444;}
.tr-radio-row.wrong .tr-radio-label{color:#ef4444;font-weight:600;}

/* Fill-in input */
.tr-fill-input{width:100%;padding:9px 13px;background:var(--s2);border:1px solid var(--b);border-radius:8px;color:var(--fg);font-family:'Plus Jakarta Sans',sans-serif;font-size:13.5px;outline:none;transition:border-color .2s;}
.tr-fill-input:focus{border-color:var(--b3);}
.tr-fill-input.correct{border-color:rgba(34,197,94,.5);background:rgba(34,197,94,.06);}
.tr-fill-input.wrong{border-color:rgba(239,68,68,.4);background:rgba(239,68,68,.06);}

/* MCQ options - reuse existing .tr-opt styles */

/* ── Bottom Navigation Bar ── */
/* ── Reading bottom bar — official dark style ── */
.tr-bottom-nav{position:absolute;bottom:0;left:0;right:0;z-index:10;background:#1a1a1a;border-top:1px solid #333;padding:0 12px;display:flex;align-items:center;min-height:44px;gap:0;}
.tr-part-tabs{display:flex;align-items:stretch;flex-shrink:0;}
.tr-part-tab{padding:0 16px;border:none;border-right:1px solid #333;background:transparent;color:#888;font-family:Arial,sans-serif;font-size:13px;font-weight:700;cursor:pointer;transition:all .15s;display:flex;align-items:center;gap:6px;height:44px;white-space:nowrap;}
.tr-part-tab:hover{color:#fff;background:rgba(255,255,255,.06);}
.tr-part-tab.active{color:#fff;background:rgba(42,171,238,.12);border-bottom:2px solid #2aabee;}
.tr-part-tab .part-score{font-size:11px;font-weight:400;color:#666;}
.tr-part-tab.active .part-score{color:#2aabee;}
.tr-qnav{display:flex;gap:2px;flex:1;justify-content:center;align-items:center;flex-wrap:wrap;padding:0 8px;}
.tr-qnav-btn{width:24px;height:24px;border-radius:2px;border:1px solid #444;background:transparent;color:#888;font-family:Arial,sans-serif;font-size:11px;font-weight:600;cursor:pointer;transition:all .12s;display:flex;align-items:center;justify-content:center;}
.tr-qnav-btn:hover{border-color:#888;color:#fff;}
.tr-qnav-btn.answered{background:rgba(42,171,238,.2);border-color:#2aabee;color:#2aabee;}
.tr-qnav-btn.current{background:#2aabee;border-color:#2aabee;color:#fff;}
.tr-nav-arrows{display:flex;gap:3px;flex-shrink:0;margin-left:8px;}
.tr-nav-arrow{width:32px;height:32px;border-radius:8px;border:1px solid var(--b);background:var(--s);color:var(--fg2);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .18s;font-size:14px;}
.tr-nav-arrow:hover{border-color:var(--b2);color:var(--gold);}

/* ── Highlight & Notes toolbar ── */
.tr-tools{display:flex;gap:6px;margin-left:auto;}
.tr-tool-btn{padding:5px 12px;border-radius:7px;border:1px solid var(--b);background:transparent;color:var(--fg2);font-family:'Plus Jakarta Sans',sans-serif;font-size:11.5px;font-weight:600;cursor:pointer;transition:all .18s;display:flex;align-items:center;gap:5px;}
.tr-tool-btn:hover{border-color:var(--b2);color:var(--gold);}
.tr-tool-btn.active{background:var(--gd);border-color:var(--b3);color:var(--gold);}
.tr-tool-btn svg{width:14px;height:14px;}

/* Notes panel */
.tr-notes-panel{position:absolute;right:0;top:0;bottom:0;width:320px;background:var(--s);border-left:1px solid var(--b);z-index:15;display:none;flex-direction:column;animation:slideInRight .25s ease;}
.tr-notes-panel.open{display:flex;}
@keyframes slideInRight{from{transform:translateX(100%);}to{transform:translateX(0);}}
.tr-notes-head{padding:16px 18px;border-bottom:1px solid var(--b);display:flex;align-items:center;justify-content:space-between;}
.tr-notes-head-title{font-size:14px;font-weight:700;color:var(--fg);}
.tr-notes-body{flex:1;padding:14px;overflow-y:auto;}
.tr-notes-textarea{width:100%;height:100%;min-height:200px;background:var(--s2);border:1px solid var(--b);border-radius:10px;padding:14px;color:var(--fg);font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;line-height:1.7;resize:none;outline:none;}
.tr-notes-textarea:focus{border-color:var(--b2);}
.tr-notes-textarea::placeholder{color:var(--fg3);}

/* Responsive adjustments */
@media(max-width:900px){
  .tr-reading-wrap{flex-direction:column;}
  .tr-qpanel-col{width:100%;border-left:none;border-top:1px solid var(--b);}
  .tr-qnav-btn{width:24px;height:24px;font-size:10px;}
  .tr-notes-panel{width:100%;}
}

.tr-qpanel{
  width:420px;flex-shrink:0;overflow-y:auto;
  padding:28px 28px;display:flex;flex-direction:column;gap:24px;
}

/* LISTENING layout */
.tr-listen-wrap{flex:1;display:flex;flex-direction:column;overflow:hidden;position:relative;}
.tr-listen-body{flex:1;overflow-y:auto;padding:24px 40px 80px;}
.tr-audio-overlay{position:absolute;inset:0;z-index:20;background:rgba(20,20,20,.65);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;}
.tr-audio-overlay.hidden{display:none;}
.tr-audio-overlay-box{background:#222;padding:40px 48px;display:flex;flex-direction:column;align-items:center;gap:18px;max-width:500px;text-align:center;}
.tr-overlay-icon{font-size:60px;}
.tr-overlay-warn{font-size:14px;color:#ccc;line-height:1.8;font-family:'Plus Jakarta Sans',sans-serif;}
.tr-overlay-sub{font-size:14px;color:#fff;font-weight:700;font-family:'Plus Jakarta Sans',sans-serif;}
.tr-overlay-play{display:flex;align-items:center;gap:10px;background:#111;color:#fff;border:2px solid #fff;padding:11px 30px;font-size:15px;font-weight:700;cursor:pointer;font-family:'Plus Jakarta Sans',sans-serif;margin-top:4px;}
.tr-overlay-play:hover{background:#444;}
.tr-listen-speed-bar{position:absolute;top:10px;right:16px;z-index:10;}
.tr-listen-speed-bar.hidden{display:none;}
.tr-listen-speed-btn2{padding:5px 12px;background:#fff;border:1px solid #ccc;font-size:12px;font-weight:700;color:#333;cursor:pointer;font-family:'Plus Jakarta Sans',sans-serif;}
.tr-listen-speed-btn2:hover{border-color:#2aabee;color:#2aabee;}
.tr-listen-part-header{background:#f5f5f0;border:1px solid #ddd;padding:12px 18px;margin-bottom:16px;}
.tr-listen-part-title{font-size:13px;font-weight:700;color:#111;font-family:'Plus Jakarta Sans',sans-serif;}
.tr-listen-part-sub{font-size:13px;font-weight:600;color:#2aabee;font-family:'Plus Jakarta Sans',sans-serif;margin-top:2px;}
.tr-listen-inst{font-size:14px;color:#333;font-family:'Plus Jakarta Sans',sans-serif;margin-bottom:16px;line-height:1.6;}
.tr-listen-note-body{font-size:15px;line-height:2.6;color:#111;font-family:Arial,sans-serif;max-width:700px;}
.tr-note-box{display:inline-block;border:1px solid #999;background:#f9f9f9;padding:2px 6px;min-width:90px;font-size:13px;color:#111;font-family:Arial,sans-serif;vertical-align:middle;text-align:center;outline:none;}
.tr-note-box.wide{min-width:140px;}
.tr-note-box:focus{border-color:#2aabee;background:#fff;}
.tr-listen-mcq-list{display:flex;flex-direction:column;gap:18px;max-width:720px;}
.tr-listen-mcq-num{font-size:11px;font-weight:700;color:#2aabee;letter-spacing:.08em;text-transform:uppercase;margin-bottom:4px;font-family:'Plus Jakarta Sans',sans-serif;}
.tr-listen-mcq-text{font-size:14.5px;font-weight:600;color:#111;line-height:1.5;margin-bottom:10px;font-family:'Plus Jakarta Sans',sans-serif;}
.tr-listen-bottom{position:absolute;bottom:0;left:0;right:0;background:#fff;border-top:1px solid #ddd;padding:8px 16px;display:flex;align-items:center;gap:8px;z-index:10;}
.tr-listen-parts{display:flex;align-items:center;flex-shrink:0;}
.tr-listen-ptab{font-size:12px;font-weight:600;color:#888;padding:5px 10px;border:none;background:none;cursor:pointer;font-family:'Plus Jakarta Sans',sans-serif;white-space:nowrap;}
.tr-listen-ptab.active{color:#111;font-weight:700;}
.tr-listen-ptab-score{font-size:11px;color:#bbb;margin-left:2px;}
.tr-listen-ptab.active .tr-listen-ptab-score{color:#2aabee;}
.tr-listen-qnums{display:flex;align-items:center;gap:3px;flex:1;justify-content:center;flex-wrap:wrap;}
.tr-listen-qnum-btn{width:24px;height:24px;font-size:11px;font-weight:600;color:#aaa;border:1px solid #e0e0e0;background:#fff;cursor:pointer;font-family:'Plus Jakarta Sans',sans-serif;display:flex;align-items:center;justify-content:center;}
.tr-listen-qnum-btn.answered{background:rgba(42,171,238,.1);border-color:rgba(42,171,238,.4);color:#2aabee;}
.tr-listen-arrows{display:flex;gap:4px;flex-shrink:0;}
.tr-listen-arrow{width:38px;height:38px;background:#111;color:#fff;border:none;cursor:pointer;font-size:18px;font-weight:700;display:flex;align-items:center;justify-content:center;}
.tr-listen-arrow:hover{background:#2aabee;}
.tr-audio-card{display:none;}
/* questions */
.tr-question{background:var(--s);border:1px solid var(--b);border-radius:12px;padding:20px;}
.tr-qnum{font-size:11px;font-weight:700;color:var(--gold);letter-spacing:.08em;text-transform:uppercase;margin-bottom:6px;}
.tr-qtext{font-size:14px;font-weight:600;color:var(--fg);line-height:1.55;margin-bottom:14px;}
.tr-options{display:flex;flex-direction:column;gap:8px;}
.tr-opt{
  display:flex;align-items:flex-start;gap:11px;
  padding:10px 13px;border-radius:9px;cursor:pointer;
  border:1px solid var(--b);background:transparent;
  transition:all .18s;text-align:left;width:100%;font-family:'Plus Jakarta Sans',sans-serif;
}
.tr-opt:hover{background:var(--s2);border-color:var(--b2);}
.tr-opt.selected{background:var(--gd);border-color:var(--b3);}
.tr-opt.correct{background:rgba(34,197,94,.1);border-color:rgba(34,197,94,.35);}
.tr-opt.wrong{background:var(--re2);border-color:rgba(239,68,68,.35);}
.tr-opt-letter{
  width:22px;height:22px;border-radius:6px;background:var(--s2);border:1px solid var(--b);
  display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;
  color:var(--fg2);flex-shrink:0;transition:all .18s;
}
.tr-opt.selected .tr-opt-letter{background:var(--gold);border-color:var(--gold);color:#060810;}
.tr-opt.correct .tr-opt-letter{background:var(--gr);border-color:var(--gr);color:#060810;}
.tr-opt.wrong .tr-opt-letter{background:var(--re);border-color:var(--re);color:#fff;}
.tr-opt-text{font-size:13.5px;color:var(--fg2);line-height:1.5;padding-top:2px;}
.tr-opt.selected .tr-opt-text,.tr-opt.correct .tr-opt-text{color:var(--fg);}

/* results screen */
.tr-results{
  display:none;flex-direction:column;align-items:center;
  justify-content:center;padding:40px;text-align:center;
  position:absolute;inset:0;z-index:50;background:var(--bg);
  overflow-y:auto;
}
.tr-results.show{display:flex;}
.tr-result-band{
  font-family:'Plus Jakarta Sans',sans-serif;
  font-size:96px;line-height:1;color:var(--gold);margin-bottom:8px;
}
.tr-result-label{font-size:14px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--fg3);margin-bottom:28px;}
.tr-result-stats{display:flex;gap:32px;margin-bottom:40px;flex-wrap:wrap;justify-content:center;}
.tr-result-stat{text-align:center;}
.tr-result-stat-n{font-family:'Plus Jakarta Sans',sans-serif;font-size:36px;color:var(--fg);}
.tr-result-stat-l{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--fg3);}
.tr-result-btns{display:flex;gap:12px;flex-wrap:wrap;justify-content:center;}
.tr-redo-btn{padding:12px 24px;border-radius:var(--btn-outline-radius);border:1.5px solid var(--btn-outline-border);background:transparent;color:var(--fg);font-family:'Plus Jakarta Sans',sans-serif;font-size:14px;font-weight:700;cursor:pointer;transition:background .15s;box-shadow:none;}
.tr-redo-btn:hover{background:var(--btn-outline-hover);color:var(--fg);}
.tr-review-wrap{position:absolute;inset:0;z-index:50;overflow:hidden;display:none;flex-direction:column;}
.tr-review-wrap.active{display:flex;}

/* ─── GRID BACKGROUND ───────────────────── */
#grid-canvas{
  position:fixed;inset:0;z-index:0;pointer-events:none;
  opacity:.22;
}


/* ─── USERNAME MODAL ────────────────────── */
.username-overlay{position:fixed;inset:0;background:rgba(6,8,16,.8);backdrop-filter:blur(14px);z-index:1100;display:none;align-items:center;justify-content:center;}
.username-overlay.show{display:flex;}
.username-modal{background:var(--s);border:1px solid var(--b2);border-radius:24px;width:440px;overflow:hidden;box-shadow:0 24px 64px rgba(0,0,0,.22);animation:popIn .3s cubic-bezier(.34,1.3,.64,1);}
.unm-head{padding:32px 28px 24px;text-align:center;background:linear-gradient(160deg,rgba(42,171,238,.06),transparent);}
.unm-head-icon{font-size:42px;margin-bottom:12px;line-height:1;}
.unm-h{font-family:'Plus Jakarta Sans',sans-serif;font-size:22px;font-weight:800;color:var(--fg);margin-bottom:6px;letter-spacing:-.02em;}
.unm-s{font-size:13px;color:var(--fg2);line-height:1.6;max-width:300px;margin:0 auto;}
.unm-body{padding:24px 28px 28px;}
.unm-input-wrap{position:relative;margin-bottom:10px;}
.unm-prefix{position:absolute;left:14px;top:50%;transform:translateY(-50%);font-size:15px;font-weight:700;color:var(--tg);}
.unm-input{width:100%;padding:13px 14px 13px 30px;background:var(--bg);border:1.5px solid var(--b);border-radius:12px;color:var(--fg);font-family:'Plus Jakarta Sans',sans-serif;font-size:15px;font-weight:600;outline:none;transition:border-color .18s;letter-spacing:.01em;box-sizing:border-box;}
.unm-input:focus{border-color:var(--tg);}
.unm-hint{font-size:11.5px;color:var(--fg3);margin-bottom:4px;line-height:1.55;min-height:16px;}
.unm-hint.ok{color:#16a34a;}
.unm-hint.bad{color:#ef4444;}
.unm-rules{font-size:11px;color:var(--fg3);margin-bottom:18px;opacity:.7;}
.unm-btn{width:100%;padding:14px;background:transparent;color:var(--fg);border:1.5px solid var(--btn-outline-border);border-radius:var(--btn-outline-radius);font-family:'Plus Jakarta Sans',sans-serif;font-size:14px;font-weight:700;cursor:pointer;transition:background .15s;letter-spacing:.01em;box-shadow:none;}
.unm-btn:hover:not(:disabled){background:var(--btn-outline-hover);}
.unm-btn:disabled{background:transparent;color:var(--fg3);border-color:var(--b);cursor:not-allowed;}
.unm-skip{text-align:center;margin-top:12px;font-size:12px;color:var(--fg3);cursor:pointer;transition:color .15s;}
.unm-skip:hover{color:var(--fg);}
.unm-skip:hover{color:var(--fg2);}

/* ─── PREMIUM SECTION ───────────────────── */
.premium-section{background:var(--white);position:relative;overflow:hidden;}
.premium-section::before{content:'';position:absolute;top:-200px;right:-100px;width:600px;height:600px;background:radial-gradient(circle,rgba(42,171,238,.08),transparent 65%);pointer-events:none;}
.premium-section::after{content:'';position:absolute;bottom:-150px;left:-50px;width:400px;height:400px;background:radial-gradient(circle,rgba(232,72,85,.06),transparent 65%);pointer-events:none;}

.pricing-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:44px;max-width:780px;margin-left:auto;margin-right:auto;}
.pricing-card{background:var(--s);border:1px solid var(--b);border-radius:20px;padding:32px 28px;position:relative;transition:all .25s;overflow:hidden;}
.pricing-card:hover{transform:translateY(-4px);box-shadow:var(--sh);}
.pricing-card.featured{border-color:var(--gold);background:linear-gradient(160deg,rgba(201,168,76,.06),var(--s));box-shadow:0 0 0 1px rgba(201,168,76,.2);}
.pricing-card.featured::before{content:'MOST POPULAR';position:absolute;top:-1px;left:50%;transform:translateX(-50%);background:var(--gold);color:#060810;font-size:10px;font-weight:800;letter-spacing:.1em;padding:4px 16px;border-radius:0 0 10px 10px;}
.pc-plan{font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--fg3);margin-bottom:12px;}
.pc-plan.gold{color:var(--gold);}
.pc-price{font-family:'Plus Jakarta Sans',sans-serif;font-size:52px;color:var(--fg);line-height:1;margin-bottom:4px;}
.pc-price sup{font-size:22px;vertical-align:super;}
.pc-price span{font-size:18px;color:var(--fg2);}
.pc-period{font-size:13px;color:var(--fg3);margin-bottom:28px;}
.pc-features{display:flex;flex-direction:column;gap:10px;margin-bottom:32px;}
.pc-feat{display:flex;align-items:flex-start;gap:9px;font-size:13.5px;color:var(--fg2);line-height:1.5;}
.pc-feat::before{content:'✓';color:var(--gr);font-weight:700;flex-shrink:0;margin-top:1px;}
.pc-feat.muted{color:var(--fg3);}
.pc-feat.muted::before{content:'–';color:var(--fg3);}
.pc-btn{width:100%;padding:13px;border-radius:var(--btn-outline-radius);font-family:'Plus Jakarta Sans',sans-serif;font-size:14px;font-weight:700;cursor:pointer;transition:background .15s;background:transparent;border:1.5px solid var(--btn-outline-border);color:var(--fg);box-shadow:none;}
.pc-btn-gold,.pc-btn-outline{background:transparent;border:1.5px solid var(--btn-outline-border);color:var(--fg);}
.pc-btn-gold:hover,.pc-btn-outline:hover{background:var(--btn-outline-hover);transform:none;box-shadow:none;}

/* ─── FOOTER REDESIGN ───────────────────── */
.footer{border-top:1px solid var(--b);padding:64px 56px 36px;margin-top:0;}
.footer--simple{padding:72px 24px 40px;text-align:center;border-top:none;}
.footer-simple-inner{max-width:760px;margin:0 auto;display:flex;flex-direction:column;align-items:center;gap:36px;}
.footer--simple .footer-brand{
  flex-direction:column;align-items:center;gap:22px;margin-bottom:8px;
}
.footer--simple .footer-brand-text{
  display:flex;flex-direction:column;align-items:center;gap:10px;
}
.footer--simple .footer-brand-img{width:52px;height:52px;border-radius:12px;}
.footer--simple .footer-logo-name{
  font-family:'Plus Jakarta Sans',sans-serif;font-size:32px;font-weight:800;
  color:var(--fg);letter-spacing:-.03em;line-height:1.15;margin:0;
}
.footer--simple .footer-tagline{
  font-size:15px;color:#6b7280;line-height:1.55;max-width:380px;margin:0;
}
.footer--simple .footer-team{width:100%;margin:0;}
.footer--simple .footer-team-label{font-size:11px;letter-spacing:.14em;margin-bottom:16px;color:#9ca3af;}
.footer--simple .footer-team-row{justify-content:center;gap:14px;}
.footer--simple .ftm-card{max-width:300px;padding:14px 18px;border-radius:10px;}
.footer--simple .ftm-name{font-size:14px;}
.footer--simple .ftm-role{font-size:12px;}
.footer--simple .footer-bottom{border-top:1px solid rgba(0,0,0,.08);padding-top:24px;width:100%;justify-content:center;}
.footer--simple .footer-copy{text-align:center;font-size:13px;color:#9ca3af;}
.footer-grid{max-width:1280px;margin:0 auto;display:grid;grid-template-columns:1.8fr 1fr 1fr 1fr;gap:48px;margin-bottom:52px;}
.footer-brand-col{}
.footer-logo-row{display:flex;align-items:center;gap:9px;margin-bottom:14px;}
.footer-logo-mark{width:28px;height:28px;background:var(--gold);border-radius:7px;display:flex;align-items:center;justify-content:center;font-family:'Plus Jakarta Sans',sans-serif;font-size:11px;font-weight:700;color:#060810;flex-shrink:0;}
.footer-logo-name{font-family:'Plus Jakarta Sans',sans-serif;font-size:18px;color:var(--fg);}
.footer-tagline{font-size:13px;color:var(--fg3);line-height:1.7;max-width:220px;margin-bottom:20px;}
.footer-social{display:flex;gap:8px;}
.footer-social-btn{display:flex;align-items:center;gap:6px;padding:7px 13px;background:var(--s2);border:1px solid var(--b);border-radius:8px;font-size:12px;font-weight:600;color:var(--fg2);text-decoration:none;transition:all .18s;cursor:pointer;}
.footer-social-btn:hover{border-color:var(--b2);color:var(--fg);}
.footer-col-title{font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--fg3);margin-bottom:16px;}
.footer-col-links{display:flex;flex-direction:column;gap:10px;}
.footer-col-link{font-size:13.5px;color:var(--fg2);text-decoration:none;cursor:pointer;transition:color .18s;}
.footer-col-link:hover{color:var(--gold);}
.footer-bottom{max-width:1280px;margin:0 auto;padding-top:20px;border-top:1px solid var(--b);display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.footer-team{max-width:1280px;margin:0 auto 28px;}
.footer-team-label{font-size:10px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--fg3);margin-bottom:12px;}
.footer-team-row{display:flex;gap:12px;flex-wrap:wrap;}
.ftm-card{display:flex;align-items:center;gap:12px;padding:12px 16px;border-radius:5px;border:1px solid var(--b);background:var(--s);text-decoration:none;transition:all .2s;flex:1;min-width:200px;max-width:320px;position:relative;overflow:hidden;box-shadow:0 8px 24px rgba(15,23,42,.06);}
.ftm-card::before{content:'';position:absolute;inset:0;opacity:0;transition:opacity .2s;}
.ftm-card:first-child::before{background:linear-gradient(120deg,rgba(42,171,238,.06),transparent);}
.ftm-card:last-child::before{background:linear-gradient(120deg,rgba(167,139,250,.06),transparent);}
.ftm-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.2);}
.ftm-card:first-child:hover{border-color:rgba(42,171,238,.35);}
.ftm-card:last-child:hover{border-color:rgba(167,139,250,.35);}
.ftm-card:hover::before{opacity:1;}
.ftm-icon{width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.ftm-dev{background:rgba(42,171,238,.12);color:var(--tg);}
.ftm-teacher{background:rgba(167,139,250,.12);color:#a78bfa;}
.ftm-info{flex:1;min-width:0;}
.ftm-name{font-size:13px;font-weight:700;color:var(--fg);line-height:1.2;margin-bottom:2px;}
.ftm-role{font-size:11px;color:var(--fg3);}
.ftm-arrow{color:var(--fg3);flex-shrink:0;transition:transform .2s,color .2s;}
.ftm-card:hover .ftm-arrow{transform:translate(2px,-2px);color:var(--tg);}
.ftm-badge{font-size:11px;font-weight:800;padding:3px 8px;border-radius:6px;background:rgba(167,139,250,.15);color:#a78bfa;flex-shrink:0;letter-spacing:.02em;}

.footer-copy{font-size:12px;color:var(--fg3);}
.footer-copy a{color:var(--gold);text-decoration:none;}
.admin-status-bar{
  position:fixed;right:20px;bottom:88px;z-index:9000;
  padding:10px 16px;border-radius:100px;
  background:var(--s);border:1px solid var(--b2);
  box-shadow:0 8px 28px rgba(15,23,42,.12);
  font-size:13px;font-weight:600;color:var(--fg2);
  opacity:0;pointer-events:none;transform:translateY(8px);
  transition:opacity .2s ease,transform .2s ease;
}
.admin-status-bar.show{opacity:1;transform:translateY(0);}
.admin-status-bar--err{border-color:rgba(239,68,68,.35);color:#dc2626;background:rgba(254,242,242,.95);}
.footer-badges{display:flex;gap:8px;}
.footer-badge{padding:4px 10px;background:var(--s2);border:1px solid var(--b);border-radius:100px;font-size:10px;font-weight:600;color:var(--fg3);letter-spacing:.04em;}

/* ─── PROFILE BADGE in nav ──────────────── */
.premium-crown{font-size:12px;line-height:1;}

/* ─── USERNAME DISPLAY ──────────────────── */
.uc-username{font-size:10px;color:var(--gold);font-weight:700;letter-spacing:.04em;}

/* ─── PREMIUM GATE ──────────────────────── */
.premium-gate{background:linear-gradient(160deg,rgba(201,168,76,.05),transparent);border:1px solid var(--b2);border-radius:14px;padding:28px;text-align:center;margin:20px 56px;}
.pg-icon{font-size:32px;margin-bottom:10px;}
.pg-h{font-size:16px;font-weight:700;color:var(--fg);margin-bottom:6px;}
.pg-p{font-size:13px;color:var(--fg2);margin-bottom:16px;line-height:1.65;}

@media(max-width:960px){
  .pricing-grid{grid-template-columns:1fr;}
  .footer-grid{grid-template-columns:1fr 1fr;gap:32px;}
  .footer{padding:40px 20px 24px;}
}
@media(max-width:600px){
  .footer-grid{grid-template-columns:1fr;}
}


/* ── fade-up row entry ── */

/* ── Completed Tests button style ── */
.lib-completed-btn{
  display:inline-flex;align-items:center;gap:6px;
  padding:8px 14px;border-radius:8px;
  border:1px solid var(--b);background:var(--s);
  color:var(--fg2);font-family:'Plus Jakarta Sans',sans-serif;
  font-size:12.5px;font-weight:500;cursor:pointer;
  transition:all .15s;white-space:nowrap;margin-left:auto;
}
.lib-completed-btn:hover{border-color:var(--b2);color:var(--fg);}

/* ── PAGE LOADER (disabled) ── */
#page-loader{display:none!important;}
html.page-loading .app-main-wrap{visibility:visible;}
html.page-loading #page-loader{display:none!important;}
.dash-card--activity-main{margin:0 0 20px;}
.dash-activity-heat--main{min-height:140px;}

/* ── Test Loading Screen ── */
#test-load-overlay{
  position:fixed;inset:0;z-index:99997;
  background:var(--bg);
  display:none;flex-direction:column;align-items:center;justify-content:center;gap:28px;
}
#test-load-overlay.show{display:flex;}
.tlo-title{font-family:'Plus Jakarta Sans',sans-serif;font-size:22px;font-weight:800;color:var(--fg);letter-spacing:-.01em;}
.tlo-sub{font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;color:var(--fg3);}
.tlo-bar-wrap{width:320px;height:4px;background:var(--b);border-radius:100px;overflow:hidden;}
.tlo-bar-fill{height:100%;width:0%;background:linear-gradient(90deg,#5eb5f7,#a78bfa);border-radius:100px;transition:width .4s cubic-bezier(.4,0,.2,1);}
.tlo-steps{display:flex;flex-direction:column;gap:8px;min-width:260px;}
.tlo-step{display:flex;align-items:center;gap:10px;font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;color:var(--fg3);transition:color .3s;}
.tlo-step.done{color:var(--fg);}
.tlo-step-dot{width:18px;height:18px;border-radius:50%;border:2px solid var(--b2);flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:all .3s;}
.tlo-step.done .tlo-step-dot{background:#22c55e;border-color:#22c55e;}
.tlo-step.done .tlo-step-dot::after{content:'✓';font-size:9px;color:#fff;font-weight:700;}
.tlo-step.active .tlo-step-dot{border-color:#5eb5f7;animation:ldrSpin .8s linear infinite;}
/* ── Custom Confirm Modal ── */
#tr-warn-modal{position:fixed;inset:0;z-index:99998;background:rgba(0,0,0,.45);display:none;align-items:center;justify-content:center;backdrop-filter:blur(3px);}
#tr-warn-modal.show{display:flex;}
.tr-warn-box{
  background:#fff;border:1px solid #d8d8d8;border-radius:8px;
  padding:28px 32px 24px;max-width:420px;width:92%;
  text-align:center;box-shadow:0 8px 32px rgba(0,0,0,.18);
  font-family:Arial,Helvetica,sans-serif;
}
.tr-warn-icon{
  width:48px;height:48px;margin:0 auto 14px;border-radius:50%;
  background:#f5c518;display:flex;align-items:center;justify-content:center;
  font-size:22px;font-weight:700;color:#1a1a1a;line-height:1;
}
.tr-warn-icon:empty::before{content:'!';font-size:26px;font-weight:700;}
.tr-warn-title{font-size:20px;font-weight:700;color:#1a1a1a;margin-bottom:12px;}
.tr-warn-msg{font-size:15px;color:#555;line-height:1.55;margin-bottom:22px;}
.tr-warn-btns{display:flex;gap:10px;justify-content:center;}
.tr-warn-btns button{
  min-width:120px;padding:10px 20px;border-radius:6px;
  font-size:14px;font-weight:600;cursor:pointer;
  font-family:Arial,Helvetica,sans-serif;transition:background .15s,border-color .15s,color .15s;
}
.tr-warn-cancel{background:#fff;border:1.5px solid #bbb;color:#1a1a1a;}
.tr-warn-cancel:hover{background:#f5f5f5;}
.tr-warn-btns .tr-warn-ok{
  background:#1e3a5f !important;border:1.5px solid #1e3a5f !important;color:#fff !important;
}
.tr-warn-btns .tr-warn-ok:hover{
  background:#152a45 !important;border-color:#152a45 !important;
}
/* ── Contrast Modes ── */
:root{--tr-fs:100%;}
#test-runner{--cr-bg:#fff;--cr-fg:#111;--cr-fg2:#444;--cr-border:#ddd;}
#test-runner .tr-passage p, #test-runner .tr-passage h2,
#test-runner .tr-passage li, #test-runner .tr-passage span,
#test-runner .tr-listen-note-body, #test-runner .tr-listen-mcq-text,
#test-runner .tr-opt-text, #test-runner .tr-qtext,
#test-runner .tr-listen-inst{font-size:var(--tr-fs)!important;}

/* Sepia */
#test-runner.cr-sepia .tr-passage-inner,
#test-runner.cr-sepia .tr-listen-body,
#test-runner.cr-sepia .tr-listen-note-body{background:#f5f0e1!important;color:#3e2f1c!important;}
#test-runner.cr-sepia .tr-listen-part-header{background:#e8dcc8!important;}
#test-runner.cr-sepia .tr-note-box{background:#ede5d0!important;color:#3e2f1c!important;}
#test-runner.cr-sepia .tr-listen-bottom{background:#e8dcc8!important;}

/* Dark */
#test-runner.cr-dark{background:#12122a;}
#test-runner.cr-dark .tr-passage-inner,
#test-runner.cr-dark .tr-listen-body,
#test-runner.cr-dark .tr-listen-note-body{background:#1a1a2e!important;color:#e0e0e0!important;}
#test-runner.cr-dark .tr-passage p,#test-runner.cr-dark .tr-passage h2,
#test-runner.cr-dark .tr-passage li,#test-runner.cr-dark .tr-listen-mcq-text,
#test-runner.cr-dark .tr-listen-inst{color:#d0d0d0!important;}
#test-runner.cr-dark .tr-listen-part-header{background:#0e0e1e!important;color:#ccc!important;}
#test-runner.cr-dark .tr-note-box{background:#0e0e1e!important;color:#e0e0e0!important;border-color:#444!important;}
#test-runner.cr-dark .tr-listen-bottom{background:#0e0e1e!important;border-color:#333!important;}
#test-runner.cr-dark .tr-head{background:#0e0e1e!important;border-color:#333!important;}

/* High Contrast */
#test-runner.cr-high{background:#000;}
#test-runner.cr-high .tr-passage-inner,
#test-runner.cr-high .tr-listen-body,
#test-runner.cr-high .tr-listen-note-body{background:#000!important;color:#fff!important;}
#test-runner.cr-high .tr-passage p,#test-runner.cr-high .tr-passage h2,
#test-runner.cr-high .tr-passage li,#test-runner.cr-high .tr-listen-mcq-text,
#test-runner.cr-high .tr-listen-inst{color:#fff!important;}
#test-runner.cr-high .tr-listen-part-header{background:#111!important;color:#fff!important;border-color:#fff!important;}
#test-runner.cr-high .tr-note-box{background:#000!important;color:#fff!important;border-color:#fff!important;}
#test-runner.cr-high .tr-head{background:#000!important;border-color:#fff!important;}
#test-runner.cr-high .tr-listen-bottom{background:#111!important;border-color:#fff!important;}

/* ── ALIVE: feat-card hover lift ── */
.feat-card{transition:transform .22s cubic-bezier(.34,1.3,.64,1),box-shadow .22s,border-color .22s;}
.feat-card:hover{transform:translateY(-6px);box-shadow:0 14px 36px rgba(0,0,0,.18);border-color:var(--b2);}

/* ── ALIVE: hp-card better hover ── */
.hp-card{transition:transform .2s cubic-bezier(.34,1.3,.64,1),border-color .2s,box-shadow .2s;}
.hp-card:hover{transform:translateY(-4px);box-shadow:0 8px 24px rgba(0,0,0,.12);border-color:var(--b2);}

/* ── ALIVE: floating hero orbs — REMOVED ── */
.hero>*:not(.hero-orb){position:relative;z-index:1;}

/* ── ALIVE: bottom nav gentle breathe ── */
@keyframes navBreathe{0%,100%{opacity:.6;}50%{opacity:.95;}}
.dp:not(.on){animation:navBreathe 2.8s ease-in-out infinite;}
.dp:not(.on):nth-child(2){animation-delay:.4s;}
.dp:not(.on):nth-child(3){animation-delay:.8s;}
.dp:not(.on):nth-child(4){animation-delay:1.2s;}
.dp:not(.on):nth-child(5){animation-delay:1.6s;}

/* ── ALIVE: CTA rolling text ── */
.btn-roll{
  display:flex;flex-direction:column;
  height:1.2em;overflow:hidden;
  align-items:center;
}
.btn-roll-inner{
  display:flex;flex-direction:column;
  gap:0;
  animation:rollText 4s cubic-bezier(.4,0,.2,1) infinite;
}
.btn-roll-inner span{
  display:block;line-height:1.2em;white-space:nowrap;
}
@keyframes rollText{
  0%,18%   {transform:translateY(0);}
  25%,43%  {transform:translateY(-1.2em);}
  50%,68%  {transform:translateY(-2.4em);}
  75%,93%  {transform:translateY(-3.6em);}
  100%     {transform:translateY(-4.8em);}
}

/* ── ALIVE: button ripple ── */
.btn-ripple{position:absolute;border-radius:50%;background:rgba(255,255,255,.25);pointer-events:none;transform:scale(0);animation:btnRipple .5s ease forwards;}
@keyframes btnRipple{to{transform:scale(4);opacity:0;}}

/* ── ALIVE: stat numbers pop ── */
@keyframes statPop{from{opacity:0;transform:translateY(12px) scale(.9);}to{opacity:1;transform:translateY(0) scale(1);}}
.stat-n{animation:statPop .6s ease both;}

/* ── ALIVE: section label slide in ── */
.sec-label{opacity:0;transform:translateX(-10px);transition:opacity .5s ease,transform .5s ease;}
.sec-label.revealed{opacity:1;transform:translateX(0);}

/* ── QUICK TOUR ── */
#tour-overlay{position:fixed;inset:0;z-index:99999;display:none;}
#tour-overlay.active{display:block;}
#tour-backdrop{position:absolute;inset:0;background:rgba(250,251,252,.55);backdrop-filter:blur(3px);}
#tour-spotlight{position:absolute;border-radius:12px;transition:all .4s cubic-bezier(.4,0,.2,1);box-shadow:0 0 0 3px var(--red),0 0 0 9999px rgba(250,251,252,.72);z-index:1;pointer-events:none;}
#tour-tooltip{position:absolute;z-index:2;width:320px;background:var(--white);border:1px solid var(--b);border-radius:12px;padding:24px;box-shadow:var(--sh);transition:all .4s cubic-bezier(.4,0,.2,1);}
#tour-tooltip::after{content:'';position:absolute;width:10px;height:10px;background:var(--white);border:1px solid var(--b);transform:rotate(45deg);}
#tour-tooltip.arrow-bottom::after{bottom:-6px;left:50%;margin-left:-5px;border-top:none;border-left:none;}
#tour-tooltip.arrow-top::after{top:-6px;left:50%;margin-left:-5px;border-bottom:none;border-right:none;}
.tour-header{display:flex;align-items:center;gap:10px;margin-bottom:14px;}
.tour-icon{width:38px;height:38px;border-radius:8px;background:var(--red-light);border:1px solid rgba(232,72,85,.2);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;}
.tour-step-label{font-size:10px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:2px;}
.tour-title{font-size:16px;font-weight:800;color:var(--fg);line-height:1.2;}
.tour-desc{font-size:13px;color:var(--fg2);line-height:1.65;margin-bottom:18px;}
.tour-footer{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.tour-skip{font-size:12px;color:var(--fg3);cursor:default;background:transparent;border:1px solid transparent;border-radius:var(--btn-outline-radius);font-family:inherit;padding:6px 12px;transition:background .15s,color .15s;}
.tour-skip:hover{color:var(--fg2);background:var(--bg);border-color:var(--b);}
.tour-dots{display:flex;gap:5px;align-items:center;}
.tour-dot{width:5px;height:5px;border-radius:50%;background:var(--b);transition:all .25s;}
.tour-dot.active{background:var(--red);width:20px;border-radius:3px;}
.tour-next{padding:10px 28px;background:var(--red);color:#fff;border:1px solid var(--red);border-radius:var(--btn-outline-radius);font-family:'Plus Jakarta Sans',sans-serif;font-size:13px;font-weight:700;cursor:default;transition:background .15s;box-shadow:0 2px 10px rgba(232,72,85,.2);}
.tour-next:hover{background:var(--red-hover);border-color:var(--red-hover);}
.tour-progress{height:2px;background:var(--blue-mid);border-radius:2px;margin-bottom:18px;overflow:hidden;}
.tour-progress-fill{height:100%;background:var(--blue);border-radius:2px;transition:width .4s ease;}

/* ── CLEAN OUTLINE BUTTONS (global) ── */
#premium-lock-overlay button{
  color:#111 !important;
  border-color:rgba(0,0,0,.14) !important;
}
#premium-lock-overlay button:hover{background:rgba(0,0,0,.05) !important;}
#premium-lock-overlay button[style*="flex:1.4"]{color:#d32f2f !important;border-color:rgba(211,47,47,.35) !important;}
#premium-lock-overlay button[style*="flex:1.4"]:hover{background:rgba(211,47,47,.08) !important;}
#contact-owner-overlay button,
#signout-modal button,
#wr-confirm-modal button,
#wr-submitting-modal button,
#writing-feedback button,
#vocab-chat-modal button,
.tgmodal button,
.overlay:not(.prof-edit-overlay):not(.prof-name-overlay) button{
  background:transparent !important;
  color:var(--fg) !important;
  border:1.5px solid var(--btn-outline-border) !important;
  border-radius:var(--btn-outline-radius) !important;
  box-shadow:none !important;
  transition:background .15s ease !important;
}
#premium-lock-overlay button:hover,
#contact-owner-overlay button:hover,
#signout-modal button:hover,
#wr-confirm-modal button:hover,
#writing-feedback button:hover,
#vocab-chat-modal button:hover,
.tgmodal button:hover,
.overlay:not(.prof-edit-overlay):not(.prof-name-overlay) button:hover{
  background:var(--btn-outline-hover) !important;
}
.prof-name-overlay .prof-name-cancel:hover{
  background:var(--red) !important;color:#fff !important;border-color:var(--red) !important;
}
.prof-name-overlay .prof-name-save:hover{
  background:var(--red-hover) !important;border-color:var(--red-hover) !important;color:#fff !important;
}
#premium-lock-overlay button[style*="flex:1.4"],
#signout-modal button[onclick*="signOut"],
button.btn-danger-outline{
  background:var(--red) !important;
  color:#fff !important;
  border-color:var(--red) !important;
}
#premium-lock-overlay button[style*="flex:1.4"]:hover,
#signout-modal button[onclick*="signOut"]:hover,
button.btn-danger-outline:hover{
  background:var(--red-hover) !important;
  border-color:var(--red-hover) !important;
}
#contact-owner-overlay button[style*="width:34px"],
#vocab-chat-modal button[style*="font-size:20px"],
button[style*="background:none"][style*="border:none"]{
  border:none !important;
  background:transparent !important;
}
#contact-owner-overlay button[style*="width:34px"]:hover,
#vocab-chat-modal button[style*="font-size:20px"]:hover{
  background:var(--btn-outline-hover) !important;
  border:1.5px solid var(--btn-outline-border) !important;
}
/* Catch remaining action buttons (excludes nav, tabs, test options, toggles) */
button:not(.dp):not(.nl):not(.lib-nav-btn):not(.lib-tab):not(.mob-stab):not(.lb-tab):not(.sett-toggle):not(.prof-field):not(.prof-action-row):not(.prof-seg-btn):not(.prof-toggle):not(.prof-premium-btn):not(.prof-logout-btn):not(.prof-edit-band-chip):not(.prof-edit-time-chip):not(.prof-edit-close):not(.prof-edit-save):not(.prof-edit-back):not(.tr-opt):not(.vocab-opt):not(.hl-swatch):not(.udrop-item):not(.asb-so):not(.goal-edit-btn):not(.theme-btn):not(.wchip):not(.filt-chip):not(.lib-flt-btn):not(.wr-mode-btn):not(.wr-task-btn):not(.tr-part-tab):not(.tr-listen-ptab):not(.sc-btn):not(.vocab-level-btn):not(.tour-dot):not(.tr-qnav-btn):not(.hl-btn):not(.tr-close):not(.ann-dismiss):not(.land-prep-link):not(.land-prep-back):not(.lib-mode-pill):not(.app-prog-tab):not(.dash-link-btn):not(.dash-live-btn):not(.dash-exam-btn):not(.dash-exam-pick-save):not(.dash-exam-pick-cancel):not(.dash-dp-day):not(.dash-dp-nav):not(.app-sidebar-toggle):not(.we-settings-opt):not(.we-settings-close):not(.we-settings-card):not(.we-report-cancel):not(.we-report-submit):not(.inspera-letter-btn):not(.tr-inspera-qbtn):not(.tr-inspera-foot-part-btn):not(.tr-inspera-nav):not(.tr-inspera-icon-btn):not(.tr-head-icon){
  background:transparent;
  border:1.5px solid var(--btn-outline-border);
  color:var(--fg);
  border-radius:var(--btn-outline-radius);
  box-shadow:none;
  transition:background .15s ease,border-color .15s ease,color .15s ease;
}
button:not(.dp):not(.nl):not(.lib-nav-btn):not(.lib-tab):not(.mob-stab):not(.lb-tab):not(.sett-toggle):not(.prof-field):not(.prof-action-row):not(.prof-seg-btn):not(.prof-toggle):not(.prof-premium-btn):not(.prof-logout-btn):not(.prof-edit-band-chip):not(.prof-edit-time-chip):not(.prof-edit-close):not(.prof-edit-save):not(.prof-edit-back):not(.tr-opt):not(.vocab-opt):not(.hl-swatch):not(.udrop-item):not(.asb-so):not(.goal-edit-btn):not(.theme-btn):not(.wchip):not(.filt-chip):not(.lib-flt-btn):not(.wr-mode-btn):not(.wr-task-btn):not(.tr-part-tab):not(.tr-listen-ptab):not(.sc-btn):not(.vocab-level-btn):not(.tour-dot):not(.tr-qnav-btn):not(.hl-btn):not(.tr-close):not(.ann-dismiss):not(.land-prep-link):not(.land-prep-back):not(.lib-mode-pill):not(.app-prog-tab):not(.dash-link-btn):not(.dash-live-btn):not(.dash-exam-btn):not(.dash-exam-pick-save):not(.dash-exam-pick-cancel):not(.dash-dp-day):not(.dash-dp-nav):not(.app-sidebar-toggle):not(.we-settings-opt):not(.we-settings-close):not(.we-settings-card):not(.we-report-cancel):not(.we-report-submit):not(.inspera-letter-btn):not(.tr-inspera-qbtn):not(.tr-inspera-foot-part-btn):not(.tr-inspera-nav):not(.tr-inspera-icon-btn):not(.tr-head-icon):hover:not(:disabled){
  background:var(--btn-outline-hover);
}
button:not(.dp):not(.nl):not(.lib-nav-btn):not(.lib-tab):not(.mob-stab):not(.lb-tab):not(.sett-toggle):not(.prof-field):not(.prof-action-row):not(.prof-seg-btn):not(.prof-toggle):not(.prof-premium-btn):not(.prof-logout-btn):not(.prof-edit-band-chip):not(.prof-edit-time-chip):not(.prof-edit-close):not(.prof-edit-save):not(.prof-edit-back):not(.tr-opt):not(.vocab-opt):not(.hl-swatch):not(.udrop-item):not(.asb-so):not(.goal-edit-btn):not(.theme-btn):not(.wchip):not(.filt-chip):not(.lib-flt-btn):not(.wr-mode-btn):not(.wr-task-btn):not(.tr-part-tab):not(.tr-listen-ptab):not(.sc-btn):not(.vocab-level-btn):not(.tour-dot):not(.tr-qnav-btn):not(.hl-btn):not(.tr-close):not(.ann-dismiss):not(.land-prep-link):not(.land-prep-back):not(.lib-mode-pill):not(.app-prog-tab):not(.dash-link-btn):not(.dash-live-btn):not(.dash-exam-btn):not(.dash-exam-pick-save):not(.dash-exam-pick-cancel):not(.dash-dp-day):not(.dash-dp-nav):not(.app-sidebar-toggle):not(.we-settings-opt):not(.we-settings-close):not(.we-settings-card):not(.we-report-cancel):not(.we-report-submit):not(.inspera-letter-btn):not(.tr-inspera-qbtn):not(.tr-inspera-foot-part-btn):not(.tr-inspera-nav):not(.tr-inspera-icon-btn):not(.tr-head-icon):disabled{
  background:transparent;
  color:var(--fg3);
  border-color:var(--b);
  opacity:.65;
  cursor:not-allowed;
}
/* Nav / tab active states keep their own fills */
.lib-nav-btn.active,.mob-stab.active,.lb-tab.on,.wr-mode-btn.active{background:var(--blue);color:#fff;border-color:var(--blue);}
body[data-app-page="lib"] .lib-tab.active,
body.app-with-shell .lib-tab.active{background:var(--white) !important;color:var(--fg) !important;border-color:var(--b) !important;font-weight:700 !important;}
.lib-nav-btn,.lib-tab,.mob-stab,.lb-tab,.wr-mode-btn,.wr-task-btn{background:transparent;border:1.5px solid var(--btn-outline-border);color:var(--fg2);}
.lib-nav-btn:hover,.lib-tab:hover,.mob-stab:hover,.lb-tab:hover,.wr-mode-btn:hover:not(.active),.wr-task-btn:hover{background:var(--btn-outline-hover);}

/* ── PROFESSIONAL UI POLISH ── */
/* Smooth transitions everywhere */
.lib-row{transition:background .18s ease,border-color .18s ease,box-shadow .18s ease !important;}
.lib-start-btn{transition:background .18s ease,color .18s ease !important;}

/* Subtle card accent on hover */
.lib-row:hover .lib-row-title{color:var(--fg) !important;}
.lib-row:hover .lib-row-ico{border-color:rgba(42,171,238,.3) !important;}

/* Cleaner section labels */
.lib-section-label{opacity:.7;}

/* Refined tag badges */
.lib-row-tag{font-size:10.5px !important;letter-spacing:.03em;}
.lib-row-tag.free{background:rgba(22,163,74,.07) !important;color:#16a34a !important;}
.lib-row-tag.premium{background:rgba(42,171,238,.07) !important;color:var(--tg) !important;}

/* Cleaner meta text */
.lib-row-meta{gap:8px !important;}

.lib-start-btn:hover{background:var(--btn-outline-hover) !important;}

/* wr-test-card — remove jump animation */
.wr-test-card{transition:background .18s ease,border-color .18s ease !important;}
.wr-test-card:hover{transform:none !important;}

/* Vocab level btn — no jump */
.vocab-level-btn:hover{transform:none !important;}
.vocab-level-btn{transition:background .15s ease,border-color .15s ease !important;}

/* Feat/hp card — keep subtle lift but reduce it */
.feat-card:hover{transform:translateY(-3px) !important;}
.hp-card:hover{transform:translateY(-2px) !important;}

/* Calm cursor — default on generic buttons; pointer on real controls */
.btn-primary,.btn-ghost,.signin-btn,.prac-gate-btn,.vocab-start-btn,.lib-start-btn,.lib-lock-btn,
.tgm-cancel,.tg-btn,.unm-btn,.pc2-btn,.pc-btn,.abtn,.abtn-sm,.back-btn,.tour-next,.sett-danger-btn,
.land-proof-link,.land-proof-btn{
  cursor:default;
}
.land-btn,.nav-start-btn,.logo,.dp,.nl,.uchip,.lib-nav-btn,.lib-tab,.mob-stab,.lb-tab,.tr-opt,.vocab-opt,.vocab-level-btn,.wr-mode-btn,.wr-task-btn,.udrop-item,.sett-toggle{cursor:pointer;}
body.on-land button,
body.on-land .land-btn,
body.on-land .nav-start-btn,
body.on-land .land-faq-q,
body.on-land .land-proof-link{cursor:default;}
body.on-land .nav-links--float .nl{cursor:pointer;}

/* ── NPROGRESS BAR ──────────────────────── */
#npbar{
  position:fixed;top:0;left:0;height:4px;width:0%;opacity:0;
  background:linear-gradient(90deg,var(--red),#ec4899,#a78bfa,var(--blue),#5bc4f8,var(--red));
  background-size:300% 100%;
  z-index:2000001;pointer-events:none;
  border-radius:0 3px 3px 0;
  box-shadow:0 2px 10px rgba(232,72,85,.45),0 2px 14px rgba(42,171,238,.35);
  transition:width .5s cubic-bezier(.4,0,.2,1),opacity .3s ease;
}
#npbar.np-running{
  opacity:1;
  animation:npShimmer 1.2s linear infinite;
}
@keyframes npShimmer{0%{background-position:300% center}100%{background-position:-300% center}}

/* ── PAGE ENTRY ANIMATION ───────────────── */
@keyframes pgIn{
  from{opacity:0;transform:translateY(13px)}
  to{opacity:1;transform:translateY(0)}
}
.page.page-in{
  animation:pgIn .38s cubic-bezier(.25,.46,.45,.94) both;
}

/* ═══════════════════════════════════════════════════════
   INTERACTION POLISH
═══════════════════════════════════════════════════════ */

/* Universal button press feedback */
button:active:not(:disabled):not(.prof-field){transform:scale(0.96);transition:transform .07s ease !important;}
.prof-field:active:not(:disabled){transform:none;}
.btn-primary:active:not(:disabled){transform:scale(0.97);}
.lib-start-btn:active:not(:disabled){transform:scale(0.94);}
.vocab-opt:active:not(:disabled){transform:scale(0.97);}
.tr-opt:active:not(:disabled){transform:scale(0.97);}
.dp:active:not(:disabled){transform:scale(0.92);}

/* Keyboard focus ring */
*:focus-visible{outline:2px solid var(--gold);outline-offset:3px;border-radius:6px;}
button:focus-visible{outline-offset:4px;}
input:focus-visible,select:focus-visible,textarea:focus-visible{outline-offset:0;border-radius:4px;}

/* ═══════════════════════════════════════════════════════
   LIBRARY CARD HOVER LIFT
═══════════════════════════════════════════════════════ */
.lib-row{transition:background .15s,border-color .15s,box-shadow .15s,transform .13s;}
.lib-row:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(0,0,0,.22);}
[data-theme="light"] .lib-row:hover{box-shadow:0 6px 20px rgba(0,0,0,.09);}

/* ═══════════════════════════════════════════════════════
   LEADERBOARD
═══════════════════════════════════════════════════════ */
.lb-row:hover:not(.me){background:var(--s2);border-color:var(--b2);}
/* Tab content fade-swap */
.lb-list{transition:opacity .15s ease;}
.lb-list.fading{opacity:0;pointer-events:none;}

/* ═══════════════════════════════════════════════════════
   TOAST — clear bottom nav on mobile
═══════════════════════════════════════════════════════ */
@media(max-width:768px){
  .toast{bottom:calc(60px + env(safe-area-inset-bottom) + 10px) !important;}
}

/* ═══════════════════════════════════════════════════════
   TEST RESULTS PANEL ENTRANCE
═══════════════════════════════════════════════════════ */
.tr-results.show{animation:popIn .38s cubic-bezier(.34,1.2,.64,1) both;}
.tr-result-band{animation:statPop .55s cubic-bezier(.34,1.3,.64,1) .12s both;}
.tr-result-stat{animation:fadeUp .4s ease both;}
.tr-result-stat:nth-child(1){animation-delay:.18s;}
.tr-result-stat:nth-child(2){animation-delay:.24s;}
.tr-result-stat:nth-child(3){animation-delay:.30s;}
.tr-result-btns{animation:fadeUp .4s ease .36s both;}

/* ═══════════════════════════════════════════════════════
   VOCAB CARD + OPTIONS ENTRANCE
═══════════════════════════════════════════════════════ */
.vocab-card{animation:pgIn .3s cubic-bezier(.25,.46,.45,.94) both;}
.vocab-feedback{animation:fadeUp .22s ease both;}
.vocab-opts .vocab-opt:nth-child(1){animation:fadeUp .2s ease both;}
.vocab-opts .vocab-opt:nth-child(2){animation:fadeUp .2s ease .05s both;}
.vocab-opts .vocab-opt:nth-child(3){animation:fadeUp .2s ease .10s both;}
.vocab-opts .vocab-opt:nth-child(4){animation:fadeUp .2s ease .15s both;}

/* ═══════════════════════════════════════════════════════
   LISTENING MCQ ITEMS ENTRANCE
═══════════════════════════════════════════════════════ */
.tr-listen-mcq-item:nth-child(1){animation:fadeUp .22s ease both;}
.tr-listen-mcq-item:nth-child(2){animation:fadeUp .22s ease .04s both;}
.tr-listen-mcq-item:nth-child(3){animation:fadeUp .22s ease .08s both;}
.tr-listen-mcq-item:nth-child(4){animation:fadeUp .22s ease .12s both;}
.tr-listen-mcq-item:nth-child(5){animation:fadeUp .22s ease .16s both;}
.tr-listen-mcq-item:nth-child(n+6){animation:fadeUp .22s ease .20s both;}

/* ═══════════════════════════════════════════════════════
   MODAL CONTENT ENTRANCE
═══════════════════════════════════════════════════════ */
#wr-confirm-modal>div{animation:popIn .22s cubic-bezier(.34,1.3,.64,1) both;}
#wr-submitting-modal>div{animation:popIn .28s cubic-bezier(.34,1.3,.64,1) both;}
#writing-feedback-content>*:first-child{animation:pgIn .35s ease .05s both;}

/* ═══════════════════════════════════════════════════════
   READING PART TABS + LISTEN PART TABS
═══════════════════════════════════════════════════════ */
.tr-part-tab{transition:background .15s,color .15s,border-color .15s;}
.tr-listen-ptab{transition:background .15s,color .15s;}

/* ═══════════════════════════════════════════════════════
   PASSAGE WORD WRAPPING (prevents overflow on mobile)
═══════════════════════════════════════════════════════ */
.tr-passage p,.tr-passage-inner p,
.tr-listen-note-body,.tr-listen-mcq-text,
.tr-qtext,.tr-tfng-label{word-break:break-word;overflow-wrap:break-word;}

/* ═══════════════════════════════════════════════════════
   WRITING FEEDBACK SCROLL ANCHOR
═══════════════════════════════════════════════════════ */
#writing-feedback{scroll-behavior:smooth;}

/* ═══ CLEAN UI — contrast + red CTAs + blue accents ═══ */
.sett-section:has(#sett-theme-toggle){display:none !important;}
.page,.nav,.hero,.lib-wrap,.sett-wrap,.prof-wrap{position:relative;z-index:1;}
.hero-eyebrow{background:var(--red-light);border-color:rgba(232,72,85,.22);color:var(--red);}
.eyebrow-dot{background:var(--red);}
.hp-val{color:var(--blue);}
.pricing-title em,.cta-h em,.hist-hero-h em{color:var(--red);}
.pc2-plan-name.gold,.pc2-item.yes.gold{color:var(--red);}
.pc2-item.yes.gold::before{background:var(--red-light);color:var(--red);}
.footer-col-link:hover,.footer-copy a,.logo:hover .logo-text{color:var(--red);}
.footer-logo-mark{background:var(--red);color:#fff;}
.pricing-card.featured{border-color:rgba(232,72,85,.3);}
.pricing-card.featured::before{background:var(--red);color:#fff;}
.pc-btn-gold{background:var(--red) !important;border-color:var(--red) !important;color:#fff !important;}
.pc-btn-gold:hover{background:var(--red-hover) !important;}
.vocab-hero-icon,.vocab-prog-fill{background:var(--blue) !important;}
.vocab-card-mode,.vocab-score-pill{color:var(--blue) !important;}
.vocab-score-pill{background:var(--blue-mid) !important;}
.vocab-result-score{color:var(--blue) !important;}
.vocab-mode-btn.selected,.vocab-level-btn.selected{border-color:var(--blue) !important;background:var(--blue-mid) !important;}
.vocab-start-btn,.vocab-next-btn{border-color:rgba(232,72,85,.35) !important;color:var(--red) !important;}
.vocab-start-btn:hover,.vocab-next-btn:hover{background:var(--red-light) !important;}
.unm-btn:not(:disabled){background:var(--red) !important;border-color:var(--red) !important;color:#fff !important;}
.unm-btn:not(:disabled):hover{background:var(--red-hover) !important;}
.lib-start-btn{color:var(--red) !important;border-color:rgba(232,72,85,.35) !important;}
.lib-start-btn:hover{background:var(--red-light) !important;}
.xp-level-badge{background:var(--red) !important;}
.xp-bar-fill{background:var(--blue) !important;}
.dc-progress-fill,.bj-bar{background:var(--blue) !important;}
.lb-tab.on{background:var(--red) !important;border-color:var(--red) !important;color:#fff !important;}
.lib-nav-btn.active,.lib-tab.active,.mob-stab.active{background:var(--blue) !important;border-color:var(--blue) !important;color:#fff !important;}
.lb-avatar-fb,.sett-toggle.on{background:var(--blue) !important;}
#npbar{
  height:4px !important;
  background:linear-gradient(90deg,var(--red),#ec4899,#a78bfa,var(--blue),#5bc4f8,var(--red)) !important;
  background-size:300% 100% !important;
  box-shadow:0 2px 10px rgba(232,72,85,.45),0 2px 14px rgba(42,171,238,.35) !important;
}
#nav-signin.google-signin-btn:not(.signin-loading),
.tgmodal .google-signin-btn:not(.signin-loading),
.prac-gate-btn.google-signin-btn:not(.signin-loading){
  display:inline-flex;align-items:center;justify-content:center;gap:10px;
  min-width:220px;padding:12px 32px;background:var(--red);color:#fff;
  border:1.5px solid #c42e3c;border-radius:var(--btn-outline-radius);
  font-family:'Plus Jakarta Sans',sans-serif;font-size:14px;font-weight:700;
  cursor:default;transition:background .15s,border-color .15s;box-shadow:0 2px 10px rgba(232,72,85,.2);
  margin-left:auto;margin-right:auto;
}
#nav-signin.google-signin-btn:not(.signin-loading) svg,
.tgmodal .google-signin-btn:not(.signin-loading) svg,
.prac-gate-btn.google-signin-btn:not(.signin-loading) svg{
  background:#fff;border-radius:3px;padding:1px;box-sizing:content-box;
}
#nav-signin.google-signin-btn:not(.signin-loading):hover,
.tgmodal .google-signin-btn:not(.signin-loading):hover,
.prac-gate-btn.google-signin-btn:not(.signin-loading):hover{background:var(--red-hover);border-color:var(--red-hover);}
.hero .btn-ghost.google-signin-btn{background:var(--white) !important;color:var(--fg) !important;border:1px solid var(--btn-outline-border) !important;box-shadow:none !important;}
.hero .btn-ghost.google-signin-btn:hover{background:var(--bg) !important;border-color:rgba(42,171,238,.35) !important;}
.tg-btn{background:var(--red) !important;border-color:var(--red) !important;color:#fff !important;}
.tg-btn:hover{background:var(--red-hover) !important;}
.lg-overlay,.username-overlay{background:rgba(250,251,252,.78) !important;}
.adm-badge.reading{background:var(--blue-mid);color:#0d85cc;}
.adm-badge.listening{background:var(--red-light);color:var(--red);}
@media(min-width:769px){
  .pnav .dp.on{background:var(--blue) !important;color:#fff !important;}
  .pnav .dp{color:var(--fg2) !important;}
}
.lib-row{background:var(--white);}
.lib-sidebar{background:var(--white);border-color:var(--b);}
.sett-card,.hist-card,.feat,.hp-card,.pc2,.cta{background:var(--white);}
.feat-grid{background:var(--b);}
.testi-card,.lb-row,.vocab-card{background:var(--white);}

/* ── App shell (signed-in dashboard) ── */
body.app-with-shell{padding-left:0;background:#eef1f4;}
body.app-with-shell .page{background:#eef1f4;min-height:100vh;}
body.app-hide-topnav.user-signed-in #nav,
body.app-hide-topnav.app-with-shell #nav{display:none !important;}
body.app-hide-topnav.user-signed-in #grid-canvas,
body.app-hide-topnav.user-signed-in #cursor-glow,
body.app-hide-topnav.app-with-shell #grid-canvas,
body.app-hide-topnav.app-with-shell #cursor-glow{display:none !important;}
body.app-with-shell #pnav{display:none !important;}
body.app-with-shell #grid-canvas,
body.app-with-shell #cursor-glow{display:none;}

.app-sidebar{
  position:fixed;left:0;top:0;bottom:0;width:220px;z-index:900;
  background:var(--white);border-right:1px solid var(--b);
  display:flex;flex-direction:column;padding:20px 14px;
}
h1,h2,h3,.land-prep-h,.app-account-title,.tests-hub-title,.dash-greeting{
  font-family:'Plus Jakarta Sans','Inter',system-ui,sans-serif;letter-spacing:-.02em;
}
.app-sidebar-brand{
  display:flex;align-items:center;gap:10px;
  font-family:'Plus Jakarta Sans','Inter',system-ui,sans-serif;font-weight:700;font-size:16px;
  color:var(--red);text-decoration:none;margin-bottom:24px;padding:4px 8px;
}
.app-sidebar-brand-dot{
  width:28px;height:28px;border-radius:50%;background:var(--red);
  flex-shrink:0;box-shadow:0 2px 8px rgba(232,72,85,.35);
}
.app-sidebar-logo{
  width:32px;height:32px;border-radius:8px;object-fit:contain;flex-shrink:0;
}
.app-sidebar-brand-text{line-height:1.1;}
.app-sidebar-nav{flex:1;display:flex;flex-direction:column;gap:4px;min-height:0;}
.app-sidebar-foot{
  margin-top:auto;padding-top:16px;
  display:flex;flex-direction:column;gap:8px;
}
.app-sidebar-user{
  display:flex;align-items:center;gap:10px;
  padding:8px 10px 10px;border:1px solid var(--b);border-radius:12px;background:var(--s);
}
.app-sidebar-user-av{
  width:34px;height:34px;border-radius:50%;background:rgba(232,72,85,.14);
  color:var(--red);display:flex;align-items:center;justify-content:center;
  font-size:13px;font-weight:800;overflow:hidden;flex-shrink:0;
}
.app-sidebar-user-av img{width:100%;height:100%;object-fit:cover;}
.app-sidebar-user-meta{min-width:0;display:flex;flex-direction:column;}
.app-sidebar-user-meta strong{font-size:13px;line-height:1.2;color:var(--fg);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.app-sidebar-user-meta span{font-size:11px;color:var(--fg3);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.app-sidebar-foot .app-sidebar-link{margin:0;}
.app-sidebar-link--profile{font-size:14px;}
.app-sidebar-link--profile-cta{background:var(--white);border-color:var(--b);justify-content:center;}
.app-sidebar-link--admin.on{
  background:rgba(99,102,241,.12);border-color:rgba(99,102,241,.28);color:#4f46e5;
}
.app-sidebar-link--admin.on .app-sidebar-ico{color:#4f46e5;}
.app-sidebar-link,.app-sidebar-premium span{
  font-family:'Inter',system-ui,sans-serif;
}
.app-sidebar-link{
  display:flex;align-items:center;gap:10px;padding:11px 14px;border-radius:10px;
  font-size:14px;font-weight:500;color:var(--fg2);text-decoration:none;
  border:1px solid transparent;
  transition:background .18s ease,border-color .18s ease,color .18s ease;
  cursor:pointer;
}
.app-sidebar-link:hover{
  background:rgba(232,72,85,.08);border-color:rgba(232,72,85,.22);color:var(--fg);
}
.app-sidebar-link.on{
  background:rgba(232,72,85,.12);border-color:transparent;color:var(--red);
}
.app-sidebar-link.on:hover{
  background:rgba(232,72,85,.16);border-color:transparent;color:var(--red);
}
.app-sidebar-link > span:last-child{position:relative;z-index:1;}
.app-sidebar-ico{position:relative;z-index:1;flex-shrink:0;}
.app-sidebar-user-meta strong{font-weight:500;}
.app-sidebar-premium--active{
  background:var(--red) !important;
  border:1px solid var(--red) !important;color:#fff !important;
  position:relative;overflow:hidden;
}
.app-sidebar-premium--active svg{stroke:#fff;}
.app-sidebar-premium--active::before{
  content:'';position:absolute;inset:-40%;
  background:conic-gradient(from 0deg,transparent,rgba(255,255,255,.35),transparent 40%);
  animation:sidebarGemSpin 4s linear infinite;opacity:.55;
}
.app-sidebar-premium--active span{position:relative;z-index:1;}
.app-sidebar-premium--active svg{position:relative;z-index:1;}
@keyframes sidebarGemSpin{to{transform:rotate(360deg);}}
.app-sidebar-link.on .app-sidebar-ico{color:var(--red);opacity:1;}
.app-sidebar-link:hover .app-sidebar-ico{color:var(--red);}
.app-sidebar-ico{
  display:flex;align-items:center;justify-content:center;
  width:20px;height:20px;flex-shrink:0;color:inherit;
}
.app-sidebar-ico svg{display:block;width:20px;height:20px;}
.app-sidebar-premium{
  display:flex;align-items:center;justify-content:center;gap:8px;
  padding:12px;border-radius:12px;background:var(--red);color:#fff;
  font-size:13px;font-weight:700;text-decoration:none;
}
.app-sidebar-premium:hover{background:var(--red-hover);}
.app-sidebar-premium svg{flex-shrink:0;}

body.app-with-shell .page{padding-left:220px;}
body.app-with-shell .app-main-wrap{
  max-width:1200px;margin:0 auto;padding:24px 28px 48px;
}
body.app-with-shell .lib-wrap{padding-left:220px;}
body.app-with-shell .lib-sidebar{display:none;}
body.app-with-shell .lib-main{max-width:100%;}
body.app-with-shell .prog-wrap{max-width:1100px;margin:0 auto;padding:24px 28px 48px;}
body.app-with-shell .sett-hero{display:none;}
body.app-with-shell .sett-wrap{max-width:1100px;margin:0 auto;padding:24px 28px 48px;}
body.app-with-shell .lb-wrap,
body.app-with-shell .vocab-wrap{max-width:1100px;margin:0 auto;padding:24px 28px 48px;}
body:not(.app-with-shell) .vocab-hub-dash,
body:not(.app-with-shell) .app-account-header{display:none;}
body.app-with-shell .vocab-hub-dash{display:block;}
body.app-with-shell .lb-hero{margin-top:0;}

body.app-with-shell #page-pricing,
body.app-with-shell .pricing-shell{
  background:#eef1f4;
  min-height:100vh;
}
body.app-with-shell #page-pricing:has(.pricing-shell--premium-active),
body.app-with-shell .pricing-shell.pricing-shell--premium-active{
  background:transparent !important;
}
body.app-with-shell .pricing-shell .pricing-outer{
  min-height:auto;
  padding:24px 28px 48px;
  background:#eef1f4;
}
body.app-with-shell .pricing-shell .pricing-outer::before,
body.app-with-shell .pricing-shell .pricing-outer::after{display:none;}
body.app-with-shell .pricing-shell .pricing-inner{
  max-width:960px;
  margin:0 auto;
  padding:0 8px;
}
body.app-with-shell .app-sidebar-premium.on{
  background:linear-gradient(180deg,#fff5f6 0%,#ffe8eb 100%);
  border-color:rgba(232,72,85,.35);
  color:var(--red);
  font-weight:700;
}

/* App topbar + sidebar toggle removed — keep rules so stale DOM never flashes */
#app-topbar,
.app-topbar,
.app-sidebar-toggle,
.app-sidebar-foot-hr--toggle{display:none!important;}
body.app-sidebar-collapsed .app-sidebar{
  width:220px;padding:20px 14px;overflow:visible;border-right:1px solid var(--b);opacity:1;pointer-events:auto;
}
body.app-sidebar-collapsed.app-with-shell .page,
body.app-sidebar-collapsed.app-with-shell .lib-wrap{padding-left:220px!important;}
body[data-app-page="home"] .dash-top{margin-bottom:24px;}
body[data-app-page="home"] .dash-top{align-items:flex-start;}
body[data-app-page="home"] .dash-pills{margin-left:auto;flex-shrink:0;}
body[data-app-page="lib"] .tests-hub-head{display:none;}

.app-sidebar-foot-hr{
  border:none;border-top:1px solid var(--b);margin:0 0 10px;width:100%;
}
.app-sidebar-foot{padding-top:12px;padding-bottom:4px;}

/* Dashboard home */
body.app-with-shell .dash-page{
  background:transparent;min-height:calc(100vh - 48px);
}
.dash-top{
  display:flex;align-items:flex-start;justify-content:space-between;gap:20px;
  flex-wrap:wrap;margin-bottom:24px;
}
.dash-top-text{flex:1;min-width:220px;}
.dash-kicker{font-size:11px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin:0 0 6px;}
.dash-greeting{font-size:clamp(22px,4vw,30px);font-weight:800;margin:0 0 6px;color:var(--fg);}
.dash-meta{font-size:14px;color:var(--fg3);margin:0;}
.dash-pills{display:flex;gap:10px;flex-wrap:wrap;}
.dash-pill{
  display:flex;align-items:center;gap:8px;padding:10px 16px;
  background:var(--white);border:1px solid var(--b);border-radius:999px;
  box-shadow:0 2px 8px rgba(0,0,0,.04);
}
.dash-pill-ico{font-size:14px;line-height:1;}
.dash-pill-l{font-size:11px;font-weight:700;color:var(--fg3);text-transform:uppercase;letter-spacing:.06em;}
.dash-pill strong{font-size:16px;font-weight:800;color:var(--red);font-family:'Inter',sans-serif;font-variant-numeric:tabular-nums;}
.dash-pill--xp .dash-pill-ico{color:#e84855;}
.dash-pill--streak .dash-pill-ico{color:#f97316;}
.dash-layout{
  display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:16px;align-items:start;
}
.dash-col{display:flex;flex-direction:column;gap:16px;}
.dash-card{
  background:var(--white);border:1px solid var(--b);border-radius:16px;padding:20px;
  box-shadow:0 2px 12px rgba(0,0,0,.04);
}
.dash-card--compact{padding:18px;}
.dash-card--mini{padding:14px 16px;}
.dash-card-head{display:flex;align-items:flex-start;justify-content:space-between;margin-bottom:14px;gap:12px;}
.dash-card-head h2{font-size:16px;font-weight:700;margin:0;color:var(--fg);}
.dash-card-sub{font-size:12px;color:var(--fg3);margin:4px 0 0;}
.dash-card-ico{margin-right:6px;opacity:.6;}
.dash-link-btn{
  border:none !important;background:none !important;box-shadow:none !important;
  color:var(--red);font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;
  padding:0 !important;min-height:0 !important;
}
.dash-link-btn:hover{text-decoration:underline;background:none !important;}
.dash-live-btn{
  display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;
  border:1px solid var(--b);background:var(--white);font-size:12px;font-weight:700;
  color:var(--fg2);cursor:pointer;font-family:inherit;
}
.dash-live-btn:hover{border-color:var(--red);color:var(--red);}
.dash-band-hero{
  background:linear-gradient(180deg,rgba(232,72,85,.08),rgba(232,72,85,.02));
  border:1px solid rgba(232,72,85,.15);border-radius:14px;
  padding:32px 24px;text-align:center;margin-bottom:16px;
}
.dash-band-label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--fg3);margin:0 0 4px;}
.dash-band-big{font-family:'Inter',sans-serif;font-size:56px;font-weight:800;color:var(--red);line-height:1;font-variant-numeric:tabular-nums;}
.dash-band-sub{font-size:13px;color:var(--fg3);margin:8px 0 0;}
.dash-band-goal{font-size:12px;font-weight:600;color:var(--red);margin:6px 0 0;}
.dash-band-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.dash-band-stat{
  text-align:center;padding:12px;background:var(--s);border-radius:10px;
}
.dash-stat-l{display:block;font-size:10px;color:var(--fg3);text-transform:uppercase;letter-spacing:.08em;margin-bottom:4px;}
.dash-band-stat strong{font-size:20px;font-weight:800;color:var(--red);font-family:'Inter',sans-serif;font-variant-numeric:tabular-nums;}
.dash-route-list{display:flex;flex-direction:column;gap:10px;}
.dash-route-item{
  display:flex;align-items:center;gap:12px;padding:14px 16px;border-radius:12px;
  border:1px solid var(--b);cursor:pointer;transition:transform .12s,box-shadow .12s;
}
.dash-route-item:hover{transform:translateX(4px);box-shadow:0 4px 12px rgba(0,0,0,.06);}
.dash-route-item--reading{border-left:4px solid #3b82f6;background:linear-gradient(90deg,rgba(59,130,246,.06),transparent);}
.dash-route-item--listening{border-left:4px solid #8b5cf6;background:linear-gradient(90deg,rgba(139,92,246,.06),transparent);}
.dash-route-item--vocab{border-left:4px solid #10b981;background:linear-gradient(90deg,rgba(16,185,129,.06),transparent);}
.dash-route-num{font-size:12px;font-weight:800;color:var(--fg3);min-width:24px;}
.dash-route-ico{display:flex;align-items:center;justify-content:center;color:var(--fg2);}
.dash-route-ico svg{width:20px;height:20px;}
.dash-route-body{flex:1;min-width:0;}
.dash-route-type{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--fg3);}
.dash-route-title{display:block;font-size:14px;font-weight:700;color:var(--fg);margin-top:2px;}
.dash-route-arrow{color:var(--fg3);font-weight:700;}
.dash-daily-slot{min-height:80px;}
.dash-daily-slot .dc-wrap{margin:0;border:none;box-shadow:none;background:transparent;}
.dash-daily-slot .dc-wrap--compact .dc-body{padding:0;}
.dash-daily-slot .dc-challenge{border-radius:10px;margin-bottom:8px;}
.dc-compact-meta{
  display:flex;justify-content:space-between;align-items:center;
  font-size:12px;font-weight:600;color:var(--fg3);margin-bottom:12px;
}
.dash-streak-ring{
  width:56px;height:56px;border-radius:50%;background:linear-gradient(135deg,#fef3c7,#fde68a);
  display:flex;align-items:center;justify-content:center;margin-bottom:10px;
}
.dash-streak-fire{font-size:28px;line-height:1;}
.dash-streak-val{font-size:14px;font-weight:600;color:var(--fg2);margin-bottom:12px;}
.dash-streak-val strong{font-size:22px;font-weight:800;color:var(--fg);font-family:'Outfit',sans-serif;}
.dash-week{display:flex;justify-content:space-between;gap:4px;}
.dash-week span{
  flex:1;text-align:center;font-size:10px;font-weight:700;padding:6px 0;
  border-radius:8px;background:var(--s);color:var(--fg3);
}
.dash-week span.done{background:rgba(232,72,85,.12);color:var(--red);}
.dash-week span.on{background:var(--red);color:#fff;}
.dash-week span.heat.l1{background:rgba(237,73,73,.18);color:#c93a3a;}
.dash-week span.heat.l2{background:rgba(237,73,73,.32);color:#b83232;}
.dash-week span.heat.l3{background:rgba(237,73,73,.48);color:#fff;}
.dash-week span.heat.l4{background:rgba(237,73,73,.68);color:#fff;}
.dash-week span.heat.l5{background:#ED4949;color:#fff;}
.dash-week span.on.heat.l1,.dash-week span.on.heat.l2,.dash-week span.on.heat.l3,
.dash-week span.on.heat.l4,.dash-week span.on.heat.l5{background:#ED4949;color:#fff;}
.dash-quick-ico{display:flex;align-items:center;justify-content:center;margin-bottom:6px;color:var(--fg2);}
.dash-quick-item .dash-quick-ico svg{display:block;}
.dash-activity-heat{overflow:visible;padding-bottom:4px;}
.dash-activity-heat--main{min-height:120px;padding:8px 0 12px;}
.dash-activity-hint{font-size:12px;color:var(--fg3);margin:-4px 0 12px;line-height:1.45;cursor:default;}
.dash-activity-hint strong,.dash-activity-hint b{color:var(--red);font-weight:700;}
.dash-heat-scroll{overflow-x:auto;width:100%;padding-bottom:4px;-webkit-overflow-scrolling:touch;}
.dash-heat-inner{display:block;position:relative;}
.dash-heat-months-row{position:relative;margin-bottom:4px;}
.dash-heat-month{position:absolute;top:0;font-size:10px;line-height:1;color:var(--fg3);white-space:nowrap;pointer-events:none;}
.dash-heat-cell{cursor:default;}
.dash-heat-tooltip{
  position:fixed;z-index:99999;padding:8px 12px;border-radius:8px;
  background:#1f2937;color:#fff;font-size:12px;font-weight:600;
  pointer-events:none;box-shadow:0 8px 24px rgba(0,0,0,.18);white-space:nowrap;
  transform:translate(-50%, calc(-100% - 10px));
}
.dash-card--activity-main{margin-bottom:16px;}
.dash-heat-cell:hover{transform:none;z-index:2;outline:2px solid rgba(237,73,73,.45);outline-offset:1px;}
.dash-heat-wrap{display:flex;flex-direction:column;gap:8px;}
.dash-heat-grid{display:inline-grid;}
.dash-heat-cell{border-radius:3px;background:#eef0f3;flex-shrink:0;display:inline-block;}
.dash-heat-cell.l0{background:#eef0f3;border:1px solid #e5e7eb;}
.dash-heat-cell.l1{background:rgba(237,73,73,.22);}
.dash-heat-cell.l2{background:rgba(237,73,73,.38);}
.dash-heat-cell.l3{background:rgba(237,73,73,.55);}
.dash-heat-cell.l4{background:rgba(237,73,73,.75);}
.dash-heat-cell.l5{background:#ED4949;}
.dash-heat-legend{display:flex;align-items:center;gap:4px;font-size:10px;color:var(--fg3);margin-top:4px;}
.dash-exam-modal{
  position:fixed;inset:0;z-index:99990;display:none;align-items:center;justify-content:center;padding:20px;
}
.dash-exam-modal.open{display:flex;}
.dash-exam-modal-backdrop{position:absolute;inset:0;background:rgba(15,23,42,.45);backdrop-filter:blur(4px);}
.dash-exam-modal-panel{
  position:relative;z-index:1;width:100%;max-width:420px;background:#fff7f8;
  border-radius:16px;padding:24px;box-shadow:0 24px 48px rgba(0,0,0,.12);
}
.dash-exam-modal-kicker{
  font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;
  color:#9a6b6b;margin:0 0 16px;
}
.dash-exam-modal-label{display:block;font-size:12px;font-weight:600;color:var(--fg3);margin-bottom:8px;}
.dash-exam-modal-input{
  width:100%;padding:12px 14px;border:1px solid #e8d4d6;border-radius:10px;
  font-size:15px;font-family:inherit;margin-bottom:16px;background:#fff;
}
.dash-exam-modal-heat{margin-bottom:16px;overflow-x:auto;}
.dash-exam-modal-actions{display:flex;gap:10px;}
.dash-exam-modal-cancel{
  flex:1;padding:12px;border-radius:10px;border:1px solid var(--b);background:#fff;
  font-weight:600;font-family:inherit;cursor:pointer;color:var(--fg2);
}
.dash-exam-modal-save{
  flex:1;padding:12px;border-radius:10px;border:none;background:#ED4949;
  color:#fff;font-weight:700;font-family:inherit;cursor:pointer;
}
.dash-exam-modal-save:hover{background:var(--red-hover);}
.dash-mini-label{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--fg3);margin-bottom:6px;}
.dash-mini-val{font-size:28px;font-weight:800;font-family:'Inter',sans-serif;color:var(--red);font-variant-numeric:tabular-nums;letter-spacing:-0.02em;}
.dash-stat-num{font-size:22px;font-weight:800;font-family:'Inter',sans-serif;color:var(--red);font-variant-numeric:tabular-nums;display:block;margin:4px 0 2px;}
.dash-exam-ico{font-size:28px;display:block;margin-bottom:8px;}
.dash-exam-title{font-size:15px;font-weight:700;margin-bottom:6px;}
.dash-exam-sub{font-size:12px;color:var(--fg3);margin:0 0 12px;line-height:1.45;}
.dash-exam-btn{
  width:100%;padding:10px;border-radius:10px;border:none;background:var(--red);
  color:#fff;font-size:13px;font-weight:700;cursor:pointer;font-family:inherit;
}
.dash-exam-btn:hover{background:var(--red-hover);}
.dash-exam-pick{display:none;padding:4px 0 0;}
.dash-exam-pick:not([hidden]){display:block;}
.dash-exam-pick[hidden]{display:none!important;}
#dash-exam-view-default[hidden]{display:none!important;}
.dash-exam-pick-kicker{
  font-size:11px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;
  color:#b45309;margin:0 0 12px;
}
.dash-exam-pick-input{
  width:100%;box-sizing:border-box;padding:12px 14px;border-radius:12px;
  border:1px solid var(--b2);background:#fff;font-size:14px;margin-bottom:14px;
}
.dash-exam-pick-actions{
  display:flex;gap:10px;position:relative;z-index:5;pointer-events:auto;
}
.dash-exam-edit-btn{
  padding:6px 12px;border-radius:8px;border:1px solid var(--b2);
  background:#fff;color:var(--red);font-size:12px;font-weight:700;cursor:default;flex-shrink:0;
}
.dash-exam-countdown-head{display:flex;align-items:flex-start;gap:10px;margin-bottom:14px;}
.dash-exam-countdown-meta{flex:1;min-width:0;}
.dash-exam-countdown-kicker{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--fg3);display:block;}
.dash-exam-countdown-date{font-size:15px;font-weight:800;color:var(--fg);display:block;margin-top:2px;line-height:1.3;}
.dash-exam-ico--sm{margin-bottom:0;flex-shrink:0;}
.dash-countdown-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;}
.dash-countdown-unit{
  background:rgba(254,226,226,.45);border-radius:12px;padding:10px 6px;text-align:center;
}
.dash-countdown-num{
  display:block;font-size:clamp(18px,4vw,26px);font-weight:800;color:var(--red);
  font-family:'Inter',sans-serif;font-variant-numeric:tabular-nums;line-height:1.1;
}
.dash-countdown-unit span{font-size:9px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:#b45309;margin-top:4px;display:block;}
.dash-date-picker{background:#fff;border-radius:14px;padding:12px;margin-bottom:12px;}
.dash-dp-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.dash-dp-title{font-size:14px;font-weight:700;color:var(--fg);}
.dash-dp-nav{
  width:32px;height:32px;border-radius:8px;border:none!important;background:#fff;
  font-size:18px;line-height:1;color:var(--red);cursor:pointer;font-weight:700;
  box-shadow:none!important;
}
.dash-dp-weekdays{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;margin-bottom:6px;}
.dash-dp-weekdays span{font-size:10px;font-weight:700;color:var(--fg3);text-align:center;}
.dash-dp-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;}
.dash-dp-day{
  aspect-ratio:1;border:1px solid rgba(232,72,85,.25)!important;border-radius:8px;background:#fff!important;
  font-size:13px;font-weight:700;color:var(--red)!important;cursor:pointer;font-family:inherit;
  box-shadow:none!important;
}
.dash-dp-day:hover:not(:disabled):not(.on):not(.dash-dp-day--selected){background:rgba(232,72,85,.08);border-color:rgba(232,72,85,.35);}
.dash-dp-day.on,
.dash-dp-day--selected,
.dash-dp-day[aria-selected="true"]{
  background:var(--red)!important;color:#fff!important;border-color:var(--red)!important;
  box-shadow:0 2px 8px rgba(232,72,85,.35)!important;
}
.dash-dp-day--past{color:#d1d5db!important;background:#fafafa;border-color:#eee;cursor:not-allowed;}
.dash-exam-pick-cancel{
  flex:1;padding:11px 14px;border-radius:12px;border:1px solid rgba(232,72,85,.35)!important;
  background:#fff!important;font-size:13px;font-weight:700;color:var(--red)!important;cursor:pointer;
}
.dash-exam-pick-save{
  flex:1;padding:11px 14px;border-radius:12px;border:none!important;
  background:var(--red)!important;color:#fff!important;font-size:13px;font-weight:700;cursor:pointer;
}
.dash-exam-pick-save:hover{background:var(--red-hover)!important;}
.dash-dp-nav{color:var(--red);font-weight:700;cursor:pointer;}
.dash-exam-pick{position:relative;z-index:20;pointer-events:auto!important;}
.dash-date-picker{position:relative;z-index:21;pointer-events:auto!important;}
.dash-dp-grid,.dash-dp-day,.dash-dp-nav,.dash-exam-pick-actions{pointer-events:auto!important;}
.dash-card--exam.dash-exam-picking{position:relative;z-index:15;}
.dash-exam-pick-save:disabled{opacity:.65;cursor:not-allowed;}
.dash-dp-day--empty{pointer-events:none;}
.dash-dp-error{
  display:flex;align-items:flex-start;gap:8px;margin-top:10px;padding:10px 12px;
  background:#fff;border:1px solid #fca5a5;border-radius:8px;box-shadow:0 4px 12px rgba(0,0,0,.08);
}
.dash-dp-error[hidden]{display:none!important;}
.dash-dp-error-ico{
  width:18px;height:18px;border-radius:3px;background:#f97316;color:#fff;
  font-size:12px;font-weight:800;display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.dash-dp-error span:last-child{font-size:12px;color:var(--fg);line-height:1.4;}
.dash-badge-equipped{display:inline-flex;align-items:center;gap:5px;font-weight:600;}
.dash-vocab-route-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.dash-vocab-route-kicker{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;color:var(--fg3);}
.dash-vocab-route-pct{font-size:12px;font-weight:700;color:#16a34a;background:rgba(22,163,74,.12);padding:3px 8px;border-radius:100px;}
.dash-vocab-route-main strong{font-size:28px;font-weight:800;color:var(--red);font-family:'Inter',sans-serif;font-variant-numeric:tabular-nums;}
.dash-vocab-route-bar{height:6px;background:rgba(232,72,85,.12);border-radius:100px;margin:10px 0 8px;overflow:hidden;}
.dash-vocab-route-fill{height:100%;background:var(--red);border-radius:100px;width:0;transition:width .35s ease;}
.dash-vocab-route-sub{font-size:12px;color:var(--fg3);margin:0;}
.dash-progress-title{font-size:13px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;color:var(--fg3);margin:0 0 14px;}
.dash-progress-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;}
.dash-progress-tile{
  background:rgba(254,226,226,.35);border-radius:14px;padding:14px 10px;text-align:center;
}
.dash-progress-ico{display:flex;align-items:center;justify-content:center;color:var(--red);margin-bottom:6px;}
.dash-progress-tile span{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:var(--fg3);}
.dash-page,.dash-page p,.dash-page h1,.dash-page h2,.dash-page h3,.dash-page span:not([onclick]),.dash-page strong,.dash-page label{cursor:default;}
.dash-page button,.dash-page a,.dash-page [onclick],.dash-quick-item,.dash-route-item,.dash-link-btn,.dash-live-btn,.dash-exam-btn,.dash-dp-day:not(:disabled),.dash-exam-pick-save,.dash-exam-pick-cancel,.dash-dp-nav{cursor:pointer;}
.dash-hero-banner,.dash-hero-cta{cursor:default;}
.dash-exam-edit-btn{cursor:pointer;}
.dash-card--exam.dash-exam-picking{background:rgba(254,226,226,.35);}
.dash-profile-card{display:flex;align-items:center;gap:12px;}
.dash-profile-av{
  width:48px;height:48px;border-radius:50%;background:rgba(232,72,85,.15);
  color:var(--red);font-weight:800;font-size:18px;display:flex;align-items:center;
  justify-content:center;overflow:hidden;flex-shrink:0;
}
.dash-profile-av img{width:100%;height:100%;object-fit:cover;}
.dash-profile-info strong{display:block;font-size:15px;}
.dash-profile-badge{font-size:12px;color:var(--fg3);}
.dash-stat-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
.dash-header{margin-bottom:24px;}
.dash-header--row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap;}
.dash-header-main{flex:1;min-width:200px;}
.dash-grid{display:grid;grid-template-columns:1.4fr 1fr;gap:16px;}
.dash-card--wide{grid-column:1/-1;}
.dash-card-tag{font-size:11px;color:var(--fg3);font-weight:600;}
.dash-mini-stat strong{display:block;font-size:28px;font-weight:800;font-family:'Outfit',sans-serif;color:var(--fg);}
.dash-mini-stat span{font-size:12px;color:var(--fg3);}

/* Tests mode pills */
.lib-mode-bar{
  display:flex;flex-wrap:wrap;gap:8px;margin-bottom:16px;padding:0 4px;
}
.lib-mode-pill{
  display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border-radius:999px;
  font-size:13px;font-weight:600;color:var(--fg2);background:var(--white);
  border:1px solid var(--b);cursor:pointer;font-family:inherit;
  transition:background .15s,border-color .15s,color .15s;
}
.lib-mode-pill:hover{border-color:#d1d5db;}
.lib-mode-pill.on{
  border-color:var(--red);background:rgba(232,72,85,.12);color:var(--red);
}

/* Tests hub (signed-in library) */
body:not(.app-with-shell):not([data-app-page="lib"]) #tests-hub{display:none;}
body.app-with-shell .lib-mode-bar,
body.app-with-shell .lib-access-tabs,
body.app-with-shell .lib-topbar-titlerow{display:none !important;}
body.app-with-shell .lib-main{padding:20px 24px 80px;background:transparent;}
body.app-with-shell .lib-wrap{background:transparent;}
body.app-with-shell .lib-filters-row{margin-bottom:20px;}
body.app-with-shell .lib-search-wrap{flex:1;max-width:none;}
.tests-hub{margin-bottom:20px;}
.tests-hub-title{font-size:26px;font-weight:800;margin:0 0 4px;color:var(--fg);}
.tests-hub-sub{font-size:14px;color:var(--fg3);margin:0 0 16px;}
.tests-cat-pills{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:14px;}
.tests-cat-pill{
  padding:8px 14px;border-radius:999px;border:1px solid var(--b);
  background:var(--white);font-size:13px;font-weight:600;color:var(--fg2);
  cursor:pointer;font-family:inherit;transition:all .15s;
}
.tests-cat-pill:hover{border-color:#d1d5db;color:var(--fg);}
.tests-cat-pill.on{border-color:var(--red);background:rgba(232,72,85,.1);color:var(--red);}
.tests-skill-tabs{
  display:flex;gap:0;border-bottom:2px solid var(--b);margin-bottom:4px;
}
.tests-skill-tab{
  padding:12px 20px;border:none;background:none;font-family:inherit;
  font-size:14px;font-weight:600;color:var(--fg3);cursor:pointer;
  border-bottom:2px solid transparent;margin-bottom:-2px;
}
.tests-skill-tab:hover{color:var(--fg);}
.tests-skill-tab.on{color:var(--red);border-bottom-color:var(--red);}
.tests-grid-head{display:flex;align-items:baseline;justify-content:space-between;margin:8px 0 14px;gap:12px;}
.tests-grid-heading{font-size:18px;font-weight:700;margin:0;}
.tests-grid-count{font-size:13px;color:var(--fg3);font-weight:600;}
.tests-grid{
  display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px;
}
.test-set-card{
  background:var(--white);border:1px solid var(--b);border-radius:14px;
  padding:16px;cursor:pointer;transition:transform .12s,box-shadow .12s,border-color .12s;
  display:flex;flex-direction:column;gap:8px;min-height:140px;
}
.test-set-card:hover{transform:translateY(-2px);box-shadow:0 8px 24px rgba(0,0,0,.08);border-color:rgba(232,72,85,.35);}
.test-set-card--locked{opacity:.85;}
.test-set-card-top{display:flex;justify-content:space-between;align-items:center;gap:8px;}
.test-set-card-type{font-size:10px;font-weight:800;text-transform:uppercase;letter-spacing:.06em;}
.test-set-card-type--reading{color:#2563eb;}
.test-set-card-type--listening{color:#7c3aed;}
.test-set-card-tag{font-size:10px;font-weight:700;padding:3px 8px;border-radius:6px;}
.test-set-card-tag.free{background:rgba(22,163,74,.1);color:#16a34a;}
.test-set-card-tag.premium{background:rgba(245,158,11,.12);color:#b45309;}
.test-set-card-title{font-size:15px;font-weight:700;margin:0;line-height:1.35;color:var(--fg);}
.test-set-card-sub{font-size:12px;color:var(--fg3);margin:0;flex:1;}
.test-set-card-foot{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:8px;border-top:1px solid var(--b);}
.test-set-card-band{font-size:12px;font-weight:700;color:var(--fg3);}
.test-set-card-band--empty{font-weight:500;}
.test-set-card-cta{font-size:13px;font-weight:700;color:var(--red);}

/* Dashboard extras */
.dash-hero-banner{
  display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;
  padding:18px 20px;margin-bottom:16px;border-radius:12px;
  background:linear-gradient(120deg,rgba(232,72,85,.08),rgba(42,171,238,.06));
  border:1px solid var(--b);cursor:default;
  transition:background .18s,border-color .18s;
}
.dash-hero-banner:hover{background:rgba(232,72,85,.12);border-color:rgba(232,72,85,.28);}
.dash-hero-banner p{margin:0;font-size:14px;color:var(--fg2);max-width:520px;}
.dash-hero-banner strong{display:block;font-size:16px;font-weight:500;color:var(--fg);margin-bottom:4px;}
.dash-hero-cta{
  padding:10px 18px;border-radius:10px;background:var(--white);color:var(--fg);
  font-size:13px;font-weight:500;border:1px solid var(--b);cursor:default;font-family:inherit;
  transition:background .14s,border-color .14s,color .14s;
}
.dash-hero-banner:hover .dash-hero-cta{background:var(--red);border-color:var(--red);color:#fff;}
.dash-quick-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px;}
.dash-quick-item{
  background:var(--white);border:1px solid var(--b);border-radius:12px;padding:14px;
  text-align:center;cursor:pointer;transition:border-color .15s,box-shadow .15s;
}
.dash-quick-item:hover{border-color:rgba(232,72,85,.4);box-shadow:0 4px 12px rgba(0,0,0,.06);}
.dash-quick-item strong{display:block;font-size:20px;font-weight:800;color:var(--red);font-family:'Inter',sans-serif;font-variant-numeric:tabular-nums;}
.dash-quick-item span{font-size:11px;color:var(--fg3);font-weight:600;text-transform:uppercase;letter-spacing:.04em;cursor:default;}
.dash-quick-item{cursor:pointer;}
.dash-focus-card .dash-focus-chips{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px;}
.dash-focus-chip{
  padding:6px 12px;border-radius:999px;font-size:12px;font-weight:600;
  background:rgba(232,72,85,.08);color:var(--red);border:1px solid rgba(232,72,85,.2);
}
.dash-tip{
  font-size:13px;color:var(--fg2);line-height:1.5;margin:0;
  padding:12px 14px;background:var(--s);border-radius:10px;border-left:3px solid var(--red);
}
.dash-band-chart-placeholder{
  height:72px;margin-top:12px;display:flex;align-items:flex-end;gap:6px;padding:0 4px;
}
.dash-band-bar{
  flex:1;background:rgba(232,72,85,.15);border-radius:4px 4px 0 0;min-height:8px;
}
.dash-band-bar.on{background:var(--red);}
@media(max-width:900px){
  .dash-quick-row{grid-template-columns:repeat(2,1fr);}
  .tests-grid{grid-template-columns:repeat(2,1fr);}
}

/* Progress section tabs */
.app-prog-tabs{
  display:flex;flex-wrap:wrap;gap:4px;margin-bottom:20px;
  border-bottom:1px solid var(--b);padding-bottom:0;
}
.app-prog-tab{
  padding:10px 16px;border:none;background:none;font-family:inherit;
  font-size:14px;font-weight:600;color:var(--fg3);cursor:pointer;
  border-bottom:2px solid transparent;margin-bottom:-1px;
}
.app-prog-tab:hover{color:var(--red);}
.app-prog-tab.on{color:var(--red);border-bottom-color:var(--red);}

/* Profile account layout */
.app-account-header{margin-bottom:24px;}
.app-account-kicker{font-size:11px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin:0 0 6px;}
.app-account-title{font-family:'Outfit',sans-serif;font-size:28px;font-weight:600;margin:0 0 6px;}
.app-account-sub{font-size:14px;color:var(--fg3);margin:0;}
.app-account-grid{
  display:grid;grid-template-columns:1.2fr .8fr;gap:16px;align-items:start;
}
.app-profile-card .sett-card{margin-bottom:0;}
.app-pref-card .sett-card{margin-bottom:0;}

/* Profile page (/profile) */
.prof-wrap{max-width:960px;margin:0 auto;padding:32px 20px 56px;}
body.app-with-shell .prof-wrap{max-width:1100px;padding:24px 28px 48px;}
.prof-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:16px;align-items:start;}
.prof-card{background:var(--white);border:1px solid var(--b);border-radius:16px;margin-bottom:16px;overflow:hidden;box-shadow:0 1px 2px rgba(15,23,42,.04);}
.prof-card-head{display:flex;align-items:center;gap:10px;padding:14px 16px;border-bottom:1px solid var(--b);flex-wrap:wrap;}
.prof-premium-pill{
  margin-left:auto;font-size:10px;font-weight:500;letter-spacing:.06em;text-transform:uppercase;
  padding:3px 8px;border-radius:999px;background:rgba(232,72,85,.1);color:var(--red);
  border:1px solid rgba(232,72,85,.2);
}
.prof-premium-btn--active{
  background:var(--red) !important;
  color:#fff !important;border:1.5px solid var(--red) !important;
  box-shadow:none !important;
}
.prof-premium-btn--active:hover{opacity:1;background:var(--red-hover) !important;border-color:var(--red-hover) !important;}
.prof-premium-btn--active svg{stroke:#fff;}
.prof-card-title{font-size:14px;font-weight:600;color:var(--fg);letter-spacing:-.01em;}
.prof-card-icon{width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0;color:var(--red);background:rgba(232,72,85,.1);}
.prof-card-icon--user,.prof-card-icon--device,.prof-card-icon--shield,.prof-card-icon--crown,.prof-card-icon--gear{background:rgba(232,72,85,.1);color:var(--red);}
.prof-fields{padding:0;}
.prof-field{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:transparent;border:none;border-bottom:1px solid var(--b);border-radius:0;box-shadow:none;padding:12px 16px;cursor:pointer;font-family:inherit;transition:background .12s;}
.prof-field:last-child{border-bottom:none;}
.prof-field:hover{background:rgba(15,23,42,.02);}
.prof-field--static{cursor:default;}
.prof-field--static:hover{background:transparent;}
.prof-field-main{flex:1;min-width:0;}
.prof-field-label{display:block;font-size:11px;font-weight:500;color:var(--fg3);margin-bottom:2px;line-height:1.3;}
.prof-field-value{display:block;font-size:14px;font-weight:500;color:var(--fg);line-height:1.35;word-break:break-word;}
.prof-field-hint{display:block;font-size:11px;font-weight:400;color:var(--fg3);margin-top:3px;line-height:1.35;}
.prof-field-chev{
  flex-shrink:0;width:8px;height:8px;margin-left:auto;margin-right:2px;
  border-right:2px solid var(--fg3);border-bottom:2px solid var(--fg3);
  transform:rotate(-45deg);opacity:.85;
}
.prof-action-row{display:flex;align-items:center;gap:12px;width:100%;text-align:left;background:transparent;border:none;border-bottom:1px solid var(--b);border-radius:0;box-shadow:none;padding:12px 16px;cursor:pointer;font-family:inherit;transition:background .12s;}
.prof-action-row:last-child{border-bottom:none;}
.prof-action-row:hover{background:rgba(15,23,42,.02);}
.prof-action-row--danger .prof-action-text strong{color:#dc2626;}
.prof-action-text{flex:1;min-width:0;}
.prof-action-text strong{display:block;font-size:14px;font-weight:500;color:var(--fg);margin-bottom:2px;}
.prof-action-text small{display:block;font-size:11px;font-weight:400;color:var(--fg3);line-height:1.35;}
.prof-devices-list{padding:8px 12px 12px;}
.prof-devices-note{font-size:11px;color:var(--fg3);padding:0 18px 14px;margin:0;line-height:1.5;}
.prof-dev-empty{padding:16px;font-size:13px;color:var(--fg3);text-align:center;}
.prof-dev-card{margin-bottom:8px;}
.prof-dev-actions{display:flex;gap:6px;flex-shrink:0;}
.prof-dev-kick,.prof-dev-primary{font-size:11px;font-weight:700;border-radius:8px;padding:5px 10px;cursor:pointer;border:1px solid transparent;white-space:nowrap;font-family:inherit;}
.prof-dev-kick{color:#dc2626;background:rgba(220,38,38,.08);border-color:rgba(220,38,38,.15);}
.prof-dev-primary{color:var(--gold);background:rgba(201,168,76,.08);border-color:rgba(201,168,76,.15);}
.prof-sub-rows{padding:4px 18px 8px;}
.prof-sub-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--b);font-size:13px;}
.prof-sub-row:last-child{border-bottom:none;}
.prof-sub-row span{color:var(--fg3);}
.prof-sub-row strong{color:var(--fg);font-weight:600;}
.prof-premium-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:calc(100% - 36px);margin:8px 18px 16px;padding:13px;background:var(--red);color:#fff;border:none;border-radius:12px;font-family:inherit;font-size:14px;font-weight:500;cursor:default;transition:opacity .15s,transform .12s;}
.prof-premium-btn:hover{opacity:.92;transform:translateY(-1px);}
.prof-pref-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 18px;border-bottom:1px solid var(--b);}
.prof-pref-row:last-child{border-bottom:none;}
.prof-pref-label{font-size:13px;font-weight:500;color:var(--fg);}
.prof-seg{display:inline-flex;background:var(--s2);border:1px solid var(--b);border-radius:10px;padding:3px;gap:2px;}
.prof-seg-btn{border:none;background:transparent;padding:6px 12px;border-radius:8px;font-size:12px;font-weight:700;color:var(--fg3);cursor:pointer;font-family:inherit;transition:background .12s,color .12s;}
.prof-seg-btn.on{background:var(--white);color:var(--fg);box-shadow:0 1px 3px rgba(0,0,0,.08);}
.prof-toggle{width:44px;height:26px;border-radius:100px;background:var(--s2);border:1px solid var(--b);position:relative;cursor:pointer;flex-shrink:0;transition:background .15s;}
.prof-toggle::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.15);transition:transform .15s;}
.prof-toggle.on{background:var(--red);border-color:var(--red);}
.prof-toggle.on::after{transform:translateX(18px);}
.prof-logout-btn{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:13px;background:var(--white);border:1px solid var(--b);border-radius:12px;font-family:inherit;font-size:14px;font-weight:600;color:var(--fg2);cursor:pointer;margin-bottom:10px;transition:background .12s,border-color .12s;}
.prof-logout-btn:hover{background:var(--s2);border-color:var(--b2);}
.prof-created{text-align:center;font-size:12px;color:var(--fg3);margin:0 0 8px;}
.prof-guest-card{background:var(--white);border:1px solid var(--b);border-radius:18px;padding:40px 28px;text-align:center;max-width:420px;margin:0 auto;}
.prof-guest-icon{width:56px;height:56px;border-radius:50%;background:rgba(232,72,85,.1);color:var(--red);display:flex;align-items:center;justify-content:center;margin:0 auto 16px;}
.prof-guest-card h2{font-size:18px;font-weight:800;margin:0 0 8px;}
.prof-guest-card p{font-size:13px;color:var(--fg3);margin:0 0 20px;line-height:1.55;}

/* Profile field editor sheet */
.prof-edit-overlay{z-index:1100;cursor:default;}
.prof-edit-sheet{
  position:relative;width:min(400px,calc(100vw - 32px));max-height:min(88vh,640px);
  background:var(--white);border:1px solid var(--b);border-radius:12px;
  box-shadow:0 20px 50px rgba(15,23,42,.12);display:flex;flex-direction:column;
  animation:profEditIn .28s cubic-bezier(.22,1,.36,1);overflow:hidden;cursor:default;
}
@keyframes profEditIn{from{opacity:0;transform:translateY(12px) scale(.99)}to{opacity:1;transform:none}}
.prof-edit-close{
  position:absolute;top:12px;right:12px;width:30px;height:30px;border:1px solid var(--b);
  border-radius:8px;background:var(--white);color:var(--fg3);font-size:18px;line-height:1;
  cursor:default;display:flex;align-items:center;justify-content:center;
  transition:background .12s,border-color .12s,color .12s;
}
.prof-edit-close:hover{background:rgba(232,72,85,.08);border-color:rgba(232,72,85,.25);color:var(--red);}
.prof-edit-head{padding:20px 44px 4px 20px;text-align:left;}
.prof-edit-kicker{font-size:10px;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--red);margin-bottom:4px;display:block;}
.prof-edit-title{font-family:'Outfit',sans-serif;font-size:18px;font-weight:600;color:var(--fg);margin:0 0 4px;letter-spacing:-.02em;}
.prof-edit-desc{font-size:13px;font-weight:400;color:var(--fg3);margin:0;line-height:1.5;}
.prof-edit-body{padding:12px 20px 8px;overflow-y:auto;flex:1;}
.prof-edit-note{font-size:12px;font-weight:400;color:var(--fg3);margin:10px 0 0;line-height:1.45;}
.prof-edit-band-grid{display:flex;flex-wrap:wrap;gap:8px;}
.prof-edit-band-chip{
  flex:1 1 calc(20% - 8px);min-width:58px;border:1.5px solid var(--b);border-radius:10px;
  background:var(--white);padding:11px 8px;cursor:default;font-family:inherit;
  transition:background .14s,border-color .14s,color .14s;
}
.prof-edit-band-chip:hover:not(.on){background:var(--red);border-color:var(--red);}
.prof-edit-band-chip:hover:not(.on) .prof-edit-band-num{color:#fff;}
.prof-edit-band-chip.on{background:var(--red);border-color:var(--red);}
.prof-edit-band-chip.on .prof-edit-band-num{color:#fff;}
.prof-edit-band-chip.on:hover{background:var(--red-hover);border-color:var(--red-hover);}
.prof-edit-band-num{display:block;font-size:15px;font-weight:500;color:var(--fg);font-variant-numeric:tabular-nums;}
.prof-edit-time-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;}
.prof-edit-time-chip{
  border:1.5px solid var(--b);border-radius:10px;background:var(--white);padding:10px 8px;
  cursor:default;font-family:inherit;text-align:center;
  transition:background .14s,border-color .14s;
}
.prof-edit-time-chip:hover:not(.on){background:var(--red);border-color:var(--red);}
.prof-edit-time-chip:hover:not(.on) strong,.prof-edit-time-chip:hover:not(.on) span{color:#fff;}
.prof-edit-time-chip.on{background:var(--red);border-color:var(--red);}
.prof-edit-time-chip.on strong,.prof-edit-time-chip.on span{color:#fff;}
.prof-edit-time-chip strong{display:block;font-size:14px;font-weight:500;color:var(--fg);}
.prof-edit-time-chip span{display:block;font-size:10px;color:var(--fg3);margin-top:2px;font-weight:400;}
.prof-edit-custom{margin-top:12px;}
.prof-edit-custom label{display:block;font-size:11px;font-weight:500;color:var(--fg3);margin-bottom:6px;}
.prof-edit-custom input{
  width:100%;padding:11px 14px;border:1.5px solid var(--b);border-radius:10px;
  font-family:inherit;font-size:14px;font-weight:400;color:var(--fg);background:var(--bg);
  outline:none;box-sizing:border-box;cursor:default;transition:border-color .15s;
}
.prof-edit-custom input:focus{border-color:var(--red);}
.prof-edit-date-wrap{margin-top:4px;}
.prof-edit-date{
  width:100%;padding:12px 14px;border:1.5px solid var(--b);border-radius:10px;
  font-family:inherit;font-size:14px;font-weight:400;color:var(--fg);background:var(--bg);
  outline:none;box-sizing:border-box;cursor:default;
}
.prof-edit-date:focus{border-color:var(--red);}
.prof-edit-foot{padding:8px 20px 20px;display:flex;flex-direction:column;gap:8px;}
.prof-edit-save{
  width:100%;padding:13px 16px;border:none;border-radius:10px;
  background:var(--red);color:#fff;font-family:inherit;font-size:14px;font-weight:500;
  cursor:default;transition:background .15s,opacity .15s,transform .1s;
  box-shadow:0 4px 14px rgba(232,72,85,.22);
}
.prof-edit-save:hover:not(:disabled){background:var(--red-hover);transform:translateY(-1px);}
.prof-edit-save:disabled{opacity:.45;}
.prof-edit-back{
  width:100%;padding:12px 16px;border:1.5px solid var(--b);border-radius:10px;
  background:var(--white);font-family:inherit;font-size:14px;font-weight:500;
  color:var(--fg);cursor:default;transition:background .15s,border-color .15s,color .15s;
  box-shadow:none;
}
.prof-edit-back:hover{background:rgba(232,72,85,.06);border-color:rgba(232,72,85,.28);color:var(--fg);}
.prof-edit-overlay .prof-edit-save{
  background:var(--red) !important;color:#fff !important;border:none !important;
  box-shadow:0 4px 14px rgba(232,72,85,.22) !important;
}
.prof-edit-overlay .prof-edit-back{
  background:var(--white) !important;border:1.5px solid var(--b) !important;
  color:var(--fg) !important;border-radius:10px !important;
}
.prof-edit-overlay .prof-edit-back:hover{
  background:rgba(232,72,85,.06) !important;border-color:rgba(232,72,85,.28) !important;
}
@media(max-width:520px){
  .prof-edit-overlay{align-items:flex-end !important;}
  .prof-edit-sheet{width:100%;max-width:100%;border-radius:12px 12px 0 0;animation:profEditSheetUp .3s cubic-bezier(.22,1,.36,1);}
  @keyframes profEditSheetUp{from{transform:translateY(100%)}to{transform:none}}
}

/* Edit name modal */
.prof-name-overlay{z-index:1100;cursor:default;}
.prof-name-dialog{
  position:relative;width:min(400px,calc(100vw - 32px));background:var(--white);
  border:1px solid var(--b);border-radius:12px;padding:20px 20px 16px;
  box-shadow:0 20px 50px rgba(15,23,42,.12);animation:profEditIn .28s cubic-bezier(.22,1,.36,1);
}
.prof-name-close{
  position:absolute;top:12px;right:12px;width:30px;height:30px;padding:0;border:1px solid var(--b);
  border-radius:8px;background:var(--white);color:var(--fg3);font-size:20px;line-height:0;
  cursor:default;display:flex;align-items:center;justify-content:center;
}
.prof-name-close:hover{background:var(--red);color:#fff;border-color:var(--red);}
.prof-name-title{font-size:18px;font-weight:600;margin:0 0 16px;color:var(--fg);}
.prof-name-fields{display:flex;flex-direction:column;gap:12px;margin-bottom:18px;}
.prof-name-label{display:block;font-size:12px;font-weight:500;color:var(--fg3);margin-bottom:6px;}
.prof-name-input{
  width:100%;padding:11px 12px;border:1.5px solid var(--b);border-radius:10px;
  font-family:inherit;font-size:14px;font-weight:400;color:var(--fg);background:var(--bg);
  outline:none;box-sizing:border-box;cursor:default;
}
.prof-name-input:focus{border-color:var(--red);}
.prof-name-actions{display:flex;justify-content:flex-end;gap:8px;}
.prof-name-cancel,.prof-name-save{
  padding:10px 18px;border-radius:10px;font-family:inherit;font-size:14px;font-weight:500;
  cursor:default;transition:background .14s,border-color .14s,color .14s;
}
.prof-name-cancel{background:var(--white);border:1.5px solid var(--b);color:var(--fg);}
.prof-name-cancel:hover{background:var(--s2);}
.prof-name-save{background:var(--red);border:1.5px solid var(--red);color:#fff;}
.prof-name-save:hover{background:var(--red-hover);border-color:var(--red-hover);}

/* Premium active pricing — animated mesh fills main column (not sidebar) */
body.app-with-shell #page-pricing,
body.app-with-shell .pricing-shell.pricing-shell--premium-active{
  background:transparent !important;
}
body.app-with-shell .pricing-shell.pricing-shell--premium-active .pricing-outer,
body.app-with-shell .pricing-outer.pricing-outer--premium-active{
  position:relative;overflow:hidden;background:transparent !important;
  min-height:calc(100vh - 80px);
}
body.app-with-shell .pricing-shell.pricing-shell--premium-active .pricing-outer::before,
body.app-with-shell .pricing-outer.pricing-outer--premium-active::before{
  content:'';position:absolute;inset:0;
  background:
    radial-gradient(ellipse 70% 55% at 15% 25%, rgba(232,72,85,.5), transparent 65%),
    radial-gradient(ellipse 60% 50% at 85% 20%, rgba(99,102,241,.45), transparent 60%),
    radial-gradient(ellipse 55% 48% at 75% 80%, rgba(66,165,245,.4), transparent 58%),
    radial-gradient(ellipse 50% 45% at 25% 75%, rgba(168,85,247,.38), transparent 55%),
    radial-gradient(ellipse 45% 40% at 50% 50%, rgba(244,114,182,.28), transparent 52%);
  animation:premiumMeshFlow 22s ease-in-out infinite;
  z-index:0;pointer-events:none;
}
@keyframes premiumMeshFlow{
  0%,100%{transform:translate(0,0) scale(1);filter:hue-rotate(0deg);}
  33%{transform:translate(2%,-1.5%) scale(1.05);filter:hue-rotate(10deg);}
  66%{transform:translate(-1.5%,2%) scale(1.03);filter:hue-rotate(-6deg);}
}
body.app-with-shell .pricing-shell.pricing-shell--premium-active #pricing-particles,
body.app-with-shell .pricing-outer--premium-active #pricing-particles{display:none;}
body.app-with-shell .pricing-shell.pricing-shell--premium-active .pricing-inner,
body.app-with-shell .pricing-outer--premium-active .pricing-inner{
  position:relative;z-index:1;
}
.premium-active{
  position:relative;text-align:center;padding:32px 0 48px;overflow:visible;
  background:transparent;color:var(--fg);
}
.premium-active .premium-active-title{color:var(--fg);}
.premium-active .premium-active-sub{color:var(--fg3);}
.premium-active .premium-active-card{background:#fff;border-color:rgba(255,255,255,.85);box-shadow:0 12px 40px rgba(15,23,42,.08);}
.premium-active .premium-active-perks span{background:rgba(255,255,255,.72);border-color:rgba(15,23,42,.08);color:var(--fg2);}
.premium-active .premium-gem-bg{display:none;}
.premium-gem-bg{
  position:absolute;inset:-20% -10%;pointer-events:none;overflow:hidden;
}
.premium-gem-orb{
  position:absolute;border-radius:50%;filter:blur(48px);opacity:.55;
  animation:premiumOrbFloat 12s ease-in-out infinite;
}
.premium-gem-orb--1{width:280px;height:280px;background:#e84855;top:0;left:10%;}
.premium-gem-orb--2{width:220px;height:220px;background:#6366f1;top:30%;right:5%;}
.premium-gem-orb--3{width:200px;height:200px;background:#42a5f5;bottom:0;left:35%;}
@keyframes premiumOrbFloat{
  0%,100%{transform:translate(0,0) scale(1);}
  50%{transform:translate(12px,-18px) scale(1.06);}
}
.premium-active--in .premium-active-inner{animation:premiumFadeUp .55s cubic-bezier(.22,1,.36,1);}
@keyframes premiumFadeUp{from{opacity:0;transform:translateY(16px)}to{opacity:1;transform:none}}
.premium-active-inner{position:relative;z-index:1;max-width:420px;margin:0 auto;padding:0 20px;}
.premium-active-badge{
  display:inline-flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;
  background:rgba(232,72,85,.1);border:1px solid rgba(232,72,85,.2);color:var(--red);
  font-size:12px;font-weight:500;margin-bottom:14px;
}
.premium-active-title{font-family:'Outfit',sans-serif;font-size:26px;font-weight:600;margin:0 0 8px;color:var(--fg);}
.premium-active-sub{font-size:14px;font-weight:400;color:var(--fg3);margin:0 0 24px;line-height:1.55;}
.premium-active-card{
  background:var(--white);border:1px solid var(--b);border-radius:12px;
  padding:22px 28px;margin-bottom:18px;box-shadow:0 8px 32px rgba(15,23,42,.06);
}
.premium-active-card-label{
  display:block;font-size:11px;font-weight:500;letter-spacing:.08em;text-transform:uppercase;
  color:var(--fg3);margin-bottom:6px;
}
.premium-active-count{
  font-family:'Outfit',sans-serif;font-size:48px;font-weight:600;line-height:1;
  color:var(--red);font-variant-numeric:tabular-nums;
}
.premium-active-card-hint{font-size:12px;font-weight:400;color:var(--fg3);margin-top:8px;display:block;}
.premium-active-perks{
  display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-bottom:20px;
}
.premium-active-perks span{
  font-size:12px;font-weight:500;padding:6px 12px;border-radius:999px;
  background:var(--s2);border:1px solid var(--b);color:var(--fg2);
}
.premium-active-cta{
  display:inline-flex;align-items:center;justify-content:center;gap:8px;
  padding:12px 24px;border-radius:10px;background:var(--red);color:#fff;
  font-size:14px;font-weight:500;text-decoration:none;cursor:default;
  transition:background .15s,transform .1s;
}
.premium-active-cta:hover{background:var(--red-hover);transform:translateY(-1px);}

/* Vocab hub */
.vocab-hub-header{margin-bottom:20px;}
.vocab-hub-queue{
  background:linear-gradient(135deg,rgba(232,72,85,.08),rgba(232,72,85,.02));
  border:1px solid rgba(232,72,85,.2);border-radius:12px;padding:24px;margin-bottom:16px;
}
.vocab-hub-stat-row{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-bottom:16px;}
.vocab-hub-stat{
  background:var(--white);border:1px solid var(--b);border-radius:12px;padding:16px;
}
.vocab-hub-stat strong{display:block;font-size:22px;font-weight:800;font-family:'Outfit',sans-serif;}
.vocab-hub-stat span{font-size:12px;color:var(--fg3);}

/* Success / welcome banner toast */
.toast.toast--success,
.toast.toast--welcome{
  bottom:auto;top:max(16px,env(safe-area-inset-top));
  left:50%;right:auto;transform:translateX(-50%) translateY(-16px);
  background:linear-gradient(135deg,#6366f1 0%,#4f46e5 55%,#4338ca 100%);
  border:none;color:#fff;font-size:14px;font-weight:500;
  padding:0;border-radius:12px;min-width:min(320px,calc(100vw - 32px));
  max-width:calc(100vw - 32px);white-space:normal;
  box-shadow:0 12px 40px rgba(79,70,229,.35),0 0 0 1px rgba(255,255,255,.12) inset;
  pointer-events:none;overflow:hidden;
}
.toast.toast--success.show,
.toast.toast--welcome.show{opacity:1;transform:translateX(-50%) translateY(0);}
.toast-success-inner,.toast-welcome-inner{
  display:flex;align-items:center;gap:12px;padding:12px 18px 12px 14px;
}
.toast-success-icon{
  width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.toast-success-text{line-height:1.35;text-align:left;}

/* Error toast */
.toast.toast--error{
  bottom:auto;top:max(16px,env(safe-area-inset-top));
  left:50%;right:auto;transform:translateX(-50%) translateY(-16px);
  background:linear-gradient(135deg,#dc2626 0%,#b91c1c 55%,#991b1b 100%);
  border:none;color:#fff;font-size:14px;font-weight:500;
  padding:0;border-radius:12px;min-width:min(320px,calc(100vw - 32px));
  max-width:calc(100vw - 32px);white-space:normal;
  box-shadow:0 12px 40px rgba(185,28,28,.35);
  pointer-events:none;overflow:hidden;
}
.toast.toast--error.show{opacity:1;transform:translateX(-50%) translateY(0);}
.toast-error-inner{display:flex;align-items:center;gap:12px;padding:12px 18px 12px 14px;}
.toast-error-icon{
  width:32px;height:32px;border-radius:50%;background:rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.toast-error-text{line-height:1.35;text-align:left;}

.pricing-trust{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:10px 16px;}
.pricing-trust-item{display:inline-flex;align-items:center;gap:6px;font-size:13px;color:var(--fg2);}
.pricing-trust-item svg{flex-shrink:0;color:var(--red);}

@media(max-width:900px){
  .app-sidebar{width:72px;padding:14px 8px;}
  .app-sidebar-brand{padding:8px;}
  .app-sidebar-brand-text{display:none;}
  .app-sidebar-logo{width:36px;height:36px;}
  .app-sidebar-link span:not(.app-sidebar-ico){display:none;}
  .app-sidebar-link{justify-content:center;padding:12px;}
  .app-sidebar-premium{font-size:0;padding:12px;}
  .app-sidebar-premium svg{margin:0;}
  body.app-with-shell .page,
  body.app-with-shell .lib-wrap{padding-left:72px;}
  .dash-layout,.dash-grid,.app-account-grid,.prof-grid{grid-template-columns:1fr;}
  .dash-col--side{order:-1;}
  .dash-stat-row{grid-template-columns:1fr 1fr;}
  .vocab-hub-stat-row{grid-template-columns:repeat(2,1fr);}
}

/* Practice page — layout shell only; visual design in styles-tests-v2.css */
body[data-app-page="lib"] #lib-access-tabs,
body[data-app-page="lib"] #lib-mode-bar,
body[data-app-page="lib"] .lib-topbar-titlerow,
body[data-app-page="lib"] .lib-sidebar,
body[data-app-page="lib"] .lib-topbar{display:none !important;}
body[data-app-page="lib"] .lib-main{padding:0 !important;background:transparent !important;}
body[data-app-page="lib"] .lib-main > .lib-filters-row{display:none !important;}
body[data-app-page="lib"] #grid-canvas{display:none !important;}
body[data-app-page="lib"] #tests-hub{display:block !important;}

/* UI polish fixes */
body.app-with-shell .lib-row-ico.reading{background:rgba(17,24,39,.04);border-color:rgba(17,24,39,.12);}
body.app-with-shell .lib-row-ico.reading svg{stroke:#6b7280;}
body.app-with-shell .lib-row-ico.listening{background:rgba(232,72,85,.06);border-color:rgba(232,72,85,.16);}
body.app-with-shell .lib-row-ico.listening svg{stroke:#d45460;}
body.app-with-shell .lib-row-tag.premium{background:rgba(232,72,85,.08);color:var(--red);border-color:rgba(232,72,85,.2);}

body.app-with-shell .tests-hub-head{
  background:var(--white);border:1px solid var(--b);border-radius:16px;padding:18px 18px 14px;margin-bottom:10px;
}
body.app-with-shell .tests-hub-title{font-size:30px;margin-bottom:2px;}
body.app-with-shell .tests-hub-sub{margin-bottom:14px;}
body.app-with-shell .tests-cat-pills{margin-bottom:12px;}
/* Signed-in shell: practice hub styling delegated to styles-tests-v2.css */

body.app-with-shell .lib-topbar{background:var(--white);border:1px solid var(--b);border-radius:14px;padding:14px 16px;}
body.app-with-shell .lib-tabs{margin:12px 0 10px;}
body.app-with-shell .lib-filters-row{
  background:var(--white);border:1px solid var(--b);border-radius:12px;padding:10px 12px;margin-bottom:14px;
}
body.app-with-shell .lib-search-in{background:#fff;border-radius:10px;}
body.app-with-shell .lib-filter-sel{background:#fff;border-radius:10px;}

@media(max-width:900px){
  .app-sidebar-user-meta{display:none;}
  .app-sidebar-user{justify-content:center;padding:8px;}
  .app-sidebar-link--profile-cta span:not(.app-sidebar-ico){display:none;}
}

/* Inspera-style page navigation loader (sidebar nav) */
.inspera-loader-backdrop{
  display:none;position:fixed;inset:0;background:#fff;z-index:9500;
}
.inspera-loader-backdrop.inspera-loader-on{display:block;}
body.inspera-loader-active{overflow:hidden!important;}
body.inspera-loader-active .app-sidebar,
body.inspera-loader-active #page-lib,
body.inspera-loader-active #nav,
body.inspera-loader-active .pnav,
body.inspera-loader-active .lib-wrap,
body.inspera-loader-active .prac-gate{display:none!important;}
#loader-container{
  position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);
  text-align:center;font-family:Arial,sans-serif;z-index:9600;
}
#loader-container.hidden{display:none!important;}
#loader-container.inspera-loader-on{display:block;}
#loader-img svg{width:80px!important;height:80px!important;display:block;margin:0 auto;}
#loader-img svg image{
  width:100%;height:100%;transform-origin:50% 50%;
  animation:insperaLoaderRotate .9s linear infinite;
}
@keyframes insperaLoaderRotate{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}
#loader-message-container h2{font-size:18px;font-weight:400;margin:16px 0 6px;color:#000;}
#loader-message-container div{font-size:14px;color:#000;}
