:root{--b:#1264e8;--n:#09265d;--i:#102a55;--m:#64748b;--l:#d9e7ff;--p:#f04496}*{box-sizing:border-box}body{margin:0;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Arial,sans-serif;background:linear-gradient(135deg,#eef8ff,#fff7fb);color:var(--i)}a{color:var(--b);font-weight:850;text-decoration:none}.top{position:sticky;top:0;z-index:9;display:flex;justify-content:space-between;gap:16px;align-items:center;padding:12px 24px;background:rgba(255,255,255,.9);backdrop-filter:blur(16px);border-bottom:1px solid var(--l)}.brand{font-size:22px;font-weight:1000;color:var(--n)}.brand span{color:var(--b)}nav{display:flex;gap:8px;flex-wrap:wrap}nav a{padding:8px 12px;border-radius:999px;color:var(--i)}nav a:hover{background:#fff;box-shadow:0 8px 20px rgba(18,100,232,.1)}.main{width:min(1180px,94vw);margin:28px auto 60px}footer{text-align:center;color:var(--m);padding:28px}.head{margin-bottom:24px}.eyebrow{font-size:12px;letter-spacing:.13em;text-transform:uppercase;color:#008b6f;font-weight:1000}h1{font-size:clamp(34px,5vw,60px);line-height:1;margin:.1em 0;color:var(--n)}h2{color:var(--n)}p{line-height:1.7}.card,.stats div,.login-card,.install{background:rgba(255,255,255,.92);border:1px solid var(--l);border-radius:24px;box-shadow:0 22px 60px rgba(18,100,232,.1)}.card{padding:24px;margin:18px 0}.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:22px}.stats div{padding:20px}.stats b{display:block;font-size:34px;color:var(--b)}.stats span{font-weight:900;color:var(--m)}.grid,.form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.form{grid-template-columns:1fr}.full{grid-column:1/-1}label{font-weight:900}input,select,textarea{width:100%;margin-top:7px;border:1px solid #cfe0fb;border-radius:14px;padding:12px 14px;font:inherit;background:#fff}textarea{min-height:100px}button{border:0;border-radius:999px;background:linear-gradient(135deg,#1264e8,#2aa7ff 50%,#f04496);color:white;font-weight:1000;padding:12px 18px;cursor:pointer;box-shadow:0 18px 35px rgba(18,100,232,.22)}.table{overflow:auto}table{width:100%;border-collapse:collapse}th,td{text-align:left;padding:12px;border-bottom:1px solid #e8f0ff;vertical-align:top}th{font-size:13px;color:#52657f;text-transform:uppercase}.muted,small{color:var(--m)}.flash{border-radius:16px;padding:12px 14px;margin-bottom:16px;font-weight:850}.success{background:#e8fff6;color:#036747;border:1px solid #a7f3d0}.error{background:#fff0f0;color:#991b1b;border:1px solid #fecaca}.badge{display:inline-block;border-radius:999px;padding:5px 9px;font-weight:1000;font-size:12px;background:#edf2ff}.badge.ok{background:#e8fff6;color:#047857}.badge.warn{background:#fff8e7;color:#a16207}.badge.bad{background:#fff0f0;color:#b91c1c}.inline{display:flex;gap:8px;align-items:center}.inline select{margin:0}.login{min-height:100vh;display:grid;place-items:center;padding:24px}.login-grid{width:min(1040px,94vw);display:grid;grid-template-columns:1fr 420px;gap:28px;align-items:center}.login-grid h1{font-size:clamp(42px,6vw,76px);background:linear-gradient(135deg,#0e2a62,#1677ff 55%,#f04496);-webkit-background-clip:text;background-clip:text;color:transparent}.login-card,.install{padding:28px}.install{width:min(720px,94vw)}@media(max-width:900px){.top{align-items:flex-start;flex-direction:column}.stats,.grid,.login-grid{grid-template-columns:1fr}.full{grid-column:auto}}


/* ClasslyOne 8.6 booking workflow polish */
.mini-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;min-width:520px}
.mini-grid .full{grid-column:1/-1}
.mini-grid button{grid-column:1/-1}
.table td{vertical-align:top}
.card .muted{margin-top:-6px;margin-bottom:18px}
.stats{grid-template-columns:repeat(5,minmax(0,1fr))}
@media(max-width:900px){
  .mini-grid{min-width:0;grid-template-columns:1fr}
  .stats{grid-template-columns:repeat(2,minmax(0,1fr))}
}


