.panel,
.card,
.surface,
.section,
.box,
.article-body,
.blog-card,
.study-card{
  background:var(--card);
  border:1px solid var(--border);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow);
}

.card,
.section,
.box,
.surface,
.panel{padding:22px}

.study-card,
.article-body,
.blog-card{padding:18px}

.card:hover{
  background:var(--card-hover);
  border-color:rgba(255,255,255,.22);
}

.divider{
  height:1px;
  background:rgba(255,255,255,.10);
  border-radius:1px;
  margin:18px 0;
}

.btn,
.top-link,
.jumpbtn,
.blog-page-btn,
.choice-btn,
.control,
.search{
  font-family:var(--ui);
}

.btn,
.top-link,
.jumpbtn,
.blog-page-btn,
.article-back,
.fab,
.float-btn,
.blog-back,
.footer-top,
.blog-btn,
.astro-btn,
.connexion-btn,
.admin-btn,
.btn-back-float,
.btn-demo-float,
.choice-btn{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  min-height:42px;
  padding:10px 18px;
  border-radius:var(--pill);
  text-decoration:none;
  font-family:var(--ui);
  font-weight:900;
  font-size:var(--fs-btn-float);
  line-height:1;
  letter-spacing:.04em;
  text-transform:uppercase;
  color:var(--gold-txt);
  border:1px solid rgba(255,216,107,.40);
  background:#ffffff10;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
  white-space:nowrap;
  text-align:center;
  transition:transform .06s ease, background .12s ease, border-color .12s ease, box-shadow .12s ease;
}

.btn-primary,
.btn-validate,
.btn-action,
.btn-generate,
.btn-submit,
.cta,
.astro-btn,
.connexion-btn,
.admin-btn{
  min-height:44px;
  padding:12px 18px;
  font-size:var(--fs-btn);
  background:linear-gradient(180deg,var(--blue1),var(--blue2));
  color:var(--gold-txt);
  border:1px solid var(--border-strong);
  box-shadow:0 10px 22px rgba(0,0,0,.25);
}

.btn-primary:hover,
.btn-validate:hover,
.btn-action:hover,
.btn-generate:hover,
.btn-submit:hover,
.cta:hover,
.astro-btn:hover,
.connexion-btn:hover,
.admin-btn:hover{
  background:linear-gradient(180deg,var(--blue3),var(--blue2));
}

.btn-primary:active,
.btn-validate:active,
.btn-action:active,
.btn-generate:active,
.btn-submit:active,
.choice-btn:active,
.jumpbtn:active,
.top-link:active{
  transform:scale(.99);
}

.btn-primary:disabled,
.btn-validate:disabled,
.btn-action:disabled,
.btn-generate:disabled,
.btn-submit:disabled,
.btn-disabled,
.is-disabled{
  background:var(--disabled-bg)!important;
  color:var(--gold-txt)!important;
  border-color:var(--disabled-border)!important;
  box-shadow:none!important;
  cursor:not-allowed!important;
  opacity:1!important;
}

.btn-primary.is-clicked,
.btn-primary.is-active,
.btn-validate.is-clicked,
.btn-validate.is-active,
.btn-action.is-clicked,
.btn-action.is-active,
.btn-generate.is-clicked,
.btn-generate.is-active,
.btn-submit.is-clicked,
.btn-submit.is-active,
.astro-btn.is-clicked,
.astro-btn.is-active,
.connexion-btn.is-clicked,
.connexion-btn.is-active,
.admin-btn.is-clicked,
.admin-btn.is-active,
.choice-btn.is-clicked,
.choice-btn.is-active,
.choice-btn.active,
.choice-btn[aria-selected="true"],
.choice-btn[aria-pressed="true"],
.jumpbtn.is-clicked,
.jumpbtn.is-active,
.jumpbtn.active,
.jumpbtn[aria-selected="true"],
.jumpbtn[aria-pressed="true"],
.top-link.is-clicked,
.top-link.is-active,
.top-link.active,
.top-link[aria-selected="true"],
.top-link[aria-pressed="true"]{
  min-height:44px;
  padding:12px 18px;
  font-size:var(--fs-btn);
  background:linear-gradient(180deg,var(--blue1),var(--blue2));
  border-color:var(--border-strong);
  box-shadow:0 10px 22px rgba(0,0,0,.25);
  color:var(--gold-txt);
}

