:root{
  --scarlet-red:#FF2400;

  --page-bg:#ffffff;
  --page-text:#111111;
  --muted:#333333;

  --surface:#ffffff;
  --surface-2:#f6f6f7;
  --border:#e9e9ee;

  --header-bg:#141414;
  --footer-bg:#141414;
  --nav-text:#ffffff;

  --shadow:0 12px 26px rgba(0,0,0,0.08);
  --transition:all .3s cubic-bezier(.4,0,.2,1);

  --btn-bg:var(--surface);
  --btn-text:var(--page-text);
  --btn-border:var(--border);

  --btn-accent-bg:var(--surface);
  --btn-accent-text:var(--page-text);
  --btn-accent-border:var(--scarlet-red);

  --btn-hover-bg:var(--scarlet-red);
  --btn-hover-text:#fff;
  --btn-hover-border:var(--scarlet-red);
}

html[data-theme="dark"]{
  --page-bg:#0f0f10;
  --page-text:#f2f2f2;
  --muted:rgba(255,255,255,.75);

  --surface:#151517;
  --surface-2:#1b1b1d;
  --border:rgba(255,255,255,.10);

  --header-bg:#151517;
  --footer-bg:#151517;

  --shadow:0 16px 34px rgba(0,0,0,.35);

  --btn-bg:var(--surface);
  --btn-text:var(--page-text);
  --btn-border:var(--border);

  --btn-accent-bg:var(--surface);
  --btn-accent-text:var(--page-text);
  --btn-accent-border:var(--scarlet-red);
}

*{
  margin:0;
  padding:0;
  box-sizing:border-box;
}

html, body{
  height:100%;
}

body{
  font-family:'Montserrat',sans-serif;
  background:var(--page-bg);
  color:var(--page-text);
  line-height:1.6;
  overflow-x:hidden;

  min-height:100vh;
  display:flex;
  flex-direction:column;
}

main,
.main-content{
  flex:1 0 auto;
}

.container{
  max-width:1200px;
  margin:0 auto;
  padding:0 20px;
}

.flash{
  padding:10px 0;
  border-bottom:1px solid var(--border);
  background:var(--surface);
}

.flash-inner{
  display:flex;
  align-items:center;
}

.flash-msg{
  font-weight:800;
}

.flash-warning{
  background:#fff6e5;
}

.flash-success{
  background:#ecfff0;
}

.flash-danger{
  background:#ffecec;
}

html[data-theme="dark"] .flash-warning{
  background:rgba(255,196,0,.12);
}

html[data-theme="dark"] .flash-success{
  background:rgba(0,255,120,.10);
}

html[data-theme="dark"] .flash-danger{
  background:rgba(255,0,0,.10);
}

.main-header{
  background:var(--header-bg);
  padding:10px 0;
  border-bottom:3px solid var(--scarlet-red);
  position:sticky;
  top:0;
  z-index:1000;
  transition:var(--transition);
}

.main-header.scrolled{
  padding:8px 0;
  background:rgba(20,20,20,.96);
}

.header-container{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:16px;
  min-width:0;
}

.header-left{
  display:flex;
  align-items:center;
  gap:12px;
  min-width:0;
  flex:1 1 auto;
}

.logo-link{
  display:flex;
  align-items:center;
  text-decoration:none;
  gap:12px;
  min-width:0;
  flex:1 1 auto;
}

.site-logo{
  height:88px;
  width:auto;
  display:block;
  object-fit:contain;
  flex-shrink:0;
}

.logo-text{
  font-size:20px;
  font-weight:900;
  color:var(--nav-text);
  line-height:1;
}

.logo-text span{
  color:var(--scarlet-red);
}

.theme-toggle{
  width:46px;
  height:46px;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.18);
  background:rgba(255,255,255,.08);
  color:var(--nav-text);
  cursor:pointer;
  transition:var(--transition);
}

.theme-toggle:hover{
  background:rgba(255,255,255,.12);
  transform:translateY(-1px);
}

.theme-toggle:focus-visible{
  outline:2px solid var(--scarlet-red);
  outline-offset:3px;
}

.nav-toggle:focus-visible{
  outline:2px solid var(--scarlet-red);
  outline-offset:3px;
}

