@font-face{font-family:"Inter";src:url("/assets/fonts/InterVariable.woff2") format("woff2");font-style:normal;font-weight:100 900;font-display:swap}
body,body *:not(i):not([class*="fa-"]){font-family:"Inter",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif!important}
body{font-optical-sizing:auto}
:is(#loopStartLabel,#loopEndLabel,#currentTimeLabel,#speedValue,.speed-value,.loop-timer,.loops-counter){font-variant-numeric:tabular-nums lining-nums}
/* Comfortable reading width; the player and practice controls keep their width. */
body .main > .text {
  width:100%;max-width:76ch;margin-inline:auto;
  font-size:16px;line-height:1.75;padding-top:48px!important;
}
body .main > .text > .text-center {
  margin-bottom:40px!important;padding-inline:12px;
}
body .main > .text h1 {
  font-size:clamp(24px,2.6vw,34px)!important;
  line-height:1.3;font-weight:700!important;letter-spacing:-.035em;
  text-wrap:balance;margin-bottom:16px!important;
}
body .main > .text .lead {
  font-size:clamp(14px,1.2vw,16px)!important;
  line-height:1.75;max-width:58ch;margin-inline:auto;
}
body .main > .text > :is(div,section):not(.text-center) {
  margin-bottom:36px!important;
}
body .main > .text h2 {
  font-size:clamp(20px,2.1vw,26px)!important;line-height:1.4;
  font-weight:700!important;letter-spacing:-.03em;text-wrap:balance;
  padding-inline:28px;margin-bottom:16px!important;
}
body .main > .text .text-div {
  padding:28px!important;border-radius:16px!important;
}
body .main > .text h3 {
  font-size:clamp(17px,1.5vw,21px)!important;line-height:1.55;
  letter-spacing:-.025em;font-weight:700!important;text-wrap:balance;
}
body .main > .text :is(p,li) {
  overflow-wrap:break-word;
}
body .main > .text :is(.font-size2,ol,ul) {
  font-size:16px;line-height:1.75!important;
}
body .main > .text .faq-item {
  margin-bottom:28px!important;
}
body .main > .text .faq-item:last-child {
  margin-bottom:0!important;
}
@media(max-width:600px) {
  body .main > .text {
    padding-top:32px!important;
  }
  body .main > .text > .text-center {
    padding-inline:0;margin-bottom:32px!important;
  }
  body .main > .text h1 {
    font-size:24px!important;line-height:1.35;
  }
  body .main > .text h2 {
    padding-inline:18px;font-size:20px!important;margin-bottom:14px!important;
  }
  body .main > .text .text-div {
    padding:18px!important;
  }
  body .main > .text > :is(div,section):not(.text-center) {
    margin-bottom:28px!important;
  }
  body .main > .text :is(.font-size2,ol,ul) {
    font-size:15px;line-height:1.8!important;
  }
  body .main > .text ol {
    margin-left:0!important;padding-left:24px;
  }
  body .main > .text .text-about .text-div > div {
    flex-wrap:wrap;
  }
}
/* Keep the end-time label inside the track before JavaScript positions it. */
.time_sliders_control #loopEndLabel:not([style*="transform"]) {
  left:auto!important;right:0;transform:none;
}

/* Small filled actions keep white labels readable; brand accents remain unchanged. */
:is(.auth-card .btn-primary,.billing-wrap .card .btn,.billing-option .btn,.header .register-link,.mobile-menu .register-link,.upgrade-cta-primary,.cookie-btn-accept,.filter-btn,.loop-btn-primary,#saveEditBtn,#confirmYes):not(:disabled):not([aria-disabled="true"]){background:#c83228!important;color:#fff!important}
:is(.auth-card .btn-primary,.billing-wrap .card .btn,.billing-option .btn,.header .register-link,.mobile-menu .register-link,.upgrade-cta-primary,.cookie-btn-accept,.filter-btn,.loop-btn-primary,#saveEditBtn,#confirmYes):not(:disabled):not([aria-disabled="true"]):hover{background:#ad2921!important;color:#fff!important}
:is(.auth-card .btn-primary,.billing-wrap .card .btn,.billing-option .btn,.header .register-link,.mobile-menu .register-link,.upgrade-cta-primary,.cookie-btn-accept,.filter-btn,.loop-btn-primary,#saveEditBtn,#confirmYes):focus-visible{outline:3px solid #fff!important;outline-offset:3px}

/* Reduced motion applies to decoration, leaving media playback and loop logic intact. */
@media(prefers-reduced-motion:reduce){
  html,html:focus-within{scroll-behavior:auto!important}
  .bg-particles{display:none!important}
  :is(.particle,.header,.logo,.logo-icon,.container,.auth-card,.auth-title,.field,.field-input,.btn-group,.divider,.auth-footer,.btn,.nav-link,.mobile-menu,.loop-card,.loop-thumbnail img),.auth-card::before{animation:none!important;transition:none!important}
  :is(.btn,.loop-card,.logo,.logo-icon):hover,.loop-thumbnail:hover img,.logo:hover img{transform:none!important}
}
.billing-plans .card .badge{background:#c83228!important;color:#fff!important}