.btn-primary.is-validated,
.btn-validate.is-validated,
.btn-action.is-validated,
.btn-generate.is-validated,
.btn-submit.is-validated{
  background:linear-gradient(180deg,#5c67ff,#3a41c8)!important;
  color:var(--gold-txt)!important;
  border-color:#3a41c8!important;
  box-shadow:none!important;
}

.control,
.search,
select,
input,
textarea{
  width:100%;
  min-height:46px;
  padding:12px 14px;
  border-radius:var(--radius-sm);
  border:1px solid rgba(255,255,255,.16);
  background:rgba(255,255,255,.06);
  color:var(--text);
  font-size:var(--fs-secondary);
  color-scheme:dark;
}

.control::placeholder,
.search::placeholder,
input::placeholder,
textarea::placeholder{
  color:rgba(201,201,211,.75);
}

.control:focus,
.search:focus,
select:focus,
input:focus,
textarea:focus{
  border-color:var(--border-strong);
  box-shadow:0 0 0 3px rgba(255,216,107,.12);
}

.fab,
.float-btn,
.blog-back,
.article-back-float,
.btn-back-float,
.btn-demo-float,
.floating-left .btn,
.floating-right .btn{
  position:fixed;
  bottom:var(--fab-bottom);
  z-index:9999;
}

.fab-left,
#btn-back,
.btn-back-float,
.blog-back,
.floating-left .btn,
.article-back-float{left:var(--fab-side)}

.fab-right,
#btn-demo,
.btn-demo-float,
.floating-right .btn{right:var(--fab-side)}

.fab-stack,
.status-fabs{
  position:fixed;
  right:var(--fab-side);
  bottom:var(--fab-bottom);
  z-index:9999;
  display:flex;
  flex-direction:column;
  gap:10px;
  align-items:flex-end;
}

.ad-gate,
.gate,
.overlay,
.loading-gate,
.study-loader-overlay{
  position:fixed;
  inset:0;
  z-index:10000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:20px;
  background:rgba(4,4,8,.78);
}

.ad-gate.is-open,
.gate.is-open,
.overlay.is-open,
.loading-gate.is-open,
.study-loader-overlay.is-open{
  display:flex;
}

.ad-gate-box,
.gate-box,
.overlay-box,
.loading-box,
.study-loader-box{
  width:min(520px,100%);
  background:rgba(17,12,30,.96);
  border:1px solid var(--border-strong);
  border-radius:var(--radius-lg);
  box-shadow:var(--shadow-strong);
  padding:26px 22px;
  text-align:center;
}

.ad-gate-title,
.gate-title,
.overlay-title,
.loading-title,
.study-loader-title{
  font-family:var(--brand);
  font-weight:900;
  font-size:var(--fs-h2);
  letter-spacing:.05em;
  text-transform:uppercase;
  color:var(--gold-txt);
  margin:0 0 10px;
}

.ad-gate-text,
.gate-text,
.overlay-text,
.loading-text,
.study-loader-text{
  color:var(--muted);
  font-size:var(--fs-secondary);
  line-height:1.6;
  margin:0 0 18px;
}

.loader-ring,
.study-loader-ring{
  width:56px;
  height:56px;
  margin:0 auto 16px;
  border-radius:50%;
  border:4px solid rgba(255,216,107,.18);
  border-top-color:var(--gold);
  animation:stellatma-spin 1s linear infinite;
}

@keyframes stellatma-spin{
  to{transform:rotate(360deg)}
}

.hidden-before-ad,
.is-hidden{display:none!important}

@media (max-width:720px){
  .card,
  .section,
  .box,
  .surface,
  .panel{
    padding:18px 16px;
  }

  .btn,
  .top-link,
  .jumpbtn,
  .blog-page-btn,
  .article-back,
  .footer-top,
  .blog-btn,
  .astro-btn,
  .connexion-btn,
  .admin-btn,
  .choice-btn{
    min-height:42px;
    padding:9px 15px;
    font-size:12px;
  }

  .btn-primary,
  .btn-validate,
  .btn-action,
  .btn-generate,
  .btn-submit,
  .cta,
  .astro-btn,
  .connexion-btn,
  .admin-btn,
  .btn-primary.is-clicked,
  .btn-primary.is-active,
  .btn-validate.is-clicked,
  .btn-validate.is-active,
  .btn-action.is-clicked,
  .btn-action.is-active,
  .btn-generate.is-clicked,
  .btn-generate.is-active,
  .btn-submit.is-clicked,
  .btn-submit.is-active,
  .choice-btn.is-clicked,
  .choice-btn.is-active,
  .choice-btn.active,
  .choice-btn[aria-selected="true"],
  .choice-btn[aria-pressed="true"],
  .jumpbtn.is-clicked,
  .jumpbtn.is-active,
  .jumpbtn.active,
  .jumpbtn[aria-selected="true"],
  .jumpbtn[aria-pressed="true"],
  .top-link.is-clicked,
  .top-link.is-active,
  .top-link.active,
  .top-link[aria-selected="true"],
  .top-link[aria-pressed="true"]{
    min-height:44px;
    padding:10px 15px;
    font-size:12px;
  }

  .fab,
  .float-btn,
  .blog-back,
  .article-back-float,
  .btn-back-float,
  .btn-demo-float,
  .floating-left .btn,
  .floating-right .btn{
    position:static;
    left:auto;
    right:auto;
    bottom:auto;
    z-index:auto;
    width:100%;
    max-width:360px;
    min-height:42px;
    padding:9px 15px;
    font-size:12px;
    white-space:normal;
    margin:10px auto 0;
  }

  .floating-left,
  .floating-right,
  .fab-stack,
  .status-fabs{
    position:static;
    left:auto;
    right:auto;
    bottom:auto;
    z-index:auto;
    width:100%;
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:10px;
    margin:18px auto 0;
  }

  .fab-left,
  #btn-back,
  .btn-back-float,
  .blog-back,
  .floating-left .btn,
  .article-back-float,
  .fab-right,
  #btn-demo,
  .btn-demo-float,
  .floating-right .btn{
    left:auto;
    right:auto;
  }
}