/* ClasslyOne 8.7 password change polish */
.password-card{max-width:780px}
.password-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.password-grid .full{grid-column:1/-1}
.password-tips{background:#f2f8ff;border:1px solid #d7e8ff;border-radius:16px;padding:12px 14px;color:#405675}
.password-tips strong{display:block;color:#082b66;margin-bottom:4px}
.password-reminder{padding:14px 18px;margin:12px 0 20px;background:linear-gradient(135deg,#ffffff,#f7fbff)}
@media(max-width:760px){.password-grid{grid-template-columns:1fr}.password-grid .full{grid-column:auto}}


/* ClasslyOne 8.8 admin notification polish */
.stats{grid-template-columns:repeat(6,minmax(0,1fr))}
.card-title-row{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}
.filter-bar{display:grid;grid-template-columns:180px 1fr auto auto;gap:12px;align-items:end;margin:16px 0 18px}
.filter-bar .plain-btn{display:inline-flex;align-items:center;justify-content:center;border:1px solid #cfe0fb;background:#fff;border-radius:999px;padding:12px 16px}
.stacked-action{margin:0 0 10px}
.danger-btn{background:linear-gradient(135deg,#d92d20,#f04438)!important}
.compact-inline input{min-width:220px}
.compact-inline select{min-width:130px}
.feature-list{line-height:1.9;color:#405675;font-weight:750}
.password-reminder a{margin-left:10px}
@media(max-width:1050px){
  .stats{grid-template-columns:repeat(3,minmax(0,1fr))}
  .filter-bar{grid-template-columns:1fr}
}
@media(max-width:640px){
  .stats{grid-template-columns:1fr}
  .compact-inline{display:grid;grid-template-columns:1fr}
  .compact-inline input,.compact-inline select{min-width:0}
}


/* ClasslyOne 8.9 student payment and registration polish */
.booking-calculator-grid{display:grid;grid-template-columns:minmax(0,1.45fr) minmax(280px,.55fr);gap:18px;align-items:start}
.student-price-card{position:sticky;top:90px;background:linear-gradient(135deg,#fff,#f7fbff);border:1px solid #d8e8ff;border-radius:24px;padding:24px;box-shadow:0 22px 60px rgba(18,100,232,.12)}
.student-price-card h3{font-size:46px;line-height:1;margin:8px 0 10px;color:#1264e8}
.student-price-card button{width:100%;border:0;border-radius:999px;background:linear-gradient(135deg,#1264e8,#2aa7ff 50%,#f04496);color:#fff;font-weight:1000;padding:13px 18px;margin:14px 0 8px;cursor:pointer}
.student-price-card button:disabled{opacity:.55;cursor:not-allowed}
.mini-payment-note{border:1px solid #d8e8ff;background:#fff;border-radius:16px;padding:12px;margin:14px 0;color:#405675;font-weight:750}
.register-shell{width:min(1120px,94vw)}
.register-card{max-height:none}
#studentFields,#tutorFields{display:grid;gap:14px}
@media(max-width:980px){.booking-calculator-grid{grid-template-columns:1fr}.student-price-card{position:relative;top:auto}}


/* ClasslyOne 4.5.0: portal cleanup */
.top{box-shadow:0 8px 30px rgba(18,100,232,.08)}
.main{max-width:1180px}
.card{border-radius:26px}
.head h1{letter-spacing:-.035em}
.login-grid section h1{letter-spacing:-.04em}
.portal-note{background:#fff;border:1px solid #d8e8ff;border-radius:20px;padding:14px 16px;color:#405675}


/* ClasslyOne 9.1 meaningful booking dropdown polish */
.booking-calculator-grid{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(310px,.6fr);gap:20px;align-items:start}
.student-booking-form.grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.student-booking-form .full{grid-column:1/-1}
.student-price-card{position:sticky;top:90px;background:linear-gradient(135deg,#fff,#f7fbff);border:1px solid #d8e8ff;border-radius:24px;padding:24px;box-shadow:0 22px 60px rgba(18,100,232,.12)}
.student-price-card h3{font-size:46px;line-height:1;margin:8px 0 10px;color:#1264e8}
.student-price-card button{width:100%;border:0;border-radius:999px;background:linear-gradient(135deg,#1264e8,#2aa7ff 50%,#f04496);color:#fff;font-weight:1000;padding:13px 18px;margin:14px 0 8px;cursor:pointer}
.student-price-card button:disabled{opacity:.55;cursor:not-allowed;background:#9fb4d6}
.mini-payment-note{border:1px solid #d8e8ff;background:#fff;border-radius:16px;padding:12px;margin:14px 0;color:#405675;font-weight:750}
.field-hint{display:block;margin-top:8px;color:#52657f;font-weight:750;line-height:1.45}
.student-booking-form select,
.student-booking-form input,
.student-booking-form textarea{font-size:16px}
@media(max-width:980px){
  .booking-calculator-grid{grid-template-columns:1fr}
  .student-price-card{position:relative;top:auto}
}
@media(max-width:720px){
  .student-booking-form.grid{grid-template-columns:1fr}
  .student-booking-form .full{grid-column:auto}
}


/* ClasslyOne 9.2 Portal Simple Premium */
:root{--blue:#1264E8;--navy:#0A2D72;--ink:#081F49;--muted:#5B6F8A;--line:#D9E7FF;--soft:#F5FAFF;--pink:#F04496;}body{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif!important;background:radial-gradient(circle at top left,rgba(37,167,240,.16),transparent 32%),linear-gradient(180deg,#F7FBFF,#FFFFFF)!important;color:var(--ink)!important}.portal-top{background:rgba(255,255,255,.9)!important;backdrop-filter:blur(18px)!important;box-shadow:0 8px 32px rgba(10,45,114,.06)!important}.card,.stat,.login-card,.install-card{border:1px solid rgba(217,231,255,.95)!important;background:rgba(255,255,255,.94)!important;box-shadow:0 22px 60px rgba(10,45,114,.12)!important}h1,.login-brand h1{letter-spacing:-.04em!important}button,.btn-primary,.btn-small{background:linear-gradient(135deg,#1264E8,#25A7F0 55%,#F04496)!important;color:white!important;border:0!important}input,select,textarea{border:1px solid #CFE0FB!important;border-radius:16px!important}.student-price-card,.price-result-card{border-radius:24px!important}

/* ClasslyOne 10.1 portal discount polish */
.discount-ticker{position:sticky;top:0;z-index:9999;overflow:hidden;background:linear-gradient(90deg,#07245c,#1264e8 38%,#f04496 74%,#ffb000);color:#fff;box-shadow:0 8px 24px rgba(8,31,73,.18)}
.discount-ticker__track{display:flex;gap:54px;width:max-content;white-space:nowrap;animation:cloTicker 24s linear infinite;padding:9px 0;font-size:13px;font-weight:1000;letter-spacing:.04em;text-transform:uppercase}.discount-ticker__track span{padding-left:32px}.discount-ticker b{background:#fff;color:#1264e8;border-radius:999px;padding:3px 10px;margin:0 4px}@keyframes cloTicker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.old-price{text-decoration:line-through;color:#8794a8!important;margin-right:6px}.discounted{color:#1264e8!important;font-weight:1000}.student-price-card{box-shadow:0 24px 70px rgba(8,31,73,.14)!important}.mini-payment-note{background:#fff7fb!important;border-color:#ffd0e7!important;color:#9b155c!important;font-weight:900!important}

/* ClasslyOne 11.0 approved brand assets */
.top .brand{display:flex;align-items:center;gap:10px;min-width:190px}.top .brand img{width:148px;max-width:40vw;height:auto;display:block}.top .brand .portal-label{font-size:13px;letter-spacing:.08em;text-transform:uppercase;color:#1264e8}.login-brand-logo{display:inline-block;margin-bottom:18px}.login-brand-logo img{width:min(320px,78vw);height:auto;display:block}.login-grid>section{align-self:center}@media(max-width:900px){.top .brand img{width:138px}.top .brand{min-width:0}}


/* ClasslyOne 4.1 account access refinement */
.login{background:linear-gradient(115deg,rgba(6,26,68,.8),rgba(18,100,232,.42)),url('/assets/images/hero-1280.webp') center/cover fixed!important}
.login-grid{background:rgba(255,255,255,.9);backdrop-filter:blur(22px);border:1px solid rgba(255,255,255,.7);padding:32px;border-radius:34px;box-shadow:0 35px 100px rgba(2,15,43,.32)}
.login-grid>section{padding:22px}.login-grid>section p{color:#425a7b}.login-card{background:#fff!important}
.login-brand-logo img{width:min(260px,72vw)}
@media(max-width:900px){.login-grid{padding:18px}.login-grid>section{padding:8px}.login{background-attachment:scroll!important}}


/* ClasslyOne 4.6 top strip enhancement */
.discount-ticker{overflow:hidden;background:linear-gradient(90deg,#071b45 0%,#1264e8 34%,#7c4dff 66%,#f04496 100%);box-shadow:0 10px 28px rgba(8,31,73,.18)}
.discount-ticker::before{content:"";position:absolute;inset:-120% auto -120% -20%;width:24%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transform:skewX(-20deg);animation:portalTickerShine 6s ease-in-out infinite;pointer-events:none}
.discount-ticker__track{gap:62px;padding:10px 0;font-size:13px;font-weight:1000;letter-spacing:.04em;text-transform:uppercase;animation-duration:26s}
.discount-ticker__track span{padding-left:34px}
.discount-ticker b{background:#fff;color:#1264e8;border-radius:999px;padding:3px 10px;margin:0 4px;box-shadow:0 6px 16px rgba(0,0,0,.12)}
@keyframes portalTickerShine{0%,58%{left:-24%}82%,100%{left:124%}}
@media(max-width:640px){.discount-ticker__track{font-size:11.5px;padding:8px 0;gap:42px}}


/* ClasslyOne 4.7 mobile ticker continuity */
@media(max-width:560px){.discount-ticker__track{animation:cloTicker 18s linear infinite!important;font-size:10.8px!important;gap:36px!important}.discount-ticker__track span{padding-left:22px}}

/* Keep portal navigation below the moving offer ticker */
.discount-ticker + .top{top:37px}
@media(max-width:640px){.discount-ticker + .top{top:32px}}

/* ClasslyOne 4.8 — portal mobile overflow protection */
html,body{max-width:100%;overflow-x:clip}
.main,.card,.booking-calculator-grid,.student-booking-form,.student-price-card,.grid,.form{min-width:0;max-width:100%}
.student-price-card h3,.mini-payment-note,.field-hint,.card p,.card strong{overflow-wrap:anywhere;word-break:normal}
@media(max-width:640px){
  .main{width:calc(100% - 16px);margin:18px auto 50px}
  .top{padding:10px 12px;max-width:100%}
  .top nav{width:100%;overflow-x:auto;flex-wrap:nowrap;padding-bottom:3px}
  .top nav a{flex:0 0 auto}
  .card,.login-card,.install{padding:18px 14px;border-radius:20px}
  .booking-calculator-grid{grid-template-columns:minmax(0,1fr);gap:14px}
  .student-booking-form.grid{grid-template-columns:minmax(0,1fr)}
  .student-booking-form .full{grid-column:auto}
  .student-price-card{position:relative;top:auto;width:100%;padding:20px 14px;border-radius:20px;overflow:hidden}
  .student-price-card h3{font-size:clamp(2.5rem,15vw,3.6rem)}
  input,select,textarea{font-size:16px;min-width:0;max-width:100%}
}
@supports not (overflow-x:clip){html,body{overflow-x:hidden}}