/* MATCHSIK enrollment polish v29.6 - micro UX refinement */
body.apply-standalone{-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
body.apply-standalone button,body.apply-standalone a{-webkit-tap-highlight-color:transparent}
body.apply-standalone #appPage .app-title-row{gap:14px!important;align-items:flex-start!important}
body.apply-standalone #appPage .app-title{max-width:760px!important;text-wrap:balance}
body.apply-standalone #appPage .app-desc{margin-top:8px!important;max-width:720px!important;text-wrap:pretty}
body.apply-standalone #appPage .panel-head h3,
body.apply-standalone #appPage .pricing-section-head h4,
body.apply-standalone #appPage .schedule-detail-head h3{letter-spacing:-.045em!important;color:#081c3b!important;text-wrap:balance}
body.apply-standalone #appPage .field>label{font-size:14px!important;font-weight:850!important;color:#193a65!important}
body.apply-standalone #appPage .field>small,
body.apply-standalone #appPage .input-help{font-size:12px!important;line-height:1.55!important;color:#73869e!important}
body.apply-standalone #appPage .choice-card,
body.apply-standalone #appPage .smart-option,
body.apply-standalone #appPage .smart-round,
body.apply-standalone #appPage .month-card,
body.apply-standalone #appPage .billing-mode-card,
body.apply-standalone #appPage .m2813-teacher-card{will-change:transform;transform:translateZ(0)}
body.apply-standalone #appPage button:focus-visible,
body.apply-standalone #appPage input:focus-visible,
body.apply-standalone #appPage select:focus-visible,
body.apply-standalone #appPage textarea:focus-visible{outline:3px solid rgba(23,103,255,.20)!important;outline-offset:2px!important}

/* Shared surface hierarchy */
body.apply-standalone #appPage .panel,
body.apply-standalone #appPage .pricing-panel,
body.apply-standalone #appPage .schedule-panel,
body.apply-standalone #appPage .quote-card{border:1px solid #dfe8f3!important;box-shadow:0 15px 38px rgba(8,28,59,.075)!important}
body.apply-standalone #appPage .smart-question{border-left-width:3px!important;background:linear-gradient(105deg,#eef6ff 0%,#f8fbff 48%,#fff 100%)!important}
body.apply-standalone #appPage .smart-stepbar{box-shadow:0 8px 22px rgba(8,28,59,.055)!important}
body.apply-standalone #appPage .draft-status{flex:none!important;white-space:nowrap!important}

/* STEP 1: clearer course and target selection */
body.apply-standalone #appPage .choice-card.selected{transform:translateY(-2px)!important}
body.apply-standalone #appPage .choice-card.selected:after{content:"";position:absolute;left:18px;right:18px;bottom:0;height:2px;border-radius:999px;background:#1767ff;animation:applyChoiceLine .24s ease both}
body.apply-standalone #appPage .smart-round.selected{box-shadow:0 9px 20px rgba(23,103,255,.10)!important}
body.apply-standalone #appPage .smart-round-detail{box-shadow:inset 0 1px 0 rgba(255,255,255,.9),0 10px 24px rgba(8,28,59,.055)!important}
body.apply-standalone #appPage .smart-date-input{font-variant-numeric:tabular-nums!important}
@media (min-width:371px) and (max-width:780px){
  body.apply-standalone #appPage .smart-round-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  body.apply-standalone #appPage .smart-round{min-height:70px!important;padding:10px!important}
  body.apply-standalone #appPage .smart-round b{font-size:19px!important}
  body.apply-standalone #appPage .smart-round small{font-size:10px!important}
  body.apply-standalone #appPage .smart-round span{font-size:9px!important;right:8px!important;top:9px!important}
  body.apply-standalone #appPage .smart-round-picker section+section{margin-top:11px!important}
  body.apply-standalone #appPage .smart-custom-date{margin-top:10px!important;min-height:44px!important;font-size:12px!important}
}

/* STEP 2: readable choices with compact vertical density */
body.apply-standalone #appPage .smart-option.selected{box-shadow:inset 3px 0 0 #1767ff,0 6px 16px rgba(23,103,255,.06)!important}
body.apply-standalone #appPage .smart-chip.selected{box-shadow:0 6px 14px rgba(255,104,30,.07)!important}
body.apply-standalone #appPage .smart-hour{font-variant-numeric:tabular-nums!important}
@media (min-width:371px) and (max-width:780px){
  body.apply-standalone #appPage .smart-hours{grid-template-columns:repeat(8,minmax(0,1fr))!important;gap:4px!important}
  body.apply-standalone #appPage .smart-hour{min-height:44px!important;padding:3px 1px!important;border-radius:7px!important}
  body.apply-standalone #appPage .smart-hour b{font-size:15px!important;line-height:1!important}
  body.apply-standalone #appPage .smart-hour span{display:none!important}
  body.apply-standalone #appPage .smart-multi{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:6px!important}
  body.apply-standalone #appPage .smart-chip{min-height:42px!important;padding:8px 10px!important;font-size:11px!important}
  body.apply-standalone #appPage .smart-detail-field+.smart-detail-field{margin-top:14px!important}
}

/* STEP 3: plan, start month and frequency as separate visual decisions */
body.apply-standalone #appPage .pricing-section{position:relative!important}
body.apply-standalone #appPage .pricing-section-head{padding:3px 0 10px!important;border-bottom:1px solid #e5ecf5!important}
body.apply-standalone #appPage .pricing-section-head>div>span{color:#1767ff!important;font-weight:900!important;letter-spacing:.14em!important}
body.apply-standalone #appPage .billing-mode-card{position:relative!important}
body.apply-standalone #appPage .month-card.selected,
body.apply-standalone #appPage .billing-mode-card.selected{transform:translateY(-2px)!important}
body.apply-standalone #appPage .month-card.selected:after,
body.apply-standalone #appPage .billing-mode-card.selected:after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:2px;border-radius:999px;background:#1767ff;animation:applyChoiceLine .24s ease both}
body.apply-standalone #appPage .freq-button.selected{transform:translateY(-1px)!important;box-shadow:0 10px 22px rgba(23,103,255,.16)!important}
body.apply-standalone #appPage .pricing-fact{min-height:64px!important;display:grid!important;align-content:center!important;gap:3px!important}
@media (min-width:371px) and (max-width:780px){
  body.apply-standalone #appPage .month-grid{grid-template-columns:repeat(3,minmax(0,1fr))!important}
  body.apply-standalone #appPage .month-card{min-height:66px!important;padding:9px!important}
  body.apply-standalone #appPage .month-card b{font-size:12px!important}
  body.apply-standalone #appPage .pricing-fact{min-height:58px!important}
}

/* STEP 4: schedule scanning and selected-state clarity */
body.apply-standalone #appPage .slot-toolbar{align-items:center!important}
body.apply-standalone #appPage .slot{transition:transform .16s ease,border-color .16s ease,box-shadow .16s ease!important;min-height:48px!important}
body.apply-standalone #appPage .slot.selected{box-shadow:inset 0 0 0 1px #1767ff,0 7px 16px rgba(23,103,255,.07)!important}
body.apply-standalone #appPage .slot small{font-size:11px!important;line-height:1.35!important}
body.apply-standalone #appPage .selected-slots{gap:6px!important}
body.apply-standalone #appPage .selected-slot{font-size:12px!important;line-height:1.45!important}
body.apply-standalone #appPage .calendar-summary{box-shadow:0 8px 20px rgba(8,28,59,.05)!important}
@media(hover:hover){body.apply-standalone #appPage .slot:not(:disabled):hover{transform:translateY(-2px)!important;box-shadow:0 7px 18px rgba(8,28,59,.07)!important}}

/* STEP 5: compact premium teacher cards */
body.apply-standalone #appPage .m2813-card-top{align-items:center!important}
body.apply-standalone #appPage .m2813-card-avatar{box-shadow:0 6px 16px rgba(8,28,59,.08)!important;border:1px solid #e2eaf4!important}
body.apply-standalone #appPage .m2813-card-avatar img{object-position:center 25%!important}
body.apply-standalone #appPage .m2813-card-top p{margin-top:3px!important;line-height:1.45!important}
body.apply-standalone #appPage .m2813-card-badges{display:flex!important;gap:5px!important;flex-wrap:wrap!important}
body.apply-standalone #appPage .m2813-card-badges span{font-size:11px!important}
body.apply-standalone #appPage .m2813-teacher-card.selected{box-shadow:inset 0 0 0 1px #8fb5ff,0 12px 28px rgba(23,103,255,.08)!important}
@media(max-width:780px){
  body.apply-standalone #appPage .m2813-card-top{grid-template-columns:42px minmax(0,1fr)!important}
  body.apply-standalone #appPage .m2813-card-avatar{width:42px!important;height:42px!important;min-width:42px!important;font-size:16px!important}
  body.apply-standalone #appPage .m2813-card-badges{margin:7px 0!important}
  body.apply-standalone #appPage .m2813-card-actions{gap:6px!important}
}

/* STEP 6: form comfort and iOS zoom prevention */
body.apply-standalone #appPage .form-panel .field-grid{gap:12px!important}
body.apply-standalone #appPage .form-panel .field{min-width:0!important}
body.apply-standalone #appPage .form-panel .control{border-color:#cbd9e9!important;background:#fff!important;min-height:48px!important;transition:border-color .16s ease,box-shadow .16s ease!important}
body.apply-standalone #appPage .form-panel .control:focus{border-color:#6ea2ff!important;box-shadow:0 0 0 3px rgba(23,103,255,.08)!important}
body.apply-standalone #appPage .consent-row{border-radius:9px!important}

/* STEP 7: quote alignment and premium emphasis */
body.apply-standalone #appPage .quote-grid>div{display:grid!important;gap:4px!important}
body.apply-standalone #appPage .quote-breakdown>div{display:grid!important;gap:3px!important}
body.apply-standalone #appPage .quote-total.refined{border-top:1px solid rgba(255,255,255,.08)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)!important}
body.apply-standalone #appPage .final-fee strong{white-space:nowrap!important;font-variant-numeric:tabular-nums!important}
body.apply-standalone #appPage .final-check-grid span{font-size:12px!important;line-height:1.45!important}
body.apply-standalone #appPage .schedule-total-badge{font-variant-numeric:tabular-nums!important}

/* Mobile readability, hierarchy and safe spacing */
@media(max-width:780px){
  body.apply-standalone #stepContent{padding-bottom:96px!important;scroll-padding-bottom:110px!important}
  body.apply-standalone #appPage .app-title-row{gap:8px!important}
  body.apply-standalone #appPage .app-title{font-size:23px!important;line-height:1.16!important}
  body.apply-standalone #appPage .app-desc{font-size:12px!important;line-height:1.55!important;margin-top:5px!important}
  body.apply-standalone #appPage .panel-kicker,
  body.apply-standalone #appPage .step-eyebrow{font-size:10px!important}
  body.apply-standalone #appPage .panel-head h3{font-size:19px!important}
  body.apply-standalone #appPage .field>label{font-size:13px!important}
  body.apply-standalone #appPage .smart-stepbar small{font-size:10px!important}
  body.apply-standalone #appPage .smart-stepbar b{font-size:12px!important}
  body.apply-standalone #appPage .smart-question>span{font-size:9px!important}
  body.apply-standalone #appPage .smart-question>b{font-size:18px!important;line-height:1.28!important}
  body.apply-standalone #appPage .smart-question>small{font-size:12px!important}
  body.apply-standalone #appPage .smart-option{min-height:52px!important}
  body.apply-standalone #appPage input,
  body.apply-standalone #appPage select,
  body.apply-standalone #appPage textarea{font-size:16px!important}
  body.apply-standalone #appPage .quote-plan-badge{max-width:116px!important;text-align:center!important;line-height:1.3!important}
  body.apply-standalone #appPage .smart-nav{left:max(10px,env(safe-area-inset-left))!important;right:max(10px,env(safe-area-inset-right))!important;bottom:max(9px,env(safe-area-inset-bottom))!important;box-shadow:0 15px 38px rgba(8,28,59,.16)!important}
  body.apply-standalone #appPage .smart-nav button{min-height:48px!important}
  body.apply-standalone #appPage .day-tab{min-height:42px!important}
}

@media(max-width:430px){
  body.apply-standalone #appPage .smart-round-head{gap:8px!important}
  body.apply-standalone #appPage .smart-round-head small{max-width:118px!important;line-height:1.35!important}
  body.apply-standalone #appPage .quote-total.refined{padding:15px!important}
  body.apply-standalone #appPage .final-fee strong{font-size:25px!important}
}

@media(max-width:370px){
  body.apply-standalone #appPage .smart-round-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.apply-standalone #appPage .smart-hours{grid-template-columns:repeat(6,minmax(0,1fr))!important;gap:4px!important}
  body.apply-standalone #appPage .smart-hour{min-height:42px!important}
  body.apply-standalone #appPage .smart-hour span{display:none!important}
  body.apply-standalone #appPage .smart-chip{min-height:41px!important;font-size:11px!important}
  body.apply-standalone #appPage .month-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  body.apply-standalone #appPage .app-title{font-size:21px!important}
}

@keyframes applyChoiceLine{from{transform:scaleX(.25);opacity:.2}to{transform:scaleX(1);opacity:1}}

@media(prefers-reduced-motion:reduce){
  body.apply-standalone #appPage .choice-card.selected,
  body.apply-standalone #appPage .month-card.selected,
  body.apply-standalone #appPage .billing-mode-card.selected,
  body.apply-standalone #appPage .freq-button.selected{transform:none!important}
  body.apply-standalone #appPage .choice-card,
  body.apply-standalone #appPage .smart-option,
  body.apply-standalone #appPage .smart-round,
  body.apply-standalone #appPage .slot,
  body.apply-standalone #appPage .m2813-teacher-card{transition:none!important;animation:none!important}
}