/* The journey has atmosphere; interactive targets never drift or scale. */
body[data-current-mode="today"] { background: radial-gradient(ellipse at 12% 35%,#23493b55,transparent 60%),var(--bg); }
body[data-current-mode="today"] .wrap {padding-top:0;}
body[data-current-mode="today"] .wrap>header {position:sticky;top:0;z-index:50;isolation:isolate;padding-block:max(16px,env(safe-area-inset-top)) 16px;background:#112723;}
body[data-current-mode="today"] .wrap>header::before {content:'';position:absolute;inset:0;z-index:-1;background:#112723;box-shadow:0 0 0 100vmax #112723;clip-path:inset(0 -100vmax);pointer-events:none;}
.quest-home { padding-bottom: 12px; }
.quest-heading.daily-welcome { padding: 28px 0 23px; }
.quest-world-heading {display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:10px;letter-spacing:.13em;}
.quest-title-row {margin:0;}
.quest-title-row h2 {font:400 clamp(34px,6vw,51px)/1.05 var(--serif);letter-spacing:-.045em;margin:0;max-width:16ch;}
.quest-title-row h2>span {color:var(--gold);}
.quest-heading>p {margin:10px 0 0;font-size:12px;color:var(--muted);line-height:1.6;}
.quest-layout {display:grid;grid-template-columns:minmax(0,1fr);gap:20px;}
.quest-world {position:relative;isolation:isolate;border:1px solid #a5d8b930;border-radius:22px;background:radial-gradient(ellipse at 30% 30%,#29564666,transparent 58%),linear-gradient(160deg,#1d3b32,#162e29 75%);box-shadow:0 18px 70px #081b1833;overflow:hidden;padding:19px 18px 22px;}
.quest-world-heading {position:relative;z-index:1;color:var(--match);font-size:10px;}
.quest-world-heading>span:last-child {letter-spacing:.02em;color:#c0cfc5;font-size:11px;}
.quest-level-progress {display:flex;gap:5px;margin:12px 0 7px;position:relative;z-index:1;}
.quest-level-progress i {height:4px;flex:1;border-radius:9px;background:#a5d8b91c;}
.quest-level-progress i.is-done {background:var(--match);box-shadow:0 0 10px #a5d8b944;}
.quest-landscape {position:absolute;inset:78px 18px 158px;pointer-events:none;z-index:-1;}
.quest-ribbon {position:absolute;inset:0;width:100%;height:100%;overflow:visible;pointer-events:none;z-index:-1;}
.quest-ribbon path {fill:none;stroke:#a5d8b936;stroke-width:2.5;stroke-dasharray:3 9;stroke-linecap:round;}
.quest-orbit {position:absolute;border:1px solid #a5d8b90a;border-radius:50%;width:390px;height:390px;left:-290px;top:55px;}
.orbit-two {left:auto;right:-290px;top:195px;width:440px;height:440px;box-shadow:0 0 0 28px #a5d8b903,0 0 0 58px #a5d8b903;}
.quest-ambient {position:absolute;color:#a5d8b955;font:42px var(--serif);animation:quest-shimmer 6s ease-in-out infinite;}
.note-one {right:9%;top:4%;font-size:48px;transform:rotate(14deg);}
.note-two {left:5%;top:60%;font-size:35px;animation-delay:-2s;}
.star-one {left:7%;top:25%;color:#eddbb56b;font-size:29px;animation-delay:-3s;}
.star-two {right:8%;top:65%;color:#eddbb54f;font-size:23px;animation-delay:-4s;}
.quest-lessons {list-style:none;padding:9px 0 0;margin:0;}
.quest-stop {position:relative;display:grid;grid-template-columns:45% 55%;align-items:center;min-height:100px;}
.quest-stop.on-right {grid-template-columns:55% 45%;}
.quest-stop.on-right .quest-node {grid-column:2;grid-row:1;}
.quest-stop.on-right .quest-stop-copy {grid-column:1;grid-row:1;text-align:right;justify-self:end;}
.quest-node {width:68px;height:70px;position:relative;padding:0;border:0;background:transparent;justify-self:center;border-radius:50%;color:#dbe9dd;}
.quest-node-face {display:grid;place-items:center;position:absolute;inset:0 0 6px;border:1px solid #819f8c4a;border-radius:50%;background:linear-gradient(145deg,#315145,#213d34);box-shadow:0 6px 0 #102920,0 8px 0 #819f8c25,inset 0 2px 0 #ffffff0e;}
.quest-node svg {width:27px;height:27px;}
.quest-node-number {position:absolute;bottom:0;right:0;display:grid;place-items:center;width:21px;height:21px;font-size:9px;font-weight:600;background:#243e33;border:1px solid #6b8b744f;border-radius:50%;color:#b0c4b7;}
.quest-stop.is-current {min-height:120px;}
.quest-stop.is-current .quest-node {width:82px;height:84px;}
.quest-stop.is-current .quest-node-face {color:#1e4934;background:linear-gradient(140deg,#dbefd4,#b8dfae);border:1px solid #e2f3d5;box-shadow:0 7px 0 #63875a,0 9px 0 #071e19,0 0 0 9px #bfe2af0b,0 0 0 10px #bfe2af24,0 0 50px #bfe2af20,inset 0 3px 0 #fff6;}
.quest-stop.is-current .quest-node-face::after {content:'';position:absolute;inset:-10px;border:1px solid #c9e9b7;border-radius:50%;opacity:.12;animation:quest-shimmer 5s ease-in-out infinite;}
.quest-stop.is-current .quest-node svg {width:33px;height:33px;}
.quest-stop.is-current .quest-node-number {color:#183d2e;background:#d7eac9;border-color:#97b987;}
.quest-stop.is-current .quest-node:hover .quest-node-face {background:#e1efd7;}
.quest-stop.is-current .quest-node:focus-visible {outline:2px solid var(--gold);outline-offset:13px;}
.quest-node {scroll-margin-block:24px;}
.quest-stop.is-current .quest-node:active .quest-node-face {box-shadow:0 7px 0 #63875a,0 9px 0 #071e19,inset 0 0 0 3px #77996655;}
.quest-stop.is-complete .quest-node-face {background:#749b7844;color:#beddaa;border-color:#a5d8b950;}
.quest-stop.is-locked .quest-node {color:#99afa1;}
.quest-stop-copy {position:relative;z-index:1;padding:8px 0;max-width:180px;}
.quest-stop-state {font-size:8px;font-weight:600;letter-spacing:.13em;color:#a5d8b9b8;}
.quest-stop h3 {font-size:13px;font-weight:500;letter-spacing:-.01em;margin:6px 0;color:#bed0c2;}
.quest-stop.is-current h3 {color:var(--paper);font-size:15px;margin:7px 0 10px;}
.quest-lesson-hint {font-size:10px;line-height:1.5;color:#bdccc1;margin:0;overflow-wrap:anywhere;}
.quest-time {display:block;color:#aabbb1;font-size:9px;margin-top:9px;}
.quest-treasure {position:relative;display:flex;align-items:center;gap:8px;width:100%;min-height:137px;margin:12px 0 0;padding:8px 12px 4px 0;border:1px solid #dac18d2e;background:linear-gradient(120deg,#dac18d0e,#dac18d05);border-radius:16px;color:var(--gold);text-align:left;}
.quest-chest-art {width:140px;max-width:43%;flex-shrink:0;overflow:visible;}
.quest-treasure>svg:last-child {width:18px;height:18px;margin-left:auto;flex-shrink:0;}
.quest-treasure-copy {display:flex;flex-direction:column;gap:7px;}
.quest-treasure-eyebrow {font-size:8px;font-weight:500;letter-spacing:.1em;color:#dfc593;}
.quest-treasure-copy strong {font:400 21px/1.12 var(--serif);letter-spacing:-.025em;color:#f0dab0;}
.quest-treasure-copy>span:last-child {font-size:10px;color:#c2baa3;line-height:1.5;}
.quest-treasure:hover {border-color:#dac18d77;background:#dac18d0e;}
.chest-spark {animation:quest-shimmer 5.5s ease-in-out infinite;}
.chest-light {opacity:.08;}
.is-earned .chest-light,.quest-reveal-art .is-open .chest-light {animation:quest-shimmer 4.5s ease-in-out infinite;}
.is-earned .chest-lid,.quest-reveal-art .is-open .chest-lid {transform:translateY(-12px) rotate(-6deg);transform-origin:35px 65px;}
.quest-next {width:100%;margin-top:16px;}
.quest-sidebar {display:flex;flex-direction:column;gap:20px;}
.quest-payoff {display:none;}
.quest-side-kicker {color:var(--gold);font-size:9px;font-weight:500;letter-spacing:.13em;text-transform:uppercase;}
.quest-sidequest.daily-free {margin:0;}
.quest-sidequest .daily-free-entry {padding:17px 4px;gap:16px;border-top:0;}
.quest-compass {display:grid;place-items:center;border:1px solid #dac18d44;width:44px;height:44px;border-radius:50%;font-size:28px;color:var(--gold);flex-shrink:0;}
.quest-sidequest .daily-free-copy {gap:6px;flex:1;}
.quest-sidequest .daily-free-copy strong {font:400 23px var(--serif);}
.quest-sidequest .daily-free-copy>span:last-child {font-size:11px;}
.quest-reward-dialog {position:fixed;inset:0;margin:auto;width:min(460px,calc(100% - 24px));max-width:calc(100% - 24px);max-height:calc(100dvh - 32px);overflow-y:auto;border:1px solid #d4c59455;border-radius:23px;background:radial-gradient(ellipse at 50% 0,#48624466,transparent 65%),#1a332c;padding:28px;color:var(--paper);text-align:center;box-shadow:0 28px 90px #0008;}
.quest-reward-dialog::backdrop {background:#051510dd;backdrop-filter:blur(7px);}
.quest-dialog-close {position:absolute;right:12px;top:12px;width:44px;height:44px;border:0;background:#0d261d66;border-radius:50%;color:var(--muted);font:25px var(--serif);z-index:2;}
.quest-reveal-art {height:135px;display:flex;align-items:center;justify-content:center;margin:-5px 0 8px;}
.quest-reveal-art .quest-chest-art {width:174px;max-width:none;}
.quest-reward-dialog h2 {font:400 33px/1.1 var(--serif);letter-spacing:-.035em;margin:13px 0;}
.quest-dialog-description {font-size:12px;line-height:1.7;color:#bdccc1;max-width:34ch;margin:0 auto 20px;}
.quest-moods {display:flex;gap:5px;margin-bottom:18px;}
.quest-moods button {flex:1;background:#ffffff04;border:1px solid #a5d8b92b;border-radius:8px;color:#b8c7ba;font-size:10px;font-family:inherit;padding:10px 5px;min-height:44px;}
.quest-moods button[aria-pressed="true"] {color:#f3dbab;border-color:#dac18d88;background:#dac18d13;}
.quest-record {padding:19px 14px;border:1px solid #dac18d33;border-radius:13px;background:#0e251e88;}
.quest-record h3 {font:400 26px var(--serif);letter-spacing:-.025em;margin:9px 0 18px;}
.quest-chords {display:flex;gap:8px;margin-bottom:13px;}
.quest-chord {flex:1;padding:12px 2px;border:1px solid #a5d8b932;border-radius:7px;background:#a5d8b906;color:#cadac9;font:22px var(--serif);transition:background .4s,color .4s;}
.quest-chord.is-playing {background:#c5e3b6;color:#183d2d;border-color:#d5eccb;box-shadow:0 0 20px #c5e3b622;}
.quest-original {font-size:9px;color:#9eb2a2;}
.quest-listen {margin-top:19px;width:100%;min-height:49px;}
.quest-dialog-continue {display:flex;align-items:center;justify-content:center;gap:10px;width:100%;border:0;background:none;color:#c7d6c8;font-size:11px;min-height:48px;margin-top:8px;}
.quest-dialog-continue svg {width:17px;height:17px;}
.quest-unlock-hint {font-size:11px;color:var(--gold);margin:20px 0 0;}
.quest-audio-status:not(.sr-only) {font-size:12px;color:var(--gold);}
.quest-reveal-art .is-open .chest-lid {animation:quest-unlock 1.1s cubic-bezier(.16,1,.3,1) both;}
@keyframes quest-unlock {from{transform:translateY(0) rotate(0deg)}to{transform:translateY(-12px) rotate(-6deg)}}
@keyframes quest-shimmer {0%,100%{opacity:.25}50%{opacity:.8}}
@media(min-width:700px){
 .quest-layout {grid-template-columns:minmax(340px,1.2fr) minmax(250px,.8fr);gap:35px;align-items:start;}
 .quest-heading.daily-welcome {padding:38px 0 28px;}
 .quest-world {padding:22px 25px;}
 .quest-landscape {inset:82px 25px 158px;}
 .quest-stop {min-height:105px;}
 .quest-stop.is-current {min-height:126px;}
 .quest-payoff {display:block;padding:30px 20px 23px;text-align:center;}
 .quest-payoff h3 {font:400 34px/1.13 var(--serif);letter-spacing:-.035em;margin:21px 0 15px;}
 .quest-payoff p {font-size:12px;line-height:1.8;color:#b2c2b7;max-width:29ch;margin:0 auto 22px;}
 .quest-vinyl {display:grid;place-items:center;margin:32px auto 0;width:141px;height:141px;border-radius:50%;background:repeating-radial-gradient(circle,#143025 0,#143025 3px,#79997922 4px,#122a23 5px);border:1px solid #90a78855;box-shadow:10px 15px 25px #051b1a66;transform:rotate(-15deg);}
 .quest-vinyl>span {display:grid;place-items:center;width:49px;height:49px;border-radius:50%;background:#d7bd88;color:#315140;font:30px var(--serif);border:4px solid #ddc996;}
 .quest-reward-choice {display:flex;align-items:center;justify-content:space-between;width:100%;text-align:left;border:1px solid #dac18d33;background:#dac18d09;border-radius:10px;padding:15px;color:#a6b6a8;font-size:10px;line-height:1.8;}
 .quest-reward-choice strong {font-size:12px;color:var(--gold);font-weight:500;}
 .quest-reward-choice svg {width:20px;height:20px;color:var(--gold);}
 .quest-sidebar {gap:28px;padding-top:10px;}
}
@media(min-width:1000px){.quest-layout {gap:60px;grid-template-columns:minmax(390px,1.1fr) minmax(300px,.9fr);}.quest-world {padding:23px 35px;}.quest-landscape {inset-inline:35px;}.quest-payoff {padding-inline:40px;}.quest-payoff h3{font-size:39px;}.quest-node {width:73px;height:76px;}.quest-stop-copy {max-width:195px;}.quest-stop h3 {font-size:14px;}.quest-stop.is-current h3 {font-size:17px;}}
@media(max-width:359px){.quest-world{padding-inline:11px;}.quest-title-row h2{font-size:31px;}.quest-landscape{inset-inline:11px;}.quest-stop h3{font-size:12px;}.quest-stop.is-current h3{font-size:13px;}.quest-treasure{gap:3px;padding-right:8px;}.quest-treasure-copy strong{font-size:18px;}.quest-reward-dialog{padding:25px 16px;}}
@media(prefers-reduced-motion:reduce){.quest-home *, .quest-reward-dialog * {animation:none!important;transition:none!important;}}



/* The streak lives with the app chrome; paging stays out of the title. */
.header-streak {position:relative;display:none;align-items:center;justify-content:center;gap:5px;min-width:49px;height:44px;margin-right:8px;padding:0 9px;border:0;border-radius:18px;background:none;color:#91a596;flex-shrink:0;cursor:pointer;font-family:inherit;}
.header-streak::before {content:'';position:absolute;inset:5px 0;border:1px solid #dac18d21;border-radius:18px;background:#dac18d06;pointer-events:none;}
body[data-current-mode="today"] .header-streak {display:inline-flex;}
.header-streak.has-streak {color:#edca86;}
.header-streak.has-streak::before {background:#dac18d12;border-color:#dac18d44;}
.header-streak:hover::before,.header-streak[aria-expanded="true"]::before {background:#dac18d21;border-color:#dac18d88;}
.header-streak:focus-visible {outline:2px solid var(--gold);outline-offset:2px;}
.header-streak svg {width:18px;height:21px;flex-shrink:0;transform:translateY(-1px);}
.header-streak strong {font-size:12px;line-height:1;font-weight:600;font-variant-numeric:tabular-nums;}
.quest-home {overflow:visible;}
.quest-page {touch-action:pan-y pinch-zoom;}
.quest-locked-note {display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding:12px 0 4px;color:#d8c598;font-size:10px;}
.quest-locked-note>span,.quest-locked-note button {display:flex;align-items:center;gap:7px;}
.quest-locked-note svg {width:15px;height:15px;}
.quest-locked-note button {min-height:36px;padding:7px 0;border:0;background:none;color:var(--match);font-size:10px;}
@media(max-width:359px){body[data-current-mode="today"] #homeLabel{width:145px;}.header-streak{margin-right:3px;min-width:43px;padding-inline:6px;}}
body[data-current-mode="today"] .wrap>header>.actions {flex-direction:row;align-items:center;}

/* A quiet home for the weekly calendar and the meaning behind the flame. */
html.streak-modal-open {overflow:hidden;}
.streak-dialog {position:fixed;inset:0;margin:auto;width:min(440px,calc(100% - 24px));max-width:calc(100% - 24px);max-height:calc(100dvh - 32px);overflow-y:auto;overscroll-behavior:contain;padding:30px 26px 24px;border:1px solid #dac18d4d;border-radius:24px;background:radial-gradient(ellipse at 50% 0,#695b3430,transparent 55%),#1a332c;color:var(--paper);box-shadow:0 28px 90px #0008;text-align:center;}
.streak-dialog::backdrop {background:#051510cc;backdrop-filter:blur(7px);}
.streak-emblem {display:grid;place-items:center;width:66px;height:66px;margin:3px auto 17px;border-radius:50%;border:1px solid #dac18d33;background:#dac18d0b;color:#91a596;}
.streak-emblem svg {width:30px;height:35px;}
.has-streak .streak-emblem {color:#edca86;border-color:#dac18d55;background:#dac18d13;}
.streak-dialog h2 {margin:0;font:400 34px/1.12 var(--serif);letter-spacing:-.035em;}
#streak-description {max-width:31ch;margin:12px auto 23px;font-size:12px;line-height:1.7;color:#bdccc1;}
.streak-habit .habit-card {padding:19px 18px 21px;border-color:#a5d8b92e;border-radius:16px;background:#10292280;text-align:left;}
.streak-habit .habit-title {font-size:21px;}
.streak-habit .habit-summary {font-size:11px;margin-top:5px;}
.streak-habit .habit-streak {display:none;}
.streak-habit .habit-week {margin-top:22px;}
.streak-habit .habit-day-mark {width:min(32px,100%);}
.streak-explainer {margin-top:23px;text-align:left;}
.streak-explainer h3 {margin:0 0 9px;font:400 21px/1.2 var(--serif);letter-spacing:-.02em;}
.streak-explainer p,.streak-goal-note {font-size:11px;line-height:1.7;color:#b3c4b8;}
.streak-explainer p {margin:8px 0 0;}
.streak-goal-note {text-align:left;margin:15px 0 20px;color:#92aa9c;}
.streak-done.daily-primary {width:100%;justify-content:center;min-height:48px;}
@media(max-width:359px){.streak-dialog{padding:25px 20px 20px;}.streak-dialog h2{font-size:29px;}.streak-habit .habit-card{padding-inline:12px;}}

/* The level stays in view; the path opens at the next playable lesson. */
.quest-world {display:flex;flex-direction:column;height:460px;padding-bottom:8px;}
.quest-world-heading,.quest-level-progress {flex-shrink:0;}
.quest-level-menu {position:relative;display:inline-flex;align-items:center;}
.quest-level-menu::after {content:'⌄';position:absolute;right:5px;top:11px;pointer-events:none;font-size:13px;}
.quest-level-picker {appearance:none;border:0;background:transparent;color:var(--match);font-family:inherit;font-size:10px;letter-spacing:.1em;text-transform:uppercase;padding:10px 23px 10px 0;width:90px;min-height:38px;cursor:pointer;}
.quest-level-picker option {background:#1a332c;color:var(--paper);}
.quest-level-picker:focus-visible {outline:2px solid var(--gold);outline-offset:2px;border-radius:4px;}
.quest-path-scroll {position:relative;flex:1;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior-y:contain;scrollbar-width:none;touch-action:pan-y pinch-zoom;}
.quest-path-scroll::-webkit-scrollbar {display:none;width:0;height:0;}
.quest-path-scroll:focus-visible {outline:1px solid #a5d8b97a;outline-offset:-1px;border-radius:10px;}
.quest-path-content {position:relative;isolation:isolate;padding:14px 0 22px;}
/* Keep the decorative orbits inside the path instead of widening its scroll area. */
.quest-path-content .quest-landscape {inset:0 0 110px;overflow:hidden;}
.quest-path-scroll .quest-node {scroll-margin-block:24px;}
.quest-world .quest-level-progress {margin-top:3px;margin-bottom:12px;}

.quest-path-scroll {mask-image:linear-gradient(to bottom,transparent,#000 12px,#000 calc(100% - 12px),transparent);}

/* Continuous journey presentation: the path belongs to the page canvas, not a
   framed game board. The reusable nodes remain the same; only their scene
   treatment changes here. */
body[data-current-mode="today"] .wrap { max-width: none; padding-inline: clamp(18px, 5vw, 64px); }
.quest-home { max-width: 1180px; margin-inline: auto; }
.quest-layout { display: block; }
.quest-world { border: 0; border-radius: 0; background: none; box-shadow: none; overflow: visible; padding: 0; }
.quest-path-content { min-height: 430px; padding-inline: clamp(8px, 4vw, 54px); }
.quest-path-content::before { content: ''; position: absolute; inset: 0; z-index: -2; pointer-events: none; background: radial-gradient(ellipse at 50% 34%, #29564624, transparent 58%), radial-gradient(ellipse at 15% 90%, #a5d8b90b, transparent 42%); }
.quest-path-scroll { margin-inline: calc(-1 * clamp(8px, 4vw, 54px)); padding-inline: clamp(8px, 4vw, 54px); }
.quest-landscape { inset-inline: clamp(8px, 4vw, 54px); }
.quest-treasure { border-inline: 0; border-radius: 0; background: linear-gradient(90deg, transparent, #dac18d0c 50%, transparent); }
.quest-sidebar { display: block; }
.quest-payoff { display: none !important; }
.quest-sidequest { display: block; max-width: 560px; margin: 8px auto 0; }
@media(min-width:700px){
  .quest-layout { display: block; }
  .quest-path-content { min-height: 500px; }
  .quest-path-scroll { margin-inline: calc(-1 * clamp(8px, 4vw, 54px)); }
  .quest-sidequest { display: block; max-width: 620px; }
}

/* Lesson copy beside each stage. */
.quest-node-number { display: none; }
.quest-stop-copy { max-width: 175px; padding-top: 11px; }
.quest-stop h3 { font: 400 17px/1.12 var(--serif); color: var(--paper); }
.quest-stop-state { color: var(--match); }
.quest-treasure { min-height: 155px; margin-top: 20px; }
@media(max-width:420px){
  .quest-stop-copy { max-width: 145px; }
  .quest-stop h3 { font-size: 15px; }
}

.quest-bottom-tabs { display: flex; justify-content: space-around; gap: 18px; margin: 18px -18px 0; padding: 15px 12px max(15px, env(safe-area-inset-bottom)); border-top: 1px solid #a5d8b918; background: #0d2822cc; }
.quest-bottom-tab { display: grid; justify-items: center; gap: 5px; min-width: 110px; padding: 5px 14px; border: 0; background: none; color: #94a79b; font: 11px var(--serif); }
.quest-bottom-tab svg { width: 28px; height: 28px; }
.quest-bottom-tab.is-active { color: var(--match); }

/* The lesson path is a full-bleed scene. Keep its copy readable with the
   existing inner padding while letting the background and route reach both
   edges of the viewport. Every lesson target uses a square box so its face
   stays circular at every breakpoint. */
.quest-world {
  width: 100vw;
  margin-left: calc(50% - 50vw);
}
/* Full-bleed scenes still need a readable gutter for the level controls. */
.quest-world-heading { padding-inline: clamp(18px, 5vw, 64px); }
.quest-world .quest-level-progress { margin-inline: clamp(18px, 5vw, 64px); }

/* Let the journey own the full viewport instead of widening a child inside
   the padded app wrapper. The chrome and readable copy retain their gutters. */
body[data-current-mode="today"] .wrap { padding-inline: 0; }
body[data-current-mode="today"] .wrap > header { padding-inline: clamp(18px, 5vw, 64px); }
.quest-home { width: 100%; max-width: none; margin-inline: 0; }
.quest-heading.daily-welcome { padding-inline: clamp(18px, 5vw, 64px); }
.quest-world { width: 100%; margin-inline: 0; }
.quest-world-heading { padding-inline: clamp(18px, 5vw, 64px); }
.quest-world .quest-level-progress { margin-inline: clamp(18px, 5vw, 64px); }
.quest-path-scroll { margin-inline: 0; padding-inline: 0; }
.quest-path-content { padding-inline: clamp(18px, 5vw, 64px); }
.quest-landscape { inset-inline: 0; }
.quest-sidequest { margin-inline: clamp(18px, 5vw, 64px); max-width: none; }

/* Floating stages. Every lesson is a thick disc with the lesson's own object
   standing on it, so the five lessons read as five different things from a
   distance. The deck (.quest-node-face) is the connector anchor and the center
   of the hit target; a badge carries the completed or locked state; the current
   stage floats under a soft spotlight. Pure CSS and inline SVG; all motion
   respects reduced motion through the existing .quest-home rule. */
.quest-stop { min-height: 168px; }
.quest-stop.is-current { min-height: 184px; }
.quest-node,
.quest-stop:not(.is-complete) .quest-node,
.quest-stop.is-current .quest-node { --stage: 136px; width: var(--stage); height: var(--stage); aspect-ratio: auto; overflow: visible; color: #e3f0e6; border-radius: 0; }
.quest-stop.is-current .quest-node { --stage: 150px; }
.quest-node-face,
.quest-stop.is-current .quest-node-face { display: block; position: absolute; inset: calc(var(--stage) * .32) calc(var(--stage) * .045) auto; height: calc(var(--stage) * .41); aspect-ratio: auto; overflow: visible; border: 0 !important; border-radius: 50%; background: none !important; box-shadow: none !important; color: inherit; opacity: 1; }
.quest-stop.is-current .quest-node-face { inset: calc(var(--stage) * .36) calc(var(--stage) * .045) auto; }
.quest-node-face::before, .quest-node-face::after { display: none !important; }
.quest-stage-side { position: absolute; left: 0; right: 0; top: 50%; height: calc(var(--stage) * .35); border-radius: 0 0 50% 50% / 0 0 calc(var(--stage) * .205) calc(var(--stage) * .205); background: linear-gradient(90deg, #102720, #24493d 40%, #1b3a31 70%, #0b1c17); box-shadow: inset 0 -6px 8px #00000059; }
.quest-stage-top { position: absolute; inset: 0; border-radius: 50%; background: linear-gradient(180deg, #3f7260, #223f36); box-shadow: inset 0 2px 0 #ffffff33, inset 0 -8px 12px #00000047, 0 1px 0 #5a8f78; }
.quest-stage-object, .quest-stage-reflection { position: absolute; left: 50%; width: calc(var(--stage) * .52); height: calc(var(--stage) * .52); transform: translateX(-50%); pointer-events: none; }
.quest-stage-object { top: calc(var(--stage) * -.23); filter: drop-shadow(0 12px 8px #00000073); }
.quest-stage-reflection { top: calc(var(--stage) * .09); transform: translateX(-50%) scaleY(-.45); opacity: .18; -webkit-mask-image: linear-gradient(to top, transparent, #000); mask-image: linear-gradient(to top, transparent, #000); }
.quest-node .quest-stage-object svg, .quest-node .quest-stage-reflection svg,
.quest-stop.is-current .quest-node .quest-stage-object svg, .quest-stop.is-current .quest-node .quest-stage-reflection svg { width: 100%; height: 100%; }
.quest-stop.is-current .quest-node .quest-stage-object svg, .quest-stop.is-current .quest-node .quest-stage-reflection svg { stroke-width: 1.9; }
.quest-stage-cast { position: absolute; left: 50%; top: 22%; width: 54%; height: 30%; transform: translateX(-50%); border-radius: 50%; background: radial-gradient(ellipse, #0b2a1fb3, transparent 68%); filter: blur(3px); opacity: .55; pointer-events: none; }
.quest-stage-shadow { position: absolute; left: 14%; right: 14%; bottom: 6px; height: 20px; border-radius: 50%; background: radial-gradient(ellipse, #000000a6, transparent 70%); filter: blur(3px); pointer-events: none; }
.quest-stage-badge { position: absolute; right: -2px; top: calc(var(--stage) * .235); display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--gold); color: #3b2a05; box-shadow: 0 3px 0 #9a6f1a, 0 6px 10px #00000066; }
.quest-node .quest-stage-badge svg { width: 20px; height: 20px; }
.quest-stage-badge.is-locked { background: #2d4453; color: #9fb1bb; box-shadow: 0 3px 0 #16242e, 0 6px 10px #00000066; }
/* Locked: a dim stage in the app's slate, art kept but hushed. */
.quest-stop.is-locked .quest-node { color: #6f8795; }
.quest-stop.is-locked .quest-stage-top { background: linear-gradient(180deg, #2a4556, #1a2e3b); box-shadow: inset 0 2px 0 #ffffff1f, inset 0 -8px 12px #00000047, 0 1px 0 #3a5468; }
.quest-stop.is-locked .quest-stage-side { background: linear-gradient(90deg, #0d1820, #223745 40%, #182a36 70%, #0a141b); }
.quest-stop.is-locked .quest-stage-object { filter: drop-shadow(0 10px 6px #00000073) saturate(.4); }
.quest-stop.is-locked .quest-stage-reflection { opacity: .08; }
/* Complete: a mint-lit stage with a gold check. */
.quest-stop.is-complete .quest-node { color: #baf3d4; }
.quest-stop.is-complete .quest-stage-top { background: linear-gradient(180deg, #3d8a69, #214d3d); box-shadow: inset 0 2px 0 #ffffff40, inset 0 -8px 12px #00000047, 0 0 0 3px #43d79633; }
.quest-stop.is-complete .quest-stage-side { background: linear-gradient(90deg, #0f3326, #2a7a58 40%, #1f5a44 70%, #0e2a20); }
/* Current: the lit stage. The deck glows, the object stands in a soft cone of
   light, and the whole platform floats over its own shadow. */
.quest-stop.is-current .quest-node { color: var(--paper); }
.quest-stop.is-current .quest-stage-top { background: radial-gradient(ellipse at 50% 30%, #d8ffe9, #79e2b4 45%, #43d796 100%); box-shadow: inset 0 2px 0 #ffffffb3, inset 0 -8px 12px #14644659, 0 0 30px #43d79673; }
.quest-stop.is-current .quest-stage-side { background: linear-gradient(90deg, #176a4a, #43d796 40%, #2a8c62 70%, #13523a); }
.quest-stop.is-current .quest-stage-object { width: calc(var(--stage) * .6); height: calc(var(--stage) * .6); top: calc(var(--stage) * -.36); filter: drop-shadow(0 14px 10px #00000066) drop-shadow(0 0 10px #ffffff59); }
.quest-stop.is-current .quest-stage-reflection { width: calc(var(--stage) * .6); height: calc(var(--stage) * .6); top: calc(var(--stage) * .06); opacity: .28; color: #0f3b2a; }
.quest-stop.is-current .quest-stage-shadow { background: radial-gradient(ellipse, #43d79699, transparent 70%); }
.quest-stage-beam { position: absolute; left: 50%; top: calc(var(--stage) * -.5); width: calc(var(--stage) * 1.2); height: calc(var(--stage) * 1.3); transform: translateX(-50%); pointer-events: none; background: conic-gradient(from 157deg at 50% 0%, #79e2b400 0deg, #79e2b44d 10deg, #79e2b485 23deg, #79e2b44d 36deg, #79e2b400 46deg); filter: blur(5px); -webkit-mask-image: radial-gradient(ellipse 56% 74% at 50% 58%, #000 38%, #000000b3 65%, transparent 100%); mask-image: radial-gradient(ellipse 56% 74% at 50% 58%, #000 38%, #000000b3 65%, transparent 100%); }
.quest-stage-pool { position: absolute; left: 50%; top: calc(var(--stage) * .27); width: calc(var(--stage) * 1.1); height: calc(var(--stage) * .47); transform: translateX(-50%); border-radius: 50%; background: radial-gradient(ellipse, #79e2b447, #79e2b414 55%, transparent 72%); filter: blur(4px); pointer-events: none; }
.quest-stage-dust { position: absolute; width: 6px; height: 6px; border-radius: 50%; background: #baf3d4; box-shadow: 0 0 8px #79e2b4; pointer-events: none; opacity: .5; }
.quest-stage-dust:nth-of-type(3) { left: 18%; top: 36%; }
.quest-stage-dust:nth-of-type(4) { left: 78%; top: 30%; width: 4px; height: 4px; }
.quest-stage-dust:nth-of-type(5) { left: 28%; top: 14%; width: 4px; height: 4px; }
.quest-stop.is-current .quest-node:hover .quest-stage-top { background: radial-gradient(ellipse at 50% 30%, #eafff3, #8fe9c1 45%, #4fdd9e 100%); }
.quest-stop.is-current .quest-node:active .quest-node-face { transform: translateY(4px); }
.quest-stop.is-current .quest-node:active .quest-stage-shadow { transform: scale(.9); }
.quest-stop.is-current .quest-node:focus-visible { outline: 2px solid var(--gold); outline-offset: 6px; border-radius: 24px; }
@media(prefers-reduced-motion:no-preference){
  .quest-stop.is-current .quest-node-face { animation: quest-stage-float 3.2s ease-in-out infinite; }
  .quest-stop.is-current .quest-stage-object { animation: quest-stage-hover 2.3s ease-in-out -0.6s infinite; }
  .quest-stop.is-current .quest-stage-reflection { animation: quest-stage-reflect 2.3s ease-in-out -0.6s infinite; }
  .quest-stop.is-current .quest-stage-cast { animation: quest-stage-cast 2.3s ease-in-out -0.6s infinite; }
  .quest-stop.is-current .quest-stage-shadow { animation: quest-stage-shadow 3.2s ease-in-out infinite; }
  .quest-stage-beam, .quest-stage-pool { animation: quest-stage-beam 3.2s ease-in-out infinite; }
  .quest-stage-dust { animation: quest-stage-dust 3.6s ease-in-out infinite; }
  .quest-stage-dust:nth-of-type(4) { animation-delay: -1.2s; }
  .quest-stage-dust:nth-of-type(5) { animation-delay: -2.3s; }
  .quest-stop.is-current .quest-node:active .quest-node-face { animation: none; }
}
@keyframes quest-stage-float { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes quest-stage-hover { 0%, 100% { transform: translateX(-50%) translateY(0) rotate(-4deg); } 50% { transform: translateX(-50%) translateY(-14px) rotate(4deg); } }
/* Mirror of the hover: the reflection slides away as the object lifts, and the
   rotate inside scaleY(-1) is already the mirrored rotation. */
@keyframes quest-stage-reflect { 0%, 100% { transform: translateX(-50%) translateY(0) scaleY(-.45) rotate(-4deg); opacity: .3; } 50% { transform: translateX(-50%) translateY(7px) scaleY(-.45) rotate(4deg); opacity: .16; } }
@keyframes quest-stage-cast { 0%, 100% { transform: translateX(-50%) scale(1); opacity: .6; } 50% { transform: translateX(-50%) scale(.76); opacity: .32; } }
@keyframes quest-stage-shadow { 0%, 100% { transform: scale(1); opacity: 1; } 50% { transform: scale(.72); opacity: .5; } }
@keyframes quest-stage-beam { 0%, 100% { opacity: .75; } 50% { opacity: 1; } }
@keyframes quest-stage-dust { 0%, 100% { transform: translateY(0); opacity: .3; } 50% { transform: translateY(-14px); opacity: 1; } }
@media(max-width:359px){
  .quest-stop { min-height: 150px; }
  .quest-stop.is-current { min-height: 164px; }
  .quest-node, .quest-stop:not(.is-complete) .quest-node, .quest-stop.is-current .quest-node { --stage: 116px; }
  .quest-stop.is-current .quest-node { --stage: 128px; }
  .quest-stage-badge { width: 28px; height: 28px; }
  .quest-node .quest-stage-badge svg { width: 17px; height: 17px; }
}

/* ---------------------------------------------------------------------------
   Endless journey. One vertical path through every level, under a sticky level
   banner. The banner lives above the scroller, so it never scrolls; dividers in
   the path dock into it as they pass beneath.
   --------------------------------------------------------------------------- */
.quest-path-content { padding-top: 6px; padding-bottom: 28px; }
.quest-level { position: relative; }
.quest-level-path { position: relative; isolation: isolate; }
/* Each level's background rings reach past the path's side padding to the screen
   edges, as the single-level page did. */
.quest-level-path .quest-landscape { inset: 0 calc(-1 * clamp(18px, 5vw, 64px)) 110px; overflow: hidden; }
.quest-level:not(.is-near) .quest-ambient { animation-play-state: paused; }
.quest-level.is-locked .quest-stop-copy h3 { color: #9fb1bb; }
.quest-level.is-locked .quest-treasure { opacity: .72; }
.quest-journey-end { margin: 6px 0 0; text-align: center; color: var(--muted); font-size: 12px; }

/* Banner */
.quest-banner { position: relative; z-index: 3; padding: 10px clamp(14px, 4vw, 64px) 16px; }
.quest-banner-card {
  --band-bg: #79e2b4; --band-ink: #101d2b; --band-wall: #3fae82; --band-glow: #fff7e8;
  position: relative; display: flex; height: 76px; max-width: 720px; margin-inline: auto; border-radius: 18px;
  background-color: var(--band-bg); color: var(--band-ink);
  box-shadow: 0 6px 0 var(--band-wall), 0 14px 22px #00000059;
  transition: background-color .38s ease, color .38s ease, box-shadow .38s ease;
}
.quest-banner-card::before { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; background: linear-gradient(135deg, #ffffff3d, transparent 62%); }
.quest-banner-card::after { content: ''; position: absolute; inset: 0; border-radius: inherit; pointer-events: none; opacity: 0; transition: opacity .38s ease; background: repeating-linear-gradient(135deg, #ffffff08 0 14px, transparent 14px 28px); }
.quest-banner-card[data-band="teal"] { --band-bg: #1f6f6a; --band-ink: #fff7e8; --band-wall: #123f3c; }
.quest-banner-card[data-band="harbor"] { --band-bg: #2f5d7a; --band-ink: #fff7e8; --band-wall: #193447; }
.quest-banner-card[data-band="sky"] { --band-bg: #8ec5e8; --band-ink: #101d2b; --band-wall: #4d86ad; }
.quest-banner-card[data-band="paper"] { --band-bg: #f4e8d0; --band-ink: #101d2b; --band-wall: #c9b48a; }
.quest-banner-card[data-band="sun"] { --band-bg: #ffc857; --band-ink: #101d2b; --band-wall: #c8932b; }
.quest-banner-card[data-band="locked"] { --band-bg: #214458; --band-ink: #fff7e8; --band-wall: #0f2230; --band-glow: #a9bdc9; }
.quest-banner-card[data-band="locked"]::after { opacity: 1; }
.quest-banner-card[data-band="locked"]::before { opacity: .35; }
.quest-banner-stage { position: relative; flex: 1; min-width: 0; margin: 0; overflow: hidden; border-radius: 18px 0 0 18px; font: inherit; color: inherit; }
.quest-banner-stage:focus-visible { outline: 3px solid var(--brand-sun); outline-offset: -4px; }
.quest-banner-face { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: center; gap: 2px; padding: 0 12px 0 16px; will-change: transform, opacity; }
.quest-banner-kicker { font-family: var(--brand-mono); font-weight: 600; font-size: 10.5px; letter-spacing: .1em; text-transform: uppercase; opacity: .82; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.quest-banner-row { display: flex; align-items: flex-end; justify-content: space-between; gap: 10px; }
.quest-banner-title { display: inline-flex; align-items: center; gap: 7px; font-family: var(--brand-display); font-weight: 600; font-size: 31px; line-height: 1.05; letter-spacing: -.03em; white-space: nowrap; }
.quest-banner-title svg { width: 21px; height: 21px; flex: none; }
.quest-banner-track { display: flex; flex-direction: column; align-items: flex-end; gap: 6px; padding-bottom: 5px; }
.quest-banner-count { font-size: 12.5px; font-weight: 700; line-height: 1; }
.quest-banner-pips { display: flex; gap: 5px; margin: 0; padding: 0; list-style: none; }
.quest-banner-pip { width: 16px; height: 8px; border-radius: 50%; background: color-mix(in srgb, currentColor 20%, transparent); }
.quest-banner-pip.is-done { background: currentColor; box-shadow: 0 2px 0 color-mix(in srgb, currentColor 45%, transparent); }
.quest-banner-pip.is-now { background: var(--band-glow); box-shadow: 0 0 0 2px currentColor; }
.quest-banner-card[data-band="locked"] .quest-banner-pip { background: transparent; box-shadow: inset 0 0 0 1.5px color-mix(in srgb, currentColor 55%, transparent); }
.quest-banner-card[data-band="locked"] .quest-banner-kicker, .quest-banner-card[data-band="locked"] .quest-banner-count { color: #c6d4dc; opacity: 1; }
.quest-banner .quest-level-menu { position: relative; display: grid; place-items: center; width: 64px; flex: none; cursor: pointer; }
.quest-banner .quest-level-menu::before { content: ''; position: absolute; left: 0; top: 16px; bottom: 16px; width: 1px; background: currentColor; opacity: .22; }
.quest-level-menu-face { display: flex; flex-direction: column; align-items: center; gap: 1px; pointer-events: none; }
.quest-level-menu-num { font-family: var(--brand-mono); font-weight: 600; font-size: 10px; letter-spacing: .08em; }
.quest-level-menu-face svg { width: 18px; height: 18px; }
.quest-banner .quest-level-picker { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; opacity: 0; cursor: pointer; font-size: 16px; appearance: none; -webkit-appearance: none; }
.quest-banner .quest-level-menu:focus-within { outline: 3px solid var(--brand-sun); outline-offset: -5px; border-radius: 14px; }

/* Level divider: docks into the banner as it reaches the top of the path. */
.quest-divider { display: flex; align-items: center; gap: 12px; padding: 30px clamp(14px, 4vw, 64px) 12px; opacity: calc(1 - var(--dock, 0) * .9); transform: translateY(calc(var(--dock, 0) * -12px)) scale(calc(1 - var(--dock, 0) * .06)); transform-origin: 50% 0; }
.quest-divider::before, .quest-divider::after { content: ''; flex: 1; height: 2px; border-radius: 2px; background: repeating-linear-gradient(90deg, #a9bdc959 0 8px, transparent 8px 14px); }
.quest-divider-chip { display: inline-flex; align-items: center; gap: 8px; padding: 8px 14px; border-radius: 12px; background: var(--brand-ink-2, #172c3d); border: 1px solid #a9bdc938; }
.quest-divider-chip b { font-family: var(--brand-display); font-weight: 600; font-size: 18px; color: var(--paper); }
.quest-divider-chip span { font-family: var(--brand-mono); font-weight: 600; font-size: 10px; letter-spacing: .1em; text-transform: uppercase; color: var(--muted); }
.quest-divider-chip svg { width: 14px; height: 14px; color: var(--muted); }
.quest-divider-chip[data-status="current"], .quest-divider-chip[data-status="reward"] { border-color: #79e2b466; }
.quest-divider-chip[data-status="current"] span, .quest-divider-chip[data-status="reward"] span { color: var(--brand-mint); }
.quest-divider-chip[data-status="complete"] span { color: var(--brand-sun); }

/* Back to your lesson: points toward the current lesson whenever it is off screen. */
.quest-back { position: absolute; right: clamp(14px, 4vw, 40px); bottom: 20px; z-index: 6; display: grid; place-items: center; width: 56px; height: 56px; padding: 0; border: 0; border-radius: 50%; background: var(--brand-mint); color: #101d2b; box-shadow: 0 5px 0 #2a9d6c, 0 12px 20px #00000073; cursor: pointer; opacity: 0; transform: translateY(14px) scale(.8); pointer-events: none; transition: opacity .2s ease, transform .3s cubic-bezier(.34, 1.56, .64, 1); }
.quest-back.is-shown { opacity: 1; transform: none; pointer-events: auto; }
.quest-back svg { width: 24px; height: 24px; transition: transform .28s cubic-bezier(.2, .8, .2, 1); }
.quest-back.points-down svg { transform: rotate(180deg); }
.quest-back:active { transform: translateY(3px); box-shadow: 0 2px 0 #2a9d6c, 0 8px 14px #00000066; }
.quest-back:focus-visible { outline: 3px solid var(--brand-sun); outline-offset: 3px; }
@media (prefers-reduced-motion: reduce) { .quest-divider { transform: none; } }
.quest-banner .quest-level-menu::after { content: none; }

/* ---------------------------------------------------------------------------
   Free play dock. A floating pill over the bottom-left of the journey replaces
   the old full-width row, so the path runs to the bottom edge. It tucks into an
   orb while the path scrolls and opens again once it rests. It sits on the left
   so the back-to-lesson arrow keeps the right corner; dark bodied with mint
   accents, so the two never read as the same control.
   --------------------------------------------------------------------------- */
.quest-path-content { padding-bottom: 104px; }
.quest-back { bottom: max(18px, env(safe-area-inset-bottom)); }
.quest-freeplay {
  position: absolute; left: clamp(14px, 4vw, 40px); bottom: max(18px, env(safe-area-inset-bottom)); z-index: 7;
  display: flex; align-items: center; gap: 10px; height: 62px; max-width: 240px; padding: 0 18px 0 6px; overflow: visible;
  border: 0; border-radius: 31px; color: var(--paper); font: inherit; text-align: left; cursor: pointer;
  background: linear-gradient(180deg, #1f3a3a, #172c33);
  box-shadow: 0 0 0 1.5px #79e2b466, 0 10px 26px #00000099, 0 0 34px #79e2b426;
  transition: max-width .32s cubic-bezier(.2, .8, .2, 1), padding .32s cubic-bezier(.2, .8, .2, 1), border-radius .32s cubic-bezier(.2, .8, .2, 1), box-shadow .2s ease;
}
.quest-freeplay:hover { box-shadow: 0 0 0 1.5px #79e2b4aa, 0 10px 26px #00000099, 0 0 40px #79e2b440; }
.quest-freeplay:active { transform: translateY(2px); }
.quest-freeplay:focus-visible { outline: 3px solid var(--brand-sun); outline-offset: 4px; }
.quest-freeplay-stage { position: relative; flex: none; width: 50px; height: 50px; }
.quest-freeplay-stage svg { display: block; width: 50px; height: 50px; }
.quest-freeplay-note { position: absolute; font: 600 14px var(--brand-display); font-style: normal; color: var(--brand-mint); opacity: 0; pointer-events: none; }
.quest-freeplay-note:first-of-type { left: 30px; top: 2px; }
.quest-freeplay-note:last-of-type { left: 8px; top: 6px; }
.quest-freeplay-label { display: flex; flex-direction: column; white-space: nowrap; overflow: hidden; transition: opacity .2s ease, max-width .32s cubic-bezier(.2, .8, .2, 1); max-width: 170px; }
.quest-freeplay-label strong { display: flex; align-items: center; gap: 7px; font: 600 17px/1.1 var(--brand-display); letter-spacing: -.02em; color: var(--paper); }
.quest-freeplay-label small { margin-top: 3px; font-size: 12px; color: #bfeed6; }
.quest-freeplay-eq { display: inline-flex; align-items: flex-end; gap: 2px; height: 12px; }
.quest-freeplay-eq i { width: 3px; height: 5px; border-radius: 2px; background: var(--brand-mint); }
.quest-freeplay-halo { position: absolute; inset: -7px; border-radius: 50%; border: 1.5px solid #79e2b455; opacity: 0; pointer-events: none; }
/* While scrolling: an orb, label tucked away, a soft halo pulse. */
.quest-freeplay.is-compact { max-width: 62px; padding: 0 6px; }
.quest-freeplay.is-compact .quest-freeplay-label { opacity: 0; max-width: 0; }
@media (prefers-reduced-motion: no-preference) {
  .quest-freeplay-eq i { animation: quest-fp-eq 1.1s cubic-bezier(.2, .8, .2, 1) infinite; }
  .quest-freeplay-eq i:nth-child(2) { animation-delay: .25s; }
  .quest-freeplay-eq i:nth-child(3) { animation-delay: .5s; }
  .quest-freeplay-note { animation: quest-fp-rise 3.2s ease-out infinite; }
  .quest-freeplay-note:last-of-type { animation-delay: 1.4s; }
  .quest-freeplay.is-compact .quest-freeplay-halo { animation: quest-fp-halo 2.4s ease-out infinite; }
}
@keyframes quest-fp-eq { 0%, 100% { height: 4px; } 50% { height: 12px; } }
@keyframes quest-fp-rise { 0% { transform: translateY(6px); opacity: 0; } 25% { opacity: .9; } 100% { transform: translateY(-34px); opacity: 0; } }
@keyframes quest-fp-halo { 0% { transform: scale(.9); opacity: .8; } 100% { transform: scale(1.25); opacity: 0; } }