.main-nav{
  display:flex;
  gap:8px;
  align-items:center;
  justify-content:flex-end;
  margin-left:auto;
  min-width:0;
}

.main-nav > a,
.nav-toggle{
  color:var(--nav-text);
  text-decoration:none;
  font-weight:800;
  padding:10px 14px;
  border-radius:12px;
  transition:var(--transition);
  white-space:nowrap;
}

.nav-toggle{
  display:inline-flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  border:0;
  background:transparent;
  font:inherit;
  cursor:pointer;
}

.main-nav > a:hover,
.main-nav > a.active,
.nav-toggle:hover,
.nav-toggle.active,
.nav-dropdown.open .nav-toggle{
  background:var(--scarlet-red);
}

.nav-dropdown{
  position:relative;
}

.nav-toggle-left{
  display:inline-flex;
  align-items:center;
  gap:10px;
  min-width:0;
}

.nav-toggle i:last-child{
  font-size:12px;
}

.nav-menu{
  position:absolute;
  top:calc(100% + 10px);
  right:0;
  min-width:190px;
  padding:8px;
  border-radius:16px;
  background:var(--header-bg);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 20px 40px rgba(0,0,0,.24);
  display:flex;
  flex-direction:column;
  gap:6px;
  opacity:0;
  pointer-events:none;
  transform:translateY(-8px);
  transition:var(--transition);
  z-index:1250;
}

.nav-dropdown.open .nav-menu{
  opacity:1;
  pointer-events:auto;
  transform:translateY(0);
}

.nav-menu a{
  color:var(--nav-text);
  text-decoration:none;
  font-weight:800;
  padding:10px 14px;
  border-radius:12px;
  transition:var(--transition);
}

.nav-menu a:hover,
.nav-menu a.active{
  background:var(--scarlet-red);
}

.account-menu a{
  display:flex;
  align-items:center;
  gap:10px;
}

.account-menu a i{
  width:18px;
  text-align:center;
}

.menu-toggle{
  display:none;
  align-items:center;
  justify-content:center;
  font-size:20px;
  color:var(--nav-text);
  cursor:pointer;
  z-index:1200;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(255,255,255,.18);
  padding:10px;
  border-radius:14px;
  transition:var(--transition);
}

.menu-toggle:hover{
  background:rgba(255,255,255,.12);
  transform:translateY(-1px);
}

.menu-toggle:focus-visible{
  outline:2px solid var(--scarlet-red);
  outline-offset:3px;
}

.nav-overlay{
  display:none;
}

@media (max-width:1360px){
  .main-nav > a,
  .nav-toggle{
    padding:10px 12px;
    font-size:14px;
  }
}

@media (max-width:1180px){
  .logo-text{
    display:none;
  }
}

@media (max-width:1280px){
  .site-logo{
    height:78px;
  }

  .menu-toggle{
    display:inline-flex;
  }

  .main-nav{
    position:fixed;
    top:0;
    right:-100%;
    bottom:0;
    height:100vh;
    width:360px;
    max-width:90vw;
    background:var(--header-bg);
    flex-direction:column;
    justify-content:flex-start;
    align-items:stretch;
    padding:96px 20px 24px;
    transition:var(--transition);
    box-shadow:-10px 0 30px rgba(0,0,0,.35);
    z-index:1150;
    gap:10px;
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }

  .main-nav.active{
    right:0;
  }

  .main-nav > a,
  .nav-toggle{
    font-size:17px;
    width:100%;
    text-align:left;
    justify-content:space-between;
  }

  .nav-dropdown{
    width:100%;
  }

  .nav-menu{
    position:static;
    top:auto;
    right:auto;
    min-width:0;
    width:100%;
    margin-top:8px;
    padding:8px;
    border:1px solid rgba(255,255,255,.08);
    background:rgba(255,255,255,.04);
    box-shadow:none;
    display:none;
    opacity:1;
    pointer-events:auto;
    transform:none;
  }

  .nav-dropdown.open .nav-menu{
    display:flex;
  }

  .nav-menu a{
    width:100%;
    text-align:left;
    font-size:16px;
  }

  .nav-overlay{
    display:none;
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.36);
    z-index:1100;
  }

  .nav-overlay.active{
    display:block;
  }
}

