/* =========================================================
   v0.9.13 — Sky Route / NOVITA-endorsed learning UI

   B+ direction: sky blue and navy form the dependable base, while a very
   small violet/coral/sun palette makes the route feel alive.  The design
   intentionally keeps one next action and avoids dashboard-density.
   ========================================================= */

:root{
  --nle-bg:#f8f7f1;
  --nle-card:#ffffff;
  --nle-text:#102c4d;
  --nle-ink:#102c4d;
  --nle-sub:#607188;
  --nle-line:#dce9f1;
  --nle-brand:#2d8fe7;
  --nle-soft:#eaf6ff;
  --nle-sky:#2d8fe7;
  --nle-sky-dark:#176fbd;
  --nle-sky-soft:#eaf6ff;
  --nle-teal:#18a6b5;
  --nle-teal-dark:#088b9c;
  --nle-teal-soft:#e8f8f8;
  --nle-violet:#7866d8;
  --nle-violet-soft:#f0edff;
  --nle-sun:#ffbd43;
  --nle-coral:#f47a5e;
  --nle-good:#159a7b;
  --nle-good-soft:#e9f8f3;
  --nle-warn:#d96147;
  --nle-warn-soft:#fff0ec;
}

html,
body.nle-app-page,
.nle-app,
.nle-seo-content,
.nle-modal{
  background:var(--nle-bg);
  color:var(--nle-text);
}

.nle-app{
  --nle-brand-dark:var(--nle-sky-dark);
  max-width:760px;
  background:var(--nle-bg);
}

.nle-shell{max-width:720px;}

/* Header: small, recognisable parent-brand cue instead of a large banner. */
.nle-topbar{
  min-height:68px;
  padding:calc(12px + env(safe-area-inset-top,0px)) 16px 11px;
  border-bottom:1px solid var(--nle-line);
  background:rgba(248,247,241,.98);
}
.nle-brand{gap:10px;}
.nle-logo{
  width:38px;
  height:38px;
  border:1px solid var(--nle-sky);
  border-radius:13px;
  color:#fff;
  background:var(--nle-sky);
}
.nle-logo svg{width:24px;height:24px;}
.nle-brand-copy{gap:1px;}
.nle-brand-copy b{color:var(--nle-ink);font-size:15px;letter-spacing:-.035em;}
.nle-brand-copy small{color:var(--nle-sub);font-size:8.5px;letter-spacing:.11em;}
.nle-brand-signal{
  display:flex;
  align-items:center;
  gap:4px;
  height:5px;
  margin-top:4px;
}
.nle-brand-signal i{
  display:block;
  width:5px;
  height:5px;
  border-radius:50%;
  background:var(--nle-sky);
}
.nle-brand-signal i:nth-child(2){background:var(--nle-sun);}
.nle-brand-signal i:nth-child(3){background:var(--nle-coral);}
.nle-mini-progress{
  min-width:58px;
  border-color:#cae4f4;
  border-radius:12px;
  background:#fff;
}
.nle-mini-progress span{color:var(--nle-sky);}

