/*
Theme Name: Heck and Back Littles
Author: Heck and Back
Version: 2.0.1
Description: Age-specific activities and Parking Lot Moment support.
*/
:root{--accent:#427054;--paper:#fff9e6;--wash:#e6f0d5;--pop:#ffe0a1;--soft:#f5cfc0;--font:Georgia,serif;--round:26px}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:#27373d;font:17px/1.7 var(--font)}a{color:inherit}button,textarea{font:inherit}button{cursor:pointer}button:focus-visible,a:focus-visible,textarea:focus-visible{outline:3px solid #c0521d;outline-offset:4px}.skip{position:absolute;left:-9999px}.skip:focus{left:10px;top:10px;background:white;padding:12px;z-index:9}.top{background:var(--accent);color:white;padding:16px 28px;display:flex;justify-content:space-between;align-items:center;gap:14px}.brand{font:bold 25px Georgia,serif;text-decoration:none}.free{background:var(--pop);border-radius:20px;padding:3px 13px;color:#30313d;font-size:13px;white-space:nowrap}.hero{margin:0;position:relative}.hero img{display:block;width:100%;height:auto}.titlebar{padding:20px 30px;background:var(--wash);display:flex;align-items:center;justify-content:space-between;gap:14px}.titlebar strong{font-size:25px;color:var(--accent)}.titlebar span{font-size:15px}.shell{display:grid;grid-template-columns:220px minmax(0,1fr);max-width:1500px;margin:auto;min-height:560px}aside{background:var(--wash);padding:25px 16px}nav{display:grid;gap:8px}nav a{padding:12px 14px;text-decoration:none;border-radius:var(--round);font-weight:bold;line-height:1.45}nav a:hover{background:var(--pop)}nav a[aria-current=page]{background:var(--accent);color:white}.nav-caption{font-size:12px;text-transform:uppercase;letter-spacing:2px;padding:0 14px 10px}.side-note{margin:30px 14px;font:19px/1.5 Georgia,serif}main{padding:35px clamp(22px,4vw,60px) 55px;min-width:0}h1{font: bold clamp(32px,4vw,48px)/1.1 var(--font);color:var(--accent);margin:0 0 20px;max-width:820px}h2{font:bold 29px/1.2 var(--font);color:var(--accent);margin:0 0 18px}h3{font-size:20px;margin:0 0 9px}p{margin:0 0 18px}.intro{font-size:20px;max-width:760px}.eyebrow{font-size:12px;letter-spacing:2px;text-transform:uppercase;font-weight:bold;color:var(--accent)}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:28px 0}.activity{display:block;text-decoration:none;background:var(--pop);padding:24px;border-radius:var(--round);border:2px solid transparent;transition:transform .15s}.activity:nth-child(3n+2){background:var(--soft)}.activity:nth-child(3n){background:var(--wash)}.activity:hover{transform:translateY(-3px);border-color:var(--accent)}.activity p{font-size:15px;margin:0}.arrow{font-size:24px;display:block;margin-top:12px}.notice{padding:18px 22px;background:var(--wash);border-radius:var(--round);margin:20px 0;font-size:15px}.notice p:last-child{margin-bottom:0}.action{border:0;background:var(--accent);color:white;padding:12px 22px;border-radius:var(--round);min-height:46px;margin:5px 6px 5px 0}.action.secondary{color:#27373d;background:var(--wash)}.action:disabled{opacity:.5;cursor:default}details{background:var(--wash);padding:18px 22px;border-radius:var(--round);margin:14px 0}summary{font-weight:bold;cursor:pointer}details p{margin:15px 0 0}blockquote{margin:25px 0;padding:18px 24px;border-left:5px solid var(--accent);background:var(--wash);font-size:22px}footer{background:var(--accent);color:white;padding:24px;text-align:center;font-size:14px}footer p{margin:0}.stage{background:white;border-radius:var(--round);padding:25px;margin:22px 0;border:2px solid var(--wash)}.match-target{font-size:75px;line-height:1.2;text-align:center;color:var(--accent);padding:25px}.choices{display:flex;justify-content:center;gap:16px;flex-wrap:wrap}.choices button{background:var(--pop);border:2px solid var(--accent);border-radius:var(--round);font-size:40px;width:85px;height:85px;color:var(--accent)}.status{min-height:35px;text-align:center;margin-top:18px}.garden{min-height:200px;background:linear-gradient(#edf9ff,#e9f5d7);padding:20px;display:flex;flex-wrap:wrap;align-content:flex-end;gap:8px;border-radius:var(--round)}.garden span{font-size:38px;line-height:1.2}.garden-buttons button{font-size:28px;min-width:65px}.story-number{font-size:13px;color:var(--accent);font-weight:bold}.story-text{font:24px/1.7 Georgia,serif}.quiet-field{min-height:270px;display:grid;place-items:center;background:var(--wash);overflow:hidden;border-radius:var(--round)}.sun{width:115px;height:115px;border-radius:50%;background:var(--pop);box-shadow:0 0 0 25px var(--soft);animation:float 8s ease-in-out infinite}.sun.paused{animation-play-state:paused}@keyframes float{50%{transform:scale(1.3)}}textarea{width:100%;min-height:230px;padding:20px;border:2px solid var(--accent);border-radius:var(--round);resize:vertical;color:#26363d;background:white}body.teens .activity{border:2px solid #302a49;box-shadow:5px 5px 0 #302a49}body.teens .titlebar{border-bottom:4px solid #302a49}body.teens h1{text-transform:uppercase;letter-spacing:-1px}body.littles main{font-size:20px}body.littles .activity{padding:28px}body.littles .activity h3{font-size:24px}body.littles .side-note{font-size:23px}body.littles .hero{background:#ffdf87}[hidden]{display:none!important}@media(prefers-reduced-motion:reduce){.sun{animation:none}.activity{transition:none}}@media(max-width:650px){.shell{grid-template-columns:1fr}.top{padding:13px 17px}.brand{font-size:21px}.titlebar{padding:15px 20px;flex-wrap:wrap}.titlebar span{font-size:13px}aside{padding:15px}.nav-caption,.side-note{display:none}nav{grid-template-columns:repeat(2,minmax(0,1fr));gap:5px}nav a{padding:11px;font-size:14px}main{padding:28px 20px 40px}.cards{grid-template-columns:1fr}.intro{font-size:18px}.story-text{font-size:21px}}
#learn-choices{display:flex;flex-wrap:wrap;gap:12px}#learn-choices button{width:auto;min-width:56px;height:auto;min-height:56px;font-size:1.1rem;padding:12px 18px}

/* 2026 refresh: readable content, quiet navigation, activities within reach. */
:root{--font:system-ui,-apple-system,"Segoe UI",sans-serif;--round:22px}
body{font-family:var(--font);font-size:17px;line-height:1.65;color:#27343c}
.top{background:var(--paper);color:var(--accent);max-width:1500px;margin:auto;padding:22px 32px;border-bottom:1px solid #20304012}
.brand{font:800 22px/1.2 var(--font);letter-spacing:-.6px}.top-actions{display:flex;align-items:center;gap:18px}.pause-shortcut{font-size:14px;font-weight:750;text-underline-offset:5px}.free{background:var(--wash);color:var(--accent)}
.shell{grid-template-columns:218px minmax(0,1fr);padding:24px 24px 0;gap:24px;min-height:75vh}aside{background:transparent;padding:14px 0;align-self:start;position:sticky;top:16px}
nav{gap:4px}nav a{font-size:14px;font-weight:650;padding:11px 14px;border-radius:12px}nav a[aria-current=page]{background:var(--wash);color:var(--accent)}nav a:hover{background:var(--pop)}.nav-caption{letter-spacing:1px;margin:0;color:#52636b}.side-note{font:15px/1.6 var(--font);color:#52636b}.mobile-navigation{display:none}
main{padding:0 0 56px;max-width:1100px}.hero{overflow:hidden;border-radius:24px 24px 0 0;background:var(--wash)}.hero img{width:100%;height:auto;display:block}.titlebar{border:0!important;background:var(--wash);border-radius:0 0 24px 24px;padding:12px 22px;margin-bottom:34px}.titlebar strong{font-size:17px}.titlebar span{font-size:13px}
[data-panel]{scroll-margin-top:24px}h1{font:800 clamp(32px,4vw,55px)/1.09 var(--font);letter-spacing:-1.7px;max-width:850px;margin-bottom:20px}h2{font:750 clamp(24px,2.5vw,33px)/1.2 var(--font);letter-spacing:-.6px}h3{font:730 20px/1.3 var(--font)}p{max-width:76ch}.intro{font-size:19px;max-width:62ch}.eyebrow{letter-spacing:1.6px}
.welcome-copy{padding:0 12px 12px}.pause-feature{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(170px,.65fr);align-items:center;gap:24px;padding:32px;border-radius:28px;background:var(--wash);margin:24px 0 36px}.pause-feature h2{max-width:650px}.pause-feature p{margin-bottom:14px}.feature-mark{font-size:76px;text-align:center;line-height:1.2;color:var(--accent);letter-spacing:8px}.feature-mark small{display:block;font:700 12px/2 var(--font);letter-spacing:2px}
.action{display:inline-block;text-decoration:none;font-weight:700;font-size:16px;border-radius:14px;min-height:48px;padding:12px 20px}.action.secondary{background:var(--wash);color:var(--accent)}
.cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.activity{padding:26px;border:0!important;box-shadow:none!important;background:var(--wash);border-radius:20px}.activity:nth-child(3n+2){background:var(--pop)}.activity:nth-child(3n){background:var(--soft)}.activity p{font-size:16px}.activity .arrow{font-size:22px}.activity:hover{transform:translateY(-2px)}.cards .activity:first-child{grid-column:1/-1;display:block;padding:28px 30px}.cards .activity:first-child h3{font-size:25px}
.stage{border:0;padding:28px;background:var(--wash)}details{background:transparent;border-top:1px solid #30405025;border-radius:0;padding:20px 0;margin:0}details p{margin-top:14px}.notice{background:var(--wash);border-radius:16px}.quiet-field{background:var(--wash)}.sun{animation-play-state:paused}
.pause-intro{max-width:760px}.pause-nav{display:flex;gap:8px;flex-wrap:wrap;margin:22px 0}.pause-nav button{border:1px solid #30405030;background:transparent;color:var(--accent);padding:11px 16px;border-radius:24px;min-height:48px}.pause-nav button[aria-pressed=true]{background:var(--accent);color:white;border-color:var(--accent)}.pause-stage{padding:clamp(18px,3vw,34px);background:var(--wash);border-radius:24px;min-height:320px}.pause-stage p{font-size:18px}.pause-grid{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:5px;max-width:430px;margin:20px 0}.pause-grid button{aspect-ratio:1;border:1px solid #30405030;border-radius:9px;min-height:42px;background:#fffef5}.palette{display:flex;gap:8px;flex-wrap:wrap}.palette button{border:2px solid transparent;border-radius:12px;min-width:55px;min-height:48px;font-size:14px;color:#203039}.palette button[aria-pressed=true]{outline:3px solid var(--accent);outline-offset:2px}
.pause-stars{display:flex;flex-wrap:wrap;gap:12px;margin:22px 0;max-width:540px}.pause-stars button{border:1px solid #30405030;border-radius:18px;background:var(--paper);min-width:64px;min-height:64px;font-size:30px;color:var(--accent)}.pause-stars button[aria-pressed=true]{background:var(--pop)}.pause-orbit{min-height:220px;display:grid;place-items:center}.pause-orbit span{display:block;width:110px;height:110px;border-radius:50%;background:var(--pop);box-shadow:0 0 0 24px var(--soft)}.pause-orbit.moving span{animation:float 9s ease-in-out infinite}.pause-status{min-height:30px;margin-top:16px}.pause-footer{font-size:14px;color:#53616a;margin-top:20px}.pause-story{font-size:23px!important;max-width:600px}.parent-note{margin-top:30px}
body.littles h1{font-family:Georgia,serif;letter-spacing:-1px}body.littles .pause-feature{border-radius:42px 24px 42px 24px}body.littles .activity{border-radius:28px}body.littles main{font-size:18px}body.littles .activity h3{font-size:23px}
body.preteens .activity{border-radius:16px}body.teens h1{text-transform:none}body.teens .hero,body.teens .titlebar{border-radius:8px}body.teens .pause-feature{border-radius:8px;border-left:6px solid var(--accent)}body.teens .activity{border-radius:8px}body.teens .eyebrow{font-weight:800}body.teens .titlebar{background:var(--accent);color:white}body.teens .titlebar strong{color:white}
footer{background:var(--paper);color:var(--accent);border-top:1px solid #30405020;text-align:left;padding:28px max(24px,calc((100vw - 1400px)/2));font-size:14px}button:focus-visible,a:focus-visible,select:focus-visible{outline:3px solid #a44219;outline-offset:4px}select{font:inherit}
@media(max-width:800px){.shell{display:block;padding:16px}.top{padding:18px 16px}.top-actions{gap:12px}.free{display:none}aside{position:static;padding:0 0 18px}aside nav,aside .nav-caption,aside .side-note{display:none}.mobile-navigation{display:block}.mobile-navigation label{font-size:13px;font-weight:700;display:block;margin-bottom:5px}.mobile-navigation select{width:100%;padding:12px;border:1px solid #30405030;border-radius:12px;background:var(--paper);color:var(--accent)}.titlebar{margin-bottom:26px;padding:10px 15px}.titlebar span{display:none}.pause-feature{padding:24px;grid-template-columns:1fr}.feature-mark{display:none}.cards{grid-template-columns:1fr}.cards .activity:first-child{grid-column:auto}h1{letter-spacing:-1px}main{padding-bottom:32px}.pause-nav{gap:6px}.pause-nav button{padding:9px 12px;font-size:14px}.hero{border-radius:16px 16px 0 0}.brand{font-size:20px}.pause-shortcut{font-size:13px}.welcome-copy{padding:0}.pause-grid{gap:4px}}
@media(prefers-reduced-motion:reduce){.pause-orbit.moving span{animation:none}.activity{transition:none}}

:root{--accent:#466447;--paper:#fffbed;--wash:#e6f0d9;--pop:#ffe09b;--soft:#f4c7af}

.shell:has([data-panel="pause"]:not([hidden])) .hero,.shell:has([data-panel="pause"]:not([hidden])) .titlebar{display:none}

.mascot{display:block;width:100px;height:100px;background-image:url("mascot-poses.png");background-size:200% 200%;background-repeat:no-repeat;mix-blend-mode:multiply;flex-shrink:0}.pose-read{background-position:0 0}.pose-make{background-position:100% 0}.pose-rest{background-position:0 100%}.pose-go{background-position:100% 100%}.section-mascot{float:right;margin:0 0 18px 20px;width:110px;height:110px}.pause-feature>.mascot{width:190px;height:190px;justify-self:center}.activity>.mascot{float:right;margin:0 0 10px 20px;width:90px;height:90px}.activity{display:flow-root}.pause-nav button{display:flex;align-items:center;gap:6px}.pause-nav .mascot{width:36px;height:36px}.pause-stage:after{content:"";display:block;clear:both}@media(max-width:800px){.pause-feature>.mascot{display:none}.section-mascot{width:76px;height:76px;margin-left:12px}.activity>.mascot{width:72px;height:72px}.pause-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.pause-nav button{border-radius:14px;text-align:left}.pause-nav .mascot{width:38px;height:38px}}

.hab-reader{max-width:860px;margin:auto}.hab-reader>label{display:flex;align-items:center;gap:12px;flex-wrap:wrap;font-size:14px;font-weight:650;margin:20px 0}.hab-reader select{max-width:100%;padding:10px 14px;border:1px solid #9eafb3;border-radius:10px;background:var(--paper,#fff);color:inherit}.reader-page{padding:clamp(22px,4vw,44px);background:#fffef9;color:#27343c;border-radius:20px;margin:22px 0;box-shadow:0 3px 20px #20304009;min-height:340px}.reader-page p{font-family:Georgia,serif;font-size:22px;line-height:1.85;margin-bottom:24px;max-width:62ch}.reader-page h2{font-size:27px}.reader-navigation,.reader-audio{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.reader-navigation{justify-content:space-between;margin:16px 0 24px}.reader-navigation button,.reader-audio button{font:650 16px/1.5 system-ui;min-height:48px;padding:10px 18px;border:1px solid #a2b2b6;border-radius:12px;background:var(--wash,#e8eff0);color:var(--accent,#234850);cursor:pointer}.reader-navigation button:disabled,.reader-audio button:disabled{opacity:.5;cursor:default}.reader-status{min-height:28px;margin:10px 0;font-size:15px}.reader-note{font-size:13px;color:#52666d}.contrast .reader-page{background:#111;color:#fff;border:1px solid white}.contrast .reader-note{color:#ddd}.large .reader-page p{font-size:28px}@media(max-width:600px){.reader-page{padding:22px 18px;min-height:0}.reader-page p{font-size:20px;line-height:1.8}.reader-navigation{gap:6px}.reader-navigation button{padding:10px 14px}.reader-navigation span{font-size:13px}}

.caregiver-return{display:block;margin:20px 0 10px;padding:12px 10px;color:inherit;font-size:15px;font-weight:650;text-decoration:underline;text-underline-offset:3px}.caregiver-return:focus-visible{outline:3px solid currentColor;outline-offset:3px}