.main-content{
  padding:40px 0;
}

.main-title{
  font-size:clamp(28px,5vw,56px);
  font-weight:900;
  margin-bottom:12px;
  line-height:1.15;
}

.subtitle{
  font-size:clamp(16px,2.2vw,20px);
  color:var(--muted);
  margin-bottom:18px;
}

.highlight{
  color:var(--scarlet-red);
}

.centered{
  text-align:center;
}

.centered-content{
  max-width:980px;
  margin:0 auto;
}

.section{
  margin-top:34px;
}

.section-title{
  font-size:20px;
  font-weight:900;
  margin-bottom:14px;
}

.info-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(240px,1fr));
  gap:18px;
  margin-top:16px;
}

.info-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:24px;
  padding:22px;
  border-bottom:8px solid var(--scarlet-red);
  transition:var(--transition);
  box-shadow:var(--shadow);
}

.info-card:hover{
  transform:translateY(-6px);
}

.info-card h3{
  font-size:18px;
  font-weight:900;
  margin-bottom:8px;
}

.info-card p{
  color:var(--muted);
}

.badges{
  display:flex;
  flex-wrap:wrap;
  gap:10px;
  margin-top:12px;
  justify-content:center;
}

.badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:10px 14px;
  background:var(--surface-2);
  border:1px solid var(--border);
  border-radius:999px;
  font-weight:800;
  font-size:14px;
}

.badge i{
  color:var(--scarlet-red);
}

.cta-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  justify-content:center;
  margin-top:18px;
}

.cta-link,
.btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:10px;
  padding:12px 16px;
  border-radius:14px;
  text-decoration:none;
  font-weight:900;
  transition:var(--transition);
  cursor:pointer;
}

.cta-link{
  border:2px solid var(--btn-border);
  background:var(--btn-bg);
  color:var(--btn-text);
}

.cta-link.primary{
  border-color:var(--btn-accent-border);
  background:var(--btn-accent-bg);
  color:var(--btn-accent-text);
}

.cta-link:hover{
  background:var(--btn-hover-bg);
  border-color:var(--btn-hover-border);
  color:var(--btn-hover-text);
  transform:translateY(-2px);
}

.btn{
  border:2px solid var(--btn-border);
  background:var(--btn-bg);
  color:var(--btn-text);
}

.btn.primary{
  border-color:var(--btn-accent-border);
  background:var(--btn-accent-bg);
  color:var(--btn-accent-text);
}

.btn:hover{
  background:var(--btn-hover-bg);
  border-color:var(--btn-hover-border);
  color:var(--btn-hover-text);
  transform:translateY(-2px);
}

.form-actions{
  margin-top:18px;
  display:flex;
  gap:12px;
  flex-wrap:wrap;
}

.helper-text{
  color:var(--muted);
  margin-top:10px;
}

.btn-sm{
  flex:1;
  padding:12px;
  text-align:center;
  border-radius:12px;
  text-decoration:none;
  font-weight:900;
  font-size:14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  transition:var(--transition);
  border:2px solid var(--btn-border);
  background:var(--btn-bg);
  color:var(--btn-text);
}

.btn-sm.primary{
  border-color:var(--btn-accent-border);
  background:var(--btn-accent-bg);
  color:var(--btn-accent-text);
}

.btn-sm:hover{
  background:var(--btn-hover-bg);
  border-color:var(--btn-hover-border);
  color:var(--btn-hover-text);
  transform:translateY(-2px);
}

.action-btn-styled{
  width:160px;
  height:160px;
  background:var(--btn-accent-bg);
  border:2px solid var(--btn-accent-border);
  border-bottom:6px solid var(--btn-accent-border);
  border-radius:20px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:12px;
  text-decoration:none;
  color:var(--btn-accent-text);
  font-weight:900;
  transition:var(--transition);
  box-shadow:var(--shadow);
}

.action-btn-styled i{
  font-size:40px;
  color:var(--scarlet-red);
}

.action-btn-styled:hover{
  background:var(--btn-hover-bg);
  border-color:var(--btn-hover-border);
  color:var(--btn-hover-text);
  transform:translateY(-6px);
}

.action-btn-styled:hover i{
  color:#fff;
}