/* Home is a single calm learning surface. */
.nle-main{padding:16px 16px 30px;}
.nle-mission-card{
  position:relative;
  overflow:hidden;
  padding:22px;
  border:1px solid #d7e8f1;
  border-top:0;
  border-radius:22px;
  background:var(--nle-card);
}
.nle-tricolor-line{
  position:absolute;
  z-index:3;
  top:0;
  right:0;
  left:0;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  height:4px;
  overflow:hidden;
  border-radius:22px 22px 0 0;
}
.nle-tricolor-line i{display:block;min-width:0;}
.nle-tricolor-line i:nth-child(1){background:var(--nle-sky);}
.nle-tricolor-line i:nth-child(2){background:var(--nle-sun);}
.nle-tricolor-line i:nth-child(3){background:var(--nle-coral);}
.nle-mission-head{position:relative;z-index:1;gap:16px;}
.nle-mission-head .nle-hero-copy{max-width:390px;}
.nle-home .nle-hero-kicker{
  display:flex!important;
  align-items:center;
  gap:7px;
  margin:0 0 7px;
  color:var(--nle-sky-dark);
  font-size:10px;
  font-weight:850;
  letter-spacing:.035em;
  line-height:1.3;
}
.nle-kicker-route{
  position:relative;
  display:flex;
  align-items:center;
  justify-content:space-between;
  width:25px;
  height:8px;
  flex:0 0 25px;
}
.nle-kicker-route:before{
  content:"";
  position:absolute;
  top:3px;
  right:2px;
  left:2px;
  height:1px;
  border-radius:999px;
  background:linear-gradient(90deg,var(--nle-sky) 0 33.333%,var(--nle-sun) 33.333% 66.666%,var(--nle-coral) 66.666% 100%);
}
.nle-kicker-route i{
  position:relative;
  z-index:1;
  display:block;
  width:7px;
  height:7px;
  border:1px solid #fff;
  border-radius:50%;
  background:var(--nle-sky);
}
.nle-kicker-route i:nth-child(2){background:var(--nle-sun);}
.nle-kicker-route i:nth-child(3){background:var(--nle-coral);}
.nle-mission-head h1{
  margin:0;
  color:var(--nle-ink);
  font-size:27px;
  line-height:1.22;
  letter-spacing:-.045em;
}
.nle-mastery-core{width:118px;flex:0 0 118px;text-align:right;}
.nle-mastery-core>strong{color:var(--nle-ink);font-size:34px;}
.nle-mastery-core>span{color:var(--nle-sub);font-size:9.5px;line-height:1.35;}
.nle-mastery-meter{height:6px;margin-top:9px;background:#e1eef5;}
.nle-mastery-meter i{background:var(--nle-sky);}
.nle-home-meta{
  position:relative;
  z-index:1;
  margin-top:17px;
  padding-top:12px;
  border-top-color:var(--nle-line);
}
.nle-release-status{font-size:10.5px;color:var(--nle-sub);}
.nle-release-status strong{color:var(--nle-ink);}

/* Three compact route nodes: blue = now, violet = connect, teal = use. */
.nle-memory-route{
  position:relative;
  z-index:1;
  margin-top:14px;
  padding:13px 11px;
  border:1px solid #dcecf3;
  border-radius:15px;
  background:#fbfeff;
}
.nle-memory-route>i{height:2px;background:#cde6ee;}
.nle-route-step{color:var(--nle-sub);}
.nle-route-step>span{
  width:31px;
  height:31px;
  border:1px solid #cfe2ec;
  border-radius:50%;
  background:#fff;
  color:var(--nle-sky);
  font-size:10.5px;
}
.nle-route-step b{font-size:11px;font-weight:800;}
.nle-route-step[data-route-step="2"]>span{color:var(--nle-violet);border-color:#ded8ff;background:var(--nle-violet-soft);}
.nle-route-step[data-route-step="3"]>span{color:var(--nle-teal);border-color:#cceceb;background:var(--nle-teal-soft);}
.nle-route-step.is-current>span{border-color:var(--nle-sky);background:var(--nle-sky);color:#fff;}
.nle-route-step[data-route-step="2"].is-current>span{border-color:var(--nle-violet);background:var(--nle-violet);}
.nle-route-step[data-route-step="3"].is-current>span{border-color:var(--nle-teal);background:var(--nle-teal);}
.nle-route-step.is-done{color:var(--nle-teal-dark);}
.nle-route-step.is-done>span{border-color:var(--nle-teal);background:var(--nle-teal-soft);color:var(--nle-teal-dark);}
.nle-route-step.is-done+i{background:var(--nle-teal);}
.nle-route-step[data-route-step="2"].is-done+i{background:var(--nle-violet);}
.nle-route-note{
  position:relative;
  z-index:1;
  margin:6px 2px 0;
  color:var(--nle-sub);
  font-size:10px;
  line-height:1.4;
  text-align:right;
}

.nle-mission-action{position:relative;z-index:1;padding-top:15px;}
.nle-mission-action .nle-card-title{color:var(--nle-ink);font-size:14px;}
.nle-mission-spark{width:auto;height:auto;margin-right:5px;border-radius:0;background:transparent;}
.nle-mission-spark:before{content:"✦";color:var(--nle-sun);font-size:15px;line-height:1;}
.nle-time{padding:4px 7px;border-radius:999px;color:var(--nle-sky-dark);background:var(--nle-sky-soft);font-size:10px;}
.nle-mission-action .nle-today-row{
  margin-top:7px;
  padding:10px 11px;
  border:1px solid #e0eef4;
  border-radius:12px;
  background:#f9fcfd;
}
.nle-mission-action .nle-today-row b{color:var(--nle-ink);font-size:12.5px;}
.nle-mission-action .nle-today-row small{color:var(--nle-sub);font-size:10.5px;}
.nle-dot{width:8px;height:8px;margin-top:4px;border-radius:50%;}
.nle-dot-new{background:var(--nle-sky);}
.nle-dot-review{background:var(--nle-coral);}

.nle-primary{
  border-color:var(--nle-teal);
  background:var(--nle-teal);
  color:#fff;
  border-radius:14px;
}
.nle-primary:hover{border-color:var(--nle-teal-dark);background:var(--nle-teal-dark);opacity:1;}
.nle-primary:active{border-color:var(--nle-teal-dark);background:var(--nle-teal-dark);opacity:1;}
.nle-primary:disabled{border-color:#b9cbd2;background:#b9cbd2;}
.nle-secondary{border-color:#d5e5ed;background:#fff;color:var(--nle-ink);}
.nle-secondary:hover{border-color:#bddbe7;background:#f8fcfd;}

/* Persistent navigation stays functional, but gains a soft active route state. */
.nle-bottom-nav{border-top-color:var(--nle-line);background:rgba(255,255,255,.98);}
.nle-bottom-nav button{color:#718196;}
.nle-bottom-nav button.is-active{color:var(--nle-sky);background:var(--nle-sky-soft);}
.nle-bottom-nav em{background:var(--nle-coral);}

/* Shared screens: the learning flow stays unchanged, only the visual system moves. */
.nle-page-head h1,
.nle-page-head h2,
.nle-lesson-head h1,
.nle-step-label{color:var(--nle-ink);}
.nle-page-head p{color:var(--nle-sub);}
.nle-page-card,
.nle-complete-card,
.nle-context,
.nle-map-level-summary,
.nle-map-category,
.nle-catalog-lesson,
.nle-seo-details{
  border-color:#d8e8f0;
  border-radius:18px;
  background:#fff;
}
.nle-chip{color:var(--nle-violet);background:var(--nle-violet-soft);}
.nle-lesson-step-state{border-color:#d8d2ff;color:var(--nle-violet);background:var(--nle-violet-soft);}
.nle-step.is-on{color:var(--nle-teal-dark);}
.nle-step.is-on i{border-color:var(--nle-teal);color:var(--nle-teal-dark);background:var(--nle-teal-soft);}
.nle-step.is-current{color:var(--nle-sky);}
.nle-step.is-current i{border-color:var(--nle-sky);color:#fff;background:var(--nle-sky);}
.nle-step.is-current small{color:var(--nle-sky);}

.nle-audio-card{border-color:#d3e8f2;background:#fff;}
.nle-audio-title:before{border-radius:50%;background:var(--nle-sky);}
.nle-audio-card.is-playing .nle-audio-title:before{background:var(--nle-teal);}
.nle-audio-card.is-loading .nle-audio-title:before{background:var(--nle-coral);}
.nle-play,
.nle-audio-card .nle-play{border-color:var(--nle-sky);background:var(--nle-sky);}
.nle-audio-track-fill{background:var(--nle-sky);}
.nle-speed-cycle{border-color:#cce6f3;color:var(--nle-sky-dark);background:var(--nle-sky-soft);}
.nle-speed-cycle:hover{border-color:var(--nle-sky);}
.nle-speaker,
.nle-sentence-audio,
.nle-target-audio{border-color:#cce5f1;color:var(--nle-sky-dark);background:var(--nle-sky-soft);}
.nle-understanding-card.is-known{border-color:#b5a8ee;outline-color:var(--nle-violet-soft);}
.nle-understanding-card.is-known .nle-known-check{color:var(--nle-violet);}
.nle-understanding-card.is-known .nle-check-mark{border-color:var(--nle-violet);background:var(--nle-violet);}
.nle-shadow-row.is-playing{border-left-color:var(--nle-teal)!important;background:var(--nle-teal-soft);}
.nle-shadow-row.is-playing .nle-en{color:var(--nle-teal-dark);}

/* Map: a route, not a data table. */
.nle-level-tabs button{border-color:#d7e7ee;background:#fff;}
.nle-level-tabs button.is-active{border-color:var(--nle-sky);background:var(--nle-sky);}
.nle-map-level-summary{border-left:3px solid var(--nle-sky);background:#fafdff;}
.nle-map-level-summary>strong,
.nle-map-category-head>span,
.nle-level-pct{color:var(--nle-sky-dark);}
.nle-bar{background:#dcecf3;}
.nle-bar i{background:var(--nle-sky);}
.nle-map-category-head{border-bottom-color:var(--nle-line);}
.nle-map-scenes:before{background:#cde6ee;}
.nle-scene-btn{border-color:#d8e8f0;background:#fff;}
.nle-scene-btn:not([disabled]):hover{border-color:var(--nle-sky);background:#fbfeff;}
.nle-scene-no{border-color:#d3e7f0;border-radius:12px;background:#f8fcfd;color:var(--nle-sky-dark);}
.nle-scene-btn.is-current{border-color:#b9def0;background:var(--nle-sky-soft);}
.nle-scene-btn.is-current .nle-scene-no{border-color:var(--nle-sky);background:var(--nle-sky);}
.nle-scene-btn.is-current .nle-scene-status small,
.nle-scene-btn.is-current .nle-scene-status strong{color:var(--nle-sky-dark);}
.nle-scene-btn.is-completed{background:var(--nle-teal-soft);}
.nle-scene-btn.is-completed .nle-scene-no{border-color:var(--nle-teal);color:var(--nle-teal-dark);background:var(--nle-teal-soft);}

/* The hub borrows the same bright but calm entry experience. */
.nle-hub{background:var(--nle-bg);}
.nle-hub-logo{border-radius:11px;background:var(--nle-sky);}
.nle-hub-hero{border-color:#d4e7f1;border-top-color:var(--nle-sky);background:#fff;}
.nle-hub-hero h1{color:var(--nle-ink);}
.nle-hub-route{border-color:#d7e8f0;background:#fafdff;}
.nle-hub-route span{border-color:var(--nle-sky);background:var(--nle-sky);}
.nle-hub-route>div:nth-of-type(2) span{border-color:var(--nle-violet);color:var(--nle-violet);background:var(--nle-violet-soft);}
.nle-hub-route>div:nth-of-type(3) span{border-color:var(--nle-teal);color:var(--nle-teal-dark);background:var(--nle-teal-soft);}
.nle-hub-card:before{background:var(--nle-sky);}
.nle-hub-card i{background:var(--nle-teal);}

.nle-complete-card{border-top-color:var(--nle-teal);}
.nle-complete-mark{border-color:var(--nle-teal);background:var(--nle-teal);}
.nle-complete-kicker{color:var(--nle-sky)!important;}
.nle-complete-summary strong{color:var(--nle-sky-dark);}
.nle-parent-link small,.nle-parent-link i{color:var(--nle-sky);}
.nle-parent-link:hover b,.nle-parent-link:hover i{color:var(--nle-sky-dark);}
.nle-parent-link:hover i{border-color:#b9def0;background:var(--nle-sky-soft);}

@media(max-width:560px){
  .nle-main{padding:14px 12px 28px;}
  .nle-mission-card{padding:19px 17px;border-radius:19px;}
  .nle-mission-head h1{font-size:25px;}
}

@media(max-width:430px){
  .nle-topbar{padding-right:12px;padding-left:12px;}
  .nle-mission-head{display:block;}
  .nle-mastery-core{width:100%;margin-top:15px;text-align:left;}
  .nle-mastery-meter{max-width:170px;}
  .nle-home-meta{margin-top:13px;}
  .nle-memory-route{grid-template-columns:minmax(0,1fr) 12px minmax(0,1fr) 12px minmax(0,1fr);}
}

@media(prefers-reduced-motion:reduce){
  .nle-app *, .nle-hub *{transition:none!important;animation:none!important;}
}

/* =========================================================
   v0.9.7 — ad-safe intermission and whole-lesson sorting
   ========================================================= */

/* Auto ads are allowed to appear on this page only.  The learning shell is
 * removed from the layout before the async ad script can paint over it. */
body.nle-ad-break-page{padding-top:0!important;overflow-x:hidden;}
body.nle-ad-break-page .nle-app{
  width:100%;
  max-width:none;
  min-height:100svh;
  border-radius:0;
  background:var(--nle-bg);
}
body.nle-ad-break-page .nle-app .nle-shell,
body.nle-ad-break-page .nle-app .nle-seo-content{display:none!important;}
.nle-ad-break-root[hidden]{display:none!important;}
.nle-ad-break-root{
  display:grid;
  min-height:100svh;
  padding:clamp(120px,18vh,190px) 16px calc(120px + env(safe-area-inset-bottom,0px));
  place-items:start center;
  background:var(--nle-bg);
}
.nle-ad-break-card{
  width:min(100%,520px);
  padding:28px 22px 22px;
  border:1px solid #d7e8f1;
  border-top:4px solid var(--nle-sky);
  border-radius:22px;
  background:#fff;
  text-align:center;
  box-shadow:0 16px 36px rgba(16,44,77,.08);
}
.nle-ad-break-kicker{
  margin:0 0 9px;
  color:var(--nle-sky-dark);
  font-size:10px;
  font-weight:850;
  letter-spacing:.12em;
}
.nle-ad-break-card h1{margin:0;color:var(--nle-ink);font-size:25px;letter-spacing:-.04em;}
.nle-ad-break-lead{margin:10px auto 0;max-width:34em;color:var(--nle-sub);font-size:12.5px;line-height:1.7;}
.nle-ad-break-route{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-wrap:wrap;
  gap:5px;
  margin:20px 0 8px;
  color:var(--nle-sub);
  font-size:10px;
  font-weight:800;
}
.nle-ad-break-route span{padding:7px 9px;border:1px solid #d9eaf2;border-radius:999px;background:#fafdff;}
.nle-ad-break-route span:nth-of-type(2){border-color:#ded8ff;color:var(--nle-violet);background:var(--nle-violet-soft);}
.nle-ad-break-route span:nth-of-type(3){border-color:#cceceb;color:var(--nle-teal-dark);background:var(--nle-teal-soft);}
.nle-ad-break-route span:nth-of-type(4){border-color:#f6dfb3;color:#9c6a18;background:#fff9eb;}
.nle-ad-break-route i{font-style:normal;color:#9eb8c8;}
.nle-ad-break-card .nle-primary{margin-top:14px;}
.nle-ad-break-note{margin:11px 0 0;color:#8a9bab;font-size:10px;line-height:1.5;}

/* The old hero ring and dot were decorative only. Keep the card focused on
 * the mastery meter, route and one next action at every viewport width. */
.nle-mission-card:before,
.nle-mission-card:after{
  display:none!important;
  content:none!important;
}

.nle-learning-flow{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:5px;
  margin:0 0 12px;
  padding:8px 10px;
  border:1px solid #dcecf3;
  border-radius:14px;
  background:#fbfeff;
}
.nle-learning-flow>span{
  min-width:76px;
  flex:1 1 80px;
  padding:6px 7px;
  border:1px solid #d9eaf2;
  border-radius:10px;
  background:#fff;
  text-align:center;
}
.nle-learning-flow>span b{display:block;color:var(--nle-ink);font-size:10.5px;line-height:1.25;}
.nle-learning-flow>span small{display:block;margin-top:2px;color:var(--nle-sub);font-size:8.5px;line-height:1.25;}
.nle-learning-flow>span.is-current{border-color:var(--nle-sky);background:var(--nle-sky-soft);}
.nle-learning-flow>span.is-current b{color:var(--nle-sky-dark);}
.nle-learning-flow>span.is-done{border-color:#cceceb;background:var(--nle-teal-soft);}
.nle-learning-flow>span.is-done b{color:var(--nle-teal-dark);}
.nle-learning-flow>i{flex:0 0 auto;color:#9eb8c8;font-size:11px;font-style:normal;}

#nle-lesson-root[data-step="2"] .nle-step2-sort-head{margin-bottom:5px;}
#nle-lesson-root[data-step="2"] .nle-step2-progress{font-variant-numeric:tabular-nums;}
#nle-lesson-root[data-step="2"] .nle-step2-replay{margin:0 0 12px;}
#nle-lesson-root[data-step="2"] .nle-step2-replay .nle-audio-card{margin:0;padding:14px 15px;border-radius:17px;}
#nle-lesson-root[data-step="2"] .nle-sentence-list-all{gap:9px;}
#nle-lesson-root[data-step="2"] .nle-sentence-list-all .nle-sentence{padding:12px 13px;}
#nle-lesson-root[data-step="2"] .nle-sentence-list-all .nle-sentence-index{min-width:34px;}

.nle-course-review-note{
  display:flex;
  flex-direction:column;
  gap:3px;
  margin:14px 0 2px;
  padding:11px 12px;
  border:1px solid #d9eaf2;
  border-radius:13px;
  background:#fafdff;
  color:var(--nle-sub);
  font-size:11px;
  line-height:1.55;
}
.nle-course-review-note b{color:var(--nle-ink);font-size:11.5px;}

/* v0.9.8 — targeted first learning and optional review context */
.nle-course-flow{grid-template-columns:repeat(4,minmax(0,1fr));}
.nle-course-flow>div:nth-child(4){background:#fff9eb;}
.nle-course-flow>div:nth-child(4) span{color:#5a4315;background:#f2c151;}
.nle-practice-note{
  display:flex;
  flex-direction:column;
  gap:3px;
  margin:10px 0 12px;
  padding:12px 13px;
  border:1px solid #d9eaf2;
  border-radius:14px;
  background:#fafdff;
  color:var(--nle-sub);
  font-size:11px;
  line-height:1.55;
}
.nle-practice-note b{color:var(--nle-ink);font-size:11.5px;}
.nle-quick-complete{
  margin:0 0 12px;
  padding:12px 13px;
  border:1px solid #cceceb;
  border-radius:14px;
  background:#f8fffd;
}
.nle-quick-complete-copy{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:10px;
  color:var(--nle-sub);
  font-size:10.5px;
  line-height:1.45;
}
.nle-quick-complete-copy b{color:var(--nle-ink);font-size:12px;}
.nle-quick-complete .nle-primary{margin-top:10px;}
.nle-quick-complete .nle-shadow-complete-hint{margin:7px 2px 0;}
.nle-complete-review-note{
  margin:0 0 13px;
  color:var(--nle-sub);
  font-size:10.5px;
  line-height:1.45;
  text-align:center;
}
.nle-review-stage{margin:0 2px 7px;color:var(--nle-sky-dark);font-size:11px;font-weight:900;}
.nle-review-context-toggle{margin-top:10px;}
.nle-review-context-card{margin-top:10px;}
.nle-graduation-page{padding-top:16px;}
.nle-graduation-intro{display:flex;flex-direction:column;gap:4px;color:var(--nle-sub);font-size:11px;line-height:1.55;}
.nle-graduation-intro small{color:var(--nle-sky-dark);font-size:9.5px;font-weight:900;letter-spacing:.08em;}
.nle-graduation-intro b{color:var(--nle-ink);font-size:13px;}
.nle-graduation-player{margin-top:13px;}
.nle-graduation-player .nle-audio-card{margin:0;}
.nle-graduation-status{margin:11px 2px 0;color:var(--nle-sky-dark);font-size:11px;font-weight:800;line-height:1.5;text-align:center;}
.nle-graduation-actions,.nle-graduation-picker{margin-top:12px;}
.nle-graduation-actions{display:grid;gap:8px;}
.nle-graduation-picker{padding:12px;border:1px solid #d9eaf2;border-radius:14px;background:#fafdff;}
.nle-graduation-picker-head{display:flex;flex-direction:column;gap:3px;margin-bottom:9px;}
.nle-graduation-picker-head b{color:var(--nle-ink);font-size:12px;}
.nle-graduation-picker-head small{color:var(--nle-sub);font-size:10px;line-height:1.45;}
.nle-graduation-options{
  display:grid;
  gap:6px;
  max-height:min(46vh,420px);
  overflow:auto;
  padding:2px 3px 2px 1px;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
}
.nle-graduation-option{display:grid;grid-template-columns:20px minmax(0,1fr);gap:7px;align-items:start;padding:8px 9px;border:1px solid #dcecf3;border-radius:10px;background:#fff;color:var(--nle-ink);cursor:pointer;}
.nle-graduation-option:has(input:checked){border-color:#f2c151;background:#fff9eb;}
.nle-graduation-option input{width:17px;height:17px;margin:1px 0 0;accent-color:var(--nle-coral);}
.nle-graduation-option>span{display:grid;grid-template-columns:24px minmax(0,1fr);gap:5px;align-items:start;font-size:11px;line-height:1.45;}
.nle-graduation-option>span>b{color:var(--nle-sub);font-size:10px;}
.nle-graduation-picker-actions{display:grid;gap:8px;margin-top:10px;}
.nle-graduation-picker-actions .nle-primary{margin-top:0;}
.nle-graduation-result{display:grid;gap:4px;margin:15px auto;color:var(--nle-sub);text-align:center;}
.nle-graduation-result strong{color:var(--nle-ink);font-size:15px;}
.nle-graduation-result span{font-size:11px;line-height:1.45;}

@media(max-width:560px){
  .nle-course-flow{grid-template-columns:1fr;}
}

@media(max-width:430px){
  .nle-ad-break-root{padding-right:12px;padding-left:12px;}
  .nle-ad-break-card{padding:24px 16px 19px;border-radius:19px;}
  .nle-ad-break-card h1{font-size:23px;}
  .nle-learning-flow{gap:4px;padding:7px;}
  .nle-learning-flow>span{min-width:68px;padding:6px 4px;}
  .nle-learning-flow>span small{font-size:8px;}
  .nle-learning-flow>i{font-size:10px;}
  .nle-quick-complete-copy{display:block;}
  .nle-quick-complete-copy span{display:block;margin-top:2px;}
  .nle-graduation-option>span{font-size:10.5px;}
}

/* v0.9.15 — make the learning mental model explicit without adding another
 * progress dashboard.  The first three actions are one phase; spaced review
 * is a later system action, not STEP 4. */
.nle-route-caption{
  display:flex;
  align-items:center;
  gap:7px;
  margin:14px 2px -7px;
  color:var(--nle-ink);
}
.nle-route-caption b{font-size:11px;font-weight:900;}
.nle-route-caption small{color:var(--nle-sub);font-size:9.5px;}
.nle-home .nle-memory-route{margin-top:12px;}
.nle-home .nle-route-note{
  display:flex;
  align-items:baseline;
  justify-content:flex-start;
  gap:5px;
  text-align:left;
}
.nle-home .nle-route-note span{color:var(--nle-sub);font-size:9px;}
.nle-home .nle-route-note b{color:var(--nle-sky-dark);font-size:10px;}
.nle-home .nle-route-note small{color:var(--nle-sub);font-size:9px;}

.nle-course-phase-label{
  display:flex;
  align-items:baseline;
  gap:7px;
  margin-top:16px;
  color:var(--nle-ink);
}
.nle-course-phase-label b{font-size:12px;}
.nle-course-phase-label small{color:var(--nle-sub);font-size:10px;}
.nle-course-flow{grid-template-columns:repeat(3,minmax(0,1fr));}
.nle-course-after-flow{
  display:flex;
  align-items:baseline;
  flex-wrap:wrap;
  gap:5px 7px;
  margin:0 0 13px;
  padding:10px 11px;
  border:1px solid #f1dfb9;
  border-radius:13px;
  background:#fffaf0;
  color:var(--nle-sub);
  line-height:1.45;
}
.nle-course-after-flow span{font-size:9px;}
.nle-course-after-flow b{color:#9c6a18;font-size:11px;}
.nle-course-after-flow small{flex:1 1 100%;font-size:10px;}

.nle-lesson-route{
  margin:0 0 15px;
  padding:9px 11px 8px;
  border:1px solid #dcecf3;
  border-radius:15px;
  background:#fbfeff;
}
.nle-lesson-route-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:8px;
  color:var(--nle-ink);
}
.nle-lesson-route-head b{font-size:11px;font-weight:900;}
.nle-lesson-route-head small{color:var(--nle-sub);font-size:9px;}
.nle-lesson-route .nle-stepper{margin:7px 0 5px;padding:0;}
.nle-lesson-route .nle-step small{font-size:9px;}
.nle-lesson-route-after{
  display:flex;
  align-items:baseline;
  gap:5px;
  margin-top:2px;
  padding-top:7px;
  border-top:1px solid #e5f0f4;
  color:var(--nle-sub);
  line-height:1.35;
}
.nle-lesson-route-after span{font-size:9px;}
.nle-lesson-route-after b{color:var(--nle-sky-dark);font-size:10px;}
.nle-lesson-route-after small{font-size:9px;}

.nle-map-level-summary>div{min-width:0;}
.nle-map-level-summary>strong{
  display:block;
  flex:0 0 auto;
  white-space:nowrap;
  font-size:13px;
}
.nle-map-definition{
  color:var(--nle-sky-dark)!important;
  font-size:10px!important;
  font-weight:750;
}
.nle-map-release{
  margin:6px 2px 0;
  color:var(--nle-sub);
  font-size:10px;
  line-height:1.4;
}
.nle-map-category-head>span{white-space:nowrap;font-size:10px;}
.nle-scene-status strong{white-space:nowrap;font-size:10.5px;}
.nle-scene-btn.is-started{background:#fbfeff;}
.nle-scene-btn.is-started .nle-scene-no{border-color:#c9e2ed;background:#f1f9fc;color:var(--nle-sky-dark);}
.nle-scene-btn.is-mastered{background:var(--nle-teal-soft);}
.nle-scene-btn.is-mastered .nle-scene-no{border-color:var(--nle-teal);color:var(--nle-teal-dark);background:var(--nle-teal-soft);}
.nle-scene-btn.is-current{background:var(--nle-sky-soft);}
.nle-scene-btn.is-current .nle-scene-no{border-color:var(--nle-sky);background:var(--nle-sky);color:#fff;}
.nle-scene-btn.is-current .nle-scene-status small,
.nle-scene-btn.is-current .nle-scene-status strong{color:var(--nle-sky-dark);}

/* Four equal pills made the automatic phase look like a mandatory STEP 4. */
.nle-ad-break-route span:nth-of-type(4){
  border-style:dashed;
  color:var(--nle-sky-dark);
  background:#fafdff;
}

/* The audio card is light in the current theme; keep the new live status
 * text dark enough on that surface. */
.nle-audio-card .nle-audio-current-line{
  border-color:#d8e8f0;
  color:var(--nle-ink);
  background:var(--nle-sky-soft);
}
.nle-audio-card .nle-audio-complete-status{
  border-top-color:#d8e8f0;
  color:var(--nle-sky-dark);
}
.nle-audio-card.is-complete .nle-audio-segment{color:var(--nle-sky-dark);}

@media(max-width:430px){
  .nle-route-caption{margin-top:12px;}
  .nle-home .nle-route-note{flex-wrap:wrap;row-gap:1px;}
  .nle-lesson-route{padding-right:9px;padding-left:9px;}
  .nle-lesson-route-after small{font-size:8.5px;}
  .nle-map-level-summary{gap:8px;}
  .nle-map-level-summary>strong{font-size:11px;}
}

@media(max-width:560px){
  .nle-course-flow{grid-template-columns:1fr;}
}
