/* Shared child quest surface. Keep these dimensions identical across routes. */
body:is([data-view="rewards"],[data-view="routine"]) .shell{background:radial-gradient(ellipse at 75% 0%,#b197ce 0%,#65467f 48%,#2d1d44 100%)}
body .quest-page{box-sizing:border-box;width:100%;max-width:1060px;margin:0 auto 24px;padding:28px 32px!important;border:1px solid #f5e4b6aa;border-radius:28px;background:linear-gradient(145deg,#fffaf0,#f4ecfa);color:#523164;box-shadow:0 15px 40px #21123126}
body .quest-page .quest-heading{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;min-height:144px;margin:0 0 24px;padding:0;border:0;text-align:left}
.quest-heading-copy{min-width:0}.quest-eyebrow{display:block;font:800 10px/1.5 system-ui,sans-serif;letter-spacing:.16em;color:#956b9e}
body .quest-page .quest-heading h1{font:700 clamp(28px,3.7vw,40px)/1.14 Georgia,serif;letter-spacing:-.025em;margin:9px 0 10px;color:#523164;overflow-wrap:normal}
body .quest-page .quest-heading p{font:400 14px/1.5 system-ui,sans-serif;color:#84688e;margin:0}
.quest-heading-aside{text-align:center;min-width:140px}
body .quest-page .quest-goal{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;margin:0 0 8px;font-family:Georgia,serif;color:#59336f}
.quest-goal strong{font:700 60px/1 Georgia,serif;letter-spacing:-.06em}.quest-goal span{display:block;max-width:none;text-align:center;font:700 15px/1.2 system-ui,sans-serif}.quest-heading-aside .reward-week-status{display:inline-block;font-size:11px;padding:4px 9px;line-height:1.3}
body .quest-page .reward-quest{margin:0}
body .quest-page .quest-prize:is(.routine-prize,.reward-prize){display:grid;grid-template-columns:168px minmax(0,1fr);align-items:center;gap:24px;margin:0 0 24px;padding:22px;border:1px solid #e3cba4;border-radius:22px;background:linear-gradient(120deg,#f9eed7,#efdef5);box-shadow:0 4px 16px #70528a0c;text-align:left}
body .quest-page .quest-prize>.reward-picture{grid-column:1;grid-row:1;width:168px;max-width:168px;height:168px;aspect-ratio:1;border:1px solid #e5d5dc;background:#fff9;border-radius:18px;justify-self:start;flex:none}
body .quest-page .quest-prize>.quest-prize-copy{grid-column:2;grid-row:1;min-width:0;text-align:left}
body .quest-page .quest-prize h3{font:700 clamp(21px,2.4vw,28px)/1.25 Georgia,serif;color:#59336f;margin:9px 0 12px;overflow-wrap:anywhere}
/* One image renderer for both reward and routine prizes, at every width. */
body .quest-page .quest-prize .reward-picture>img{position:absolute;inset:0;grid-area:auto;width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center;padding:10px;box-sizing:border-box;border-radius:inherit}
body .quest-page .quest-prize p{font:400 14px/1.55 system-ui,sans-serif;color:#765d7d;margin:0}.quest-prize-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:14px}.quest-prize-actions:empty{display:none}
body .quest-page :is(.routine-calendar,.reward-week){display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;padding:6px;margin:0 0 20px;border:1px solid #e2d3e9;border-radius:18px;background:#e8dded80;box-shadow:none;list-style:none}
body .quest-page :is(.routine-calendar button,.reward-day){display:grid;justify-items:center;align-content:center;gap:8px;min-width:0;min-height:86px;margin:0;padding:10px 3px;border:1px solid transparent;border-radius:12px;background:transparent;color:#84688e;box-shadow:none}
body .quest-page :is(.routine-calendar button strong,.reward-day>span){font:750 13px/1.4 system-ui,sans-serif;color:inherit}
body .quest-page :is(.routine-calendar button[aria-pressed="true"],.reward-day.sticker-today){background:#f7f0fb;border:1px solid #b38ac8;outline:0;box-shadow:inset 0 0 0 1px #b38ac822}
body .quest-page :is(.routine-day-complete,.reward-day.sticker-earned){background:#e4f0e6;color:#356446}
body .quest-page .routine-day-state{font-size:9px;line-height:1.2}.routine-day-state .ui-icon{width:12px;height:12px}
.quest-loading{min-height:300px}.quest-loading>p{font-size:14px;color:#84688e;margin:0 0 18px}.quest-loading-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin:0 0 24px}.quest-loading-days span{height:86px;border-radius:12px;background:#e8dded80}.quest-loading-task{width:min(100%,520px);height:96px;border-radius:18px;background:#e8dded80;margin:12px auto}
/* Navigation nodes stay mounted during sync; use pressed and focus feedback instead of full-page fades. */
body .parent-navigation{display:flex;flex-wrap:nowrap;align-items:stretch;gap:8px;width:100%;max-width:none;box-sizing:border-box;margin:0 0 24px;padding:10px;border:1px solid #e9d6fa38;border-radius:20px;background:linear-gradient(120deg,#38254dd9,#543760d9);box-shadow:0 8px 22px #2112311a;overflow-x:auto;overscroll-behavior-x:contain;scroll-padding:10px}
body .parent-navigation button{flex:1 0 auto;min-width:0;min-height:46px;padding:12px 14px;border:1px solid #e3cef33b;border-radius:12px;background:linear-gradient(140deg,#ffffff14,#ffffff06);color:#f1e6f6;font:650 13px/1.2 system-ui,sans-serif;white-space:nowrap;box-shadow:inset 0 1px #ffffff10;cursor:pointer}
body .parent-navigation button[aria-current="page"]{background:linear-gradient(135deg,#fff3c5,#f1d89c);color:#523164;border-color:#fff2bf;box-shadow:0 3px 10px #1c10271f}
body .parent-navigation button:hover:not([aria-current="page"]){background:#ffffff24;border-color:#e8d3f488}body .parent-navigation button:active{transform:translateY(1px)}
body .frame>.top.parent-top,body[data-sticky-navigation="true"] .frame>.top.parent-top{display:flex;flex-wrap:nowrap;align-items:center;gap:20px;min-height:108px;border:0;border-bottom:1px solid #e3c5ff24;border-radius:0;margin-bottom:26px;padding:calc(15px + env(safe-area-inset-top)) max(24px,calc((100% - 1280px)/2)) 15px;background:linear-gradient(110deg,#2b1d43f5,#49305df0 58%,#352248f5);box-shadow:0 7px 28px #180f2929}
body .parent-top .parent-wordmark{display:block;text-align:left;flex:none;min-height:0;font:700 30px/1.02 ui-rounded,'Trebuchet MS',system-ui,sans-serif;letter-spacing:-.04em;background:none;border:0;padding:4px 0;text-shadow:0 3px 0 #3b214e}.parent-wordmark .reader-child-name{display:block;color:#fff2c1}.parent-wordmark .reader-title-line{display:block;color:#ffc2ed}
body .parent-top nav.text-navigation{display:flex;flex-wrap:nowrap;gap:10px;margin-left:auto;min-width:0}
body .parent-top nav.text-navigation button{display:inline-flex;flex:none;flex-direction:row;align-items:center;justify-content:center;gap:8px;width:auto;max-width:none;min-width:0;height:auto;min-height:48px;padding:11px 16px;border:1px solid #ddc5f444;border-radius:14px;background:linear-gradient(145deg,#ffffff15,#ffffff05);color:#f6e8fd;box-shadow:inset 0 1px #ffffff0c;font:650 13px/1.25 system-ui,sans-serif;white-space:nowrap}
body .parent-top nav.text-navigation button .navlabel{display:inline}.parent-top .ui-icon{width:21px;height:21px}
/* Equal, safe-area-aware outer spacing, plus consistent space within the practice panel. */
body[data-view="wordPractice"] .shell{--practice-gutter:clamp(16px,2.6vw,28px);box-sizing:border-box;min-height:100dvh;padding:max(var(--practice-gutter),env(safe-area-inset-top)) max(var(--practice-gutter),env(safe-area-inset-right)) max(var(--practice-gutter),env(safe-area-inset-bottom)) max(var(--practice-gutter),env(safe-area-inset-left))}
body[data-view="wordPractice"] .frame{display:block;width:100%;max-width:920px;min-height:0;margin:0 auto;padding:0}
body[data-view="wordPractice"] .word-practice{box-sizing:border-box;width:100%;max-width:none;height:calc(100dvh - max(var(--practice-gutter),env(safe-area-inset-top)) - max(var(--practice-gutter),env(safe-area-inset-bottom)));min-height:480px;margin:0;padding:clamp(20px,3vw,32px)!important;border-radius:24px;gap:14px}
@media(max-width:1050px) and (min-width:641px){body .parent-navigation{display:grid;grid-template-columns:repeat(4,minmax(0,1fr))}body .parent-navigation button{padding-inline:8px;font-size:12px}}
@media(max-width:740px){
 body .quest-page{padding:20px 16px!important;border-radius:24px}
 body .quest-page .quest-heading{min-height:148px;margin-bottom:20px;gap:12px}
 body .quest-page .quest-heading h1{font-size:28px}.quest-heading-aside{min-width:84px;max-width:100px}.quest-goal strong{font-size:46px}body .quest-page .quest-goal{display:block}.quest-goal span{display:block;max-width:none;text-align:center;font-size:12px;margin-top:4px}
 body .quest-page .quest-heading p{font-size:12px}.quest-eyebrow{font-size:9px;letter-spacing:.12em}
 body .quest-page .quest-prize:is(.routine-prize,.reward-prize){grid-template-columns:110px minmax(0,1fr);gap:16px;padding:16px;margin-bottom:20px}
 body .quest-page .quest-prize>.reward-picture{width:110px;height:110px;max-width:110px;border-radius:16px}
 body .quest-page .quest-prize h3{font-size:21px;margin:7px 0 9px}body .quest-page .quest-prize p{font-size:12px}
 body .quest-page :is(.routine-calendar,.reward-week){gap:3px;padding:4px}body .quest-page :is(.routine-calendar button,.reward-day){min-height:74px;padding:8px 1px;gap:8px}body .quest-page :is(.routine-calendar button strong,.reward-day>span){font-size:11px}.quest-loading-days span{height:74px}
 body .frame>.top.parent-top,body[data-sticky-navigation="true"] .frame>.top.parent-top{min-height:90px;gap:12px;padding:calc(12px + env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) 12px max(16px,env(safe-area-inset-left));margin-bottom:18px}
 body .parent-top .parent-wordmark{font-size:24px}body .parent-top nav.text-navigation button{padding:10px;font-size:11px;gap:5px}.parent-top .ui-icon{width:17px;height:17px}
}
@media(max-width:380px){body .quest-page .quest-heading h1{font-size:25px}body .quest-page .quest-prize:is(.routine-prize,.reward-prize){grid-template-columns:88px minmax(0,1fr);gap:12px;padding:14px}body .quest-page .quest-prize>.reward-picture{width:88px;height:88px;max-width:88px}body .quest-page .quest-prize h3{font-size:18px}body .parent-top nav.text-navigation button{white-space:normal;max-width:112px}.parent-top nav{gap:6px!important}body .parent-top .parent-wordmark{font-size:22px}}
@media(prefers-reduced-motion:no-preference){.quest-loading-task,.quest-loading-days span{animation:quest-breathe 1.8s ease-in-out infinite}@keyframes quest-breathe{50%{opacity:.45}}}

body .quest-page .quest-prize:is(.routine-prize,.reward-prize):not(:has(img)){grid-template-columns:168px minmax(0,1fr)}
@media(max-width:740px){body .quest-page .quest-prize:is(.routine-prize,.reward-prize):not(:has(img)){grid-template-columns:110px minmax(0,1fr)}}
@media(max-width:380px){body .quest-page .quest-prize:is(.routine-prize,.reward-prize):not(:has(img)){grid-template-columns:88px minmax(0,1fr)}}
body .quest-page .quest-heading .quest-goal{display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center;margin:0 0 8px;font:700 26px/1.1 Georgia,serif}body .quest-page .quest-heading .quest-goal strong{font:700 60px/1 Georgia,serif}body .quest-page .quest-heading .quest-goal span{font:700 15px/1.2 system-ui,sans-serif}@media(max-width:740px){body .quest-page .quest-heading .quest-goal{display:block}body .quest-page .quest-heading .quest-goal strong{font-size:46px}body .quest-page .quest-heading .quest-goal span{display:block;font-size:12px}}

body .quest-page .quest-prize:is(.routine-prize,.reward-prize){min-height:212px}@media(max-width:740px){body .quest-page .quest-prize:is(.routine-prize,.reward-prize){min-height:224px}}

/* Selected routine days keep dark ink on their light selected surface. */
body .quest-page .routine-calendar button[aria-pressed="true"]{color:#523164}
body .quest-page .routine-calendar button[aria-pressed="true"] strong{color:inherit}
body .quest-page .routine-calendar button.routine-day-complete[aria-pressed="true"]{color:#265b3a;background:#dff1e3;border-color:#43865b}
body .quest-page .routine-calendar button[aria-pressed="true"] .routine-day-state{color:inherit}

/* Phone layouts: actions fit the viewport instead of extending behind browser chrome. */
@media(max-width:740px){
 body .frame>.top.parent-top,body[data-sticky-navigation="true"] .frame>.top.parent-top{display:grid;grid-template-columns:minmax(0,1fr);justify-items:stretch;gap:12px;width:100%;min-width:0;box-sizing:border-box}
 body .parent-top .parent-wordmark{width:max-content;max-width:100%;min-width:0;overflow-wrap:anywhere}
 body .parent-top nav.text-navigation{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);width:100%;max-width:100%;min-width:0;margin:0;gap:10px}
 body .parent-top nav.text-navigation button{width:100%;max-width:none;min-width:0;min-height:44px;height:auto;padding:10px 8px;box-sizing:border-box;white-space:normal;font-size:12px;line-height:1.3;overflow-wrap:anywhere}
 body .parent-top nav.text-navigation button span{min-width:0}.parent-top nav.text-navigation .ui-icon{flex-shrink:0}
 /* Reading and routine prizes share the same large, image-first phone card. */
 body .quest-page .quest-prize:is(.routine-prize,.reward-prize),body .quest-page .quest-prize:is(.routine-prize,.reward-prize):not(:has(img)){grid-template-columns:minmax(0,1fr);gap:18px;min-height:0;padding:20px 18px;justify-items:center;text-align:center}
 body .quest-page .quest-prize>.reward-picture{grid-column:1;grid-row:1;width:240px;max-width:100%;height:auto;aspect-ratio:1;justify-self:center;border-radius:20px}
 body .quest-page .quest-prize:is(.routine-prize,.reward-prize)>.quest-prize-copy{grid-column:1;grid-row:2;text-align:center;width:100%;max-width:420px}
 body .quest-page .quest-prize .reward-picture img{width:100%;height:100%;padding:10px;object-fit:contain}
 body .quest-page .quest-prize h3{font-size:22px;line-height:1.3;overflow-wrap:break-word;margin:8px 0 12px}
 body .quest-page .quest-prize p{font-size:13px;line-height:1.55}.quest-prize-actions{justify-content:center}
 /* All weekdays have a tile; selected and completed states remain distinct. */
 body .quest-page :is(.routine-calendar,.reward-week){gap:5px;padding:5px;border-radius:17px}
 body .quest-page :is(.routine-calendar button,.reward-day){background:#fffaf5;border:1px solid #d7c3e3;border-radius:11px;color:#70517e;min-height:64px;padding:9px 1px;gap:7px}
 body .quest-page .routine-calendar button{position:relative;min-height:50px;cursor:pointer;transition:background .15s,border-color .15s}
 body .quest-page .routine-calendar .routine-day-state{display:none}
 body .quest-page :is(.routine-calendar button strong,.reward-day>span){font-size:11px;white-space:nowrap}
 body .quest-page .routine-calendar button.routine-day-complete,body .quest-page .reward-day.sticker-earned{background:#e4f0e6;border-color:#a1c6aa;color:#265b3a}
 body .quest-page .routine-calendar button.routine-day-complete:after{content:'';position:absolute;bottom:6px;width:5px;height:5px;border-radius:50%;background:#43865b}
 body .quest-page .routine-calendar button[aria-pressed="true"],body .quest-page .reward-day.sticker-today{background:#eee2f7;border:2px solid #8c60a7;color:#523164;box-shadow:0 2px 7px #52316412}
 body .quest-page .routine-calendar button.routine-day-complete[aria-pressed="true"],body .quest-page .reward-day.sticker-earned.sticker-today{background:#dff1e3;color:#265b3a;border-color:#43865b}
}
/* Small manual opener remains available even for charts too short to scroll. */
.routine-palette-toggle{display:flex;align-items:center;justify-content:center;gap:8px;width:max-content;max-width:100%;min-height:40px;margin:0 auto 14px;padding:9px 15px;border:1px solid #d7bce5;border-radius:13px;background:#f2e7f8;color:#604073;font:700 12px/1.3 system-ui,sans-serif;box-shadow:none}
.routine-palette-toggle .ui-icon{width:18px;height:18px}.routine-palette-toggle[aria-expanded="true"]{background:#654080;color:#fff5df;border-color:#82589d}
@media(max-width:740px){
 body .routine-chart .routine-stamp-dock{max-width:560px;margin-inline:0;padding:9px 9px 8px;bottom:max(10px,env(safe-area-inset-bottom));border-radius:18px}
 .stamp-dock-heading{margin-bottom:2px;padding-inline:3px}.stamp-dock-heading strong{font-size:10px;line-height:1.3}
 body .routine-chart .stamp-dock-shapes{grid-auto-columns:44px;gap:8px;padding:11px 8px 6px}
 body .routine-chart .stamp-dock-shapes button{height:44px;min-height:44px}.stamp-dock-shapes .routine-art{width:32px;height:32px}
 body .routine-chart .stamp-dock-colors{margin-top:3px;gap:0;justify-content:space-around}
 body .routine-chart .stamp-dock-colors button{width:28px;height:28px;min-height:28px}.stamp-dock-colors button:before{width:15px;height:15px}
}

/* Phone palette keeps its accessible label without the redundant visual heading. */
@media(max-width:740px){body .routine-chart .routine-stamp-dock .stamp-dock-heading{display:none}}

/* Keep the native practice picker, with an inset chevron and room for its label. */
body[data-view="wordPractice"] .word-practice .word-practice-source select{appearance:none;-webkit-appearance:none;padding-right:48px;background-image:url("assets/select-chevron-v121.svg");background-repeat:no-repeat;background-position:right 16px center;background-size:16px 16px}
@media(forced-colors:active){body[data-view="wordPractice"] .word-practice .word-practice-source select{appearance:auto;-webkit-appearance:auto;background-image:none;padding-right:16px}}

/* Neutral private-page skeleton while authentication and the destination restore. */
.session-content-placeholder{display:grid;gap:18px}.session-content-title{width:65%;height:36px;border-radius:10px}.session-content-subtitle{width:44%;height:17px;border-radius:8px}.session-content-panel{height:200px;border-radius:22px;margin:8px 0}.session-content-lines{display:grid;gap:14px}.session-content-lines>.session-shape{height:40px;border-radius:12px}.session-content-lines>.session-shape:last-child{width:75%}
@media(max-width:600px){.session-content-title{height:28px;width:80%}.session-content-panel{height:160px}.session-content-placeholder{gap:14px}}