@media (max-width:480px){
  .action-btn-styled{
    width:100%;
    height:100px;
    flex-direction:row;
    gap:20px;
  }
}

.lessons-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:25px;
  margin-top:24px;
}

.lesson-card{
  background:var(--surface);
  padding:26px;
  border-radius:24px;
  border:1px solid var(--border);
  border-bottom:8px solid var(--scarlet-red);
  transition:var(--transition);
  display:flex;
  flex-direction:column;
  box-shadow:var(--shadow);
}

.lesson-card:hover{
  transform:translateY(-8px);
}

.lesson-badge{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:8px 12px;
  border-radius:999px;
  background:var(--surface-2);
  border:1px solid var(--border);
  font-weight:900;
  font-size:13px;
  width:fit-content;
  margin-bottom:12px;
}

.lesson-actions{
  display:flex;
  gap:12px;
  margin-top:auto;
  padding-top:18px;
}

.video-container{
  width:100%;
  max-width:1200px;
  margin:0 auto;
  aspect-ratio:16 / 9;
  position:relative;
  overflow:hidden;
  border-radius:24px;
  background:#000;
  border:1px solid var(--border);
  box-shadow:0 20px 40px rgba(0,0,0,0.12);
}

.video-container iframe{
  position:absolute;
  inset:0;
  width:100% !important;
  height:100% !important;
  border:0;
}

.pdf-frame{
  display:block;
  width:min(1100px, 100%);
  height:95vh;
  margin:0 auto;
  border:1px solid var(--border);
  border-radius:22px;
  overflow:hidden;
  background:var(--surface);
  box-shadow:var(--shadow);
}

.main-footer{
  background:var(--footer-bg);
  color:var(--nav-text);
  padding:34px 0;
  border-top:5px solid var(--scarlet-red);
  flex:0 0 auto;
  margin-top:auto;
}

.footer-container{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);
  align-items:center;
  gap:30px;
}

.footer-left{
  justify-self:start;
}

.footer-center{
  justify-self:center;
  text-align:center;
}

.footer-right{
  justify-self:end;
}

.copyright-text{
  text-align:center;
  width:100%;
  font-size:14px;
  line-height:1.5;
}

.bot-link{
  display:flex;
  align-items:center;
  gap:14px;
  padding:14px 18px;
  border:1px solid rgba(255,255,255,.18);
  border-radius:14px;
  background:rgba(255,255,255,.06);
  transition:var(--transition);
}

.bot-link:hover{
  border-color:rgba(255,255,255,.3);
  background:rgba(255,255,255,.09);
}

.bot-link i{
  font-size:20px;
  color:#fff;
}

.bot-title{
  font-size:12px;
  opacity:.75;
}

.bot-username{
  color:#fff;
  text-decoration:none;
  font-weight:900;
}

.bot-username:hover{
  color:var(--scarlet-red);
}

.social-icons{
  display:flex !important;
  flex-direction:row !important;
  gap:15px;
}

.social-icon{
  width:45px;
  height:45px;
  background:rgba(255,255,255,.12);
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:white;
  text-decoration:none;
  transition:var(--transition);
}

.social-icon:hover{
  background:var(--scarlet-red);
  transform:scale(1.08);
}

@media (max-width:850px){
  .footer-container{
    grid-template-columns:1fr;
    gap:20px;
    text-align:center;
    justify-items:center;
  }

  .footer-left,
  .footer-center,
  .footer-right{
    justify-self:center;
  }
}

.auth-wrap{
  max-width:520px;
  margin:0 auto;
}

.auth-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:24px;
  padding:22px;
  box-shadow:var(--shadow);
}

.form-row{
  margin-top:14px;
}

label{
  display:block;
  font-weight:900;
  margin-bottom:6px;
  color:var(--page-text);
}

input[type="text"],
input[type="email"],
input[type="password"]{
  width:100%;
  padding:12px 14px;
  border-radius:14px;
  border:1px solid var(--border);
  font-size:16px;
  outline:none;
  background:var(--surface);
  color:var(--page-text);
}

input:focus{
  border-color:rgba(255,36,0,.34);
  box-shadow:0 0 0 4px rgba(255,36,0,0.10);
}

