/* Shared learning layout, responsive statistics and profile. */
.trail{background-image:url('learning-landscape.svg?v=2');background-size:100% 100%;background-position:center top;background-repeat:no-repeat}
.path-line{stroke:#d9e9fa;stroke-width:25}.path-progress{stroke:#79b7f8;stroke-width:5;stroke-dasharray:3 21}
.trail-mascot{top:77%;right:0}
.course-head__language{margin:0 0 6px;font-size:.8rem;line-height:1.2;font-weight:800;color:#fff}
.course-head .eyebrow{margin-top:0;font-size:.68rem}
#guideLanguage{display:inline-flex;margin-top:9px;padding:7px 12px;border-radius:10px;background:#e2f0ff;color:#0b67dc;font-size:.95rem;font-weight:800}
.rail .cards{grid-template-rows:none}
#wordCard{position:relative;inset:auto;width:100%;display:grid;grid-template-columns:48px minmax(0,1fr);align-items:center;gap:3px 14px;padding:20px;text-align:left;z-index:auto;backdrop-filter:none}
#wordCard .word-card__badge{grid-row:1/4;width:48px;height:48px;margin:0;font-size:1.25rem}
#wordCard small{font-size:.64rem}
#wordCard strong{margin:0;font-size:1.04rem;overflow-wrap:anywhere}
#wordCard>span{margin:0;font-size:.78rem}
.streak-card [hidden]{display:none!important}
.streak-card__status svg{display:block;width:100%;height:auto;overflow:visible}
.streak-start{position:absolute;z-index:3;inset:18px 12px auto;margin:0 auto;max-width:220px;text-align:center;font-size:1.12rem;line-height:1.3;font-weight:850;color:#064aa1}
/* The original status artwork and mascot stay intact; only its numeral is live text. */
.streak-card__mascot{width:clamp(130px,55%,180px)}
.guide-select-all{display:flex;align-items:center;gap:9px;width:max-content;margin:0 0 16px;color:#176bd4;font-size:.84rem;font-weight:750;cursor:pointer}
.guide-select-all input{appearance:auto;width:19px;height:19px;margin:0;accent-color:#1680f6;cursor:pointer}
.guide-select-all input:focus-visible{outline:3px solid #91c5ff;outline-offset:3px}
.guide-select-all:has(input:disabled){color:#5487ad;cursor:default}
.guide-select-all input:disabled{cursor:default}
/* Compact repeat control occupies the former word-of-the-day position. */
.trail-review-slot{position:absolute;left:0;top:26px;width:132px;z-index:3}
.trail-review-slot .review-launch,.mobile-review-slot .review-launch{width:132px;min-height:154px;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;gap:0;padding:14px 10px 13px;border:1px solid #cfe2fb;border-radius:23px;background:linear-gradient(150deg,#fff,#f8fcff);color:#0b206d;text-align:center;box-shadow:0 9px 24px #2566ba0b;position:relative}
.trail-review-slot .review-launch:hover,.mobile-review-slot .review-launch:hover{transform:none;box-shadow:0 9px 24px #2566ba0b}
.trail-review-slot .review-launch__icon,.mobile-review-slot .review-launch__icon{width:48px;height:48px;border-radius:15px;background:linear-gradient(145deg,#38b5ff,#0875f6);color:#fff;display:grid;place-items:center;transform:rotate(-6deg);box-shadow:0 8px 16px #1676ef21}
.trail-review-slot .review-launch__icon svg,.mobile-review-slot .review-launch__icon svg{width:32px;height:32px;transform:rotate(6deg)}
.trail-review-slot .review-launch__icon svg rect,.mobile-review-slot .review-launch__icon svg rect{fill:#fff}
.trail-review-slot .review-launch__icon svg path,.mobile-review-slot .review-launch__icon svg path{stroke:#1686f7}
.trail-review-slot .review-launch__copy,.mobile-review-slot .review-launch__copy{flex:none;min-width:0;width:100%;margin-top:17px}
.trail-review-slot .review-launch strong,.mobile-review-slot .review-launch strong{font-size:1rem;font-weight:850;color:#081a68}
.trail-review-slot .review-launch small,.mobile-review-slot .review-launch small{font-size:.68rem;line-height:1.35;margin-top:5px;color:#6f88b2;font-weight:450}
.trail-review-slot .review-launch__count,.mobile-review-slot .review-launch__count{position:absolute;top:10px;right:8px;min-width:22px;height:22px;padding:0 5px;border-radius:8px;background:#e8f3ff;color:#0872ed;font-size:.65rem;border:1px solid #d2e6ff}
.mobile-review-slot,.mobile-nav-statistics{display:none}
.mobile-page.hidden{display:none}.mobile-page{display:none}
.profile-view{display:block}
.mobile-page__header{padding:8px 2px 22px}
.mobile-page__header h1{margin:0 0 9px;font-size:1.6rem;letter-spacing:-.035em;color:#081a68}
.mobile-page__header p{margin:0;color:#7388ac;font-size:.88rem;line-height:1.5}
.mobile-page__language{display:inline-flex;align-items:center;margin-top:12px;padding:6px 11px;border-radius:10px;background:#e4f0ff;color:#1669cd;font-size:.8rem;font-weight:750}
.profile-cards{max-width:640px}
.profile-cards .account-card{height:auto;min-height:232px;padding:24px;gap:22px}
.profile-cards .account-card .card__title{margin-bottom:0}
.profile-cards .account-card .account{gap:16px}
.profile-cards .account-btn{margin-top:0;min-height:48px}
@media(min-width:861px){
  .app:has(#profileView:not(.hidden)){grid-template-columns:20vw 50vw}
  .app:has(#profileView:not(.hidden))>.rail{display:none}
  .app:has(#profileView:not(.hidden))>.main{padding:32px}
  #profileView{max-width:760px;margin:0 auto}
}
@media(max-width:860px){
  .nav{grid-template-columns:repeat(4,minmax(0,1fr));gap:2px}
  .nav .mobile-nav-statistics{display:grid}
  .nav__item{min-width:0;font-size:.63rem;padding:8px 2px;gap:4px}
  .nav__item span{white-space:nowrap}
  .rail{display:none}
  .mobile-page{display:block}
  .mobile-review-slot{display:block;position:relative;z-index:3;height:0}
  .mobile-review-slot .review-launch{position:absolute;top:17px;left:0}
  .trail-review-slot{display:none}
  .trail-mascot{top:77%;right:-8px;width:150px}
  .app:has(#statisticsView:not(.hidden)){min-height:calc(100dvh - 78px)}
  .statistics-view:not(.hidden){display:flex;flex-direction:column;height:calc(100dvh - 106px);min-height:0}
  .statistics-view .mobile-page__header{flex:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 0 16px}
  .statistics-view .mobile-page__header h1{margin:0;font-size:1.4rem}
  .statistics-view .mobile-page__header p{display:none}
  .statistics-view .mobile-page__language{margin:0;font-size:.7rem;padding:6px 9px}
  .statistics-cards{flex:1;min-height:0;max-height:640px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-rows:minmax(100px,1.1fr) minmax(86px,.8fr) minmax(112px,1fr);gap:12px}
  .statistics-cards .card{min-width:0;min-height:0;padding:15px;border-radius:20px}
  .statistics-cards .streak-card{grid-column:1/-1;padding:0;height:auto}
  .statistics-cards .streak-card__mascot{width:190px;height:auto;max-height:69%;max-width:70%;object-fit:contain;object-position:bottom}
  .statistics-cards .streak-card__status{top:0;width:104px;max-height:54%;overflow:visible}
  .statistics-cards .streak-start{top:14px;font-size:1.12rem;max-width:100%}
  .statistics-cards #goalCard{grid-column:1/-1;display:flex;flex-direction:column;justify-content:center}
  .statistics-cards .card__title{margin-bottom:12px;gap:8px}
  .statistics-cards .card__title h2{font-size:.98rem}
  .statistics-cards .card__title>span{display:none}
  .statistics-cards .goal{gap:14px}
  .statistics-cards .goal__icon,.statistics-cards .goal__icon img{width:40px;height:40px}
  .statistics-cards .goal__top{font-size:.82rem;margin-bottom:5px}
  .statistics-cards .goal__count{font-size:.7rem;margin-top:3px}
  .statistics-cards #wordCard{display:flex;flex-direction:column;justify-content:center;gap:7px;padding:14px;text-align:center}
  .statistics-cards #wordCard .word-card__badge{width:clamp(42px,7dvh,64px);height:clamp(42px,7dvh,64px);margin:0 0 5px;font-size:clamp(1.3rem,3dvh,1.8rem);border-radius:17px;box-shadow:0 6px 12px #137cf222}
  .statistics-cards #wordCard small{font-size:.72rem}
  .statistics-cards #wordCard strong{font-size:clamp(1.15rem,4.8vw,1.55rem);line-height:1.2}
  .statistics-cards #wordCard>span{font-size:.94rem}
  .statistics-cards #progressCard{display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center}
  .statistics-cards #progressCard .card__title{margin:0 0 12px}
  .statistics-cards #progressCard .card__title h2{font-size:1.06rem}
  .statistics-cards .progress-wrap{display:flex;flex-direction:column;align-items:center;gap:11px}
  .statistics-cards .ring{width:clamp(56px,10dvh,90px);height:clamp(56px,10dvh,90px)}
  .statistics-cards .ring:before{inset:10px}
  .statistics-cards .ring strong{font-size:1.3rem}
  .statistics-cards .progress-copy{line-height:1.3}
  .statistics-cards .progress-copy strong{font-size:.9rem}
  .statistics-cards .progress-copy>span{display:none}
}
@media(max-width:360px){
  .nav__item{font-size:.59rem}
  .lesson--2 .lesson__text{right:calc(100% + 8px);width:64px;max-width:64px}
  .lesson--2 .lesson__text span{max-width:64px}
  .mobile-review-slot .review-launch{width:120px;min-height:148px;padding-left:8px;padding-right:8px}
  .mobile-review-slot .review-launch strong{font-size:.95rem}
  .mobile-review-slot .review-launch small{font-size:.65rem}
  .statistics-cards{gap:9px}
  .statistics-cards .card{padding:12px}
  .statistics-view .mobile-page__header h1{font-size:1.25rem}
  .statistics-view .mobile-page__language{font-size:.65rem}
}
@media(max-width:860px) and (max-height:620px){
  .statistics-cards{gap:8px}
  .statistics-cards #goalCard .card__title{margin-bottom:7px}
  .statistics-cards #progressCard .card__title{margin-bottom:6px}
  .statistics-cards .progress-wrap{gap:5px}
  .statistics-cards .streak-start{top:8px;font-size:1rem}
  .statistics-cards .streak-card__status{width:92px;top:-8px}
  .statistics-cards #wordCard{gap:3px;padding:11px}
  .statistics-cards #wordCard .word-card__badge{width:36px;height:36px;font-size:1.2rem;border-radius:12px;margin-bottom:3px}
  .statistics-cards #wordCard strong{font-size:1.1rem}
  .statistics-cards #wordCard small{font-size:.63rem}
  .statistics-cards #wordCard>span{font-size:.82rem}
  .statistics-cards #progressCard .card__title h2{font-size:.92rem}
  .statistics-cards .ring{width:56px;height:56px}
  .statistics-cards .ring:before{inset:7px}
  .statistics-cards .ring strong{font-size:1.05rem}
  .statistics-cards .progress-copy strong{font-size:.8rem}
}
@media(max-width:860px) and (max-height:500px){
  .statistics-cards{max-height:none;grid-template-rows:minmax(85px,1fr) minmax(85px,1fr)}
  .statistics-cards .streak-card,.statistics-cards #goalCard{grid-column:auto}
  .statistics-cards .streak-card__mascot{left:75%;width:150px;height:auto;max-height:88%;max-width:45%}
  .statistics-cards .streak-card__status{left:25%;top:-15px;width:110px;max-height:100%}
  .statistics-cards .streak-start{right:46%;top:25%;font-size:.88rem}
  .statistics-cards #progressCard{align-items:stretch}
  .statistics-cards .progress-wrap{flex-direction:row;justify-content:center}
  .statistics-cards #wordCard{display:grid;grid-template-columns:48px 1fr;text-align:left;gap:2px 12px}
  .statistics-cards #wordCard .word-card__badge{width:44px;height:44px;font-size:1.4rem}
  .statistics-cards #wordCard .word-card__badge{grid-row:1/4}
}
/* Glossary actions remain visible while studied words scroll. */
.guide-dialog{display:flex;flex-direction:column;overflow:hidden}
.guide-dialog__header{flex:none}
.guide-dialog__body{flex:1;min-height:0;overflow-y:auto;overscroll-behavior:contain;scrollbar-color:#a9c9ec transparent;scrollbar-width:thin}
.guide-dialog__footer{flex:none;padding:17px 26px 21px;background:#fff;border-top:1px solid #e2edf8}
.guide-dialog__footer .primary{display:block;width:100%;min-height:48px;font-size:.88rem}
@media(max-width:620px){.guide-dialog__footer{padding:14px 18px 18px}.guide-dialog__footer .primary{font-size:.82rem;padding:15px 16px}}