:root{color-scheme:light;--navy:#06264c;--blue:#0875bc;--teal:#087e91;--muted:#526781;--line:#dbe5ef;--surface:#f1f6fb;--white:#fff;--error:#a5212c;--radius:18px}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:100px}body{margin:0;color:var(--navy);background:var(--white);font-family:Arial,Helvetica,'Noto Sans TC',sans-serif;font-size:16px;line-height:1.7}a{color:inherit;text-decoration:none}button,input,select{font:inherit}a:focus-visible,button:focus-visible{outline:3px solid var(--blue);outline-offset:4px}header{height:104px;display:flex;align-items:center;justify-content:space-between;padding:12px 4%;gap:24px;background:var(--white);border-bottom:1px solid var(--line)}.brand img{width:210px;height:76px;object-fit:contain}nav{display:flex;gap:32px;font-weight:600;white-space:nowrap}nav a:hover,.text-link:hover{color:var(--blue)}.button{display:inline-flex;align-items:center;justify-content:center;background:var(--navy);color:var(--white);border:0;border-radius:100px;padding:16px 32px;font-weight:700;cursor:pointer;min-height:52px;text-align:center;transition:background 0.16s}.button:hover{background:var(--blue)}.button:disabled{opacity:.6;cursor:wait}.menu{display:none}.hero{position:relative;min-height:610px;overflow:hidden;display:flex;align-items:center}.hero-photo{position:absolute;width:100%;height:100%;object-fit:cover;object-position:center}.hero-content{position:relative;width:62%;padding:64px 4%;background:linear-gradient(90deg,rgba(255,255,255,.97),rgba(255,255,255,.65) 75%,transparent)}.eyebrow{font-size:16px;font-weight:600;color:var(--teal);letter-spacing:.08em;margin:0 0 18px}.hero h1{font-size:clamp(40px,4.9vw,78px);line-height:1.35;font-weight:900;letter-spacing:-.03em;margin:12px 0 22px}.hero h1 span{color:var(--blue)}.hero-sub{font-size:clamp(18px,1.65vw,25px);font-weight:600}.hero-actions{display:flex;align-items:center;gap:32px;margin-top:32px}.hero-actions>.button{font-size:24px;padding:18px 52px}.trust{border-left:1px solid var(--line);padding-left:28px;margin:0;line-height:1.35}.trust strong{display:block;font-size:42px;color:var(--teal)}.trust span{font-weight:600;font-size:18px}.benefits{display:grid;grid-template-columns:repeat(3,1fr);padding:35px 4%;border-bottom:1px solid var(--line);gap:24px}.benefits>div{display:flex;align-items:center;gap:24px;padding-left:20px}.benefits>div+div{border-left:1px solid var(--line)}.glyph{font-size:32px;font-weight:800;color:var(--blue)}.benefits p{margin:0}.benefits strong{font-size:21px;display:block}.benefits p span{display:block;color:var(--muted)}.section{padding:80px 5%}.section-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;gap:20px}h2{font-size:36px;line-height:1.4;margin:0 0 16px}h3{font-size:23px;line-height:1.5;margin:12px 0}p{margin:12px 0}.text-link{color:var(--blue);text-decoration:underline;text-underline-offset:7px;font-weight:600}.course-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:28px;max-width:1120px}.course-card{display:grid;grid-template-columns:40% 60%;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden;transition:box-shadow 0.16s}.course-card:hover{box-shadow:0 12px 32px #06264c16}.course-card>img{width:100%;height:100%;min-height:270px;object-fit:cover}.course-body{padding:28px}.course-body .eyebrow{font-size:14px}.meta{font-size:15px;color:var(--muted)}.story{background:var(--surface);display:grid;grid-template-columns:1fr 1.3fr;gap:8%;font-size:19px}.story h2{font-size:44px}.closing{padding:72px 5%;background:var(--navy);color:var(--white);text-align:center}.closing h2{font-size:42px}.light{background:var(--white);color:var(--navy);margin-top:20px}.light:hover{color:var(--white)}footer{padding:40px 5%;display:grid;grid-template-columns:1fr 1fr;gap:8px 32px;font-size:14px;color:var(--muted)}footer img{width:180px;max-height:65px;object-fit:contain}footer>div{display:flex;gap:20px;flex-wrap:wrap}.page-title{font-size:44px;line-height:1.4;margin:0 0 20px}.intro{color:var(--muted);max-width:750px;margin-bottom:40px;font-size:18px}.plan-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}.plan-card{display:flex;flex-direction:column;padding:32px;border:1px solid var(--line);border-radius:var(--radius);min-height:390px}.plan-card.trial{border:2px solid var(--blue);background:var(--surface)}.plan-card h2{font-size:26px}.plan-card .price{font-size:34px;font-weight:800}.plan-card .button{margin-top:auto}.plan-card ul{padding-left:22px;margin-bottom:28px}.error{color:var(--error)}.booking-layout{display:grid;grid-template-columns:.85fr 1.15fr;gap:6%}.service-image{width:100%;max-height:300px;object-fit:cover;border-radius:var(--radius)}.booking-panel{border:1px solid var(--line);padding:30px;border-radius:var(--radius)}.booking-note{background:var(--surface);padding:22px;margin-top:28px;border-radius:var(--radius)}.pager,.days,.times{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}.days{flex-wrap:nowrap;overflow:auto}.chip{border:1px solid var(--line);background:var(--white);color:var(--navy);padding:10px 18px;border-radius:10px;cursor:pointer;white-space:nowrap}.chip.selected{background:var(--navy);color:var(--white)}.time{padding:8px 15px;background:var(--surface);border-radius:8px}.disabled{opacity:.5;text-decoration:line-through}.mobile-only{display:none}@media(min-width:1600px){.hero{min-height:700px}}@media(max-width:1100px){nav{gap:16px;font-size:14px}.brand img{width:170px}.hero-content{width:67%}.hero h1{font-size:52px}.hero-actions>.button{font-size:20px;padding:16px 32px}.benefits strong{font-size:18px}.plan-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.course-card{display:block}.course-card>img{height:220px;min-height:0}}@media(max-width:760px){header{height:82px;padding:8px 5%}.brand img{width:155px;height:60px}.header-cta{padding:10px 18px;min-height:42px;font-size:14px}.menu{display:block;border:0;background:var(--surface);padding:8px 12px;border-radius:8px;font-size:14px}nav{display:none;position:absolute;top:82px;left:0;right:0;z-index:20;padding:22px 6%;background:var(--white);box-shadow:0 8px 20px #06264c18}nav.open{display:grid;gap:18px;font-size:16px}.hero{min-height:740px;align-items:start;padding-top:290px}.hero-photo{height:370px;object-position:78% center;top:0;object-fit:cover}.hero-content{width:100%;background:linear-gradient(0deg,#fff 82%,rgba(255,255,255,0));padding:55px 6% 35px}.hero h1{font-size:40px}.hero-sub{font-size:18px}.eyebrow{font-size:14px}.mobile-only{display:block}.hero-actions{gap:22px}.hero-actions>.button{padding:14px 28px;font-size:20px}.trust{padding-left:20px}.trust strong{font-size:30px}.trust span{font-size:14px}.benefits{display:block;padding:15px 6%}.benefits>div{padding:18px 0;gap:25px}.benefits>div+div{border-left:0;border-top:1px solid var(--line)}.benefits strong{font-size:19px}.benefits p span{font-size:15px}.section{padding:50px 6%}.section-head{align-items:start;flex-direction:column}.section h2{font-size:30px}.course-grid,.story,.plan-grid,.booking-layout{grid-template-columns:1fr}.course-card{display:grid;grid-template-columns:34% 66%}.course-card>img{height:100%;min-height:240px}.course-body{padding:22px 18px}.course-body h3{font-size:21px}.story{gap:20px;font-size:17px}.story h2{font-size:34px}.closing{padding:50px 6%}.closing h2{font-size:30px}footer{grid-template-columns:1fr;padding:32px 6%}.page-title{font-size:34px}.booking-panel{padding:22px;margin-top:30px}.plan-card{padding:26px;min-height:350px}.intro{font-size:16px}.booking-note .button{width:100%;padding:14px 18px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.reading{max-width:800px;font-size:19px}.about-photo{width:100%;height:340px;object-fit:cover;object-position:right;border-radius:18px}.feature-grid,.review-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;margin-top:36px}.feature-grid article,.review-card{margin:0;padding:30px;border:1px solid var(--line);border-radius:18px;background:var(--white)}.feature-grid h2{font-size:26px}.review-card blockquote{margin:0 0 28px;font-size:18px}.review-card figcaption{display:flex;flex-direction:column}.review-card figcaption span{font-size:14px;color:var(--muted)}.faq-list{max-width:950px}.faq-list details{border-bottom:1px solid var(--line);padding:22px 0}.faq-list summary{font-size:20px;font-weight:700;cursor:pointer;padding:6px}.faq-list summary:focus-visible{outline:3px solid var(--blue)}.faq-list details p{padding:8px 6px;max-width:850px;color:var(--muted)}.resource-list{max-width:850px}.resource-list article{padding:32px 0;border-bottom:1px solid var(--line)}.example{background:var(--surface);padding:24px;border-left:4px solid var(--blue);font-family:inherit;letter-spacing:normal}nav a[aria-current]{color:var(--blue)}@media(max-width:1000px){.feature-grid,.review-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:760px){.feature-grid,.review-grid{grid-template-columns:1fr}.about-photo{height:260px}.reading{font-size:17px}.faq-list summary{font-size:18px}}
.course-visual{display:flex;flex-direction:column;align-items:center;justify-content:center;background:linear-gradient(140deg,#dfeffa,#f6f9fc);min-height:250px;color:var(--blue)}.course-visual strong{font-size:72px;line-height:1.2}.course-visual span{font-weight:600}@media(max-width:1100px){.course-visual{min-height:200px}}@media(max-width:760px){.course-visual{min-height:240px}.course-visual strong{font-size:48px}.course-visual span{font-size:12px}}/* Shared motion and the two stages of the one-to-one course. */
header{position:sticky;top:0;z-index:30;background:#fffffff5;backdrop-filter:blur(14px)}.hero{min-height:660px}.hero-detail{font-size:18px;color:var(--muted);line-height:1.9}.hero-content{width:65%;padding-top:45px;padding-bottom:50px}.hero-sub{font-size:24px}.credential-line{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.credential-line span{padding:8px 13px;border:1px solid #bfd4e6;border-radius:100px;font-size:14px;font-weight:600}.course-grid{display:block;max-width:none}.unified-course{display:block;padding:0;max-width:none}.journey-card{border:1px solid var(--line);border-radius:18px;overflow:hidden}.journey-heading{padding:34px 38px;background:linear-gradient(110deg,#eaf4fb,#f5f9fc)}.journey-heading h3,.journey-heading h2{font-size:32px;margin:0}.journey-heading p{max-width:780px}.course-options{display:grid;grid-template-columns:1fr 1fr;gap:0}.course-options>article{padding:34px 38px}.course-options>article+article{border-left:1px solid var(--line)}.course-options .button{margin-top:16px}.plan-grid{margin-top:35px}.motion-toggle{background:transparent;border:0;color:var(--muted);padding:0;cursor:pointer;text-decoration:underline;text-underline-offset:5px;font-size:14px}.reading-progress{height:3px;background:var(--blue);position:fixed;top:0;left:0;width:100%;transform:scaleX(0);transform-origin:left;z-index:99;pointer-events:none}.button{position:relative;overflow:hidden;transition:background 0.2s,transform 0.2s,box-shadow 0.2s}.button:hover{transform:translateY(-3px);box-shadow:0 8px 18px #06264c20}.button:active{transform:translateY(0) scale(.98)}.button::after{content:'';position:absolute;inset:-40% -80%;background:linear-gradient(100deg,transparent 42%,#ffffff26 50%,transparent 58%);transform:translateX(-90%);pointer-events:none}.button:hover::after{animation:button-sheen 0.56s ease}.feature-grid article,.review-card,.plan-card{transition:transform 0.24s,box-shadow 0.24s,border-color 0.24s}.feature-grid article:hover,.review-card:hover,.plan-card:hover{transform:translateY(-6px);box-shadow:0 18px 40px #06264c12;border-color:#99bfdc}.hero-content>*{animation:rise-in 0.64s cubic-bezier(.2,.7,.2,1) both}.hero-content h1{animation-delay:0.064s}.hero-content .hero-sub{animation-delay:0.128s}.hero-content .hero-detail{animation-delay:0.192s}.hero-content .hero-actions{animation-delay:0.256s}.hero-photo{transform:translateY(var(--hero-offset,0px)) scale(1.035);transition:transform 0.08s linear;animation:portrait-enter 1.12s ease both}.hero::after{content:'';position:absolute;bottom:0;left:0;height:3px;width:100%;background:linear-gradient(90deg,#0875bc00,#0875bc80,#87d4e6,#0875bc00);background-size:200% 100%;animation:ambient-line 7.2s ease-in-out infinite;pointer-events:none}.is-revealed{animation:rise-in 0.56s cubic-bezier(.2,.7,.2,1) var(--reveal-delay,0ms) both}.faq-list details[open] p{animation:rise-in 0.28s ease}.faq-list summary{transition:color 0.16s}.faq-list summary:hover,.faq-list details[open] summary{color:var(--blue)}nav a{position:relative}nav a::after{content:'';height:2px;position:absolute;bottom:-7px;left:0;width:100%;background:var(--blue);transform:scaleX(0);transform-origin:left;transition:transform 0.2s}nav a:hover::after,nav a[aria-current]::after{transform:scaleX(1)}@view-transition{navigation:auto}::view-transition-old(root){animation:page-out 0.16s ease}::view-transition-new(root){animation:page-in 0.24s ease}@keyframes rise-in{from{opacity:0;transform:translateY(22px)}to{opacity:1;transform:translateY(0)}}@keyframes portrait-enter{from{opacity:.65;filter:blur(3px)}to{opacity:1;filter:blur(0)}}@keyframes button-sheen{to{transform:translateX(90%)}}@keyframes ambient-line{0%,100%{background-position:0 50%}50%{background-position:100% 50%}}@keyframes page-out{to{opacity:0}}@keyframes page-in{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}body[data-motion='off'] *,body[data-motion='off'] *::after{animation:none!important;transition:none!important}body[data-motion='off'] .hero-photo{transform:none}body[data-motion='off'] .button:hover,body[data-motion='off'] .feature-grid article:hover,body[data-motion='off'] .review-card:hover,body[data-motion='off'] .plan-card:hover{transform:none}.motion-toggle:focus-visible{outline:3px solid var(--blue);outline-offset:5px}@media(max-width:1100px){.hero-content{width:70%}.hero-sub{font-size:20px}.hero-detail{font-size:16px}}@media(max-width:760px){.hero{min-height:840px}.hero-content{width:100%;padding:55px 6% 38px}.hero-content h1{font-size:38px}.hero-sub{font-size:19px}.hero-detail{font-size:16px}.hero-actions{gap:18px}.hero-actions>.button{font-size:19px;padding:14px 24px}.course-options{grid-template-columns:1fr}.course-options>article{padding:28px 24px}.course-options>article+article{border-left:0;border-top:1px solid var(--line)}.journey-heading{padding:28px 24px}.journey-heading h3,.journey-heading h2{font-size:28px}.credential-line{gap:8px}.hero-photo{transform:none}.hero .eyebrow{letter-spacing:.02em}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.hero-photo{transform:none}::view-transition-old(root),::view-transition-new(root){animation:none!important}}
/* Keep the portrait's head inside the frame on wide displays. */
.hero-photo{object-position:center top;transform:none;transition:opacity 0.24s}.about-photo{object-position:right top}@media(min-width:761px){.hero{min-height:max(660px,36vw)}}@media(max-width:760px){.hero-photo{object-position:78% top}}
@media(min-width:761px){.hero-photo{width:72%;height:100%;right:0;top:0;object-fit:contain;object-position:right bottom}.about-photo{height:auto;aspect-ratio:1672/941;object-fit:contain}}
.brand-logo{position:relative;display:block;width:210px;height:76px}.brand-logo .brand-fallback,.brand-writing{position:absolute;inset:0;width:100%;height:100%;object-fit:contain}.brand-writing{display:none}.motion-ready[data-motion='on'] .brand-writing{display:block}.motion-ready[data-motion='on'] .brand-fallback{visibility:hidden}.pen-stroke{stroke-dasharray:1;stroke-dashoffset:1}.motion-ready[data-motion='on'] .pen-stroke{animation:logo-write var(--pen-duration) linear var(--pen-delay) forwards}.signature-finish{opacity:0}.motion-ready[data-motion='on'] .signature-finish{animation:signature-complete 0.12s linear 2.64s forwards}@keyframes logo-write{to{stroke-dashoffset:0}}@keyframes signature-complete{to{opacity:1}}.student-login{font-weight:700;font-size:15px;white-space:nowrap;color:var(--blue)}.student-login:hover{text-decoration:underline;text-underline-offset:6px}.login-panel{display:flex;align-items:center;justify-content:space-between;gap:30px;background:var(--surface);border-radius:18px;padding:30px;margin:0 0 35px}.login-panel h2{font-size:26px}.login-panel p{max-width:650px}.login-panel>.button{flex-shrink:0}header{transition:box-shadow 0.28s,background 0.28s}header.is-scrolled{box-shadow:0 8px 28px #06264c0f;background:#fffffff9}.hero::after{animation:ambient-line 3.6s ease-in-out 1}.section-head .text-link{transition:transform 0.24s}.section-head .text-link:hover{transform:translateX(5px)}.feature-grid .glyph{display:inline-block;transition:transform 0.32s}.feature-grid article:hover .glyph{transform:rotate(-5deg) scale(1.12)}.plan-card .price{transform-origin:left;transition:transform 0.24s,color 0.24s}.plan-card:hover .price{transform:scale(1.035);color:var(--blue)}.closing{position:relative;overflow:hidden;background:linear-gradient(120deg,#06264c,#0c3d68);background-size:180% 180%}.closing:has(.is-revealed){animation:closing-wash 3.2s ease both}.time{animation:slot-in 0.2s ease both}.chip{transition:background 0.16s,transform 0.16s}.chip:hover{transform:translateY(-2px);background:#e8f2fa}.chip.selected:hover{background:var(--navy)}nav.open{animation:menu-open 0.24s ease both}.faq-list details[open]{border-color:var(--blue)}.hero-content h1 span{display:inline-block;animation:headline-blue 1.44s ease 0.24s both}@keyframes headline-blue{from{color:#06264c;transform:translateY(5px)}to{color:#0875bc;transform:translateY(0)}}@keyframes slot-in{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:translateY(0)}}@keyframes menu-open{from{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@keyframes closing-wash{from{background-position:0 50%}to{background-position:100% 50%}}@media(max-width:1100px){.brand-logo{width:170px}}@media(max-width:760px){header{gap:12px}.brand-logo{width:155px;height:60px}.header-cta{display:none}.student-login{margin-left:auto;font-size:14px}.menu{padding:8px}.login-panel{display:block;padding:24px}.login-panel>.button{margin-top:12px}.brand-logo .brand-fallback{width:100%;height:100%}}@media(prefers-reduced-motion:reduce){.brand-writing{display:none!important}.brand-fallback{visibility:visible!important}.hero-content h1 span{animation:none}}
/* Short, ordered motion shared across pages. */
:root{--motion-ease:cubic-bezier(.22,1,.36,1)}.motion-ready[data-motion='on'] .motion-pending{opacity:0}.is-revealed{animation-duration:0.384s;animation-timing-function:var(--motion-ease)}.hero-content>*{animation-duration:0.496s;animation-timing-function:var(--motion-ease)}.hero-photo{animation-name:portrait-soft;animation-duration:0.52s;animation-timing-function:ease-out}@keyframes portrait-soft{from{opacity:0}to{opacity:1}}.hero-content h1 span{animation-duration:0.56s}.feature-grid article,.review-card,.plan-card,.button,.chip{transition-duration:0.176s;transition-timing-function:var(--motion-ease)}.feature-grid article:hover,.review-card:hover,.plan-card:hover{transform:translateY(-4px)}.button:hover{transform:translateY(-2px)}.button:active{transform:scale(.98)}.button:hover::after{animation-duration:0.36s}.course-option,.course-options>article{transition:background 0.176s ease}.course-option:hover,.course-options>article:hover{background:#f6faff}.plan-card .price{transition-duration:0.176s}.faq-list details[open] p{animation-duration:0.224s;animation-timing-function:var(--motion-ease)}nav.open{animation-duration:0.176s}.time{animation-duration:0.144s}.chip.selected{animation:chip-select 0.144s ease-out}.days{animation:dates-enter 0.16s ease-out}.text-link{transition:color 0.144s,text-underline-offset 0.144s}.text-link:hover{text-underline-offset:9px}.student-login{transition:color 0.144s}.student-login:active{opacity:.75}header{transition-duration:0.192s}::view-transition-old(root){animation-duration:0.128s}::view-transition-new(root){animation-duration:0.192s}@keyframes chip-select{from{transform:scale(.96)}to{transform:scale(1)}}@keyframes dates-enter{from{opacity:.5;transform:translateY(4px)}to{opacity:1;transform:translateY(0)}}body[data-motion='off'] .motion-pending{opacity:1}@media(prefers-reduced-motion:reduce){.motion-pending{opacity:1!important}}
.motion-ready.signature-seen .brand-writing{display:none}.motion-ready.signature-seen .brand-fallback{visibility:visible}.signature-seen .pen-stroke,.signature-seen .signature-finish{animation:none!important}
/* Cinematic page entrances and responsive depth. */
:root{--motion-ease:cubic-bezier(.16,1,.3,1)}.headline-mask{display:block;overflow:hidden;perspective:900px;padding-bottom:.08em;margin-bottom:-.08em}.headline-line{display:block;transform-origin:center bottom}.hero-content h1,.hero-content h1 span{animation:none}.hero h1 span{color:inherit}.hero h1 .headline-line>span{color:var(--blue)}.headline-active .headline-line{animation:headline-unfold 0.92s var(--motion-ease) var(--line-delay,0ms) both}.is-revealed{animation-name:cinematic-rise;animation-duration:0.76s;animation-timing-function:var(--motion-ease)}.is-revealed.card-entry{animation-name:card-arrival;animation-duration:0.84s}.hero-content>.eyebrow{animation-duration:0.76s}.hero-content>.hero-sub{animation-duration:0.84s;animation-delay:0.32s}.hero-content>.hero-detail{animation-duration:0.84s;animation-delay:0.48s}.hero-content>.hero-actions{animation-duration:0.88s;animation-delay:0.64s}.hero-photo{animation-duration:1s;animation-delay:0.12s}.benefits{perspective:1200px}.feature-grid,.review-grid,.plan-grid,.course-options{perspective:1400px}.feature-grid article,.review-card,.plan-card{position:relative;isolation:isolate;overflow:hidden;transition:transform 0.4s var(--motion-ease),box-shadow 0.4s,border-color 0.32s,background 0.32s}.feature-grid article::before,.review-card::before,.plan-card::before{content:'';position:absolute;inset:0;background:radial-gradient(350px circle at var(--spot-x,50%) var(--spot-y,0%),#54b5e427,transparent 65%);opacity:0;transition:opacity 0.36s;pointer-events:none;z-index:-1}.feature-grid article:hover::before,.review-card:hover::before,.plan-card:hover::before{opacity:1}.feature-grid article:hover,.review-card:hover,.plan-card:hover{box-shadow:0 24px 55px #06264c20;border-color:#73b2da}.plan-card:hover .price{transform:scale(1.08);transition-duration:0.36s}.button{transition:transform 0.32s var(--motion-ease),translate 0.32s var(--motion-ease),background 0.24s,box-shadow 0.32s}.button:hover{transform:translateY(-5px);box-shadow:0 14px 28px #06264c30}.button:hover::after{animation-duration:0.64s}.section h2{position:relative}.section-head h2::after,.story h2::after{content:'';display:block;width:82px;height:4px;border-radius:4px;background:linear-gradient(90deg,var(--blue),#69c4e5);margin-top:18px;transform-origin:left}.is-revealed h2::after,.is-revealed.section-head h2::after{animation:accent-draw 0.72s var(--motion-ease) 0.24s both}.story{position:relative;overflow:hidden}.story::after{content:'';position:absolute;width:360px;height:360px;right:-180px;top:-180px;border:1px solid #0875bc25;border-radius:50%;box-shadow:0 0 0 45px #0875bc05,0 0 0 90px #0875bc03;pointer-events:none}.closing{background:linear-gradient(120deg,#06264c,#0d4d7e,#06264c);background-size:220% 220%}.closing:has(.is-revealed){animation:closing-wash 3.04s ease both}.closing h2{position:relative}.closing .button:hover{box-shadow:0 16px 42px #75c5f347}.reading-progress{height:4px;box-shadow:0 0 12px #0875bc50}.faq-list details[open] p{animation:faq-unfold 0.44s var(--motion-ease) both}.faq-list details{transition:border-color 0.32s,background 0.32s}.faq-list details[open]{background:#f7fbff}.time{animation:slot-in 0.32s var(--motion-ease) both}.days{animation:dates-enter 0.4s var(--motion-ease)}nav.open{animation:menu-open 0.4s var(--motion-ease) both}::view-transition-old(root){animation:page-exit 0.304s ease both}::view-transition-new(root){animation:page-reveal 0.52s var(--motion-ease) both}
@keyframes headline-unfold{from{opacity:0;transform:translateY(115%) rotateX(-18deg)}to{opacity:1;transform:translateY(0) rotateX(0)}}@keyframes cinematic-rise{from{opacity:0;transform:translateY(48px)}to{opacity:1;transform:translateY(0)}}@keyframes card-arrival{from{opacity:0;transform:translateY(58px) rotateX(7deg) scale(.96)}to{opacity:1;transform:translateY(0) rotateX(0) scale(1)}}@keyframes accent-draw{from{transform:scaleX(0)}to{transform:scaleX(1)}}@keyframes faq-unfold{from{opacity:0;transform:translateY(-15px)}to{opacity:1;transform:translateY(0)}}@keyframes page-exit{to{opacity:0;transform:translateY(-10px)}}@keyframes page-reveal{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}
@media(hover:hover) and (pointer:fine){.interactive-card:hover{transform:perspective(1200px) rotateX(var(--tilt-x,0deg)) rotateY(var(--tilt-y,0deg)) translateY(-9px)}.magnetic-button{translate:var(--magnet-x,0px) var(--magnet-y,0px)}}@media(max-width:760px){.is-revealed{animation-duration:0.64s}.is-revealed.card-entry{animation-duration:0.68s}.headline-active .headline-line{animation-duration:0.76s}.story::after{width:220px;height:220px;right:-140px;top:-140px}}body[data-motion='off'] .headline-line{opacity:1;transform:none}body[data-motion='off'] .interactive-card:hover,body[data-motion='off'] .magnetic-button{transform:none;translate:none}@media(prefers-reduced-motion:reduce){.headline-line{opacity:1!important;transform:none!important}.interactive-card:hover,.magnetic-button{transform:none!important;translate:none!important}::view-transition-old(root),::view-transition-new(root){animation:none!important}}
/* One entrance timeline: rows left-to-right, then top-to-bottom. */
.motion-ready .hero-content>*{animation:none}.motion-ready .hero-photo{animation:none}.motion-ready .hero-content>*.is-revealed{animation:cinematic-rise 0.76s var(--motion-ease) var(--reveal-delay,0ms) both}.motion-ready .hero-content>h1.is-revealed,.is-revealed.page-title{animation:none}.headline-active .headline-line{animation-delay:calc(var(--reveal-delay,0ms) + var(--line-delay,0ms))}.motion-ready .hero-photo.is-revealed{animation:portrait-soft 1s ease-out var(--reveal-delay,0ms) both}.is-revealed h2::after,.is-revealed.section-head h2::after{animation-delay:calc(var(--reveal-delay,0ms) + 240ms)}

.hero-secondary{display:inline-block;margin-top:20px}.hero-actions{flex-wrap:wrap;gap:24px}.hero-actions>.button{font-size:21px;padding:18px 30px}.hero h1{font-size:clamp(36px,4.1vw,65px)}@media(max-width:760px){.hero-actions>.button{font-size:18px;padding:15px 24px}.hero h1{font-size:36px}}
.motion-ready main h1.headline-active .headline-line{animation:headline-unfold 0.92s var(--motion-ease) calc(var(--reveal-delay,0ms) + var(--line-delay,0ms)) both}.hero-content h1 .headline-mask,.hero-content h1 .headline-line{display:block}@media(max-width:760px){.motion-ready main h1.headline-active .headline-line{animation-duration:0.76s}}body[data-motion='off'] main h1.headline-active .headline-line{animation:none}

.auth-section{max-width:750px}.auth-card{padding:clamp(24px,5vw,48px);border:1px solid var(--line,#dce5ef);border-radius:24px;background:#fff;box-shadow:0 20px 70px #07356910}.auth-tabs{display:flex;gap:12px;margin-bottom:28px}.auth-card label{display:block;font-weight:600;margin:18px 0}.auth-card input{display:block;box-sizing:border-box;width:100%;padding:14px 16px;margin-top:8px;border:1px solid #bacada;border-radius:12px;background:#f9fbfe;color:#082248;font:inherit}.auth-card input:focus{outline:2px solid #258fe0;outline-offset:2px}.auth-card [hidden]{display:none}.auth-card button:disabled{opacity:.6;cursor:wait}.member-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:20px}.member-card{padding:26px;border:1px solid #dce5ef;border-radius:20px;background:#fff}.member-card h3{margin:0 0 12px}.account-actions{display:flex;gap:18px;align-items:center;margin:24px 0}.member-records{margin:36px 0}.member-records li{padding:18px;border-bottom:1px solid #dce5ef;list-style:none}.member-records ul{padding:0}.member-card p{overflow-wrap:anywhere}

.social-logins{display:grid;gap:12px}.google-login,.facebook-login{display:flex;width:100%;justify-content:center;align-items:center;gap:14px;padding:15px 22px;min-height:54px;background:#fff;color:#1f2937;border:1px solid #b7c5d5;border-radius:12px;font-weight:600;cursor:pointer;transition:box-shadow 0.2s,border-color 0.2s}.google-login:hover{border-color:#4285f4;box-shadow:0 5px 18px #4285f41a}.facebook-login:hover{border-color:#1877f2;box-shadow:0 5px 18px #1877f21a}.google-icon,.facebook-icon{display:block;width:20px;height:20px;object-fit:contain;flex:0 0 20px}.auth-divider{display:flex;align-items:center;gap:16px;color:#526781;margin:24px 0;font-size:14px}.auth-divider:before,.auth-divider:after{content:'';flex:1;height:1px;background:#dce5ef}

.booking-details:empty{display:none}.booking-details{border-top:1px solid #dce5ec;margin-top:28px;padding-top:24px;animation:cinematic-rise 0.56s both}.booking-form{display:grid;gap:16px}.booking-form label{display:grid;gap:7px}.booking-form input,.booking-form textarea{width:100%;padding:12px;border:1px solid #b9c8d3;border-radius:10px;background:#fff;color:#102c46;font:inherit}.times button.time{cursor:pointer;font:inherit}.times .time.selected{background:#123f68;color:white;border-color:#123f68}.booking-form button:disabled{opacity:.55;cursor:wait}.booking-form input:focus-visible,.times button:focus-visible{outline:3px solid #51b7ee;outline-offset:3px}.booking-status{color:#b33b30}

/* Student scheduling dashboard */

#student-dashboard{--ej-bg:#f5f6fa;--ej-surface:#ffffff;--ej-ink:#172d4e;--ej-soft:#edf2f8;--ej-muted:#687487;--ej-line:#e1e6ed;--ej-navy:#1d365d;--ej-on-navy:#ffffff;--ej-green:#2d735c;--ej-green-bg:#edf6f1;--ej-warm:#a25e15;--ej-warm-bg:#fff4e4;font:14px/1.5 Arial,Helvetica,'Segoe UI','Microsoft JhengHei',sans-serif;color:var(--ej-ink);background:var(--ej-bg);border-radius:16px;overflow:hidden;color-scheme:light}
#student-dashboard *{box-sizing:border-box}#student-dashboard [hidden]{display:none!important}#student-dashboard h1,#student-dashboard h2,#student-dashboard h3,#student-dashboard p{margin:0}#student-dashboard h1{font-size:27px;font-weight:500;letter-spacing:.02em}#student-dashboard h2{font-size:20px;font-weight:500}#student-dashboard h3{font-size:15px;font-weight:500}#student-dashboard strong{font-weight:500}#student-dashboard button,#student-dashboard input,#student-dashboard select{font:inherit}#student-dashboard button{color:inherit;border:0;background:none;display:inline-flex;justify-content:center;align-items:center;gap:8px;min-height:38px;border-radius:8px;padding:8px 12px}#student-dashboard button:disabled{opacity:.45}#student-dashboard button:hover:not(:disabled){filter:brightness(.96)}#student-dashboard button:focus-visible,#student-dashboard select:focus-visible{outline:2px solid var(--ej-green);outline-offset:3px}#student-dashboard .ej-primary{background:var(--ej-navy);color:var(--ej-on-navy)}#student-dashboard .ej-secondary,#student-dashboard .ej-small{border:1px solid var(--ej-line);background:var(--ej-surface)}#student-dashboard .ej-link{padding:0;font-size:12px}#student-dashboard .ej-full{width:100%}#student-dashboard .ej-icon{padding:4px 10px;min-width:36px;font-size:23px}#student-dashboard .ej-muted{color:var(--ej-muted)}#student-dashboard .ej-row{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}#student-dashboard .ej-header{display:flex;justify-content:space-between;align-items:center;padding:20px 32px;background:var(--ej-surface);border-bottom:1px solid var(--ej-line)}#student-dashboard .ej-brand{font-size:16px;letter-spacing:.17em;font-weight:500}#student-dashboard .ej-brand span{margin-left:7px;color:var(--ej-muted)}#student-dashboard .ej-header-end{display:flex;gap:16px;align-items:center;padding-right:75px}#student-dashboard .ej-avatar{background:var(--ej-soft);border-radius:50%;padding:7px 12px}#student-dashboard .ej-demo{font-size:11px;color:var(--ej-muted)}#student-dashboard main{padding:28px 32px;position:relative}#student-dashboard .ej-welcome{display:flex;justify-content:space-between;align-items:center;gap:16px;margin-bottom:25px}#student-dashboard .ej-eyebrow{font-size:11px;letter-spacing:.12em;color:var(--ej-muted)}#student-dashboard .ej-welcome p{margin-top:6px}#student-dashboard .ej-zone{font-size:12px;display:flex;align-items:center;gap:7px;color:var(--ej-muted)}#student-dashboard .ej-top{display:grid;grid-template-columns:1.55fr 1fr;gap:18px}#student-dashboard .ej-next,#student-dashboard .ej-balance{padding:22px 24px;border-radius:14px;background:var(--ej-surface);border:1px solid var(--ej-line)}#student-dashboard .ej-next{border-top:3px solid var(--ej-navy)}#student-dashboard .ej-tag{font-size:11px;background:var(--ej-green-bg);color:var(--ej-green);padding:3px 9px;border-radius:5px}#student-dashboard .ej-next-detail{display:flex;gap:23px;align-items:center;padding:18px 0}#student-dashboard .ej-next-detail p{font-size:12px;margin-top:4px}#student-dashboard .ej-date{display:grid;text-align:center;border-right:1px solid var(--ej-line);padding-right:23px;min-width:70px;font-size:12px}#student-dashboard .ej-date strong{font-size:34px;line-height:1.2}#student-dashboard .ej-divider{margin:0 6px;color:var(--ej-line)}#student-dashboard .ej-balance-number{display:flex;align-items:baseline;gap:10px;margin:9px 0 8px}#student-dashboard .ej-balance-number strong{font-size:42px;line-height:1.2}#student-dashboard .ej-balance-number span{color:var(--ej-muted)}#student-dashboard .ej-balance-info,#student-dashboard .ej-balance>.ej-row{font-size:12px}#student-dashboard hr{border:0;border-top:1px solid var(--ej-line);margin:18px 0}#student-dashboard .ej-tabs{display:flex;gap:22px;border-bottom:1px solid var(--ej-line);margin:25px 0 23px;flex-wrap:wrap}#student-dashboard .ej-tabs button{border-radius:0;border-bottom:2px solid transparent;padding:13px 3px;color:var(--ej-muted)}#student-dashboard .ej-tabs button[aria-pressed=true]{color:var(--ej-ink);border-color:var(--ej-navy)}#student-dashboard .ej-section-head{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:20px;flex-wrap:wrap}#student-dashboard .ej-section-head p{font-size:12px;margin-top:5px}#student-dashboard .ej-book-layout,#student-dashboard .ej-history-layout{display:grid;grid-template-columns:minmax(0,1fr) 235px;gap:18px}#student-dashboard .ej-calendar,#student-dashboard .ej-selection,#student-dashboard .ej-preference-form,#student-dashboard .ej-match-panel{background:var(--ej-surface);border:1px solid var(--ej-line);border-radius:12px;min-width:0}#student-dashboard .ej-calendar-toolbar{display:flex;justify-content:space-between;align-items:center;padding:13px 14px;gap:8px}#student-dashboard .ej-calendar-toolbar .ej-row{gap:6px}#student-dashboard .ej-legend{display:flex;gap:16px;padding:0 19px 13px;font-size:11px;color:var(--ej-muted)}#student-dashboard .ej-legend span{display:flex;gap:5px;align-items:center}#student-dashboard .ej-dot{width:7px;height:7px;border-radius:2px;display:inline-block}#student-dashboard .available{background:var(--ej-green)}#student-dashboard .chosen{background:var(--ej-navy)}#student-dashboard .own{background:var(--ej-warm)}#student-dashboard .ej-calendar-scroll{overflow-x:auto}#student-dashboard .ej-week-grid{display:grid;grid-template-columns:46px repeat(7,minmax(60px,1fr));min-width:466px;border-top:1px solid var(--ej-line);padding-bottom:8px}#student-dashboard .ej-day-head{text-align:center;padding:11px 0;font-size:11px;border-bottom:1px solid var(--ej-line)}#student-dashboard .ej-day-head strong{display:block;font-size:15px;margin-top:2px}#student-dashboard .ej-time{font-size:10px;padding:13px 0;text-align:center;color:var(--ej-muted)}#student-dashboard .ej-cell{border-left:1px solid var(--ej-line);border-bottom:1px solid var(--ej-line);padding:4px;min-height:42px;display:flex;align-items:center;justify-content:center}#student-dashboard .ej-cell .ej-slot{min-height:31px;width:100%;padding:4px 0;font-size:11px;background:var(--ej-green-bg);color:var(--ej-green);border-radius:5px}#student-dashboard .ej-cell .ej-slot[aria-pressed=true]{background:var(--ej-navy);color:var(--ej-on-navy)}#student-dashboard .ej-own-slot{background:var(--ej-warm-bg);color:var(--ej-warm);font-size:10px;padding:6px 2px;text-align:center;border-radius:5px;width:100%}#student-dashboard .ej-unavailable{font-size:11px;color:var(--ej-muted);opacity:.55}#student-dashboard .ej-selection{padding:18px;height:fit-content}#student-dashboard .ej-count{font-size:11px;background:var(--ej-soft);padding:3px 8px;border-radius:4px}#student-dashboard .ej-selected-list{min-height:150px;padding-top:12px}#student-dashboard .ej-selected-item{border-bottom:1px solid var(--ej-line);padding:10px 0;display:flex;justify-content:space-between;align-items:center;font-size:12px}#student-dashboard .ej-selected-item p{color:var(--ej-muted);font-size:11px}#student-dashboard .ej-selected-item button{font-size:17px;min-height:32px;padding:2px 6px}#student-dashboard .ej-selection-total{border-top:1px solid var(--ej-line);padding:15px 0;font-size:12px}#student-dashboard .ej-selection-total .ej-row+.ej-row{margin-top:6px}#student-dashboard .ej-footnote{color:var(--ej-muted);font-size:11px;margin-top:10px;text-align:center}#student-dashboard .ej-empty{text-align:center;color:var(--ej-muted);padding:32px 5px;font-size:12px}#student-dashboard .ej-empty svg{display:block;margin:0 auto 10px;width:22px;height:22px}#student-dashboard .ej-switch{display:flex;border:1px solid var(--ej-line);border-radius:8px;background:var(--ej-surface);padding:3px}#student-dashboard .ej-switch button[aria-pressed=true]{background:var(--ej-soft)}#student-dashboard .ej-month{display:grid;grid-template-columns:repeat(7,minmax(0,1fr))}#student-dashboard .ej-month-head{font-size:11px;text-align:center;padding:10px 0;color:var(--ej-muted);border-bottom:1px solid var(--ej-line)}#student-dashboard .ej-month button{min-height:73px;display:flex;align-items:flex-start;justify-content:flex-start;flex-direction:column;padding:8px;border-radius:0;border-bottom:1px solid var(--ej-line);font-size:12px;gap:6px}#student-dashboard .ej-month button[aria-pressed=true]{background:var(--ej-soft);box-shadow:inset 0 0 0 1px var(--ej-navy)}#student-dashboard .ej-history-mark{font-size:10px;color:var(--ej-green);background:var(--ej-green-bg);padding:2px 4px;border-radius:4px}#student-dashboard .ej-history-mark.upcoming{background:var(--ej-warm-bg);color:var(--ej-warm)}#student-dashboard .ej-record{padding:16px 0;border-bottom:1px solid var(--ej-line)}#student-dashboard .ej-record p{font-size:12px;color:var(--ej-muted);margin-top:5px}#student-dashboard .ej-record .ej-tag{display:inline-block;margin-top:8px}#student-dashboard [data-history-list]{padding:0 20px 20px}#student-dashboard .ej-preference-layout{display:grid;grid-template-columns:1fr 1.3fr;gap:18px}#student-dashboard .ej-preference-form,#student-dashboard .ej-match-panel{padding:22px}#student-dashboard .ej-days{display:flex;gap:7px;margin:18px 0;flex-wrap:wrap}#student-dashboard .ej-days button{background:var(--ej-soft);min-width:32px;padding:6px 9px}#student-dashboard .ej-days button[aria-pressed=true]{background:var(--ej-navy);color:var(--ej-on-navy)}#student-dashboard .ej-form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:14px 0}#student-dashboard label{font-size:12px;display:block}#student-dashboard select{display:block;width:100%;padding:9px;border:1px solid var(--ej-line);border-radius:7px;margin-top:6px;background:var(--ej-surface);color:var(--ej-ink)}#student-dashboard .ej-check{display:flex;gap:8px;align-items:center;margin:16px 0}#student-dashboard input[type=checkbox]{accent-color:var(--ej-navy);width:16px;height:16px}#student-dashboard .ej-match-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:13px 0;border-bottom:1px solid var(--ej-line);font-size:12px}#student-dashboard .ej-match-row p{color:var(--ej-muted);font-size:11px}#student-dashboard .ej-notice{margin-top:18px;padding:12px 16px;background:var(--ej-soft);border-radius:8px;font-size:12px}#student-dashboard .ej-dialog{background:var(--ej-surface);border:1px solid var(--ej-line);box-shadow:0 12px 40px #0002;border-radius:14px;padding:24px;margin-top:20px}#student-dashboard .ej-dialog h2{margin-top:3px}#student-dashboard .ej-occurrence{display:grid;grid-template-columns:minmax(90px,1fr) minmax(80px,1fr) minmax(100px,1fr);gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid var(--ej-line);font-size:12px}#student-dashboard .ej-occurrence label{margin:0;display:flex;gap:7px;align-items:center}#student-dashboard .ej-conflict{color:var(--ej-warm)}#student-dashboard .ej-dialog-footer{margin-top:18px;display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap}#student-dashboard .ej-dialog-note{font-size:12px;color:var(--ej-muted);margin:14px 0}
@media(max-width:760px){#student-dashboard main{padding:20px 16px}#student-dashboard .ej-header{padding:16px}#student-dashboard .ej-header-end{padding-right:75px}#student-dashboard .ej-demo{display:none}#student-dashboard .ej-top{grid-template-columns:1.25fr 1fr}#student-dashboard .ej-next,#student-dashboard .ej-balance{padding:18px 16px}#student-dashboard .ej-book-layout,#student-dashboard .ej-history-layout{grid-template-columns:minmax(0,1fr)}#student-dashboard .ej-selected-list{min-height:0}#student-dashboard .ej-welcome{align-items:flex-start;flex-direction:column}#student-dashboard .ej-tabs{gap:16px}#student-dashboard .ej-preference-layout{grid-template-columns:1fr}#student-dashboard .ej-month button{min-height:65px;padding:6px 3px}#student-dashboard .ej-history-mark{font-size:9px}}
@media(max-width:520px){#student-dashboard .ej-top{grid-template-columns:1fr}#student-dashboard h1{font-size:24px}#student-dashboard h2{font-size:18px}#student-dashboard .ej-tabs{gap:10px}#student-dashboard .ej-tabs button{font-size:12px;gap:5px}#student-dashboard .ej-tabs svg{width:14px}#student-dashboard .ej-form-row{grid-template-columns:1fr}#student-dashboard select{font-size:16px}#student-dashboard .ej-occurrence{grid-template-columns:1fr 1fr}#student-dashboard .ej-occurrence select{grid-column:1/-1}#student-dashboard .ej-dialog{padding:16px}#student-dashboard button{min-height:44px}#student-dashboard .ej-cell .ej-slot{min-height:38px}#student-dashboard .ej-month button{min-height:64px}#student-dashboard .ej-header-end{padding-right:70px}}
/* Live student area: scoped layout, readable controls, native accessible modal. */
.student-account-page{max-width:1200px;margin:0 auto;padding:36px 5% 64px}
#student-dashboard{padding:28px 32px}
#student-dashboard nav.ej-tabs{position:static;display:flex;padding:0;background:transparent;box-shadow:none;z-index:auto;font-size:14px}
#student-dashboard .ej-calendar-status{padding:0 18px 12px;font-size:12px;color:var(--ej-muted)}
#student-dashboard .ej-credit-note{font-size:12px;margin-top:12px}
#student-dashboard input[type=time],#student-dashboard input[type=date]{display:block;width:100%;padding:9px;border:1px solid var(--ej-line);border-radius:7px;margin-top:6px;background:var(--ej-surface);color:var(--ej-ink);font:inherit;min-height:42px}
#student-dashboard input:focus-visible,#student-dashboard a:focus-visible{outline:2px solid var(--ej-green);outline-offset:3px}
#student-dashboard .ej-join{display:inline-flex;align-items:center;justify-content:center;padding:10px 14px;min-height:42px;border-radius:8px;font-size:14px;text-decoration:none}
#student-dashboard .ej-dialog{position:fixed;inset:0;margin:auto;width:min(620px,calc(100% - 32px));max-height:85vh;overflow-y:auto;color:var(--ej-ink)}
#student-dashboard .ej-dialog::backdrop{background:#09233b70;backdrop-filter:blur(3px)}
#student-dashboard .ej-history-mark{font-size:11px}
#student-dashboard .ej-history-mark.canceled{color:var(--ej-muted);background:var(--ej-soft);text-decoration:line-through}
#student-dashboard .ej-error{color:#ad3529}
#student-dashboard .ej-plans-heading{margin-top:24px}
#student-dashboard .ej-empty-next{margin:20px 0 8px}
@media(max-width:760px){.student-account-page{padding:20px 3% 40px}#student-dashboard{padding:20px 16px}#student-dashboard .ej-tabs button{font-size:14px}#student-dashboard .ej-history-mark{font-size:11px}}
@media(max-width:520px){#student-dashboard{padding:20px 12px}#student-dashboard .ej-tabs{gap:12px}#student-dashboard .ej-tabs button{font-size:13px}#student-dashboard input[type=time],#student-dashboard input[type=date]{font-size:16px}#student-dashboard .ej-calendar-toolbar{flex-wrap:wrap}#student-dashboard .ej-cell{padding:3px}}
#student-dashboard .ej-scroll-hint{display:none}#student-dashboard .ej-time{font-size:11px}#student-dashboard .ej-cell .ej-slot{font-size:12px}@media(max-width:760px){#student-dashboard .ej-scroll-hint{display:block;padding:0 18px 10px;font-size:12px;color:var(--ej-muted)}}

/* Calendar orientation and selection conflicts. */
#student-dashboard .ej-week-nav{border:1px solid transparent;background:transparent;color:var(--ej-muted);font-weight:400;min-height:44px;padding:8px 12px;white-space:nowrap}#student-dashboard .ej-week-nav span[aria-hidden]{font-size:19px;line-height:1}#student-dashboard .ej-week-nav:disabled{border-color:var(--ej-line)}#student-dashboard .ej-day-head.ej-today{background:#e8f2ee;color:#225f4a;box-shadow:inset 0 3px 0 #39775f}#student-dashboard .ej-today-label{position:absolute;bottom:5px;left:0;right:0;font-size:10px;font-weight:600}#student-dashboard .ej-cell.ej-today-cell{background:#f0f7f3}#student-dashboard .ej-cell .ej-slot-overlap:disabled{background:#e5e7eb;color:#6b7280;opacity:1;cursor:not-allowed;box-shadow:none;border:1px solid #d1d5db}#student-dashboard .ej-calendar-toolbar>.ej-row{flex:1}#student-dashboard .ej-calendar-toolbar [data-week-label]{text-align:center;flex:1;white-space:nowrap}@media(max-width:520px){#student-dashboard .ej-calendar-toolbar>.ej-row{flex-basis:100%;display:grid;grid-template-columns:auto 1fr auto}#student-dashboard .ej-week-nav{font-size:12px;padding:7px 9px}#student-dashboard .ej-calendar-toolbar>[data-action=today]{margin-left:auto}}

#student-dashboard .ej-day-head{position:relative;height:76px}#student-dashboard .ej-week-nav:hover:not(:disabled){background:var(--ej-soft);color:var(--ej-navy)}#student-dashboard .ej-week-nav:disabled{border-color:transparent}#student-dashboard .ej-today-reveal{animation:ej-today-glow 1.12s ease-out}@keyframes ej-today-glow{0%,45%{background-color:#bcdcca;box-shadow:inset 0 0 0 2px #39775f}25%,70%{background-color:#e0f0e7;box-shadow:inset 0 0 0 1px #80ae96}100%{background-color:#f0f7f3}}@media(prefers-reduced-motion:reduce){#student-dashboard .ej-today-reveal{animation:none;box-shadow:inset 0 0 0 2px #39775f}}

/* Approved Airy week: no prototype data or host controls. */
#student-dashboard{--ring-duration:1200ms;--week-duration:320ms}
#student-dashboard .ej-calendar{padding:16px;border:0;background:var(--ej-surface)}
#student-dashboard .ej-calendar-toolbar{position:relative;display:flex;justify-content:center;padding:0 38px 12px;min-height:76px}
#student-dashboard .ej-calendar-toolbar>.ej-row{flex:0 1 340px;display:grid;grid-template-columns:44px minmax(0,1fr) 44px;gap:6px;flex-basis:340px}
#student-dashboard .ej-calendar-toolbar [data-week-label]{font-size:13px;white-space:normal;line-height:1.6;text-align:center}
#student-dashboard .ej-week-nav{min-width:44px;min-height:44px;padding:6px;color:var(--ej-navy);border:0;border-radius:6px}
#student-dashboard .ej-week-nav span[aria-hidden]{font-size:23px}
#student-dashboard .ej-calendar-toolbar [data-action=today]{position:absolute;right:0;top:17px;min-height:32px;padding:4px 8px;font-size:12px;border-color:var(--ej-line);margin:0}
#student-dashboard .ej-legend{padding:4px 0 8px;flex-wrap:wrap}
#student-dashboard .ej-calendar-status{padding:0!important;min-height:20px}
#student-dashboard .ej-scroll-hint{display:none}
#student-dashboard .ej-calendar-scroll{overflow:clip;display:flow-root;height:auto;max-height:none;position:relative}
#student-dashboard .ej-week-grid{position:relative;width:100%;min-width:0;grid-template-columns:38px repeat(7,minmax(0,1fr));border:0;padding:0;margin-top:10px}
#student-dashboard .ej-day-head{height:76px;padding:7px 0;border:0;font-size:11px;color:var(--ej-muted)}
#student-dashboard .ej-day-head strong{font-size:19px;line-height:22px;margin-top:5px;color:var(--ej-ink)}
#student-dashboard .ej-day-head.ej-today{background:transparent;box-shadow:none;color:var(--ej-muted)}
#student-dashboard .ej-today-label{bottom:6px;font-size:10px;font-weight:400;line-height:16px;color:var(--ej-green)}
#student-dashboard .ej-cell.ej-today-cell{background:transparent}
#student-dashboard .ej-cell{height:40px;min-height:40px;padding:4px 3px;border:0;position:relative}
#student-dashboard .ej-cell .ej-slot{position:relative;z-index:2;min-height:32px;height:32px;padding:3px 0;font-size:11px;border-radius:7px;background:var(--ej-green-bg);color:var(--ej-green)}
#student-dashboard .ej-cell .ej-slot[aria-pressed=true]{background:var(--ej-navy);color:var(--ej-on-navy)}
#student-dashboard .ej-cell .ej-slot-overlap:disabled{background:var(--ej-soft);color:var(--ej-muted);border:0;opacity:.65}
#student-dashboard .ej-cell .ej-own-slot{font-size:10px;min-height:32px;height:32px;padding:2px}
#student-dashboard .ej-unavailable{visibility:hidden}
#student-dashboard .ej-time{height:40px;padding:12px 0;font-size:10px}
#student-dashboard .ej-selected-list{height:auto;max-height:none;overflow:visible;min-height:110px}
#student-dashboard .ej-selected-item{align-items:flex-start;position:relative;padding:12px 24px 12px 0}
#student-dashboard .ej-selected-item>button{position:absolute;right:0;top:12px}
#student-dashboard .ej-selected-date,#student-dashboard .ej-selected-time{display:block;line-height:1.7}
#student-dashboard .ej-selected-date{font-size:11px;color:var(--ej-muted)}
#student-dashboard .ej-selected-time{font-size:14px}
#student-dashboard .ej-clear-actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
#student-dashboard .ej-clear-actions button{min-height:36px;text-decoration:underline;text-underline-offset:3px;color:var(--ej-muted)}
#student-dashboard .ej-week-enter{animation:ej-live-week-slide var(--week-duration) ease-out}
@keyframes ej-live-week-slide{from{transform:translateX(var(--week-offset,9px));opacity:.55}to{transform:translateX(0);opacity:1}}
#student-dashboard .ej-day-head.ej-today-reveal{background:transparent;box-shadow:none;animation:none}
#student-dashboard .ej-today-frame{position:absolute;border:1px solid var(--ej-green);border-radius:10px;pointer-events:none;z-index:3;animation:ej-live-today-frame 1.52s ease-out forwards}
@keyframes ej-live-today-frame{0%{opacity:0;background:transparent}12%{opacity:.7;background:var(--ej-green-bg);box-shadow:0 0 12px #39775f25}40%{opacity:.4;background:transparent}75%{opacity:.13}100%{opacity:0;background:transparent;box-shadow:none}}
#student-dashboard .ej-dialog [data-action=close]{width:44px;height:44px;min-height:44px;flex-shrink:0;border:1px solid var(--ej-line);background:var(--ej-soft);border-radius:9px;font-size:25px;padding:0}
#student-dashboard .ej-weekly-dialog{width:min(540px,calc(100% - 28px))}
#student-dashboard .ej-dialog[open]{animation:ej-live-popup 0.192s cubic-bezier(.16,.85,.3,1)}
#student-dashboard .ej-dialog[open]::backdrop{animation:ej-live-backdrop 0.144s ease-out}
@keyframes ej-live-popup{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:translateY(0) scale(1)}}
@keyframes ej-live-backdrop{from{opacity:0}to{opacity:1}}
#student-dashboard .ej-exit-confirm{max-width:390px}
#student-dashboard .ej-exit-confirm .ej-dialog-footer{justify-content:flex-end}
#student-dashboard .ej-plan-balance{display:flex;gap:12px;align-items:center;padding:12px 0;border-bottom:1px solid var(--ej-line);font-size:12px}
#student-dashboard .ej-starts-now{font-size:12px;color:var(--ej-muted);margin:0 0 18px}
#student-dashboard .ej-start-date{font-size:13px;color:var(--ej-ink);border:1px solid var(--ej-line);background:var(--ej-soft);min-height:36px;margin-left:8px;padding:6px 10px}
#student-dashboard .ej-occurrence{grid-template-columns:minmax(110px,1fr) minmax(0,1.3fr)}
#student-dashboard .ej-week-picker{background:var(--ej-surface);border:1px solid var(--ej-line);border-radius:12px;padding:12px;margin-top:10px;color:var(--ej-ink);animation:ej-live-popup 0.144s ease-out}
#student-dashboard .ej-week-shortcuts{display:flex;gap:8px;margin-bottom:10px}
#student-dashboard .ej-week-shortcuts button{flex:1;background:var(--ej-soft);border:1px solid var(--ej-line);min-height:44px}
#student-dashboard .ej-week-month{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}
#student-dashboard .ej-week-month button{width:44px;min-height:44px}
#student-dashboard .ej-week-days,#student-dashboard .ej-week-choice{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));align-items:center;text-align:center;gap:0}
#student-dashboard .ej-week-days{color:var(--ej-muted);padding:5px 0}
#student-dashboard .ej-week-choice{width:100%;min-height:44px;border:1px solid transparent;border-radius:7px;background:transparent;padding:6px 0;margin:3px 0}
#student-dashboard .ej-week-choice[aria-pressed=true]{background:var(--ej-green-bg);border-color:var(--ej-green);color:var(--ej-green)}
#student-dashboard .ej-week-choice:disabled{opacity:.3}
#student-dashboard .ej-other-month{opacity:.45}
#student-dashboard .pick-effect{animation:ej-floor-press 0.384s cubic-bezier(.16,.75,.3,1)}
#student-dashboard .spark-burst i{position:absolute;left:50%;top:50%;background:var(--spark,#efa72e);box-shadow:0 0 4px #f4c97580;pointer-events:none}
@media(max-width:600px){#student-dashboard .ej-calendar{padding:10px 0}#student-dashboard .ej-calendar-toolbar{padding:0 42px 10px 0;flex-wrap:nowrap}#student-dashboard .ej-calendar-toolbar>.ej-row{flex-basis:100%;grid-template-columns:44px minmax(0,1fr) 44px}#student-dashboard .ej-cell{height:44px;min-height:44px;padding:3px 1px}#student-dashboard .ej-cell .ej-slot{height:38px;min-height:38px;font-size:10px}#student-dashboard .ej-week-grid{grid-template-columns:30px repeat(7,minmax(0,1fr))}#student-dashboard .ej-time{height:44px;font-size:10px}#student-dashboard .ej-cell .ej-own-slot{font-size:9px}#student-dashboard .ej-occurrence{grid-template-columns:1fr}#student-dashboard .ej-occurrence select{grid-column:auto}}
#student-dashboard .spark-burst i{position:absolute;left:50%;top:50%;width:5px;height:2px;background:var(--spark);border-radius:50%;box-shadow:0 0 3px var(--spark);opacity:0;will-change:transform,opacity}
#student-dashboard .impact-bed{position:absolute;left:50%;top:75%;width:1px;height:1px;z-index:1;pointer-events:none;--spark:#efa72e}
#student-dashboard .impact-bed .spark-burst{position:absolute;inset:0;z-index:1}
#student-dashboard .floor-wave{position:absolute;left:0;top:0;width:var(--floor-width,64px);height:26px;border-radius:50%;border:2px solid #d1aa6570;box-shadow:0 0 6px #f4c97540;transform:translate(-50%,-50%);animation:ej-floor-wave var(--ring-duration,680ms) cubic-bezier(.12,.6,.3,1) forwards}
#student-dashboard .wind-arc{position:absolute;left:0;top:0;width:var(--floor-width,64px);height:20px;border-radius:50%;border:1px solid transparent;border-bottom-color:#6c859660;border-top-color:#d4b17850;animation:ej-floor-wind calc(var(--ring-duration,680ms)*.8) ease-out forwards;animation-delay:var(--wind-delay,0ms);opacity:0}
#student-dashboard .impact-dust{position:absolute;left:0;top:0;width:3px;height:3px;border-radius:50%;background:#b5a58a;opacity:0;filter:blur(.5px)}
@media(prefers-reduced-motion:reduce){#student-dashboard .impact-bed{display:none}}
#student-dashboard .floor-wave{height:var(--floor-height,44px);border-radius:10px;animation-name:ej-topdown-wave}
#student-dashboard .impact-bed{top:50%}
#student-dashboard .cancel-effect{animation:ej-cancel-stone 0.24s ease-out;transform:none}
#student-dashboard .cancel-wave{position:absolute;left:0;top:0;width:var(--floor-width,64px);height:var(--floor-height,44px);border:1px solid #809ba980;border-radius:10px;animation:ej-cancel-wave 0.336s ease-out forwards}
#student-dashboard .cancel-dust{position:absolute;left:0;top:0;width:3px;height:2px;border-radius:50%;background:#809ba9;opacity:0}
@keyframes ej-floor-press{0%{transform:translateY(-2px) scale(1.025)}18%{transform:translateY(5px) scale(1.1,.84);box-shadow:0 1px 2px #18354a35}48%{transform:translateY(-1px) scale(.99,1.025)}100%{transform:translateY(0) scale(1)}}
@keyframes ej-floor-wave{0%{transform:translate(-50%,-50%) scale(.7);opacity:0;filter:blur(0)}12%{opacity:.85}55%{opacity:.4;filter:blur(3px)}100%{transform:translate(-50%,-50%) scale(3.2,2.6);opacity:0;filter:blur(7px)}}
@keyframes ej-floor-wind{0%{transform:translate(-50%,-50%) rotate(var(--wind-angle,0deg)) scale(.8);opacity:0;filter:blur(0)}15%{opacity:.7}100%{transform:translate(-50%,-50%) rotate(var(--wind-angle,0deg)) scale(3.8,2.8);opacity:0;filter:blur(3px)}}
@keyframes ej-topdown-wave{0%{transform:translate(-50%,-50%) scale(.9);opacity:0;filter:blur(0)}12%{opacity:.7}100%{transform:translate(-50%,-50%) scale(2.6);opacity:0;filter:blur(6px)}}
@keyframes ej-cancel-stone{0%{box-shadow:inset 0 0 0 1px #8daab9;filter:brightness(1.04)}100%{box-shadow:none;filter:brightness(1)}}
@keyframes ej-cancel-wave{0%{transform:translate(-50%,-50%) scale(1.5);opacity:0;filter:blur(3px)}30%{opacity:.55}100%{transform:translate(-50%,-50%) scale(1);opacity:0;filter:blur(0)}}
/* Final approved impact and Today styles override earlier experiments. */
#student-dashboard .floor-wave{animation:ej-topdown-wave var(--ring-duration) cubic-bezier(.12,.6,.3,1) forwards;height:var(--floor-height,44px);border-radius:10px}
#student-dashboard .impact-bed{top:50%}
#student-dashboard .ej-today-frame{border:1px solid var(--ej-green);animation:ej-live-today-frame 1.52s ease-out forwards}
@media(prefers-reduced-motion:reduce){#student-dashboard .impact-bed{display:none}#student-dashboard .pick-effect,#student-dashboard .cancel-effect,#student-dashboard .ej-week-enter,#student-dashboard .ej-dialog[open],#student-dashboard .ej-dialog[open]::backdrop,#student-dashboard .ej-week-picker{animation:none}#student-dashboard .ej-today-frame{animation:ej-live-today-frame 0.48s linear forwards;background:transparent!important;box-shadow:none!important}}

/* Mobile and tablet hardening across every public page and student screen. */
main,section,article,aside,form,.course-body,.booking-panel,.auth-card{min-width:0}
img{max-width:100%}
button,a,input,select,textarea{touch-action:manipulation}
.auth-card,.booking-details,.booking-note,.member-card,.review-card{overflow-wrap:anywhere}
@media(max-width:1100px){
 header{height:82px;padding:8px 4%;gap:12px}
 header .brand{flex:0 0 auto}
 header .brand-logo{width:170px;height:60px}
 header .header-cta{display:none}
 header .student-login{margin-left:auto;min-height:44px;display:inline-flex;align-items:center}
 header .menu{display:inline-flex;align-items:center;justify-content:center;flex:0 0 48px;min-width:48px;min-height:44px;padding:8px;white-space:nowrap;border:0;border-radius:8px;background:var(--surface);font-size:14px}
 header>nav{display:none;position:absolute;top:100%;left:0;right:0;padding:16px 5%;background:var(--white);box-shadow:0 8px 20px #06264c18;max-height:calc(100dvh - 82px);overflow-y:auto;white-space:normal}
 header>nav.open{display:grid;gap:4px;font-size:16px}
 header>nav a{display:flex;align-items:center;min-height:44px;padding:6px 8px}
 header>nav a::after{bottom:0}
}
@media(max-width:760px){
 header{gap:8px;padding-inline:4%}
 header .brand-logo{width:140px}
 header .student-login{font-size:13px}
 .section,.closing{padding-inline:5%}
 .page-title,.section h2,.journey-heading h2,.journey-heading h3{overflow-wrap:anywhere}
 .login-panel,.auth-card,.booking-panel,.booking-note{padding:20px}
 .social-logins button{padding:12px 10px;gap:10px;font-size:15px}
 .auth-tabs{flex-wrap:wrap}
 input,select,textarea,.auth-card input,.booking-form input,.booking-form textarea{font-size:16px;min-height:44px;max-width:100%}
 .chip,.time,.times button.time{min-height:44px}
 .pager{display:flex;justify-content:space-between;gap:8px}
 .pager .chip{flex:1;padding:10px 8px;white-space:normal}
 .days{display:flex;flex-wrap:wrap;overflow:visible;gap:8px}
 .days .chip{flex:1 1 calc(33.333% - 8px);padding:10px 7px;font-size:14px;text-align:center}
 .times{gap:8px}
 .times .time{flex:0 1 calc(33.333% - 6px);padding:8px 4px;text-align:center}
 .button{max-width:100%;white-space:normal;overflow-wrap:anywhere}
 .plan-card{min-height:0;gap:12px}
 .plan-card .button,.auth-card form>.button,.booking-form>.button{width:100%}
 .plan-card ul{margin-block:8px 20px}
 .account-actions,.login-panel{flex-wrap:wrap}
 footer>div{gap:4px 16px}
 footer>div a{min-height:44px;display:inline-flex;align-items:center}
 #student-dashboard .ej-dialog{width:calc(100% - 24px);max-height:calc(100dvh - 24px);padding:16px;overscroll-behavior:contain}
 #student-dashboard .ej-dialog>.ej-row{flex-wrap:nowrap;align-items:flex-start}
 #student-dashboard .ej-dialog-title,#student-dashboard .ej-record,#student-dashboard .ej-selected-item{overflow-wrap:anywhere}
 #student-dashboard .ej-dialog-footer{gap:12px}
 #student-dashboard .ej-dialog-footer>button{min-height:44px;flex:1 1 auto}
 #student-dashboard .ej-dialog select,#student-dashboard input[type=time],#student-dashboard input[type=date]{font-size:16px;min-height:44px}
 #student-dashboard .ej-match-row{flex-wrap:wrap}
 #student-dashboard .ej-match-row .ej-secondary{min-height:44px}
 #student-dashboard .ej-plan-balance{flex-wrap:wrap}
 #student-dashboard .ej-week-shortcuts button{font-size:14px;padding-inline:6px}
 #student-dashboard .ej-start-date{min-height:44px}
 #student-dashboard .ej-next-detail{gap:12px}
 #student-dashboard .ej-date{min-width:60px;padding-right:12px}
 #student-dashboard .ej-next-detail>div:last-child{min-width:0}
 #student-dashboard .ej-next-detail h2{font-size:18px;white-space:normal}
 #student-dashboard .ej-footnote{line-height:1.7}
}
@media(max-width:380px){
 header .brand-logo{width:112px;height:56px}
 header .student-login{font-size:12px}
 header .menu{flex-basis:44px;min-width:44px}
 .hero h1{font-size:32px}
 .hero-actions>.button{width:100%;font-size:17px}
 .trust{border-left:0;padding-left:0}
 .journey-heading,.course-options>article{padding:24px 18px}
 .auth-card,.booking-panel,.booking-note{padding:16px}
 .google-login,.facebook-login{font-size:14px}
 .student-account-page{padding-inline:2%}
 #student-dashboard{padding-inline:8px}
 #student-dashboard .ej-tabs{gap:8px}
 #student-dashboard .ej-tabs button{font-size:12px;padding-inline:2px}
 #student-dashboard .ej-cell .ej-slot{font-size:11px;padding:0;min-height:44px;height:44px}
 #student-dashboard .ej-cell,#student-dashboard .ej-time{height:48px;min-height:48px}
 #student-dashboard .ej-cell .ej-own-slot{font-size:10px}
 #student-dashboard .ej-selected-item>button{min-width:32px;min-height:44px}
 #student-dashboard .ej-history-layout .ej-selection{padding:14px}
}
@media(pointer:coarse){
 .button:hover,.chip:hover,.plan-card:hover,.feature-grid article:hover,.review-card:hover{transform:none;translate:none}
 #student-dashboard .ej-cell{min-height:48px;height:48px}
 #student-dashboard .ej-cell .ej-slot{min-height:44px;height:44px}
 #student-dashboard .ej-clear-actions button,#student-dashboard .ej-link{min-height:44px}
 #student-dashboard .ej-selected-item>button{min-width:32px;min-height:44px}
}

#student-dashboard .ej-slot-check{margin-right:3px}
#student-dashboard .ej-cell .ej-slot{white-space:nowrap;font-variant-numeric:tabular-nums}
@media(max-width:760px){.days .chip{white-space:normal}#student-dashboard .ej-slot-check{position:absolute;right:2px;top:1px;margin:0;font-size:9px;line-height:1}}

/* Keep date choices visible on tablets; compact weekday captions on phones. */
.days{flex-wrap:wrap;overflow:visible}
@media(max-width:600px){#student-dashboard .ej-weekday-prefix{display:none}#student-dashboard .ej-check{min-height:44px;margin-block:8px}}

/* Mobile hero: separate the portrait from the introductory text. */
@media(max-width:760px){
 .hero{display:flex;flex-direction:column;align-items:stretch;min-height:0;padding-top:0}
 .hero-photo{position:relative;display:block;width:100%;height:clamp(240px,62vw,340px);top:auto;right:auto;object-fit:cover;object-position:78% top;transform:none}
 .hero-content{width:100%;background:var(--white);padding:26px 6% 36px;border-top:1px solid var(--line)}
 .hero-content>.eyebrow{font-size:13px;line-height:1.8;letter-spacing:.025em;margin:0 0 18px;padding-left:12px;border-left:3px solid var(--teal);color:var(--teal)}
 .hero-content h1{margin-top:0}
}

/* Shared language switch: changes copy without replacing booking controls. */
.language-toggle{display:inline-flex;align-items:center;gap:3px;padding:3px;border:1px solid var(--line);border-radius:100px;background:var(--white);flex-shrink:0}
.language-toggle [data-language]{border:0;border-radius:100px;padding:7px 10px;min-height:38px;min-width:42px;background:transparent;color:var(--muted);font-size:13px;font-weight:700;cursor:pointer;line-height:1.2}
.language-toggle [data-language][aria-pressed=true]{color:var(--white);background:var(--teal)}
.language-toggle [data-language]:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
#student-dashboard .ej-language-settings{display:flex;gap:10px;align-items:center;flex-wrap:wrap;font-size:12px;margin-bottom:18px;padding:10px 14px;border:1px solid var(--ej-line);border-radius:10px;background:var(--ej-surface)}
#student-dashboard .ej-language-settings [data-language-status]{flex-basis:100%;font-size:12px;color:var(--ej-muted)}
#student-dashboard .ej-language-settings [data-language-status]:empty{display:none}
html[lang=en] .eyebrow{letter-spacing:.04em}
html[lang=en] #student-dashboard .ej-day-head{font-size:11px}
html[lang=en] #student-dashboard .ej-weekday-prefix{display:none}
@media(max-width:1200px){header{gap:14px}header>nav{gap:18px;font-size:14px}}
@media(max-width:600px){
 header{display:grid;grid-template-columns:minmax(0,1fr) 44px auto 44px;grid-template-rows:52px 44px;gap:0 8px;height:auto;min-height:108px;padding:6px 4%}
 header>.brand{grid-row:1;grid-column:1/4;min-width:0}
 header .brand-logo{width:min(140px,100%);height:52px}
 header>.student-login{grid-row:2;grid-column:3/5;justify-self:end;font-size:12px;margin-left:0;white-space:nowrap}
 header>.menu{grid-row:1;grid-column:4;min-width:44px;flex-basis:44px;padding:5px}
 header>.language-toggle{grid-row:2;grid-column:2;justify-self:end;padding:2px}
 .language-toggle [data-language]{min-height:38px;min-width:44px;padding:7px 10px}
 header>nav{grid-column:1/-1;max-height:calc(100dvh - 108px)}
 html[lang=en] .hero h1{font-size:clamp(32px,8vw,50px);line-height:1.2;letter-spacing:-.025em}
 html[lang=en] #student-dashboard .ej-tabs{gap:10px}
 html[lang=en] #student-dashboard .ej-tabs button{font-size:12px;white-space:normal}
 html[lang=en] #student-dashboard .ej-today-label{font-size:9px}
}

/* Option D: show the language visitors can switch to; retain recovery choices. */
.language-toggle{gap:0;padding:0;border:0;border-radius:0;background:transparent}
.language-toggle [data-language]{display:inline-flex;align-items:center;justify-content:center;position:relative;min-width:40px;min-height:26px;padding:4px 8px;border:1px solid var(--line);border-radius:6px;background:var(--white);color:var(--teal);font-size:11px;font-weight:700;line-height:1.2;letter-spacing:.02em}
html[lang=en] .language-toggle [data-language=en],html[lang=zh-Hant] .language-toggle [data-language="zh-TW"]{display:none}
html[data-language-failed] .language-toggle [data-language]{display:inline-flex}
.language-toggle [data-language]+[data-language]::before{content:none}
.language-toggle [data-language][aria-pressed=true]{background:transparent;color:var(--teal);font-weight:700}
.language-toggle [data-language][aria-pressed=true]::after{content:none}
.language-toggle [data-language]:hover{color:var(--navy)}
.language-toggle [data-language]:focus-visible{outline:2px solid var(--blue);outline-offset:1px;border-radius:3px}
@media(max-width:760px){header>.language-toggle{padding:0}}
@media(pointer:coarse){.language-toggle [data-language]{min-width:44px;min-height:44px}}
/* English hero uses a consistent type scale and a balanced text/portrait frame. */
@media(min-width:761px){html[lang=en] .hero{min-height:660px;background:#f4f8fb}html[lang=en] .hero-content{width:58%;padding:54px 4% 50px;background:linear-gradient(90deg,#fff 76%,rgba(255,255,255,.92) 89%,transparent)}html[lang=en] .hero-photo{width:52%;height:100%;object-fit:cover;object-position:78% top}html[lang=en] .hero h1{max-width:18ch;font-size:clamp(38px,3.7vw,54px);line-height:1.16;letter-spacing:-.035em;margin:18px 0 24px}html[lang=en] .hero-content>.eyebrow{max-width:38ch;font-size:13px;line-height:1.6;letter-spacing:.035em}html[lang=en] .hero-sub{max-width:39ch;font-size:19px;line-height:1.65;margin:0 0 14px}html[lang=en] .hero-detail{max-width:42ch;font-size:15px;line-height:1.7;margin:0}html[lang=en] .hero-actions{gap:20px;margin-top:28px}html[lang=en] .hero-actions>.button{font-size:17px;padding:15px 25px;min-height:50px}html[lang=en] .trust{padding-left:20px}html[lang=en] .trust strong{font-size:30px}html[lang=en] .trust span{font-size:13px}html[lang=en] .hero-secondary{font-size:14px;margin-top:18px}}
@media(min-width:761px) and (max-width:1050px){html[lang=en] .hero-content{width:62%}html[lang=en] .hero-sub{font-size:17px}html[lang=en] .hero h1{font-size:38px}html[lang=en] .hero-actions{gap:16px}}
@media(max-width:760px){html[lang=en] .hero h1{font-size:clamp(30px,8vw,42px);line-height:1.18;letter-spacing:-.025em;text-wrap:balance}html[lang=en] .hero-sub{font-size:17px;line-height:1.65}html[lang=en] .hero-detail{font-size:14px;line-height:1.75}html[lang=en] .hero-content{padding-top:24px}html[lang=en] .hero-actions{margin-top:24px;gap:18px}html[lang=en] .hero-actions>.button{font-size:16px}html[lang=en] .trust strong{font-size:28px}html[lang=en] .trust span{font-size:13px}}
html[lang=en] .hero h1 .headline-line{text-wrap:balance}

/* The approved balance display is presentation-only; full credits remain in Wix. */
#student-dashboard .ej-balance-number{align-items:center;flex-wrap:wrap}
#student-dashboard button.ej-balance-clock{display:inline-flex;gap:9px;padding:7px 0;margin:0;border:0;background:transparent;min-height:90px;perspective:700px}
#student-dashboard .ej-flip-digit{position:relative;display:inline-block;width:60px;height:72px;flex:0 0 60px;border-radius:9px;background:#fff;perspective:650px;transform-style:preserve-3d;transform-origin:50% 12%;box-shadow:0 5px 0 #d8cbb6,0 9px 14px #73592317;font-variant-numeric:tabular-nums}
#student-dashboard .ej-flip-half{position:absolute;left:0;right:0;height:36px;overflow:hidden;background:#fff;backface-visibility:hidden}
#student-dashboard .ej-flip-top{top:0;border-radius:9px 9px 0 0;transform-origin:center bottom;background:linear-gradient(#fff,#f8fafb)}
#student-dashboard .ej-flip-bottom{bottom:0;border-radius:0 0 9px 9px;transform-origin:center top}
#student-dashboard .ej-flip-number{display:block;height:72px;line-height:72px;font-size:48px;font-weight:500;color:var(--ej-ink);text-align:center}
#student-dashboard .ej-flip-bottom .ej-flip-number{transform:translateY(-36px)}
#student-dashboard .ej-flip-flap{z-index:3;will-change:transform}
#student-dashboard .ej-flip-flap.ej-flip-bottom{transform:rotateX(90deg)}
#student-dashboard .ej-flip-seam{position:absolute;left:0;right:0;top:35px;height:2px;background:#d7dedf;z-index:5;pointer-events:none}
#student-dashboard .ej-flip-digit:before,#student-dashboard .ej-flip-digit:after{content:'';position:absolute;width:3px;height:8px;top:32px;background:#b59459;border-radius:2px;z-index:6}
#student-dashboard .ej-flip-digit:before{left:-1px}#student-dashboard .ej-flip-digit:after{right:-1px}

/* Student-area annotation refinements. */
#student-dashboard .ej-week-year{display:block;text-align:center;font-size:19px;line-height:1.3;color:var(--ej-ink)}
#student-dashboard .ej-week-dates{display:block;text-align:center;font-size:12px;line-height:1.5;color:var(--ej-muted)}
#student-dashboard .ej-weekly-action{display:flex;align-items:center;gap:9px;flex-wrap:wrap}
#student-dashboard .ej-new-badge{position:relative;overflow:hidden;border-radius:5px;padding:3px 7px;background:#eef5ed;color:#467044;font-size:10px;white-space:nowrap}
#student-dashboard .ej-new-badge:after{content:'';position:absolute;inset:0;background:linear-gradient(110deg,transparent 20%,#ffffffb0 50%,transparent 80%);transform:translateX(-120%);animation:ej-new-shine 2.4s ease-in-out 3}
@keyframes ej-new-shine{0%,45%{transform:translateX(-120%)}85%,100%{transform:translateX(120%)}}
#student-dashboard a.ej-join-live{background:linear-gradient(135deg,#f4d77c,#dab24d);color:#44320f;box-shadow:0 0 0 1px #c79e35,0 4px 18px #d6b45e40;animation:ej-class-glow 1.7s ease-in-out 3}
@keyframes ej-class-glow{50%{box-shadow:0 0 0 1px #c79e35,0 4px 24px #d6b45e80}}
#student-dashboard .ej-booking-selection{position:relative;overflow:visible}
#student-dashboard .ej-selection-controls{position:sticky;top:94px;z-index:3;background:var(--ej-surface);padding-bottom:12px;border-bottom:1px solid var(--ej-line)}
#student-dashboard .ej-selection-controls .ej-selection-total{margin-top:12px;padding-top:0;border-top:0}
#student-dashboard .ej-booking-selection .ej-selected-list{margin-top:12px}
#student-dashboard .ej-package-card{border:1px solid var(--ej-line);border-radius:10px;margin:12px 0;background:var(--ej-surface)}
#student-dashboard .ej-package-card summary{padding:16px;display:grid;grid-template-columns:1fr auto;gap:7px 12px;cursor:pointer;font-size:13px;list-style:disclosure-closed}
#student-dashboard .ej-package-card summary>span:not(.ej-tag){grid-column:1/-1;color:var(--ej-muted)}
#student-dashboard .ej-package-card summary:focus-visible{outline:2px solid var(--ej-green);outline-offset:2px}
#student-dashboard .ej-package-detail{border-top:1px solid var(--ej-line);padding:16px}
#student-dashboard .ej-package-detail h3{margin:12px 0 8px}
#student-dashboard .ej-package-lessons{padding:0;margin:0;list-style:none}
#student-dashboard .ej-package-lessons li{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;font-size:12px;padding:10px 0;border-bottom:1px solid var(--ej-line);overflow-wrap:anywhere}
#student-dashboard .ej-package-lessons li>[data-no-translate]{flex:1 1 210px;font-variant-numeric:tabular-nums}
@media(prefers-reduced-motion:reduce){#student-dashboard .ej-new-badge:after,#student-dashboard a.ej-join-live{animation:none}}

/* Shared bilingual footer: clear groups and large, visible link targets. */
footer.site-footer{display:block;background:#f6f9fa;border-top:1px solid #e0e8eb;padding:44px 24px 22px;margin-top:64px}
.site-footer .footer-inner{max-width:1120px;margin:auto;display:grid;grid-template-columns:1.4fr 1fr 1fr;gap:42px}
.site-footer .footer-brand{display:flex;flex-direction:column;align-items:flex-start;gap:12px}
.site-footer .footer-brand>a:first-child{display:inline-flex;align-items:center;min-height:44px}
.site-footer .footer-brand img{width:150px;height:auto;margin:0}
.site-footer .footer-brand p{margin:0;max-width:300px;font-size:14px;line-height:1.8;color:#637782}
.site-footer .footer-trial{display:inline-flex;align-items:center;justify-content:center;min-height:44px;border:1px solid #cedde2;border-radius:8px;padding:9px 14px;background:#fff;color:#213b54;font-size:13px;text-decoration:none}
.site-footer .footer-group{display:flex;flex-direction:column;align-items:flex-start;gap:0;margin:0}
.site-footer .footer-group h2{font-size:14px;font-weight:700;margin:0 0 9px;color:#263e48}
.site-footer .footer-group a{display:flex;align-items:center;min-height:44px;padding:8px 0;color:var(--blue);font-size:14px;font-weight:600;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;line-height:1.5}
.site-footer .footer-group a:hover,.site-footer .footer-group a:focus-visible{color:var(--navy);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.site-footer .footer-bottom{max-width:1120px;margin:28px auto 0;border-top:1px solid #e0e8eb;padding-top:18px;display:flex;flex-wrap:wrap;gap:8px 20px;align-items:center}
.site-footer .footer-bottom p{flex-basis:100%}
.site-footer .footer-bottom p{margin:0;font-size:12px;color:#71818a}
@media(max-width:760px){footer.site-footer{padding:32px 20px 20px;margin-top:42px}.site-footer .footer-inner{grid-template-columns:1fr 1fr;gap:26px 20px}.site-footer .footer-brand{grid-column:1/-1}.site-footer .footer-brand p{max-width:none}}

/* Student annotations: clear badges, deliberate actions, and quieter package chrome. */
#student-dashboard .ej-weekly-action{position:relative;display:inline-flex;flex-wrap:nowrap}
#student-dashboard .ej-tabs [data-tab=preferences]{position:relative;overflow:visible}
#student-dashboard .ej-new-badge{position:absolute;right:-7px;top:-9px;z-index:2;background:#ffe234;color:#53440b;border:1px solid #e4c41a;border-radius:5px;padding:2px 6px;font-size:10px;line-height:1.4;pointer-events:none;box-shadow:0 2px 5px #7c65051c}
#student-dashboard .ej-tabs [data-tab=preferences] .ej-new-badge{top:-5px;right:-17px;transform:none;font-size:9px;padding:1.8px 5.4px;border-radius:4.5px}
#student-dashboard .ej-new-badge:after{pointer-events:none}
#student-dashboard .ej-selection-controls>[data-action=review]{position:relative;overflow:hidden;margin-top:18px;box-shadow:0 4px 0 #102440;transition:transform .12s ease,box-shadow .12s ease}
#student-dashboard .ej-selection-controls>[data-action=review]:not(:disabled):hover{transform:translateY(-1px);box-shadow:0 5px 0 #102440}
#student-dashboard .ej-selection-controls>[data-action=review]:not(:disabled):active{transform:translateY(3px);box-shadow:0 1px 0 #102440}
#student-dashboard .ej-selection-controls>[data-action=review]:not(:disabled):after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(110deg,transparent 30%,#ffffff60 50%,transparent 70%);transform:translateX(-140%);animation:ej-review-shine 4.6s ease-in-out 3}
#student-dashboard .ej-selection-controls>[data-action=review]:disabled{box-shadow:none;transform:none}
@keyframes ej-review-shine{0%,65%{transform:translateX(-140%)}88%,100%{transform:translateX(140%)}}
#student-dashboard .ej-booking-selection>.ej-credit-note{font-size:11px;line-height:1.7;margin-top:16px;padding-top:12px;border-top:0}
#student-dashboard .ej-tag.ej-tag-expired{background:#edf0f3;color:#78808b}
#student-dashboard button.ej-dialog-close{border:0;background:transparent;box-shadow:none;border-radius:0;padding:0;min-width:44px;min-height:44px;font-size:25px;color:var(--ej-muted);align-self:flex-start}
#student-dashboard button.ej-dialog-close:hover{color:var(--ej-ink)}
#student-dashboard .ej-record-heading{display:flex;flex-wrap:wrap;gap:3px 8px;font-size:12px;line-height:1.6;font-variant-numeric:tabular-nums}
#student-dashboard .ej-record-time{white-space:nowrap}
.site-footer .footer-group{position:static;inset:auto;padding:0;background:transparent;box-shadow:none;white-space:normal;z-index:auto}
.site-footer .footer-group a:after{content:none}
.site-footer .footer-inner{grid-template-columns:minmax(0,1.4fr) minmax(0,1fr) minmax(0,1fr);gap:56px}
.site-footer .footer-brand{gap:18px}
.site-footer .footer-brand img{width:170px}
.site-footer .footer-invitation{display:flex;flex-direction:column;align-items:flex-start;gap:16px;padding-left:18px;border-left:2px solid #c5d7de}
.site-footer .footer-invitation p{max-width:280px}
.site-footer .footer-trial{background:#213b54;color:#fff;border-color:#213b54;border-radius:24px;padding:10px 20px;box-shadow:0 3px 8px #213b5410}
.site-footer .footer-trial:hover{background:#087e91;border-color:#087e91}
.site-footer .footer-group h2{margin-bottom:14px;letter-spacing:.03em}
@media(max-width:760px){.site-footer .footer-inner{grid-template-columns:1fr 1fr;gap:32px 20px}.site-footer .footer-brand{grid-column:1/-1}.site-footer .footer-invitation p{max-width:none}}
@media(prefers-reduced-motion:reduce){#student-dashboard .ej-selection-controls>[data-action=review]:after{animation:none}#student-dashboard .ej-selection-controls>[data-action=review]{transition:none}}

.plan-card .price del{font-size:20px;font-weight:400;color:var(--muted);margin-right:12px;text-decoration-thickness:1px}.plan-card .price ins{text-decoration:none}.plan-card .price{display:flex;align-items:baseline;flex-wrap:wrap;gap:4px}
.plan-card,.plan-card:hover,.plan-card.trial,.plan-card.trial:hover{border:1px solid var(--line);background:#fff;transform:none;translate:none;box-shadow:none;animation:none;transition:none}
.plan-card::before{display:none}
.plan-card .price,.plan-card:hover .price{transform:none;color:var(--navy);transition:none}
.plan-card .button,.plan-card .button:hover{transform:none;translate:none;box-shadow:none}
.plans-shared-note{margin:0 0 24px;color:var(--muted);line-height:1.8}
#student-dashboard .ej-record-meta{display:flex;flex-wrap:wrap;gap:4px 8px;min-width:0;line-height:1.7}
#student-dashboard .ej-record-meta>span{white-space:nowrap}
#student-dashboard .ej-record-meta>span+span::before{content:'·';margin-right:8px}

/* Browser-local registration eligibility dialog. */
.registration-gate{box-sizing:border-box;width:min(calc(100vw - 32px),580px);max-height:calc(100dvh - 32px);overflow:auto;border:1px solid #d8e7e2;border-radius:24px;padding:36px;color:#173a33;background:#fff;box-shadow:0 24px 90px #102b3340;color-scheme:light;font-family:Arial,Helvetica,'Noto Sans TC',sans-serif}
.registration-gate::backdrop{background:#102b336b;backdrop-filter:blur(5px)}
.registration-gate-brand{display:block;font-size:11px;letter-spacing:.16em;font-weight:700;color:#57746d;margin-bottom:14px}
.registration-gate h2{margin:0 0 10px;font-size:clamp(24px,4vw,30px);letter-spacing:-.03em;line-height:1.35}
/* Authored by Grok: the new-student questions open with no highlighted title. */
.registration-gate:focus,.registration-gate:focus-visible,.registration-gate h2:focus,.registration-gate h2:focus-visible{outline:none}
.registration-gate p{line-height:1.7;margin:0 0 26px;color:#60736e;font-size:14px}
.registration-gate-form{display:grid;gap:20px}
.registration-gate-field{margin:0;padding:0;border:0;min-width:0}
.registration-gate-label{display:flex;align-items:center;flex-wrap:wrap;gap:8px;font-size:14px;font-weight:700;line-height:1.6;margin-bottom:10px}
.registration-gate-number{display:inline-grid;place-items:center;flex:none;width:24px;height:24px;border-radius:50%;background:#edf4f1;color:#547068;font-size:12px;font-weight:700}
.registration-gate-optional{font-size:12px;font-weight:400;color:#657b73}
.registration-gate-required{font-size:10px;font-weight:500;color:#547068;margin-left:auto;padding:1px 7px;border:1px solid #dce8e2;border-radius:5px}
.registration-gate select{box-sizing:border-box;display:block;width:100%;min-height:48px;border:1px solid #ceded6;border-radius:10px;background:#f8faf9;color:#173a33;font:inherit;font-size:16px;padding:10px 12px;cursor:pointer}
.registration-gate select:focus-visible,.registration-gate button:focus-visible{outline:3px solid #83bdae;outline-offset:3px}
.registration-gate-radio-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.registration-gate-radio{display:flex;align-items:center;gap:10px;border:1px solid #ceded6;border-radius:10px;min-height:48px;padding:10px 16px;box-sizing:border-box;cursor:pointer;font-size:15px;background:#f8faf9}
.registration-gate-radio:has(input:checked){border-color:#267a64;background:#edf7f2;box-shadow:inset 0 0 0 1px #267a64}
.registration-gate-radio input{accent-color:#267a64;width:18px;height:18px;margin:0;flex:none}
.registration-gate-radio:focus-within{outline:3px solid #83bdae;outline-offset:3px}
.registration-gate-actions{display:flex;gap:12px;flex-wrap:wrap;border-top:1px solid #e5ede8;padding-top:22px;margin-top:4px}
.registration-gate-actions .button{flex:1;min-width:100px;min-height:48px;cursor:pointer;justify-content:center;border-radius:10px}
.registration-gate-actions .button[data-cancel]{background:#fff;color:#60736e;border:1px solid #ceded6}
.registration-gate-actions .button:disabled{opacity:.45;cursor:not-allowed;transform:none}
.registration-gate[data-blocked] .registration-gate-actions{margin-top:24px}
.auth-card[hidden]{display:none}
.registration-gate-field:has(.registration-chart-link){display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;column-gap:12px}
.registration-gate-field:has(.registration-chart-link)>select{grid-column:1/-1}
.registration-chart-link{font:inherit;font-size:12px;font-weight:600;min-height:44px;padding:0 2px;margin-top:-10px;color:var(--blue);border:0;background:transparent;text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:4px;cursor:pointer}
.registration-level-chart{box-sizing:border-box;width:min(calc(100vw - 32px),660px);max-height:calc(100dvh - 32px);padding:0;overflow:hidden;border:1px solid var(--line);border-radius:24px;background:#fff;color:var(--navy);box-shadow:0 30px 100px #06264c50;color-scheme:light;font-family:Arial,Helvetica,'Noto Sans TC',sans-serif}
.registration-level-chart[open]{display:flex;flex-direction:column}
.registration-level-chart.registration-chart-expanded{width:min(calc(100vw - 32px),1120px)}
.registration-chart-header,.registration-chart-guide,.registration-chart-note{flex:none}
.registration-level-chart::backdrop{background:#06264c7d;backdrop-filter:blur(7px)}
.registration-chart-header{position:relative;padding:24px 72px 20px;text-align:center;background:linear-gradient(125deg,#eaf4fb,#f5f9fc);border-bottom:1px solid var(--line)}
.registration-chart-brand{display:block;font-size:10px;font-weight:700;letter-spacing:.16em;color:var(--teal);margin-bottom:12px}
.registration-chart-header h2{font-size:clamp(24px,4vw,32px);line-height:1.25;letter-spacing:-.035em;margin:0 0 12px}
/* Authored by Grok: focusing the comparison title must not draw a highlight box. */
.registration-chart-header h2:focus,.registration-chart-header h2:focus-visible{outline:none}
.registration-chart-header p{font-size:14px;line-height:1.7;margin:0 auto;max-width:620px;color:var(--muted)}
.registration-chart-close{position:absolute;right:20px;top:20px;width:44px;height:44px;border:1px solid var(--line);border-radius:50%;background:#ffffffb3;color:var(--navy);font:300 28px/1 Arial,sans-serif;cursor:pointer}
.registration-chart-close:hover{background:#fff;border-color:var(--blue)}
.registration-chart-link:focus-visible,.registration-chart-close:focus-visible,.registration-chart-scroll:focus-visible{outline:3px solid #82bbdf;outline-offset:3px}
.registration-chart-guide{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding:12px 28px 10px;font-size:12px;color:var(--muted)}
.registration-chart-selected{padding:6px 10px;border-radius:20px;background:#eaf4fb;color:var(--blue);font-weight:600}
.registration-chart-guide>[hidden]{display:none}
.registration-chart-tooltip{position:fixed;inset:auto;margin:0;box-sizing:border-box;width:290px;max-width:calc(100vw - 24px);padding:16px 18px;border:1px solid var(--line);border-radius:14px;background:#fbfdff;color:var(--navy);box-shadow:0 12px 35px #06264c33;font-family:Arial,Helvetica,'Noto Sans TC',sans-serif;pointer-events:none;z-index:10;text-align:left}
.registration-chart-tooltip[hidden]{display:none}
.registration-chart-tooltip strong{display:block;margin-bottom:8px;font-size:13px;letter-spacing:.06em;color:var(--blue)}
.registration-chart-tooltip p{margin:0;font-size:13px;line-height:1.7}
.registration-chart-scroll{margin:0 24px;border:1px solid var(--line);border-radius:14px;overflow:auto;overscroll-behavior:contain;scrollbar-color:#b4c9d8 var(--surface)}
.registration-chart-scroll{flex:1 1 auto;min-height:0}
.registration-chart-table{width:100%;border-collapse:separate;border-spacing:0;text-align:center;font-size:13px;line-height:1.5}
.registration-chart-expanded .registration-chart-table{min-width:1000px}
.registration-chart-table [hidden]{display:none}
.registration-chart-details{display:none}
.registration-chart-toggle{margin-left:auto;min-height:44px;padding:8px 14px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--blue);font:inherit;font-weight:600;cursor:pointer}
.registration-chart-toggle:focus-visible,.registration-chart-info:focus-visible{outline:3px solid #82bbdf;outline-offset:2px}
.registration-chart-info{display:block;width:44px;height:44px;margin:auto;padding:0;border:1px solid var(--line);border-radius:50%;background:#fff;color:var(--blue);font:24px Arial,sans-serif;cursor:pointer}
.registration-chart-info[aria-expanded=true]{background:#e4eff8;border-color:var(--blue)}
.registration-chart-table caption{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.registration-chart-table th,.registration-chart-table td{padding:10px 12px;border-bottom:1px solid var(--line);border-right:1px solid var(--line);white-space:nowrap;background:#fff}
.registration-chart-table thead th{box-sizing:border-box;height:49px;position:sticky;top:0;z-index:4;font-size:12px;font-weight:600;letter-spacing:.01em;background:var(--surface);color:var(--navy)}
.registration-chart-table th:first-child{position:sticky;left:0;z-index:1;text-align:left;font-size:12px;letter-spacing:.035em;background:#f7fafd;color:var(--navy);min-width:80px}
.registration-chart-table thead th:first-child{z-index:5;background:#eaf2fa}
@media(hover:hover) and (pointer:fine){
.registration-chart-table tbody tr:hover>*{background:#e4eff8;color:var(--navy)}
}
.registration-chart-table tr:last-child>*{border-bottom:0}
.registration-chart-table tr>*:last-child{border-right:0}
.registration-chart-score{display:block;line-height:1.5}
.registration-chart-score+span{margin-top:8px}
.registration-chart-score strong{display:block;font-size:12px;font-weight:600}
.registration-chart-score small{display:block;font-size:10px;color:var(--muted)}
.registration-chart-note{padding:14px 28px 18px;margin:0;font-size:12px;line-height:1.8;color:var(--muted)}
.registration-chart-table tbody th:has(.registration-chart-choice){padding:8px}
.registration-chart-level-buttons{display:flex;justify-content:center;gap:6px}
.registration-chart-choice{display:block;box-sizing:border-box;flex:1;min-width:44px;min-height:44px;padding:10px 12px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--navy);font:inherit;font-size:15px;font-weight:700;line-height:inherit;text-align:center;cursor:pointer}
.registration-chart-choice:hover{background:#e4eff8;color:var(--blue)}
.registration-chart-choice[aria-pressed=true]{background:var(--blue);border-color:var(--blue);color:#fff}
.registration-chart-choice:focus-visible{position:relative;outline:3px solid var(--blue);outline-offset:-3px;border-radius:5px}
/* Desktop comparison: balanced bilingual heading and a calm, spacious score table. */
@media(min-width:701px){
.registration-level-chart{width:min(calc(100vw - 48px),860px);max-height:calc(100dvh - 48px);border-radius:22px;border-color:var(--line);box-shadow:0 24px 90px #06264c40}
.registration-level-chart.registration-chart-expanded{width:min(calc(100vw - 48px),1180px)}
.registration-chart-header{display:block;height:auto;min-height:0;grid-template-columns:none;grid-template-rows:none;gap:0;padding:28px 72px 24px;background:linear-gradient(135deg,#eaf4fb,#f5f9fc);border-bottom-color:var(--line)}
.registration-chart-brand{font-size:10px;letter-spacing:.14em;margin-bottom:10px;color:var(--teal)}
.registration-chart-header h2{display:block;width:100%;font-size:29px;line-height:1.4;letter-spacing:0;margin:0 0 12px;font-weight:700;text-wrap:balance;word-break:normal;overflow-wrap:normal}
.registration-level-chart[lang=en] .registration-chart-header h2{font-size:30px;letter-spacing:-.025em}
.registration-chart-header p{display:block;width:100%;max-width:640px;margin:0 auto;font-size:14px;line-height:1.75;text-wrap:pretty;word-break:normal;overflow-wrap:normal}
.registration-chart-close{top:20px;right:20px;border-color:var(--line);background:#fff;color:var(--muted)}
.registration-chart-guide{padding:16px 24px;gap:10px}
.registration-chart-selected{padding:7px 12px;background:#eaf4fb;border:1px solid var(--line);font-size:12px;letter-spacing:0;line-height:1.5}
.registration-chart-toggle{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-width:120px;padding:9px 14px;border-color:var(--line);border-radius:10px;background:#f7fafd;line-height:1.5;white-space:nowrap}
.registration-chart-toggle::after{content:'+';font:20px/1 Arial,sans-serif;font-weight:400}
.registration-chart-toggle[aria-expanded=true]::after{content:'−'}
.registration-chart-toggle:hover{background:#eaf4fb;border-color:#99bfdc}
.registration-chart-scroll{border-color:var(--line);border-radius:12px;background:#fff;isolation:isolate}
.registration-chart-table{table-layout:fixed;font-size:15px;font-variant-numeric:tabular-nums;line-height:1.5}
.registration-chart-table th,.registration-chart-table td{padding:9px 16px;border-right:0;border-bottom-color:var(--line)}
.registration-chart-table thead th{height:46px;padding:12px 16px;background:var(--surface);color:var(--muted);font-size:12px;letter-spacing:.06em;font-weight:700}
.registration-chart-table th:first-child{width:24%;min-width:96px;text-align:center;background:#f7fafd;letter-spacing:0}
.registration-chart-table thead th:first-child{background:#eaf2fa}
.registration-chart-table tbody tr:nth-child(even)>*{background:#fafcff}
.registration-chart-table tbody th:has(.registration-chart-choice){padding:7px 16px}
.registration-chart-choice{width:80px;margin:0 auto;min-height:44px;padding:8px 12px;font-size:15px;letter-spacing:.03em;border-color:var(--line);background:#fff;border-radius:8px}
.registration-chart-choice[aria-pressed=true]{background:var(--blue);border-color:var(--blue);color:#fff}
.registration-chart-table tbody tr:has(.registration-chart-choice[aria-pressed=true])>*{background:#eaf4fb}
.registration-chart-table tbody tr:has(.registration-chart-choice[aria-pressed=true])>th{box-shadow:inset 3px 0 var(--blue)}
.registration-chart-expanded .registration-chart-table{table-layout:auto;min-width:1040px;font-size:13px}
.registration-chart-expanded .registration-chart-table th:first-child{width:100px}
.registration-chart-expanded .registration-chart-table th,.registration-chart-expanded .registration-chart-table td{padding:9px 12px;border-right:1px solid var(--line)}
.registration-chart-expanded .registration-chart-table tr>*:last-child{border-right:0}
.registration-chart-expanded .registration-chart-choice{width:64px}
.registration-chart-score strong{font-size:12px}
.registration-chart-score small{font-size:11px;line-height:1.45}
.registration-chart-note{padding:16px 24px 20px;font-size:12px;line-height:1.75;color:var(--muted);background:#fff}
.registration-chart-tooltip{width:320px;padding:18px 20px;border-radius:12px;border-color:var(--line);box-shadow:0 10px 32px #06264c26}
.registration-chart-tooltip strong{font-size:13px;letter-spacing:.04em}
.registration-chart-tooltip p{font-size:14px;line-height:1.7}
}
@media(min-width:701px) and (hover:hover) and (pointer:fine){.registration-chart-table tbody tr:hover>*{background:#e4eff8;color:var(--navy)}}
/* Authored by Grok: phone comparison chart keeps the title, close button, and explanation on separate rows, and gives the table the remaining screen. */
@media(max-width:700px){
.registration-level-chart,.registration-level-chart.registration-chart-expanded{width:calc(100vw - 16px);height:calc(100dvh - 16px);max-height:calc(100dvh - 16px);margin:8px;overflow:hidden;border-radius:18px}
.registration-chart-header{display:grid;grid-template-columns:minmax(0,1fr) 44px;grid-template-areas:"brand close" "title close" "intro intro";align-items:center;column-gap:8px;row-gap:2px;height:auto;min-height:0;position:relative;top:auto;z-index:1;padding:14px 14px 12px;text-align:left;backdrop-filter:none}
.registration-chart-brand{grid-area:brand;margin:0;letter-spacing:.08em}
.registration-chart-header h2{grid-area:title;margin:0;font-size:22px;text-align:left}
.registration-chart-header p{grid-area:intro;margin:6px 0 0;max-width:none;font-size:13px;line-height:1.55;text-align:left}
.registration-chart-close{grid-area:close;position:static;justify-self:end;align-self:start}
.registration-chart-guide{padding:10px 14px;gap:8px;align-items:flex-start}
.registration-chart-toggle,.registration-chart-table .registration-chart-extra{display:none}
.registration-chart-table .registration-chart-details{display:table-cell}
.registration-chart-scroll{margin:0 10px}
.registration-chart-scroll.registration-chart-more{-webkit-mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 28px),transparent);mask-image:linear-gradient(to right,#000 0,#000 calc(100% - 28px),transparent)}
.registration-chart-table,.registration-chart-expanded .registration-chart-table{width:100%;min-width:0;font-size:12px}
.registration-chart-table th,.registration-chart-table td{padding:6px 4px}
.registration-chart-table thead th{height:auto}
.registration-chart-table th:first-child{min-width:44px;box-shadow:6px 0 8px -6px #06264c26}
.registration-chart-table tbody th:has(.registration-chart-choice){padding:6px 4px}
.registration-chart-choice{padding:8px 6px;font-size:14px}
.registration-chart-table .registration-chart-details{font-size:11px;letter-spacing:0;min-width:44px}
.registration-chart-note{padding:12px 14px 14px;font-size:12px;line-height:1.6}
}
@media(max-width:480px){.registration-gate{padding:24px;border-radius:18px}.registration-gate-form{gap:18px}.registration-gate-actions{padding-top:18px}.registration-gate-optional{font-size:11px}}

/* Compact account sign-out; retain comfortable phone touch targets. */
#student-dashboard .ej-welcome [data-action=logout]{font-size:12px;line-height:1.4;padding:6px 10px;min-height:32px;border-radius:6px}
@media(pointer:coarse){#student-dashboard .ej-welcome [data-action=logout]{min-height:44px}}

/* FAQ trial and refund explanations. */
.faq-list details>p{margin:14px 0;line-height:1.8}
.faq-list .faq-trial-button{margin:4px 0 18px;font-size:14px}
.faq-refund-section{margin:20px 0;padding:0}
.faq-refund-section h3{font-size:17px;margin:0 0 10px;line-height:1.5}
.faq-refund-section p{margin:10px 0;line-height:1.8}
.faq-refund-example{padding:18px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}

/* Keep the student account action aligned with the header controls. */
body>header{justify-content:flex-start}
body>header>nav{margin-left:auto}
body>header>.student-login{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:8px 16px;margin-left:0;border:1px solid var(--line);border-radius:10px;background:var(--surface);color:var(--navy);font-size:14px;line-height:1.2;flex-shrink:0;text-decoration:none}
body>header>.student-login:hover{background:#e4eff8;border-color:#a4bfd7;text-decoration:none}
@media(min-width:1101px) and (max-width:1280px){
 body>header{height:82px;gap:12px;padding:8px 4%}
 body>header .brand-logo{width:170px;height:60px}
 body>header>.header-cta{display:none}
 body>header>nav{display:none;position:absolute;top:100%;left:0;right:0;margin-left:0;padding:16px 5%;background:var(--white);box-shadow:0 8px 20px #06264c18;max-height:calc(100dvh - 82px);overflow-y:auto;white-space:normal}
 body>header>nav.open{display:grid;gap:4px;font-size:16px}
 body>header>nav a{display:flex;align-items:center;min-height:44px;padding:6px 8px}
 body>header>.menu{display:inline-flex;align-items:center;justify-content:center;min-width:48px;min-height:44px;padding:8px;border:0;border-radius:8px;background:var(--surface);font-size:14px}
}
@media(min-width:601px) and (max-width:1280px){body>header>.language-toggle{margin-left:auto}body>header>.student-login{margin-left:0}}
@media(min-width:1281px){body>header>.student-login{order:1}body>header>.language-toggle{order:2}}
@media(max-width:600px){body>header>.student-login{font-size:12px;min-height:40px;padding:7px 10px;margin-left:0}body>header>nav{margin-left:0}}

/* Focused lesson pages and practice guides. */
.seo-breadcrumb{position:static;inset:auto;background:transparent;box-shadow:none;border:0;padding:0;transform:none;display:flex;flex-wrap:wrap;align-items:baseline;gap:8px;font-size:14px;line-height:1.7;margin-bottom:32px}.seo-breadcrumb a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}.resource-list article li{margin:12px 0;line-height:1.9}.resource-list .example p{margin:0 0 12px}.resource-list .example p:last-child{margin-bottom:0}.closing p a{color:inherit;text-decoration:underline;text-underline-offset:4px}

[data-seo-related] a,[data-seo-expansion] h3 a{color:var(--blue);text-decoration:underline;text-underline-offset:4px}

/* Responsive header controls: original logo, copy and account behavior retained. */
body>header>.language-toggle [data-language]{min-width:52px;min-height:44px;padding:10px 12px;border-color:transparent;border-radius:12px;background:#f1f6f9;color:var(--teal);font-size:12px;letter-spacing:.02em}
body>header>.language-toggle [data-language]:hover{background:#e6f0f4;color:var(--navy)}
body>header>.student-login{gap:8px;min-height:44px;padding:10px 16px;border:1px solid var(--navy);border-radius:12px;background:var(--navy);color:#fff;font-weight:700;white-space:nowrap;box-shadow:0 2px 4px #06264c0d}
body>header>.student-login:hover{background:#0b3b69;border-color:#0b3b69;color:#fff}
body>header>.student-login::before{content:'';display:block;flex:0 0 17px;width:17px;height:17px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.7' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M4.5 21v-2a7.5 7.5 0 0 1 15 0v2'/%3E%3C/svg%3E") center/contain no-repeat}
@media(max-width:1280px){
 body>header{column-gap:10px}
 body>header>.menu{gap:8px;flex:0 0 auto;min-height:44px;min-width:78px;padding:10px 12px;border:1px solid var(--line);border-radius:12px;background:#fff;color:var(--navy);font-size:13px;font-weight:600;line-height:1.2;cursor:pointer}
 body>header>.menu:hover,body>header>.menu[aria-expanded=true]{background:#f1f6f9;border-color:#b4c9d8}
 body>header>.menu::before{content:'';display:block;flex:0 0 16px;width:16px;height:14px;background:linear-gradient(currentColor,currentColor) 0 0/16px 1.5px no-repeat,linear-gradient(currentColor,currentColor) 0 6px/12px 1.5px no-repeat,linear-gradient(currentColor,currentColor) 0 12px/16px 1.5px no-repeat}
 body>header>.menu[aria-expanded=true]::before{background:linear-gradient(45deg,transparent 46%,currentColor 47%,currentColor 53%,transparent 54%),linear-gradient(-45deg,transparent 46%,currentColor 47%,currentColor 53%,transparent 54%)}
 body>header>nav{left:auto;right:4%;width:min(360px,92%);padding:12px;border:1px solid var(--line);border-radius:16px;box-shadow:0 16px 36px #06264c18;max-height:calc(100dvh - 100px)}
 body>header>nav.open{gap:3px}
 body>header>nav a{border-radius:9px;padding:9px 14px;min-height:44px}
 body>header>nav a:hover{background:transparent}
 body>header>nav a[aria-current],body>header>nav a[aria-current]:hover{background:var(--surface)}
 body>header>nav a::after{left:14px;width:calc(100% - 28px);bottom:5px}
}
@media(max-width:600px){
 body>header{row-gap:4px;padding-bottom:10px}
 body>header>.language-toggle{grid-column:1/3;justify-self:start;padding:0}
 body>header>.student-login{grid-column:3/5;min-height:44px;font-size:12px;padding:10px 12px}
 body>header>.menu{min-width:44px;width:44px;padding:12px;gap:0;font-size:0}
 body>header>nav{max-height:calc(100dvh - 132px)}
}

/* Member-aware offers and understated language control; logo remains untouched. */
[data-trial-offer][hidden]{display:none!important}
html:not([data-trial-state]) [data-trial-offer],html[data-trial-state=pending] [data-trial-offer]{visibility:hidden}
body>header>.language-toggle [data-language]{min-width:44px;background:transparent;border:0;color:var(--muted);font-size:11px;font-weight:500;border-radius:6px;letter-spacing:.04em}
body>header>.language-toggle [data-language]:hover{background:#f5f8fa;color:var(--teal)}
body>header>.language-toggle [data-language]:focus-visible{outline:2px solid var(--blue);outline-offset:1px}

@media(scripting:none){html:not([data-trial-state]) [data-trial-offer]{visibility:visible}}

/* Owned lesson credits remain bookable independently of trial promotions. */
.owned-lesson-actions{display:flex;flex-wrap:wrap;gap:10px 22px;margin-top:18px}.owned-lesson-actions[hidden]{display:none}.owned-lesson-actions a{font-size:14px;min-height:44px;display:inline-flex;align-items:center}
#student-dashboard .ej-owned-credit-actions{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:14px}#student-dashboard .ej-owned-credit-actions[hidden]{display:none}
#student-dashboard a.ej-join-disabled{background:#e8edf1!important;color:#667587!important;border-color:#d5dee5!important;box-shadow:none!important;animation:none!important;cursor:not-allowed;opacity:1}

.owned-credit-options{grid-column:1/-1;padding:20px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}.owned-credit-options a{display:inline-flex;align-items:center;min-height:44px;margin-right:22px}

/* Selected design 3A: original satin sweep, only while joining is available. */
#student-dashboard a.ej-join-live[aria-disabled="false"]{position:relative;isolation:isolate;overflow:hidden;background:#0a3c61;color:#fff;border-color:transparent;box-shadow:0 3px 12px #092b4e20}
#student-dashboard a.ej-join-live[aria-disabled="false"]::after{content:"";position:absolute;inset:-30% -80%;pointer-events:none;background:linear-gradient(110deg,transparent 38%,#ffffff55 48%,transparent 58%);animation:ej-class-ready-sweep 3.6s ease-in-out infinite}
@keyframes ej-class-ready-sweep{0%,20%{transform:translateX(-60%)}65%,100%{transform:translateX(60%)}}
@media(prefers-reduced-motion:reduce){#student-dashboard a.ej-join-live[aria-disabled="false"]::after{animation:none;content:none}}

/* TOEIC stays in the compact comparison on phones too. */
@media(max-width:700px){.registration-chart-table{min-width:350px}.registration-chart-table th,.registration-chart-table td{padding:6px 3px}.registration-chart-score strong{font-size:11px}.registration-chart-score small{font-size:10px}}
/* Review cards stay still on hover; keep their normal entrance animation. */
.review-card,.review-card:hover{transform:none;translate:none;box-shadow:none;border-color:var(--line);background:var(--white);transition:none}
.review-card::before,.review-card:hover::before{content:none;opacity:0;transition:none}
/* Reviews retain original attribution; generated portraits are disclosed as illustrations. */
.review-card figcaption{display:flex;flex-direction:row;align-items:center;gap:12px}.review-person{display:flex;flex-direction:column;min-width:0}.review-avatar{display:flex;align-items:center;justify-content:center;width:48px;height:48px;flex:0 0 48px;border-radius:50%;object-fit:cover;border:1px solid var(--line);background:var(--surface);color:var(--blue);font-weight:700}.review-card time{font-size:14px;color:var(--muted)}.review-order{font-size:14px;color:var(--muted)}.review-more{margin-top:28px}.review-more>summary{width:max-content;margin:0 auto;min-height:44px;padding:10px 22px;border:1px solid var(--line);border-radius:100px;color:var(--blue);cursor:pointer;font-weight:600}.review-more>summary:hover{background:var(--surface)}.review-more .review-grid{margin-top:24px}.review-more .review-less-label{display:none}.review-more[open] .review-more-label{display:none}.review-more[open] .review-less-label{display:inline}.review-photo-note{margin:24px 0 0;font-size:13px;color:var(--muted)}

/* Mobile: one row with equally sized, understated language/account/menu controls.
   Account text stays in the DOM for its translated accessible name and member state. */
@media(max-width:760px){
 body>header{display:grid;grid-template-columns:minmax(0,1fr) repeat(3,44px);grid-template-rows:60px;height:76px;min-height:76px;padding:8px 4%;gap:0 6px}
 body>header>.brand{grid-area:1/1;min-width:0}
 body>header .brand-logo{width:min(140px,100%);height:60px}
 body>header>.language-toggle{grid-area:1/2;justify-self:center;margin:0;padding:0;width:44px;height:44px}
 body>header>.student-login{grid-area:1/3;justify-self:center;margin:0;order:0}
 body>header>.menu{grid-area:1/4;justify-self:center;order:0}
 body>header>.language-toggle [data-language],body>header>.student-login,body>header>.menu{align-items:center;justify-content:center;box-sizing:border-box;width:44px;min-width:44px;max-width:44px;height:44px;min-height:44px;max-height:44px;padding:0;gap:0;flex:0 0 44px;border:0;border-radius:6px;background:transparent;color:var(--muted);box-shadow:none;letter-spacing:0}
 body>header>.language-toggle [data-language]{font-size:14px;font-weight:400;line-height:1}
 body>header>.student-login,body>header>.menu{display:inline-flex;font-size:0;line-height:0;overflow:hidden}
 body>header>.student-login::before{width:18px;height:18px;flex:0 0 18px;background:currentColor;mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='1.3' stroke-linecap='round'%3E%3Ccircle cx='12' cy='8' r='3.5'/%3E%3Cpath d='M4.5 21v-2a7.5 7.5 0 0 1 15 0v2'/%3E%3C/svg%3E") center/contain no-repeat}
 body>header>.menu::before{width:18px;height:18px;flex:0 0 18px;background:linear-gradient(currentColor,currentColor) 0 2px/18px 1px no-repeat,linear-gradient(currentColor,currentColor) 0 8px/18px 1px no-repeat,linear-gradient(currentColor,currentColor) 0 14px/18px 1px no-repeat}
 body>header>.menu[aria-expanded=true]::before{background:linear-gradient(45deg,transparent 47%,currentColor 48%,currentColor 52%,transparent 53%),linear-gradient(-45deg,transparent 47%,currentColor 48%,currentColor 52%,transparent 53%)}
 body>header>.language-toggle [data-language]:hover,body>header>.student-login:hover,body>header>.menu:hover,body>header>.menu[aria-expanded=true]{background:transparent;border:0;box-shadow:none;color:var(--navy)}
 body>header>nav{grid-column:1/-1;max-height:calc(100dvh - 92px)}
 html[data-language-failed] body>header>.language-toggle{width:auto;position:relative;z-index:1;background:var(--white)}
}

/* Learning hub: exercises and teaching articles share a home, with distinct reading layouts. */
.learning-hub .section{max-width:1240px;margin-inline:auto;padding-block:72px}
.learning-hub .hub-hero{display:grid;grid-template-columns:1.08fr 1fr;gap:64px;align-items:center;padding-top:80px;padding-bottom:80px}
.hub-hero .page-title{margin:0 0 24px;font-size:clamp(40px,4.4vw,64px);letter-spacing:-.04em}
.hub-hero .intro{font-size:20px;max-width:36em;color:var(--muted)}
.hub-actions{display:flex;gap:28px;align-items:center;flex-wrap:wrap;margin-top:32px}
.hub-preview{background:var(--surface);border:1px solid var(--line);border-radius:24px;padding:32px 36px;position:relative}
.hub-preview:before{content:'';position:absolute;left:-1px;top:32px;width:4px;height:48px;background:var(--blue);border-radius:4px}
.hub-preview .eyebrow{font-size:13px;margin:0 0 10px}.hub-before{color:var(--muted);padding-bottom:20px;border-bottom:1px solid var(--line);margin-bottom:22px}.hub-after{font-size:20px;line-height:1.8}.hub-caption{font-size:12px;color:var(--muted);margin-top:22px}
.learning-hub .hub-feature{display:grid;grid-template-columns:1fr 1fr;gap:64px;align-items:center;border-block:1px solid var(--line);padding-block:44px}
.hub-feature h2{font-size:clamp(26px,2.6vw,36px);margin:0;max-width:16em}.hub-feature p:not(.eyebrow){color:var(--muted);margin-top:0}.hub-feature .text-link{display:inline-block;margin-top:12px}
.hub-exercises .resource-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:30px;margin-top:36px}.hub-exercises .resource-list article{padding:28px 0;border-top:2px solid var(--navy);border-bottom:0}.hub-exercises h2{font-size:32px}.hub-exercises article h2{font-size:23px}.hub-exercises .example{font-size:16px;padding:18px;border-radius:12px;background:var(--surface)}
.learning-hub .hub-guides{padding-top:32px}.hub-guide-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;margin-top:36px}.hub-guide-grid article{border:1px solid var(--line);border-radius:18px;padding:28px;background:white;display:flex;flex-direction:column}.hub-number{font-size:14px;color:var(--teal);letter-spacing:.1em}.hub-guide-grid h3{font-size:22px}.hub-guide-grid p{color:var(--muted);margin-bottom:24px}.hub-guide-grid .text-link{margin-top:auto;font-size:15px}.hub-guide-grid h3 a:hover{text-decoration:underline;text-underline-offset:5px}
.learning-hub .hub-method{border-top:1px solid var(--line);padding-block:44px 64px}.hub-method h2{font-size:28px}.hub-method .intro{max-width:48em;color:var(--muted)}
.learning-article{max-width:980px;margin-inline:auto}.learning-article .page-title{font-size:clamp(32px,4vw,52px)}.learning-article .resource-list{max-width:760px}.hub-article-note{margin:30px 0 44px;padding-block:18px;border-block:1px solid var(--line);font-size:14px}.hub-article-note p{color:var(--muted);margin-bottom:0}
@media(max-width:1000px){.learning-hub .hub-hero{gap:32px}.hub-exercises .resource-list,.hub-guide-grid{gap:20px}.hub-preview{padding:28px}.hub-actions{gap:20px}.hub-guide-grid article{padding:22px}}
@media(max-width:760px){.learning-hub .section{padding-block:44px}.learning-hub .hub-hero{grid-template-columns:1fr;gap:32px;padding-top:44px}.hub-hero .intro{font-size:18px}.hub-hero .page-title{font-size:40px}.hub-actions .button{padding:13px 22px;font-size:16px}.hub-preview{padding:24px}.hub-after{font-size:18px}.learning-hub .hub-feature{grid-template-columns:1fr;gap:20px}.hub-exercises .resource-list,.hub-guide-grid{grid-template-columns:1fr;gap:16px}.hub-exercises .resource-list article{padding-block:24px}.hub-guide-grid article{padding:26px}.learning-hub .hub-guides{padding-top:12px}.learning-article .seo-breadcrumb{white-space:normal}.learning-article .resource-list article{padding-block:28px}}

.blog-byline{display:flex;flex-wrap:wrap;gap:8px 24px;color:var(--muted);font-size:13px;border-block:1px solid var(--line);padding:16px 0;margin:28px 0 12px}.blog-post .resource-list{margin-top:36px}.blog-post .example{white-space:normal;overflow-wrap:anywhere}.hub-blog-archive .hub-guide-grid{row-gap:28px}.hub-blog-archive .hub-guide-grid .eyebrow{font-size:13px;margin:0}.hub-blog-archive time{white-space:nowrap}.site-footer .footer-bottom>a{text-decoration:underline;text-underline-offset:4px}.policy-page>.section{max-width:980px;margin-inline:auto}.policy-languages{position:static;display:flex;gap:24px;margin-bottom:32px;background:transparent;box-shadow:none;border:0;padding:0}.policy-languages a,.policy-versions a{color:var(--blue);text-decoration:underline;overflow-wrap:anywhere}.policy-versions{display:flex;flex-direction:column;gap:40px;max-width:760px}.policy-versions>section+section{border-top:1px solid var(--line);padding-top:36px}.policy-versions h2{font-size:25px;margin-top:28px}.policy-versions li{margin-bottom:14px}.policy-page .seo-breadcrumb{white-space:normal}
.policy-versions{overflow-wrap:anywhere}
.blog-post .blog-table-wrap{overflow-x:auto;margin:24px 0;border:1px solid var(--line);border-radius:12px}.blog-table{width:100%;border-collapse:collapse;font-size:16px;line-height:1.7}.blog-table th,.blog-table td{padding:12px 16px;text-align:left;vertical-align:top;border-bottom:1px solid var(--line)}.blog-table thead th{background:var(--surface);color:var(--navy);font-size:14px}.blog-table tbody th{font-weight:600;min-width:9em}.blog-table tbody tr:last-child th,.blog-table tbody tr:last-child td{border-bottom:0}
.blog-post .justin-take{padding:24px 28px;border-left:4px solid var(--navy);background:var(--surface);border-radius:0 12px 12px 0}.blog-post .justin-take p:last-child{margin-bottom:0}.blog-post .prompt-box{font-size:16px;padding:18px;border-radius:12px;background:var(--surface)}.blog-post ol{padding-left:1.4em}.blog-post ol li{margin:12px 0;line-height:1.9}.blog-byline a{color:inherit;text-decoration:underline;text-underline-offset:3px}.blog-faq .faq-item{border-top:1px solid var(--line);padding:18px 0}.blog-faq .faq-item h3{font-size:19px;margin:0 0 8px}.blog-faq .faq-item p{margin:0;line-height:1.9}
@media(max-width:760px){.blog-table{font-size:15px}.blog-table th,.blog-table td{padding:10px 12px}.blog-post .justin-take{padding:18px}}
.blog-post .prompt-list{margin:16px 0}.blog-post .prompt-item{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:10px;margin:0 0 16px}.blog-post .prompt-item:last-child{margin-bottom:0}.blog-post .prompt-item p{margin:0}.prompt-label{font-weight:600}.prompt-text{line-height:1.8;overflow-wrap:anywhere}.prompt-copy{position:absolute;top:8px;right:8px;display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;padding:0;margin:0;border:0;border-radius:8px;background:transparent;color:#6b7280;cursor:pointer;-webkit-tap-highlight-color:transparent}.prompt-copy svg{width:16px;height:16px;display:block}.prompt-copy:hover,.prompt-copy:focus-visible{color:#1f2937;background:rgba(15,23,42,.07)}.prompt-copy:focus-visible{outline:2px solid var(--blue);outline-offset:1px}.prompt-copy.is-copied{color:#15803d}.prompt-copy.is-failed{color:#b45309}.prompt-copy [hidden]{display:none}.prompt-copy-tip{position:absolute;top:50%;right:calc(100% + 6px);transform:translateY(-50%);padding:3px 8px;border-radius:6px;background:#1f2937;color:#fff;font-size:12px;line-height:1.4;font-weight:500;white-space:nowrap;pointer-events:none}.blog-table .mark{margin-right:.35em}.blog-table .mark-label{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}.prompt-copy-tip[data-copy-done]{position:absolute;width:1px;height:1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);background:none;color:inherit;white-space:nowrap}.blog-post .prompt-box{position:relative;padding-right:56px}@media (forced-colors:active){.prompt-copy{color:ButtonText}.prompt-copy-tip{border:1px solid CanvasText}}.prompt-copy-status{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

.terms-list{display:grid;gap:18px;margin-top:22px}.terms-list p{margin:0;line-height:1.8}.terms-list strong{margin-right:.4em}.terms-effective{color:#52626b;margin:0}
.site-footer .footer-bottom>a.footer-youtube{display:inline-flex;align-items:center;gap:8px;padding:4px 0}
.site-footer .footer-youtube .youtube-icon{display:block;flex:none;width:28px;height:20px}
html[lang="en"] .site-footer .footer-local{display:none}
.closing .closing-local{margin:18px 0 0;font-size:14px}
.closing .closing-local a{color:inherit;opacity:.85;text-decoration:underline;text-underline-offset:4px}
.section-links{display:flex;flex-wrap:wrap;gap:8px 20px}
.section-links a{text-decoration:underline;text-underline-offset:4px}
/* Scroll reveals: quick and subtle so fast scrolling never shows blank sections (2026-10-30). */
.is-revealed,.is-revealed.card-entry,.motion-ready .hero-content>*.is-revealed{animation-duration:.26s!important}
.motion-ready .hero-photo.is-revealed{animation-duration:.4s!important}
.motion-ready main h1.headline-active .headline-line{animation-duration:.45s!important}
.closing:has(.is-revealed){animation-duration:.8s!important}
.is-revealed h2::after,.is-revealed.section-head h2::after{animation-duration:.3s!important;animation-delay:calc(var(--reveal-delay,0ms) + 80ms)!important}
@media(prefers-reduced-motion:reduce){.motion-pending{opacity:1!important}.is-revealed,.headline-line{animation:none!important}}
/* Failsafe: never leave content hidden if the reveal script stops working. */
.motion-ready[data-motion='on'] .motion-pending{animation:ej-reveal-failsafe 0s linear 3s forwards}
@keyframes ej-reveal-failsafe{to{opacity:1}}