.page-shell{
  padding-top:44px;
}

.wide-container{
  max-width:1500px;
}

.page-hero-card,
.progress-card,
.result-box,
.page-panel,
.hero-side-card,
.mini-info-card,
.auth-card-elevated,
.verify-card,
.centered-card{
  background:linear-gradient(180deg, var(--surface), var(--surface-2));
  border:1px solid var(--border);
  border-radius:30px;
  box-shadow:var(--shadow);
}

.page-hero-card,
.page-panel,
.progress-card,
.result-box{
  padding:26px;
}

.hero-grid{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(300px,.85fr);
  gap:22px;
  align-items:stretch;
}

.hero-copy,
.profile-hero-copy{
  display:flex;
  flex-direction:column;
  justify-content:center;
}

.hero-side-card,
.mini-info-card{
  padding:22px;
}

.hero-badge{
  display:inline-flex;
  align-items:center;
  gap:10px;
  width:fit-content;
  padding:10px 14px;
  border-radius:999px;
  background:rgba(255,36,0,.10);
  border:1px solid rgba(255,36,0,.18);
  color:var(--scarlet-red);
  font-size:14px;
  font-weight:900;
  margin-bottom:14px;
}

.centered-text{
  text-align:center;
}

.full-width .hero-badge{
  margin-left:auto;
  margin-right:auto;
}

.align-left{
  justify-content:flex-start;
}

.small-subtitle{
  font-size:15px;
  margin-top:10px;
  margin-bottom:0;
}

.section-heading-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  flex-wrap:wrap;
  margin-bottom:8px;
}

.section-caption{
  color:var(--muted);
  font-weight:800;
}

.back-link-row{
  margin-bottom:18px;
}

.back-link{
  display:inline-flex;
  align-items:center;
  gap:8px;
  color:var(--scarlet-red);
  font-weight:900;
  text-decoration:none;
}

.back-link:hover{
  text-decoration:underline;
}

.progress-card{
  margin-top:22px;
}

.compact-card{
  padding:24px;
}

.progress-bar{
  width:100%;
  height:14px;
  border-radius:999px;
  background:rgba(128,128,128,.16);
  overflow:hidden;
  margin-top:14px;
}

.progress-bar span{
  display:block;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg, var(--scarlet-red), #ff8f7d);
  box-shadow:0 8px 18px rgba(255,36,0,.18);
}

.status-row{
  display:flex;
  gap:12px;
  flex-wrap:wrap;
  align-items:center;
  margin-top:18px;
}

.status-pill{
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:9px 14px;
  border-radius:999px;
  font-weight:800;
  font-size:14px;
  white-space:nowrap;
  border:1px solid var(--border);
  background:var(--surface-2);
}

.status-pill.done,
.mini-status.done{
  border-color:rgba(22,163,74,.25);
  background:rgba(22,163,74,.12);
  color:#15803d;
}

.status-pill.todo,
.mini-status.todo{
  border-color:rgba(220,38,38,.25);
  background:rgba(220,38,38,.10);
  color:#b91c1c;
}

html[data-theme="dark"] .status-pill.done,
html[data-theme="dark"] .mini-status.done{
  color:#86efac;
  background:rgba(34,197,94,.14);
  border-color:rgba(34,197,94,.26);
}

html[data-theme="dark"] .status-pill.todo,
html[data-theme="dark"] .mini-status.todo{
  color:#fca5a5;
  background:rgba(239,68,68,.14);
  border-color:rgba(239,68,68,.24);
}

.profile-shell{
  display:grid;
  gap:28px;
}

.profile-hero-card{
  display:grid;
  grid-template-columns:minmax(0,1.15fr) minmax(320px,.85fr);
  gap:22px;
  padding:28px;
  border-radius:30px;
  background:linear-gradient(180deg, var(--surface), var(--surface-2));
  border:1px solid var(--border);
  box-shadow:var(--shadow);
}

.progress-hero-panel{
  display:grid;
  grid-template-columns:160px minmax(0,1fr);
  gap:18px;
  align-items:center;
}

