/* What this is: the timer's original garden and responsive reading surfaces for families. */
:root{--paper:#f8f4e9;--ink:#263b33;--muted:#52655c;--purple:#5b4166;--red:#aa4240;--line:#d6ddce;--font:1;--shadow:0 18px 50px #283f3212;color-scheme:light}
*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);font:calc(17px * var(--font))/1.55 system-ui,-apple-system,"Segoe UI",sans-serif}button,input,select,textarea{font:inherit}button{cursor:pointer;color:inherit;border:1px solid var(--line);background:#fffdf7;padding:10px 17px;border-radius:999px;min-height:44px;line-height:1.3}button:hover{background:#eeeadd;border-color:#aebea4}button:disabled{opacity:.55;cursor:default}a{color:var(--purple)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid #765484;outline-offset:4px}button[aria-pressed=true]{background:#e6eadb;border-color:#506b56;color:#243c2d}[hidden]{display:none!important}.dark-button{background:var(--ink);color:#fffdf3;border-color:var(--ink)}.dark-button:hover{background:#3c5547}.outline-button{background:transparent;border-color:#70866f}.skip{position:absolute;top:5px;left:10px;z-index:10;transform:translateY(-160%);background:#fff;padding:12px}.skip:focus{transform:none}.topbar{max-width:1380px;margin:auto;display:flex;align-items:center;justify-content:space-between;padding:21px 40px;border-bottom:1px solid var(--line);gap:20px}.brand{display:flex;align-items:center;gap:12px;font-size:12px;letter-spacing:.18em;font-weight:750}.brand svg{width:34px;height:34px;fill:#dae3c9;stroke:var(--ink);stroke-width:2;stroke-linecap:round}.brand svg path{fill:none}.top-actions{display:flex;gap:9px;flex-wrap:wrap}.top-actions button{font-size:14px;padding:9px 15px}main{max-width:1280px;margin:auto;padding:36px 40px 16px}.intro{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:29px}.eyebrow{font-size:12px;font-weight:750;letter-spacing:.12em;text-transform:uppercase;margin:0 0 7px;color:var(--muted)}h1,h2,p{margin-top:0}h1{font-family:Georgia,"Times New Roman",serif;font-size:clamp(31px,4.3vw,54px);font-weight:500;line-height:1.12;margin-bottom:11px;letter-spacing:-.04em}h2{font-family:Georgia,"Times New Roman",serif;font-weight:500;font-size:30px;line-height:1.25;letter-spacing:-.02em}.subtitle{color:var(--muted);margin-bottom:0;font-size:19px}.examples{display:flex;align-items:center;gap:20px;justify-content:space-between;margin-bottom:20px}.examples>span{font-size:13px;color:var(--muted)}.examples>div{display:flex;gap:8px;flex-wrap:wrap}.examples button{font-size:13px;min-height:40px;padding:8px 14px}.adventure{position:relative;isolation:isolate;min-height:525px;border-radius:30px;overflow:hidden;background:#bdd8cd;border:1px solid #b4cab7;box-shadow:var(--shadow)}.scene{position:absolute;inset:0;z-index:-1;overflow:hidden}.landscape{height:100%;width:100%;opacity:.95}.scene:after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#f4f3ddf7 0%,#f4f3ddd9 26%,#f4f3dd40 52%,transparent 65%);pointer-events:none}.answer{position:relative;padding:35px 38px 25px;width:52%;min-height:393px}.plan-label{display:flex;gap:8px;align-items:center;font-size:12px;text-transform:uppercase;letter-spacing:.12em;font-weight:700;margin-bottom:12px;color:#42553d}.tiny-dot{width:7px;height:7px;border-radius:50%;background:#55753b}.answer h2{font-size:clamp(28px,3.5vw,43px);max-width:15ch;margin-bottom:16px;overflow-wrap:anywhere}.count-lead{font-size:16px;margin-bottom:0}.big-answer{display:flex;align-items:baseline;flex-wrap:wrap;gap:8px 15px;font-family:Georgia,"Times New Roman",serif;font-size:90px;font-weight:500;line-height:1.06;letter-spacing:-.04em;margin:5px 0 15px;font-variant-numeric:tabular-nums}.big-answer .unit{font:500 27px/1.2 system-ui,sans-serif;letter-spacing:-.025em}.big-answer .part{display:inline-flex;align-items:baseline;gap:7px}.big-answer.timed{font-size:58px;gap:9px 22px}.big-answer.timed .unit{font-size:18px}.big-answer.words{font-size:39px;line-height:1.25;max-width:14ch}.date-summary{font-size:14px;max-width:32ch;margin-bottom:12px;color:#45583e}.family-note{font-size:16px;max-width:35ch;margin:0}.timer-actions{margin-top:15px}.timer-actions button{font-size:13px;background:#ffffffa6;border-color:#78946b}.day-panel{position:relative;z-index:1;max-width:600px;padding:0 38px 25px}.day-path{display:flex;align-items:flex-start;gap:0;padding:8px 0 4px;max-width:520px}.day-step{position:relative;display:flex;align-items:center;flex-direction:column;min-width:0;flex:1;font-size:11px;text-align:center}.day-step:before{content:"";position:absolute;top:21px;left:0;right:0;height:2px;background:#8a9e73;z-index:-1}.day-step:first-child:before{left:50%}.day-step:last-child:before{right:50%}.day-dot{background:#f6f4db;border:1px solid #7c9562;width:43px;height:43px;border-radius:50%;display:grid;place-items:center;font-size:17px;font-weight:550;margin-bottom:5px}.day-step:first-child .day-dot{background:#4d6947;color:#fff;border-color:#4d6947}.day-step.event-day .day-dot{background:#a85954;color:#fff;border-color:#a85954}.day-label{max-width:8ch;line-height:1.3}.scene-caption{font-size:11px;max-width:46ch;line-height:1.5;color:#435440;margin:8px 0 0}.scene-sign{position:absolute;right:24px;bottom:20px;z-index:2;background:#fffae5e6;padding:7px 14px;border-radius:999px;font-size:12px;border:1px solid #ddd0a8;margin:0}.bug-stage{position:absolute;top:41%;left:69%;width:200px;height:220px;perspective:700px;z-index:1;animation:bug-breathe 5s ease-in-out infinite}.ladybug{position:absolute;width:168px;height:200px;transform:rotate(-19deg) rotateX(24deg) rotateY(-12deg);transform-style:preserve-3d}.bug-shell{position:absolute;inset:36px 0 0;background:radial-gradient(ellipse at 31% 20%,#ef9a79 0%,#d95548 31%,#ac302e 69%,#651e23 100%);border-radius:49% 49% 48% 48%;box-shadow:inset 2px 3px 7px #ffd6a39c,inset -10px -9px 13px #3b112f69,0 7px 0 #492731,4px 15px 16px #263b3322;transform:translateZ(14px);overflow:hidden}.bug-shell:after{content:"";position:absolute;left:19px;top:14px;right:48px;height:52px;transform:rotate(-35deg);border-radius:50%;background:linear-gradient(#fff9e749,transparent)}.seam{position:absolute;left:50%;height:100%;width:4px;background:#47292e;transform:rotate(2deg);box-shadow:1px 0 2px #e5785b}.spot{position:absolute;background:radial-gradient(at 35% 26%,#474047,#201f29 75%);border-radius:50%;width:31px;height:32px;box-shadow:inset 1px 1px 2px #4d3a46}.s1{left:30px;top:28px}.s2{right:27px;top:26px}.s3{left:17px;top:78px;width:34px;height:35px}.s4{right:16px;top:76px;width:34px;height:35px}.s5{left:42px;bottom:15px;width:25px;height:27px}.s6{right:37px;bottom:15px;width:25px;height:27px}.bug-head{position:absolute;width:87px;height:69px;left:42px;top:0;border-radius:48%;background:radial-gradient(at 30% 30%,#414c40,#172a27 80%);transform:translateZ(3px);box-shadow:inset 2px 2px 5px #92a47f44}.eye{width:16px;height:21px;background:#fff8dc;position:absolute;top:11px;border-radius:50%;box-shadow:inset 0 -3px 2px #bdcdb4}.eye:after{content:"";position:absolute;width:7px;height:10px;background:#1c302a;border-radius:50%;top:5px;left:6px}.e1{left:20px}.e2{right:18px}.antenna{position:absolute;width:30px;height:27px;border-top:3px solid #24382f;border-radius:50%;top:-14px}.antenna:after{content:"";height:7px;width:7px;background:#24382f;position:absolute;top:0;border-radius:50%}.a1{left:-9px;transform:rotate(-31deg)}.a2{right:-9px;transform:rotate(31deg)}.a2:after{right:0}.leg{position:absolute;z-index:-1;width:50px;height:38px;border:5px solid #263c32;border-bottom:0;border-left:0;border-radius:0 75% 0 0;top:90px;transform-origin:left}.l1{left:-21px;top:54px;transform:rotate(-118deg)}.l2{left:-33px;top:109px;transform:rotate(-137deg)}.l3{left:-21px;top:158px;transform:rotate(-157deg)}.r1{right:-33px;top:57px;transform:rotate(-22deg)}.r2{right:-39px;top:106px;transform:rotate(1deg)}.r3{right:-23px;top:155px;transform:rotate(21deg)}.bug-shadow{position:absolute;top:115px;left:-7px;height:78px;width:190px;border-radius:50%;background:#293e324a;filter:blur(9px);transform:rotate(-19deg)}.floating-seed{position:absolute;width:7px;height:7px;z-index:1;background:#fff5bf;border-radius:50%;box-shadow:0 0 12px #fff8b5;animation:drift 8s ease-in-out infinite}.seed-one{left:64%;top:30%}.seed-two{left:88%;top:39%;animation-delay:-3s}.seed-three{left:76%;top:70%;animation-delay:-5s}.ways{margin-top:30px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:16px}.section-title h2{margin:0;font-size:26px}.view-switch{display:flex;gap:5px;flex-wrap:wrap}.view-switch button{font-size:13px;padding:8px 14px}.view-panel{display:flex;align-items:center;justify-content:space-between;gap:24px;background:#fffdf7;border:1px solid var(--line);border-radius:20px;padding:24px 30px;min-height:180px}.unit-lesson{display:flex;align-items:center;gap:24px;max-width:820px}.comparison-text{font-family:Georgia,"Times New Roman",serif;font-size:27px;line-height:1.35;margin:0 0 7px}.muted{color:var(--muted);font-size:14px;margin-bottom:0}.mini-bug{position:relative;flex:none;width:66px;height:79px;transform:rotate(-20deg);background:radial-gradient(at 28% 20%,#ee9480,#b94743 58%,#842e31);border-radius:46%;box-shadow:0 5px 0 #253b3340}.mini-bug:before{content:"";position:absolute;background:#263b33;width:36px;height:25px;top:-12px;left:15px;border-radius:45%}.mini-bug:after{content:"";position:absolute;inset:0;border-radius:46%;background:radial-gradient(circle at 24% 29%,#253b33 0 7px,transparent 8px),radial-gradient(circle at 76% 29%,#253b33 0 7px,transparent 8px),radial-gradient(circle at 23% 66%,#253b33 0 8px,transparent 9px),radial-gradient(circle at 76% 66%,#253b33 0 8px,transparent 9px),linear-gradient(90deg,transparent 48%,#253b33 49% 52%,transparent 53%)}.amount-ring,.game-clock{--fill:1;flex:none;width:135px;height:135px;border-radius:50%;padding:10px;background:conic-gradient(from -90deg,#9a5556 calc(var(--fill)*1turn),#eee8d8 0);display:grid;place-items:center;position:relative}.amount-ring>div,.game-clock>div{background:#fffdf7;border-radius:50%;height:100%;width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center}.amount-ring strong{font-family:Georgia,serif;font-size:34px;font-weight:500;line-height:1.1}.amount-ring span{font-size:12px}.analog-clock{width:150px;height:150px;flex:none;fill:#f4eedf;stroke:#72846b;stroke-width:2}.analog-clock #hourHand{stroke:#343f48;stroke-width:7;stroke-linecap:round}.analog-clock #minuteHand{stroke:#a44f4a;stroke-width:4;stroke-linecap:round}.analog-clock .clock-pin{fill:#343f48;stroke:none}.step-leaf{width:105px;flex:none;fill:#a6be8d;stroke:#59774e;stroke-width:3}.step-leaf path+path{fill:none}.explore-row{display:grid;grid-template-columns:1fr 1fr;gap:17px;margin-top:22px}.activity-link{border:1px solid var(--line);border-radius:20px;padding:23px;display:flex;align-items:center;gap:18px;text-align:left;background:#ece9f1}.activity-link:nth-child(2){background:#f1e8db}.activity-link:hover{background:#e1dbe9}.activity-number{font-family:Georgia,serif;font-size:24px;color:#765d82}.activity-link strong{display:block;font-family:Georgia,serif;font-weight:500;font-size:23px;line-height:1.2}.activity-link small{display:block;margin-top:7px;color:#506057;font-size:13px;line-height:1.45}.arrow{margin-left:auto;font-size:27px;color:#5b4166}.status{min-height:1.6em;margin:16px 0 0;font-size:14px;color:#546349}footer{display:flex;justify-content:space-between;gap:20px;border-top:1px solid var(--line);font-size:12px;color:#5d6b59;padding:17px 0}dialog{max-width:720px;width:calc(100% - 32px);max-height:calc(100dvh - 36px);margin:auto;padding:30px;border:1px solid #b3c0aa;border-radius:24px;color:var(--ink);background:#faf7ed;box-shadow:0 30px 100px #13271d44;overflow:auto}dialog::backdrop{background:#20392ed1;backdrop-filter:blur(4px)}.dialog-top{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:8px}.dialog-top h2{font-size:35px;margin:0}.dialog-top+p{font-size:15px;color:var(--muted)}.close-button{font-size:13px;padding:8px 13px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px;margin-top:24px}.form-grid label{display:flex;flex-direction:column;gap:7px;font-size:14px;font-weight:600;min-width:0}.form-grid .full{grid-column:1/-1}.form-grid input,.form-grid select,.form-grid textarea{width:100%;min-width:0;border:1px solid #9db09a;border-radius:9px;padding:10px 12px;background:#fffefa;color:var(--ink);min-height:45px;font-weight:400}.form-grid input[type=checkbox]{width:20px;min-height:20px;accent-color:#566e4a}.form-grid .checkbox-label{flex-direction:row;align-items:center;font-weight:400}.form-grid small,.save-area small{color:var(--muted);font-size:12px;font-weight:400;line-height:1.5}.form-error{color:#922e31;font-size:14px;margin:20px 0 0;min-height:1.5em}.dialog-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:18px}.save-area{border-top:1px solid var(--line);margin-top:28px;padding-top:20px}.save-buttons{display:flex;gap:7px;flex-wrap:wrap}.save-buttons button{font-size:12px;padding:9px 11px}.save-area small{display:block;margin-top:10px}.save-area p{font-size:13px;margin:12px 0}.practice-dialog{max-width:830px}.practice-layout{display:grid;grid-template-columns:240px 1fr;gap:35px;align-items:center;margin:33px 0}.game-clock{width:235px;height:235px;padding:18px;background:conic-gradient(from -90deg,#95739f calc(var(--fill)*1turn),#e4e8d9 0);border:1px solid #aebea4}.game-clock:after{content:"";position:absolute;inset:1px;border-radius:50%;background:repeating-conic-gradient(from -90deg,#58664c 0deg 1deg,transparent 1deg 30deg);mask:radial-gradient(transparent 66%,black 67% 70%,transparent 71%);pointer-events:none}.game-clock strong{font-family:Georgia,serif;font-size:67px;font-weight:500;line-height:1.2}.game-clock span{font-size:15px}.piece-buttons{display:flex;gap:8px;flex-wrap:wrap}.piece-buttons button{background:#ebe5f0;border-color:#a68ab2}.added-pieces{display:flex;flex-wrap:wrap;gap:6px;min-height:40px;margin-top:20px}.added-pieces span{font-size:14px;background:#e3e9d3;padding:5px 12px;border:1px solid #93a77a;border-radius:7px}.practice-feedback{font-family:Georgia,serif;font-size:23px;min-height:2.6em;line-height:1.4;margin:15px 0 0}.story-dialog{max-width:720px}.story-art{position:relative;height:200px;background:linear-gradient(#c5ddd5,#e8e7bd);border-radius:16px;margin:20px 0 23px;overflow:hidden}.story-art:before{content:"";position:absolute;bottom:-30px;left:-20%;width:100%;height:125px;border-radius:50%;background:#97b17b;transform:rotate(-12deg)}.story-art:after{content:"";position:absolute;right:-70px;bottom:-40px;width:75%;height:140px;border-radius:50%;background:#608c64;transform:rotate(9deg)}.story-art .mini-bug{position:absolute;left:24%;top:85px;z-index:2;transform:rotate(-25deg) scale(1.15)}.story-sun{width:63px;height:63px;border-radius:50%;background:#fff3bf;position:absolute;right:13%;top:21px}.story-ring{position:absolute;height:100px;width:100px;border-radius:50%;top:42px;left:48%;background:conic-gradient(from -90deg,#a56a73 var(--story-fill,0turn),#f9f3df 0);border:9px solid #fff9e3;z-index:1;box-shadow:0 4px 16px #284c3322}.story-mark{position:absolute;z-index:3;top:133px;left:51%;background:#fbf4da;color:#294632;padding:3px 9px;border-radius:50%;font-size:12px}.story-mark.m2{left:58%;top:139px}.story-mark.m3{left:65%;top:125px}.story-dialog h2{font-size:33px}.story-text{font-family:Georgia,serif;font-size:25px;line-height:1.65;margin-bottom:17px}.noscript{padding:20px;text-align:center}.large-text{--font:1.15}.large-text .muted,.large-text .family-note,.large-text .date-summary,.large-text label{font-size:18px}.large-text .comparison-text{font-size:31px}@keyframes bug-breathe{0%,100%{transform:translateY(0) rotate(0)}50%{transform:translateY(-8px) rotate(2deg)}}@keyframes drift{0%,100%{transform:translate(0,0);opacity:.4}50%{transform:translate(15px,-17px);opacity:.9}}html[data-still=true] *,html[data-still=true] *:before,html[data-still=true] *:after{animation:none!important;transition:none!important}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important;scroll-behavior:auto!important}}
@media(max-width:1000px){.topbar{padding:18px 25px}main{padding:28px 25px 12px}.examples{flex-direction:column;align-items:flex-start;gap:10px}.bug-stage{left:71%;transform-origin:center;scale:.85}.answer{width:58%;padding:30px}.day-panel{padding-left:30px;width:60%}.big-answer.timed{font-size:48px}.section-title{align-items:flex-start;flex-direction:column;gap:14px}.activity-link{padding:19px;gap:12px}.activity-link strong{font-size:21px}}
@media(max-width:720px){.brand{font-size:10px;letter-spacing:.1em}.brand svg{width:27px}.topbar{padding:14px 16px;align-items:flex-start;gap:12px}.top-actions{justify-content:flex-end;gap:6px}.top-actions button{font-size:12px;padding:7px 10px;min-height:38px}main{padding:22px 16px 10px}.intro{align-items:flex-start;flex-direction:column;gap:16px;margin-bottom:24px}.intro .outline-button{font-size:14px}.subtitle{font-size:17px}.examples button{font-size:12px;padding:8px 11px}.adventure{min-height:640px;border-radius:23px}.scene:after{background:linear-gradient(#f3f2ddf7 0%,#f3f2ddd9 25%,#f3f2dd65 48%,transparent 70%)}.landscape{width:140%;margin-left:-20%}.answer{width:100%;padding:27px 25px;min-height:300px}.answer h2{max-width:none;font-size:33px;margin-bottom:12px}.big-answer{font-size:76px;margin-bottom:10px}.big-answer.timed{font-size:50px}.big-answer.words{font-size:33px;max-width:20ch}.count-lead{font-size:14px}.date-summary{max-width:42ch}.family-note{max-width:40ch}.bug-stage{left:55%;top:52%;scale:.7}.day-panel{width:70%;padding:10px 20px 20px;position:absolute;bottom:5px}.day-path{padding:0}.day-dot{height:35px;width:35px;font-size:14px}.day-step:before{top:17px}.day-step{font-size:10px}.scene-caption{font-size:10px}.scene-sign{font-size:10px;right:12px;bottom:15px}.floating-seed{display:none}.ways{margin-top:25px}.view-panel{padding:22px;gap:14px}.unit-lesson{gap:17px}.mini-bug{width:48px;height:59px;scale:.85}.mini-bug:before{width:28px;left:10px}.comparison-text{font-size:23px}.amount-ring{width:100px;height:100px;padding:8px}.amount-ring strong{font-size:28px}.amount-ring span{font-size:10px}.unit-lesson .eyebrow{font-size:10px;letter-spacing:.07em}.muted{font-size:12px}.analog-clock{width:110px;height:110px}.explore-row{grid-template-columns:1fr;gap:12px}.activity-link{padding:20px}.activity-link strong{font-size:24px}.activity-link small{font-size:13px}footer{flex-direction:column;gap:8px}.practice-layout{grid-template-columns:1fr;gap:25px}.game-clock{margin:auto}.piece-buttons{justify-content:center}.added-pieces{justify-content:center}.practice-feedback{text-align:center}dialog{padding:22px;border-radius:19px}.dialog-top h2{font-size:28px}.story-text{font-size:22px}}
@media(max-width:420px){.topbar{flex-direction:column}.top-actions{width:100%;justify-content:space-between}.top-actions #motion{display:block}.top-actions button{padding:8px 9px}h1{font-size:35px}.examples>div{gap:6px}.adventure{min-height:640px}.answer{padding:24px 22px}.answer h2{font-size:30px}.big-answer{font-size:68px}.big-answer.timed{font-size:39px;gap:8px 17px}.big-answer.timed .unit{font-size:16px}.day-panel{width:100%;bottom:28px}.scene-sign{bottom:9px}.bug-stage{top:53%;left:50%;scale:.65}.view-panel{flex-wrap:wrap;justify-content:center}.unit-lesson{align-items:flex-start;width:100%}.comparison-text{font-size:23px}.amount-ring{width:105px;height:105px;margin-top:4px}.view-switch{gap:5px}.view-switch button{font-size:12px;padding:9px 10px}.form-grid{grid-template-columns:1fr}.form-grid label{grid-column:1}.story-mark.m3{left:77%}.story-mark.m2{left:65%}.story-mark.m1{left:52%}.story-ring{left:51%}.scene-caption{font-size:10px}.day-step .day-label{font-size:9px}}
@media(forced-colors:active){.scene{display:none}.adventure,.view-panel,.day-dot,button,dialog{border:1px solid CanvasText}.answer{width:100%;color:CanvasText}.day-panel{position:relative;bottom:auto;width:100%}.scene-sign{display:none}.amount-ring,.game-clock{border:4px solid CanvasText;background:Canvas}.game-clock>div,.amount-ring>div{color:CanvasText;background:Canvas}.day-step:before{background:CanvasText}.day-dot{color:CanvasText!important;background:Canvas!important}}

/* Preston's physical kitchen timer is the familiar hour reference. */
.bug-stage{width:230px;height:220px;left:67%}
.kitchen-timer{position:relative;width:220px;height:220px;transform:rotate(-9deg) rotateX(13deg);transform-style:preserve-3d}
.timer-dial{position:absolute;width:240px;height:90px;left:-10px;top:123px;z-index:1;filter:drop-shadow(0 7px 5px #243c3238)}
.timer-shell{position:absolute;width:220px;height:170px;top:0;left:0;z-index:2;border-radius:51% 51% 45% 45%;overflow:hidden;background:radial-gradient(ellipse at 31% 21%,#f6a28d 0%,#e65d48 24%,#c9352f 58%,#7d252a 100%);box-shadow:inset 3px 4px 6px #ffd9b891,inset -8px -10px 13px #50182b64,0 3px 0 #302c26}
.timer-shell:after{content:"";position:absolute;left:30px;top:12px;width:92px;height:33px;border-radius:50%;transform:rotate(-22deg);background:linear-gradient(#fff9e778,transparent);pointer-events:none}
.timer-seam{position:absolute;top:0;left:51%;width:4px;height:103px;background:#3b2925;transform:rotate(3deg);box-shadow:1px 0 2px #e68062}
.timer-spot{position:absolute;background:radial-gradient(at 35% 25%,#45473d,#17271f 74%);border-radius:50%;box-shadow:inset 1px 1px 2px #6e5141}
.ts1{left:41px;top:25px;width:40px;height:26px;transform:rotate(-24deg)}.ts2{right:37px;top:25px;width:42px;height:27px;transform:rotate(27deg)}.ts3{left:16px;top:69px;width:26px;height:38px;transform:rotate(19deg)}.ts4{right:16px;top:71px;width:29px;height:41px;transform:rotate(-12deg)}.ts5{right:70px;top:58px;width:16px;height:12px}
.timer-face{position:absolute;bottom:-9px;left:55px;width:114px;height:100px;border-radius:51% 51% 30% 30%;background:radial-gradient(at 38% 28%,#495044,#172a23 68%,#11251e);box-shadow:inset 2px 3px 4px #5c705e55}
.paint-eye{position:absolute;top:24px;width:25px;height:29px;border-radius:50%;background:#faf8e3;box-shadow:inset 1px -2px 2px #bccbb9}.pe1{left:19px;transform:rotate(19deg)}.pe2{right:18px;transform:rotate(-19deg)}
.paint-eye:before{content:"";position:absolute;inset:5px 3px 3px 6px;background:#1a3027;border-radius:50%}.paint-eye:after{content:"";position:absolute;top:9px;left:10px;width:6px;height:7px;border-radius:50%;background:#fcf8e4}
.paint-pointer{position:absolute;width:20px;height:17px;bottom:14px;left:48px;border-left:4px solid #fdf9df;border-top:4px solid #fdf9df;transform:rotate(45deg);border-radius:5px}
.bug-shadow{width:232px;height:70px;top:163px;left:-13px;transform:rotate(-9deg);filter:blur(10px)}
.mini-timer{position:relative;flex:none;width:74px;height:67px;margin:6px 0 12px;border-radius:51% 51% 43% 43%;background:radial-gradient(circle at 30% 27%,#1d3024 0 8px,transparent 9px),radial-gradient(circle at 72% 27%,#1d3024 0 8px,transparent 9px),radial-gradient(circle at 17% 58%,#1d3024 0 7px,transparent 8px),radial-gradient(circle at 84% 59%,#1d3024 0 7px,transparent 8px),linear-gradient(90deg,transparent 49%,#263728 50% 52%,transparent 53%),radial-gradient(at 30% 20%,#f29477,#c93a32 65%,#80252b);box-shadow:inset 1px 2px 3px #ffca9d75}
.mini-face{position:absolute;bottom:0;left:18px;width:39px;height:33px;border-radius:50% 50% 30% 30%;background:radial-gradient(circle at 30% 38%,#eef3d7 0 4px,transparent 5px),radial-gradient(circle at 73% 38%,#eef3d7 0 4px,transparent 5px),#233b2d;z-index:2}
.mini-dial{position:absolute;bottom:-8px;left:0;right:0;height:17px;border-radius:0 0 50% 50%;background:#21362b;box-shadow:0 4px 4px #314c3420}
.mini-dial:after{content:"";position:absolute;left:5px;right:5px;top:5px;height:4px;background:repeating-linear-gradient(90deg,#f2f0d6 0 3px,transparent 3px 9px);border-radius:50%}
@media(max-width:1000px){.bug-stage{left:69%}}
@media(max-width:720px){
  .adventure{display:flex;flex-direction:column;min-height:640px}
  .answer{min-height:0;padding-bottom:250px}
  .bug-stage{top:auto;bottom:40px;left:auto;right:7%;scale:.7;transform-origin:right bottom}
  .adventure:has(.day-panel:not([hidden])) .bug-stage{bottom:153px}
  .day-panel{position:relative;bottom:auto;width:100%;padding:0 22px 45px;max-width:none}
  .scene-sign{bottom:10px;right:13px}
  .scene:after{background:linear-gradient(#f3f2ddf7 0%,#f3f2dde0 37%,#f3f2dd48 68%,transparent 90%)}
  .mini-timer{width:60px;height:56px;scale:.88;margin-right:-4px}
  .mini-face{left:13px;width:34px;height:30px}
  .unit-lesson{min-width:0}.unit-lesson>div:last-child{min-width:0}.comparison-text{overflow-wrap:anywhere}
  .large-text .answer h2{font-size:32px}.large-text .date-summary{font-size:17px}
}
@media(max-width:420px){.bug-stage{left:auto;right:18px;scale:.65}.adventure:has(.day-panel:not([hidden])) .bug-stage{bottom:151px}.answer{padding-bottom:238px}.day-dot{width:clamp(23px,7vw,35px);height:clamp(23px,7vw,35px);font-size:12px}.day-step:before{top:14px}}
@media(forced-colors:active){.answer{padding-bottom:25px}.day-panel{padding-bottom:25px}}

.clock-view,.steps-view{display:block}.clock-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:16px;margin-top:24px}.clock-card{text-align:center;padding:18px 10px;background:#f5f1e5;border:1px solid #d7dec9;border-radius:16px;min-width:0}.clock-card .eyebrow{letter-spacing:.05em}.clock-card .clock-value{font-size:15px;margin:12px 0 0}.clock-hour{stroke:#343f48;stroke-width:7;stroke-linecap:round}.clock-minute{stroke:#a44f4a;stroke-width:4;stroke-linecap:round}.clock-card .analog-clock{width:130px;height:130px;max-width:100%}
.plan-journey{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:12px;list-style:none;counter-reset:journey;margin:24px 0 0;padding:0}.plan-journey li{counter-increment:journey;background:#eef0df;padding:16px;border:1px solid #cbd6ba;border-radius:15px}.plan-journey li:before{content:counter(journey);display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#55734c;color:#fff;margin-bottom:14px;font-size:13px}.plan-journey strong{display:block;font-size:15px;margin-bottom:9px}.plan-journey span{display:block;font-size:13px;line-height:1.6;overflow-wrap:anywhere}
.explore-row{grid-template-columns:repeat(3,minmax(0,1fr))}.activity-link:nth-child(3){background:#e6eadb}.calm-note{margin-top:22px;border:1px solid var(--line);border-radius:14px;padding:16px 20px;background:#f1eee2}.calm-note summary{cursor:pointer;min-height:30px;font-size:15px}.calm-note p{font-size:15px;line-height:1.6;margin:14px 0 0;max-width:70ch}.calm-note summary:focus-visible{outline:3px solid #765484;outline-offset:4px}
.minute-dialog{max-width:760px}.second-seeds{display:grid;grid-template-columns:repeat(15,minmax(0,1fr));gap:7px;margin:25px 0 17px;border-radius:17px;background:linear-gradient(#e4ead6,#cfddb9);padding:19px}.second-seed{aspect-ratio:1;border-radius:50% 50% 40% 40%;background:#f6f5e1;border:1px solid #a9b990}.second-seed.grown{background:#dfad41;border-color:#957436;box-shadow:inset 0 2px 2px #fff2b077}.minute-controls,.piece-choices{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}.minute-controls button{font-size:13px}.piece-explorer{display:flex;align-items:center;justify-content:space-between;gap:24px;border-top:1px solid var(--line);padding-top:23px;margin:25px 0}.piece-explorer h3{font-family:Georgia,serif;font-weight:500;font-size:27px;margin:0 0 10px}.piece-choices button{min-width:50px}.piece-explorer .amount-ring{width:110px;height:110px}.minute-dialog>p:last-of-type{margin:20px 0}
@media(max-width:1000px){.explore-row{grid-template-columns:1fr}.activity-link{min-height:100px}}
@media(max-width:420px){.clock-cards,.plan-journey{grid-template-columns:1fr}.second-seeds{grid-template-columns:repeat(10,minmax(0,1fr));gap:5px;padding:12px}.piece-explorer{flex-wrap:wrap;justify-content:center}.piece-explorer>div:first-child{width:100%}.piece-choices button{flex:1}.minute-dialog h3{font-size:24px}}
@media(forced-colors:active){.second-seed{background:Canvas;border:1px solid CanvasText}.second-seed.grown{background:Highlight;border-color:Highlight}.clock-card,.plan-journey li{border:1px solid CanvasText}.plan-journey li:before{color:Canvas;background:CanvasText}}
.clock-date{font-size:12px;color:var(--muted);margin:5px 0 0}

/* Child appearance choices keep a light reading surface in every illustrated scene. */
:root{--body-font:system-ui,-apple-system,"Segoe UI",sans-serif;--display-font:Georgia,"Times New Roman",serif;--accent:#356344;--purple:var(--accent);--soft:#e7edde;--panel:#fffdf5;--line:#bfcdbb}
html[data-font="rounded"]{--body-font:"Trebuchet MS","Tahoma",sans-serif;--display-font:"Trebuchet MS","Tahoma",sans-serif}
html[data-font="simple"]{--body-font:Arial,"Tahoma",sans-serif;--display-font:Arial,"Tahoma",sans-serif}
html[data-palette="ocean"]{--paper:#eff5f7;--panel:#fbfdff;--ink:#253c4e;--muted:#4c6374;--accent:#275f7c;--soft:#dfeaf0;--line:#b8ccd6}
html[data-palette="berry"]{--paper:#f6f0f6;--panel:#fffaff;--ink:#443044;--muted:#6a506a;--accent:#744c7c;--soft:#ede0ed;--line:#d4bfd4}
html[data-palette="sunshine"]{--paper:#fff6e5;--panel:#fffcf4;--ink:#4a3929;--muted:#725b40;--accent:#805619;--soft:#f5e7c9;--line:#dbc8a2}
body{font-family:var(--body-font)}
h1,h2,.big-answer,.comparison-text,.amount-ring strong,.activity-number,.activity-link strong,.game-clock strong,.practice-feedback,.story-text,.piece-explorer h3{font-family:var(--display-font)}
.big-answer .unit{font-family:var(--body-font)}
button{color:var(--ink);background:var(--panel);border-color:var(--line)}
button:hover{background:var(--soft)}
.dark-button,.dark-button:hover{background:var(--ink);color:#fffdf3;border-color:var(--ink)}
button[aria-pressed="true"]{background:var(--soft);color:var(--ink);border-color:var(--accent)}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,.calm-note summary:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
.activity-link,.activity-link:nth-child(2),.activity-link:nth-child(3),.view-panel,dialog{background:var(--panel);border-color:var(--line)}
.activity-link:hover,.clock-card,.plan-journey li,.calm-note{background:var(--soft);border-color:var(--line)}
.activity-link small,.activity-number,.arrow,.status,footer{color:var(--muted)}
.plan-journey li:before{background:var(--accent);color:#fff}
.scene:after{background:linear-gradient(90deg,var(--paper) 0%,var(--paper) 52%,transparent 67%)}
.bug-stage{z-index:1}
.night-landmark{display:none}
.plan-label,.date-summary,.scene-caption{color:var(--ink)}
.day-dot{background:var(--panel);border-color:var(--accent)}
.day-step.event-day .day-dot{background:var(--accent);color:#fff}
.day-label{background:var(--paper);border-radius:6px;padding:1px 4px}
.landscape-stars,.landscape-seaside{display:none}
html[data-theme="stars"] .landscape-garden,html[data-theme="seaside"] .landscape-garden{display:none}
html[data-theme="stars"] .landscape-stars,html[data-theme="seaside"] .landscape-seaside{display:block}
html[data-theme="stars"] .scene-caption{background:var(--paper);padding:6px 9px;border-radius:9px}
#openCustomize{display:inline-flex;align-items:center;justify-content:center;gap:7px}
#openCustomize svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.6;flex:none}
.top-actions button,.close-button{min-height:44px;min-width:44px}
.customize-dialog{max-width:760px}
.customize-dialog[open]{display:flex;flex-direction:column;overflow:hidden}
.customize-dialog>.dialog-top,.customize-dialog>p,.customize-dialog>.look-actions{flex:none}
.look-scroll{overflow:auto;min-height:0;padding:0 6px 3px 1px;scrollbar-gutter:stable}
.look-preview{display:flex;align-items:center;justify-content:space-between;overflow:hidden;min-height:112px;border:1px solid var(--line);border-radius:18px;margin:19px 0 23px;background:var(--soft)}
.look-preview>div{padding:15px 22px;min-width:0}
.look-preview>div>span{display:block;font-size:13px;color:var(--muted)}
.look-preview strong{display:block;font-family:var(--display-font);font-size:42px;line-height:1.3;font-weight:500}
.look-preview-art{align-self:stretch;position:relative;display:block;min-width:36%;border-radius:45% 0 0 0}
.look-field{border:0;padding:0;margin:0 0 22px;min-width:0}
.look-field legend{font-size:17px;font-weight:650;margin-bottom:10px;padding:0}
.look-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}
.color-choices{grid-template-columns:repeat(4,minmax(0,1fr))}
.look-choice{display:flex;align-items:flex-start;gap:8px;border:1px solid var(--line);border-radius:13px;background:var(--panel);padding:13px 11px;cursor:pointer;min-width:0;min-height:74px}
.look-choice:has(input:checked){border:2px solid var(--accent);padding:12px 10px;background:var(--soft)}
.look-choice:has(input:focus-visible){outline:3px solid var(--accent);outline-offset:3px}
.look-choice input{flex:none;width:18px;height:18px;margin:3px 0 0;accent-color:var(--accent)}
.look-choice>span{min-width:0;flex:1}
.look-choice strong{display:block;font-size:16px;line-height:1.35;overflow-wrap:anywhere;font-weight:650}
.look-choice small{display:block;font-size:12px;line-height:1.4;color:var(--muted);margin-top:5px}
.font-storybook{font-family:Georgia,"Times New Roman",serif}
.font-rounded{font-family:"Trebuchet MS","Tahoma",sans-serif}
.font-simple{font-family:Arial,"Tahoma",sans-serif}
.color-swatch{display:block;width:34px;height:24px;border-radius:8px;margin-bottom:8px;border:1px solid #0003}
.swatch-leaf{background:linear-gradient(90deg,#356344 50%,#e7edde 50%)}
.swatch-ocean{background:linear-gradient(90deg,#275f7c 50%,#dfeaf0 50%)}
.swatch-berry{background:linear-gradient(90deg,#744c7c 50%,#ede0ed 50%)}
.swatch-sunshine{background:linear-gradient(90deg,#805619 50%,#f5e7c9 50%)}
.theme-picture{display:block;position:relative;overflow:hidden;width:100%;height:60px;border-radius:8px;margin-bottom:9px}
.theme-garden,.look-preview-art{background:linear-gradient(165deg,#c2ded5 0 48%,#98b878 49% 70%,#5d8769 71%)}
.theme-stars,html[data-theme="stars"] .look-preview-art{background:radial-gradient(circle at 25% 23%,#fff1c0 0 2px,transparent 3px),radial-gradient(circle at 80% 50%,#fff1c0 0 2px,transparent 3px),linear-gradient(165deg,#23455f 0 58%,#6c8b91 59% 76%,#315a62 77%)}
.theme-seaside,html[data-theme="seaside"] .look-preview-art{background:linear-gradient(165deg,#bae2ec 0 44%,#6bb6c9 45% 71%,#f3dfa9 72%)}
.theme-picture:after,.look-preview-art:after{content:"";position:absolute;top:10px;right:17%;width:20px;height:20px;border-radius:50%;background:#fff1b6}
.look-preview-art:after{width:33px;height:33px;top:20px}
.theme-stars:after,html[data-theme="stars"] .look-preview-art:after{box-shadow:inset 8px 1px #23455f}
.look-large{display:flex;align-items:center;gap:10px;min-height:44px;cursor:pointer;font-size:17px}
.look-large input{width:20px;height:20px;accent-color:var(--accent)}
.look-status{font-size:14px;color:var(--ink);margin:17px 0 6px}
.look-hint{font-size:12px;color:var(--muted);margin:0}
.look-actions{display:flex;gap:9px;flex-wrap:wrap;justify-content:flex-end;margin-top:21px}
.look-actions button{font-size:14px;min-height:44px}
.look-actions #resetLook{margin-right:auto}
.large-text .look-choice strong,.large-text .look-field legend{font-size:19px}
.large-text .look-choice small,.large-text .look-status,.large-text .look-hint{font-size:15px}
@media(max-width:720px){.scene:after{background:linear-gradient(var(--paper) calc(100% - 230px),transparent calc(100% - 110px))}.look-choice{padding:12px 9px}.look-choice:has(input:checked){padding:11px 8px}.look-choice strong{font-size:15px}.look-preview strong{font-size:36px}}
@media(max-width:460px){.look-choices{grid-template-columns:1fr}.color-choices,.theme-choices{grid-template-columns:repeat(2,minmax(0,1fr))}.look-choice{min-height:62px}.look-actions button{flex:1 1 120px}.look-actions #resetLook{margin-right:0}.look-preview>div{padding:12px 15px}.look-preview-art{min-width:32%}}
@media(max-width:720px){html[data-theme="stars"] .night-landmark{display:block;position:absolute;left:28px;bottom:150px;width:75px;height:75px;z-index:1}.adventure:has(.day-panel:not([hidden])) .night-landmark{bottom:270px}}
@media(forced-colors:active){.look-choice,.look-preview,.color-swatch,.theme-picture{border:1px solid CanvasText}.look-choice:has(input:checked){border:3px solid Highlight}.look-choice,.look-preview,button,.day-dot{background:Canvas;color:CanvasText}.dark-button{background:ButtonFace;color:ButtonText}}

/* Garden integration keeps the standalone activity return reachable. */
.garden-navigation{max-width:1380px;margin:auto;padding:10px 40px 0}.garden-navigation a{display:inline-flex;align-items:center;min-height:44px;font:inherit;text-underline-offset:4px}@media(max-width:720px){.garden-navigation{padding:6px 16px 0}}

/* Loading recovery and the existing Garden help route. */
.load-notice{max-width:1280px;margin:18px auto;padding:16px 24px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}.load-notice>span{display:block}.load-notice a,.garden-help a{display:inline-flex;align-items:center;min-height:44px;gap:12px;text-underline-offset:4px}.garden-help{margin:0 0 16px}@media(max-width:720px){.load-notice{margin:12px 16px;padding:12px 16px}.load-notice a{flex-wrap:wrap;gap:6px}}

@media(max-height:650px){.customize-dialog[open]{display:block;overflow:auto}.customize-dialog .look-scroll{overflow:visible;max-height:none}.customize-dialog .look-preview{display:none}}
@media(max-width:650px){input,select,textarea{font-size:max(16px,1em)!important}.topbar{padding:12px 16px}.intro{margin-bottom:14px}.subtitle{font-size:16px}main{padding-top:16px}.examples{margin-bottom:12px}.answer{padding-top:20px}}

/* Page appearance is separate from the retained illustrated scene choices. */
:root{--accent-ink:#fff;--focus:#765484}
html[data-page-appearance="light"]{color-scheme:light}
html[data-page-appearance="dark"]{color-scheme:dark;--paper:#17211d;--panel:#202e27;--ink:#eef5ed;--muted:#c0d0c3;--soft:#2b3d32;--line:#769583;--accent:#aedcb6;--accent-ink:#122719;--focus:#ead19a;--shadow:0 18px 50px #0004}
html[data-page-appearance="dark"][data-palette="ocean"]{--paper:#15232b;--panel:#20343f;--ink:#edf6fc;--muted:#bed3df;--soft:#294552;--line:#7c9dad;--accent:#b0d9ef;--accent-ink:#112934}
html[data-page-appearance="dark"][data-palette="berry"]{--paper:#271b29;--panel:#39283d;--ink:#fff0fe;--muted:#ddc5e0;--soft:#49324c;--line:#aa84ad;--accent:#e5b6ed;--accent-ink:#34203b}
html[data-page-appearance="dark"][data-palette="sunshine"]{--paper:#282217;--panel:#3b3121;--ink:#fff4dc;--muted:#e5d5b8;--soft:#4b3d28;--line:#ad9873;--accent:#f0d293;--accent-ink:#32260e}
html[data-page-contrast="strong"]{--paper:#fff;--panel:#fff;--ink:#111;--muted:#222;--soft:#eee;--line:#222;--accent:#153f27;--accent-ink:#fff;--focus:#54266d}
html[data-page-appearance="dark"][data-page-contrast="strong"]{--paper:#080d0a;--panel:#101b13;--ink:#fff;--muted:#f1f7ef;--soft:#182b1e;--line:#d8f1dc;--accent:#c3f4d0;--accent-ink:#07120b;--focus:#ffe499}
.topbar,.garden-navigation{background:var(--paper)}
.page-appearance{max-width:1380px;margin:auto;padding:14px 40px 0;display:flex;align-items:flex-start;gap:16px;flex-wrap:wrap}
.page-appearance label{display:flex;flex-direction:column;gap:5px;font-size:14px;min-width:160px;max-width:100%}
.page-appearance select{min-height:44px;border:1px solid var(--line);border-radius:9px;padding:8px 12px;background:var(--panel);color:var(--ink);max-width:100%}
.page-appearance p{flex:1 1 280px;color:var(--muted);font-size:13px;padding-top:23px;margin:0}
.timer-invitation{font-size:clamp(25px,3.3vw,39px);margin:16px 0 12px}
.timer-welcome{max-width:65ch;color:var(--muted);font-size:16px;margin:12px 0 0}
.intro>div:first-child{min-width:0;max-width:800px}.intro h1{overflow-wrap:anywhere}
.personal-actions{display:flex;gap:10px;flex-wrap:wrap;flex-shrink:0;max-width:100%}
.clock-limit{margin:24px 0 0;color:var(--muted);max-width:85ch;font-size:14px}
.scene-sign,#dayCaption{background:var(--panel);color:var(--ink);border:1px solid var(--line)}
#dayCaption{padding:6px 9px;border-radius:9px}
.timer-language-line{display:block}.timer-language-line[lang="th"]{letter-spacing:normal;word-spacing:normal}
.dark-button,.dark-button:hover{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.plan-journey li:before,.day-step.event-day .day-dot{background:var(--accent);color:var(--accent-ink)}
.form-grid input,.form-grid select,.form-grid textarea,.timer-actions button,.amount-ring>div,.game-clock>div{background:var(--panel);color:var(--ink);border-color:var(--line)}
.piece-buttons button,.added-pieces span{background:var(--soft);color:var(--ink);border-color:var(--line)}
.skip{background:var(--panel);color:var(--ink)}

/* Living companions use reserved space. The kitchen timer is a stable object. */
.bug-stage,.floating-seed{animation:none}
.timer-companion{display:flex;align-items:center;justify-content:center;gap:18px;margin:16px 0;padding:12px 20px;border:1px solid var(--line);border-radius:18px;background:var(--panel);color:var(--ink);min-width:0}
.timer-companion [data-character-art]{width:200px;flex:0 0 200px;line-height:0;pointer-events:none}
.ladybug-character{width:100%;height:auto;display:block;overflow:visible}
.timer-companion figcaption{font-size:16px;line-height:1.6;max-width:36ch;overflow-wrap:anywhere}
.scenery-controls{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0 20px}
.scenery-controls button{min-height:44px;font-size:14px}
.story-art{height:auto;min-height:300px;display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:110px 12px 12px;isolation:isolate;overflow:hidden}
.story-art .timer-companion{position:relative;z-index:2;display:flex;flex-direction:column;gap:4px;margin:0;padding:8px;min-width:0;background:var(--panel)}
.story-art .timer-companion [data-character-art]{width:100%;max-width:210px;flex-basis:auto}
.story-art figcaption{font-size:14px;text-align:center}
.story-ring{top:10px;left:calc(50% - 50px)}
.story-mark.m1{top:75px;left:calc(50% - 44px)}
.story-mark.m2{top:75px;left:calc(50% - 12px)}
.story-mark.m3{top:75px;left:calc(50% + 20px)}
.story-art:before,.story-art:after{z-index:-1;pointer-events:none}
.large-text .timer-companion figcaption{font-size:18px}
@media(max-width:720px){.timer-companion{gap:8px;padding:10px;align-items:center}.timer-companion [data-character-art]{width:145px;flex-basis:145px}.timer-companion figcaption{font-size:15px}.story-art{gap:6px;padding-inline:6px}.story-art .timer-companion{padding:6px}.story-art .timer-companion figcaption{font-size:14px}.top-actions{flex-wrap:wrap}.top-actions button{min-height:44px}}
@media(max-width:420px){.timer-companion{flex-direction:column}.timer-companion [data-character-art]{width:160px;flex-basis:auto}.timer-companion figcaption{text-align:center}.story-art .timer-companion [data-character-art]{width:100%}.story-art .timer-companion figcaption{font-size:13px}.large-text .story-art figcaption{font-size:16px}}
@media(forced-colors:active){.timer-companion{border:1px solid CanvasText;background:Canvas;color:CanvasText}.ladybug-character path,.ladybug-character ellipse,.ladybug-character circle{forced-color-adjust:none}.story-art{background:Canvas}.story-art:before,.story-art:after,.story-sun{display:none}}
@media print{.scenery-controls,[data-scenery-pause],[data-scene-still]{display:none!important}.timer-companion{break-inside:avoid;border:1px solid #555;background:#fff;color:#222}.timer-companion [data-character-art]{width:120px;flex-basis:120px}.story-art .timer-companion [data-character-art]{width:120px;flex-basis:auto}.story-art{break-inside:avoid;background:#fff}.story-art:before,.story-art:after{display:none}}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible,.calm-note summary:focus-visible{outline-color:var(--focus)}
@media(max-width:1000px){.intro{align-items:flex-start;flex-direction:column}.page-appearance{padding:12px 24px 0}.personal-actions{flex-shrink:1}}
@media(max-width:720px){.page-appearance{padding:12px 16px 0;gap:10px}.page-appearance label{flex:1 1 125px;min-width:0}.page-appearance p{flex-basis:100%;padding:0}.personal-actions{width:100%}.personal-actions button{flex:1 1 140px}.timer-invitation{font-size:28px}}
@media(forced-colors:active){html[data-page-appearance],html[data-page-contrast]{--paper:Canvas;--panel:Canvas;--ink:CanvasText;--muted:CanvasText;--soft:Canvas;--line:CanvasText;--accent:Highlight;--accent-ink:HighlightText;--focus:Highlight}.page-appearance select,.form-grid input,.form-grid select,.form-grid textarea,.amount-ring>div,.game-clock>div{background:Canvas;color:CanvasText;border-color:CanvasText}.dark-button,.dark-button:hover{background:ButtonFace;color:ButtonText;border-color:ButtonText}}

/* Keep the hour reference clear of the short-phone calendar caption. */
@media(max-width:720px){.scene-sign{position:static;align-self:flex-end;margin:0 22px 16px}.answer{padding-bottom:25px}.bug-stage,.adventure:has(.day-panel:not([hidden])) .bug-stage{position:relative;top:auto;bottom:auto;left:auto;right:18px;align-self:flex-end;flex-shrink:0;margin-bottom:16px}}
@media(forced-colors:active){.bug-stage{display:none}}
/* Print the active dialog once in document flow, without its underlying page. */
@media print{body:has(dialog[open]){background:#fff;overflow:visible}body:has(dialog[open])> :not(dialog[open]){display:none!important}dialog[open]{position:static;inset:auto;width:100%;max-width:none;max-height:none;overflow:visible;margin:0;box-shadow:none;background:#fff;color:#222}dialog::backdrop{display:none}dialog[open] .close-button,dialog[open] .dialog-actions{display:none!important}}

/* Keep the timer editor's commit action visible while its fields scroll. */
.saved-timers{margin:18px 0;padding:16px;border:1px solid var(--line);border-radius:16px;background:var(--panel)}
.saved-timers h2{font-size:22px;margin:0}.saved-timers p{font-size:15px;color:var(--muted)}
.timer-list{display:flex;flex-wrap:wrap;gap:8px}.timer-list button{max-width:100%;overflow-wrap:anywhere;min-height:44px}
.timer-list button[aria-pressed=true]{background:var(--accent);color:var(--accent-ink)}
.advanced-settings{margin:16px 0}.advanced-settings summary{cursor:pointer;font-weight:650;padding:12px 0}
.advanced-settings .form-grid{margin-top:12px}
#builder:has(#advancedSettings:not([open])) .save-buttons{display:none}
#replaceArea{margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:12px}
#replaceArea label{display:grid;gap:6px}#replaceChoice{width:100%;min-height:44px}#replaceTimer{margin-top:10px;max-width:100%}
#builder{padding:0;overflow:hidden}
#planForm{display:flex;flex-direction:column;max-height:calc(100dvh - 40px)}
.builder-scroll{overflow:auto;padding:24px;min-height:0;overscroll-behavior:contain}
.builder-footer{flex-shrink:0;padding:10px 24px 16px;border-top:1px solid var(--line);background:var(--paper)}
.builder-footer .dialog-actions{margin:0;gap:8px}.builder-footer .form-error{margin:0 0 6px}
.time-picker,.departure-picker{margin:0;min-width:0;border:1px solid var(--line);border-radius:12px;padding:10px}
.time-picker legend,.departure-picker legend{font-size:14px;font-weight:650}
.time-choices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px}.form-grid .time-choices label{min-width:0;grid-column:auto}
.time-choices select{width:100%;min-width:0;padding:10px 6px}
.selected-time{margin:0;color:var(--muted);font-size:14px;grid-column:1/-1}
#departureFields{display:grid;gap:12px;margin-top:12px}
.timer-tools{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}
.example-picker{margin:18px 0}.example-picker summary{cursor:pointer;padding:10px 0;font-weight:650}.example-picker .examples{margin:12px 0}
@media(max-width:500px){.builder-scroll{padding:16px}.builder-footer{padding:8px 12px 12px}.builder-footer .dialog-actions{display:grid;grid-template-columns:1fr 1fr}.builder-footer button[type=submit]{grid-column:1/-1;grid-row:1}.builder-footer button{font-size:14px;padding:9px}.time-picker{grid-column:1/-1}.topbar{flex-direction:column}.top-actions{justify-content:flex-start}}