.progress-ring-card{
  width:210px;
  height:210px;
  border-radius:50%;
  display:grid;
  place-items:center;
  background:radial-gradient(circle at center, var(--surface) 57%, transparent 58%), conic-gradient(var(--scarlet-red) 0deg, var(--scarlet-red) calc(3.6deg * var(--progress-value, 0)), rgba(128,128,128,0.15) 0deg 360deg);
  border:1px solid rgba(255,255,255,.12);
  box-shadow:0 12px 30px rgba(0,0,0,0.12);
}

.progress-ring-value{
  width:146px;
  height:146px;
  border-radius:50%;
  background:var(--surface);
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  box-shadow:inset 0 0 0 1px var(--border);
}

.progress-ring-value strong{
  font-size:44px;
  line-height:1;
}

.progress-ring-value span{
  margin-top:8px;
  font-size:15px;
  color:var(--muted);
  font-weight:700;
}

.progress-hero-meta{
  display:grid;
  gap:16px;
}

.course-scale{
  --scale-edge-gap: 18px;
  position:relative;
  width:100%;
  max-width:100%;
  min-width:0;
  padding:30px var(--scale-edge-gap) 30px;
  overflow:hidden;
}

.course-scale-track,
.course-scale-fill{
  position:absolute;
  left:var(--scale-edge-gap);
  right:var(--scale-edge-gap);
  top:42px;
  height:10px;
  border-radius:999px;
}

.course-scale-track{background:rgba(128,128,128,0.18)}
.course-scale-fill{right:auto;width:0;background:linear-gradient(90deg, var(--scarlet-red), #ff8f7d);box-shadow:0 8px 18px rgba(255,36,0,0.18);max-width:calc(100% - (var(--scale-edge-gap) * 2))}
.course-scale-points{position:relative;height:54px;width:100%}
.scale-point{position:absolute;top:0;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:10px;min-width:max-content}
.course-scale .scale-point:first-child{left:var(--scale-edge-gap) !important;transform:none;align-items:flex-start}
.course-scale .scale-point:last-child{left:calc(100% - var(--scale-edge-gap)) !important;transform:translateX(-100%);align-items:flex-end}
.scale-dot{width:20px;height:20px;border-radius:50%;border:3px solid rgba(128,128,128,.28);background:var(--surface);flex:0 0 auto}
.scale-point.reached .scale-dot{border-color:var(--scarlet-red);background:var(--scarlet-red);box-shadow:0 0 0 6px rgba(255,36,0,.12)}
.scale-caption{font-size:13px;font-weight:800;color:var(--muted);white-space:nowrap}

.profile-stats-grid,
.results-summary-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;
  min-width:0;
}

.stat-card{
  background:linear-gradient(180deg, var(--surface), var(--surface-2));
  border:1px solid var(--border);
  border-radius:24px;
  padding:22px;
  box-shadow:var(--shadow);
}

.stat-icon{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:16px;background:rgba(255,36,0,.10);color:var(--scarlet-red);font-size:20px}
.stat-value{margin-top:18px;font-size:34px;font-weight:900;line-height:1.05}
.stat-label{margin-top:8px;color:var(--muted);font-weight:700}

.profile-modules-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(290px,1fr));
  gap:20px;
}

.profile-module-card{
  background:var(--surface);
  border:1px solid var(--border);
  border-radius:24px;
  padding:22px;
  box-shadow:var(--shadow);
  border-bottom:8px solid var(--scarlet-red);
}

.profile-module-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px;flex-wrap:wrap}
.mini-status{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border-radius:999px;font-weight:800;font-size:13px;border:1px solid var(--border)}
.module-checklist{display:grid;gap:10px;margin-top:14px}
.check-item{display:flex;gap:10px;align-items:center;color:var(--muted);font-weight:800}
.check-item.done{color:var(--page-text)}
.check-item i{color:var(--scarlet-red)}

.auth-layout{
  max-width:860px;
  margin:0 auto;
  display:grid;
  gap:22px;
}

.auth-layout-wide{max-width:920px}
.auth-hero-card{padding:26px 28px}
.auth-card-elevated{padding:24px 24px 22px}
.auth-inline-flash{border-radius:18px;border:1px solid var(--border);padding:12px 14px;margin-bottom:14px}
.center-actions{justify-content:center}
.verify-result-block{margin-top:18px}
.verify-meta p + p{margin-top:8px}

.field{margin-top:0}
.test-user-card{margin-bottom:18px;text-align:left}

.question-block{
  background:linear-gradient(180deg, var(--surface), var(--surface-2));
  border:1px solid var(--border);
  border-radius:24px;
  padding:22px;
  box-shadow:var(--shadow);
  margin-top:18px;
  text-align:left;
}

.question-block h3{
  font-size:20px;
  font-weight:900;
  margin-bottom:16px;
}

.option{
  display:flex;
  gap:12px;
  align-items:flex-start;
  padding:14px 16px;
  border:1px solid var(--border);
  border-radius:16px;
  background:var(--surface);
  cursor:pointer;
  transition:var(--transition);
}

.option + .option{margin-top:12px}
.option:hover{transform:translateY(-2px);border-color:rgba(255,36,0,.24);background:var(--surface-2)}
.option input{margin-top:3px;accent-color:var(--scarlet-red)}
.option span{font-weight:700;color:var(--page-text)}

.result-success{background:linear-gradient(180deg, #f8fff8, #eefcf1)}
.result-fail{background:linear-gradient(180deg, #fff8f8, #fff0f0)}
html[data-theme="dark"] .result-success{background:linear-gradient(180deg, rgba(22,163,74,.14), rgba(22,163,74,.10))}
html[data-theme="dark"] .result-fail{background:linear-gradient(180deg, rgba(220,38,38,.16), rgba(220,38,38,.12))}

.results-page .container{max-width:1540px;padding-left:24px;padding-right:24px}
.results-table-wrap{width:100%;margin-top:18px;overflow-x:auto;-webkit-overflow-scrolling:touch;background:var(--surface);border:1px solid var(--border);border-radius:28px;box-shadow:var(--shadow)}
.results-table{width:100%;min-width:980px;border-collapse:collapse;table-layout:fixed;background:var(--surface)}
.results-table thead th{background:var(--surface-2);color:var(--page-text);font-size:15px;font-weight:900;letter-spacing:.01em;text-align:left;padding:18px 20px;border:1px solid var(--border);white-space:normal}
.results-table tbody td{padding:18px 20px;vertical-align:top;border:1px solid var(--border);color:var(--page-text);line-height:1.55;font-size:15px;overflow-wrap:anywhere;word-break:normal}
.results-table tbody tr:nth-child(even) td{background:var(--surface-2)}
.results-table th:nth-child(2), .results-table td:nth-child(2),
.results-table th:nth-child(3), .results-table td:nth-child(3),
.results-table th:nth-child(4), .results-table td:nth-child(4){text-align:center}
.results-table th:nth-child(5), .results-table td:nth-child(5){white-space:nowrap}
.result-muted{display:block;margin-top:6px;color:var(--muted)}
.result-date{display:inline-block;white-space:nowrap}

.course-grid-wide .lesson-card,
.team-grid .info-card{min-height:100%}
.empty-media-state{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;color:white;flex-direction:column;gap:12px;padding:20px;text-align:center}
.empty-media-state i{font-size:54px;color:var(--scarlet-red)}
.centered-card{max-width:900px;margin:0 auto}

.consent-box{margin-top:18px;padding:18px 18px 16px;border:1px solid var(--border);border-radius:18px;background:var(--surface-2)}
.consent-check{display:flex;gap:12px;align-items:flex-start;cursor:pointer}
.consent-check input[type="checkbox"]{width:18px;height:18px;margin-top:3px;accent-color:var(--scarlet-red);flex:0 0 auto}
.consent-copy{line-height:1.6;color:var(--page-text)}
.consent-copy a,.inline-policy-link,.footer-policy-link,.policy-warning a,.policy-card a{color:var(--scarlet-red);text-decoration:none;font-weight:800}
.consent-copy a:hover,.inline-policy-link:hover,.footer-policy-link:hover,.policy-warning a:hover,.policy-card a:hover{text-decoration:underline}
.consent-links-row{display:flex;flex-wrap:wrap;gap:14px;margin:14px 0 8px}
.inline-policy-link{display:inline-flex;align-items:center;gap:8px}
.consent-note{margin:0;color:var(--muted);line-height:1.6}
.policy-container{max-width:1100px}
.policy-actions{display:flex;gap:14px;flex-wrap:wrap;justify-content:center;margin:10px 0 18px}
.policy-warning{margin:0 auto 24px;padding:18px 20px;border-radius:20px;border:1px solid var(--border);background:linear-gradient(180deg, var(--surface-2), var(--surface));box-shadow:var(--shadow)}
.policy-warning p{margin:8px 0 0}
.policy-warning-soft{text-align:center}
.policy-stack{display:grid;gap:18px}
.policy-card{background:var(--surface);border:1px solid var(--border);border-radius:24px;padding:24px;box-shadow:var(--shadow)}
.policy-card h2{margin:0 0 12px;font-size:22px;line-height:1.28}
.policy-card p,.policy-card li{color:var(--page-text);line-height:1.7}
.policy-card p + p{margin-top:12px}
.policy-list{margin:0;padding-left:22px;display:grid;gap:8px}
.footer-policy-link{display:inline-block;margin-top:6px}

@media (max-width:1000px){
  .hero-grid,
  .profile-hero-card,
  .progress-hero-panel{grid-template-columns:1fr}
  .progress-ring-card{margin:0 auto}
}

@media (max-width:900px){
  .results-page .container{padding-left:16px;padding-right:16px}
  .results-table{min-width:760px}
  .results-table thead th,.results-table tbody td{padding:16px 14px}
}

@media (max-width:640px){
  .page-hero-card,
  .progress-card,
  .page-panel,
  .result-box,
  .profile-hero-card,
  .policy-card,
  .auth-card,
  .auth-card-elevated{padding:20px}
  .progress-top{align-items:flex-start}
  .section-heading-row{align-items:flex-start}
  .course-scale{--scale-edge-gap:12px;padding-left:var(--scale-edge-gap);padding-right:var(--scale-edge-gap)}
  .scale-caption{font-size:12px}
}

.hero-section.compact-hero{margin-bottom:10px}
.hero-text{display:flex;flex-direction:column;align-items:flex-start}
.centered-text.hero-text,.hero-text.centered-text{align-items:center}


.nav-menu.account-menu,
.nav-menu.lang-menu{
  min-width:190px;
}

.account-menu a{
  display:flex;
  align-items:center;
  gap:10px;
}

.account-menu a i{
  width:18px;
  text-align:center;
}

.form-grid.two-columns{
  display:grid;
  grid-template-columns:repeat(2, minmax(0, 1fr));
  gap:16px;
}

@media (max-width:700px){
  .form-grid.two-columns{
    grid-template-columns:1fr;
    gap:0;
  }
}

img,svg,video,iframe{max-width:100%;height:auto}
input,button,select,textarea{font:inherit}

.progress-top,
.progress-top-simple{
  display:grid;
  gap:6px;
}

.progress-label{
  font-size:16px;
  font-weight:700;
  color:var(--muted);
}

.progress-meta{
  display:flex;
  flex-wrap:wrap;
  align-items:baseline;
  gap:8px;
  font-size:18px;
}

.progress-meta b{
  font-size:36px;
  line-height:1;
}

.progress-meta span{
  color:var(--muted);
  font-weight:700;
}

.progress-simple-note{
  padding:16px 18px;
  border-radius:18px;
  background:rgba(255,36,0,0.06);
  border:1px solid rgba(255,36,0,0.16);
  color:var(--muted);
  font-weight:600;
}

@media (max-width: 700px){
  .progress-hero-panel{
    grid-template-columns:1fr;
    justify-items:center;
    text-align:center;
  }

  .progress-hero-meta{
    width:100%;
  }

  .progress-meta{
    justify-content:center;
  }

  .status-row{
    justify-content:center;
  }
}

.progress-hero-panel.ring-only{display:flex;align-items:center;justify-content:center;min-width:0;}
.progress-hero-panel.ring-only .progress-ring-card{margin:0 auto;}
@media (max-width:1000px){.progress-hero-panel.ring-only{justify-content:center;}}
@media (max-width:700px){
  .progress-ring-card{
    width:180px;
    height:180px;
  }

  .progress-ring-value{
    width:126px;
    height:126px;
  }

  .progress-ring-value strong{
    font-size:38px;
  }
}