@charset "UTF-8";
:root{font-family:"Trebuchet MS","Segoe UI",Arial,sans-serif;color:#254e43;background:#f7f5eb;font-synthesis:none;--ink:#254e43;--green:#215d4e;--accent:#e8aa63;--border:#dedfd1;--water:#b6dedc}*{box-sizing:border-box}body{margin:0}button,input,select,textarea{font:inherit}button,a,input,select,textarea{touch-action:manipulation}button{cursor:pointer;min-height:46px;border:1px solid var(--border);border-radius:13px;padding:10px 17px;background:#fffdf7;color:var(--ink);font-weight:700}button:disabled{cursor:default;opacity:.55}button:hover:enabled{filter:brightness(.97)}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:4px solid #cc813b;outline-offset:4px}button.primary{background:var(--green);color:#fffdf3;border-color:var(--green);box-shadow:0 4px 0 #163f35;padding:14px 25px}button.outline{background:transparent;border:1.5px solid #658476}button.quiet,.textbutton{border:0;background:transparent;box-shadow:none}.textbutton,a{color:#406958}a{text-underline-offset:4px}button.danger{color:#913f35}button[hidden],[hidden]{display:none!important}.topbar{max-width:1440px;margin:auto;padding:23px 4.5%;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--border);gap:15px}.brand{font-size:29px;letter-spacing:1px;font-weight:900;text-decoration:none;color:var(--ink)}.brand span{color:#d49555;font-size:12px;margin-left:3px}.brand small{display:block;font-size:8px;letter-spacing:1.7px;margin-top:5px}.topbar nav{display:flex;gap:8px}main{max-width:1440px;padding:0 4.5%;margin:auto}.heading{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:25px 0 22px}.eyebrow{font-size:10px;letter-spacing:2px;font-weight:800;margin:0 0 9px;color:#6e8877}h1{font-size:clamp(25px,3vw,38px);letter-spacing:-1.4px;margin:0;font-weight:800}h1 span{display:inline-block;color:#d9a256;font-size:28px;margin-left:18px;vertical-align:top}.stages{display:flex;gap:8px}.stage{width:42px;height:42px;border:1px solid #d6ddcc;border-radius:50%;display:grid;place-items:center;font-size:21px;background:#eeefe4;color:#8b9b85}.stage.open{background:#e0ead6;color:#365e44}.stage.current{background:var(--green);color:white;box-shadow:0 0 0 4px #e1e8d8}.welcome{min-height:480px;display:grid;grid-template-columns:1fr 1fr;border:1px solid #dbdfcf;border-radius:28px;overflow:hidden;background:#fffdf5}.welcome-copy{padding:45px 10%}.welcome h2{font-size:clamp(30px,3.2vw,45px);line-height:1.14;letter-spacing:-1.4px;margin:17px 0 18px}.welcome-copy>p:not(.eyebrow):not(.small){font-size:18px;color:#658071;line-height:1.65}.launch-settings{display:flex;gap:14px;margin:25px 0}.launch-settings label{font-size:12px;font-weight:700}label{display:block}select,input[type=text],input[type=search],input:not([type]),textarea{display:block;min-height:45px;border:1px solid #cdd8c8;border-radius:9px;background:#fffef9;color:var(--ink);width:100%;padding:10px;margin-top:6px}select{max-width:100%}.small{font-size:12px;color:#647d70;line-height:1.6}.welcome-pond{position:relative;background:#e1eddd;overflow:hidden;min-height:440px}.welcome-pond:before{content:"";position:absolute;inset:45% -30% -40%;background:#a8d4d2;border-radius:48% 51% 0 0;transform:rotate(-8deg)}.hill{position:absolute;left:-20%;right:-10%;height:160px;top:27%;background:#c6dbb7;border-radius:70% 60% 0 0}.sun{width:60px;height:60px;position:absolute;right:16%;top:13%;background:#eed697;border-radius:50%;box-shadow:0 0 0 15px #ecdca557}.hero-leaf{position:absolute;left:24%;top:69%;width:55%;height:18%;border-radius:50%;background:#77a96d;box-shadow:0 9px 0 #688d60;transform:rotate(-7deg)}.hero-leaf:after{content:"";position:absolute;left:50%;top:0;bottom:50%;width:1px;background:#64885a;transform:rotate(25deg)}.hero-frog{position:absolute;width:38%;left:33%;top:43%;transform:rotate(-5deg)}.hero-frog svg{width:100%}.flower{position:absolute;right:13%;bottom:13%;font-size:58px;color:#f3e6df}.hello{position:absolute;left:12%;top:18%;background:#fffdf5;padding:13px 18px;border-radius:20px 20px 0 20px;font-weight:700;transform:rotate(-6deg);font-size:17px}.pond-lines{position:absolute;left:10%;right:12%;bottom:17%;height:25%;border-top:2px solid #e4f2e184;border-bottom:2px solid #e4f2e184;border-radius:40%}.reeds{position:absolute;bottom:0;right:3%;width:40px;height:90px;border-left:5px solid #6e9b77;border-right:5px solid #6e9b77;transform:rotate(13deg);border-radius:50% 60% 0 0}.reeds:after{content:"";position:absolute;width:5px;height:110%;bottom:0;left:45%;background:#81aa7c;transform:rotate(-18deg);border-radius:100%}.board{border:1px solid #d2ddcd;border-radius:25px;background:#fffdf6;overflow:hidden}.boardbar{display:flex;align-items:center;gap:12px;padding:16px 25px;border-bottom:1px solid #e4e7da}.badge{background:#e5eddc;border-radius:20px;padding:7px 14px;font-size:13px;font-weight:700}.scope-badge,.round-label{font-size:12px;color:#657c6b}.round-label{margin-left:auto}.prompt{min-height:160px;text-align:center;display:flex;align-items:center;flex-direction:column;justify-content:center;padding:14px;gap:8px}.instruction{font-size:18px;margin:0;color:#627e6d}.target{font-family:"Segoe UI",Arial,sans-serif;font-size:clamp(45px,5vw,76px);font-weight:700;letter-spacing:2px;line-height:1.2;color:#254e43;white-space:pre-wrap}.target.sentence{font-size:clamp(27px,3vw,46px);letter-spacing:.2px}.target-picture{width:112px}.target-picture svg{width:100%;height:90px}.adult-cue{margin:0;font-size:13px;color:#617969;max-width:680px}.scene{height:300px;position:relative;overflow:hidden;background:linear-gradient(#c5e6df,#a7d2d3);border-top:1px solid #c7dfd3}.ripple{position:absolute;height:25px;border-top:2px solid #e9f4e5aa;border-bottom:2px solid #e9f4e578;border-radius:50%;width:25%}.r1{left:3%;top:30%}.r2{right:2%;top:67%}.r3{left:39%;top:13%;width:12%}.bank{position:absolute;bottom:-45px;left:calc(50% - 110px);width:220px;height:100px;border-radius:50%;background:#e1d4ac;box-shadow:0 -9px 0 #acc485}.frog{position:absolute;z-index:3;width:110px;left:calc(50% - 55px);bottom:0;pointer-events:none;transition:left .65s ease,bottom .65s ease,transform .65s ease}.frog svg{display:block;width:100%}.frog.jumping{animation:hop .65s ease}.leaves{display:flex;gap:11%;justify-content:center;position:absolute;inset:40px 10% 55px}.leaf{width:38%;max-width:340px;border:0;background:#b0ce88;border-radius:50% 47% 46% 50%;box-shadow:0 9px 0 #88ad72,0 17px 22px #4c92702b;color:#244b35;display:flex;align-items:center;justify-content:center;font-size:clamp(37px,4.5vw,65px);font-family:"Segoe UI",Arial,sans-serif;position:relative;padding:19px 25px;min-height:125px;isolation:isolate}.leaf:before{content:"";position:absolute;top:0;left:46%;width:9%;height:27%;background:#b9dfd9;clip-path:polygon(0 0,100% 0,50% 100%);z-index:-1}.leaf:after{content:"";position:absolute;width:34%;height:1px;background:#79a46577;left:50%;bottom:21%;transform:rotate(35deg);z-index:-1}.leaf svg{width:65%;max-width:160px;max-height:145px;filter:drop-shadow(0 3px 1px #395d4520)}.leaf.correct{outline:4px solid #406e42;outline-offset:3px}.leaf .result-mark{position:absolute;font:700 28px Arial;top:18px;right:28px;color:#274f38}.leaf.try-again{outline:3px dashed #a77d44;outline-offset:2px}.leaf:disabled{opacity:1}.water-flower{position:absolute;left:5%;bottom:11px;color:#fae3d6;font-size:48px}.scene .reeds{height:70px}.scene .reeds.left{left:1%;transform:rotate(-15deg)}.feedback-row{display:flex;align-items:center;justify-content:space-between;gap:15px;padding:18px 25px;min-height:87px}.feedback-row #feedback{font-size:16px;font-weight:700;max-width:65%;line-height:1.5}.actions{display:flex;align-items:center;gap:10px}.oral-gate{text-align:center;padding:15px;background:#f2eddf}.oral-gate p{font-size:14px}.oral-gate button{margin:5px}.empty{text-align:center;min-height:350px;padding:70px 20px}.preview,.warning{padding:10px 18px;background:#f6dfb4;border-radius:12px;margin-bottom:14px;font-size:14px}.preview{display:flex;align-items:center;justify-content:space-between}.warning{border:1px solid #b68a45}.position-dots{display:flex;gap:9px;align-items:center}.position-dot{width:20px;height:20px;border:2px solid #536b4d;border-radius:50%}.position-dot.selected{background:#365a40;box-shadow:0 0 0 5px #f8f3d7}.position-arrow{font-size:25px;margin-left:10px}footer{display:flex;align-items:center;gap:25px;padding:19px 0;font-size:11px;color:#7a8c79}footer>span:last-child{margin-left:auto}footer .textbutton{font-size:12px;padding:5px;min-height:40px}footer a{font-size:12px}dialog{color:var(--ink);border:1px solid #d4ddcc;border-radius:23px;max-width:min(95vw,650px);padding:28px;box-shadow:0 30px 100px #183c4d40}dialog::backdrop{background:#183b344f;backdrop-filter:blur(4px)}dialog h2{margin:0 0 15px;font-size:27px}dialog p,dialog li{line-height:1.65}dialog.teacher-panel{width:1080px;max-width:96vw;max-height:93dvh;padding:0}.dialog-head{display:flex;justify-content:space-between;align-items:center;padding:22px 27px;position:sticky;top:0;background:#fffef9;z-index:4;border-bottom:1px solid var(--border)}.dialog-head h2{margin:0}.tabs{display:flex;gap:10px;padding:12px 25px;background:#f4f5e9;position:sticky;top:104px;z-index:3;overflow:auto}.tabs button{border:0;background:transparent;white-space:nowrap}.tabs button[aria-selected=true]{background:var(--green);color:white}.tab{padding:0 27px 25px;font-size:14px}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin:20px 0}.form-grid label{font-weight:700;font-size:13px}.checks{display:flex;flex-wrap:wrap;gap:15px}.checkline{margin:20px 0}.checks label,.checkline{display:flex;align-items:center;gap:8px}input[type=checkbox]{width:21px;height:21px;accent-color:var(--green)}.panel-actions{display:flex;gap:12px;flex-wrap:wrap;margin:20px 0}table{border-collapse:collapse;width:100%;text-align:left;white-space:normal}th{font-size:12px;background:#ecf0e1;padding:12px 9px}td{border-bottom:1px solid #e0e5d5;padding:9px}td button{padding:6px 10px;font-size:12px}td.reading-text{font-size:20px}.table-wrap{overflow:auto;margin:20px 0;max-height:400px}details{border:1px solid #d5ddc9;border-radius:13px;padding:15px;margin:15px 0}summary{cursor:pointer;font-weight:700;min-height:28px}.stats{display:flex;gap:15px;flex-wrap:wrap}.stat{padding:18px;background:#eaf0df;border-radius:13px;min-width:130px}.stat b{display:block;font-size:29px}.stat span{font-size:12px}fieldset{border:1px solid #d4dcc8;border-radius:12px}textarea{resize:vertical;min-height:75px}.recent-record{padding:12px 0;border-bottom:1px solid #dde3d2}.writing{padding:15px 25px}.write-tools{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:12px}.writing-surface{position:relative;width:100%;height:240px;border:1px solid #c1d1bc;border-radius:14px;overflow:hidden;background:#fffef7;touch-action:none}#writingModel,#writingGuides,#ink{position:absolute;width:100%;height:100%;inset:0}#ink{touch-action:none;cursor:crosshair}.model-path{fill:none;stroke:#678c90;stroke-width:7;stroke-linecap:round;stroke-linejoin:round;opacity:.45}.model-path.animate{stroke-dasharray:1000;stroke-dashoffset:1000;animation:draw 3s ease forwards}.start-dot{fill:#d4934d}.contrast{--ink:#122e24;--green:#143e2d;--border:#7f8e70;color:#122e24}.contrast .instruction,.contrast .small,.contrast footer{color:#294a39}.contrast .leaf{background:#c7e798;color:#102b13}.calm *{animation:none!important;transition:none!important;scroll-behavior:auto!important}@keyframes hop{50%{transform:translateY(-65px) rotate(-8deg)}}@keyframes draw{to{stroke-dashoffset:0}}@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important;scroll-behavior:auto!important}}@media(min-width:900px) and (max-height:820px){.topbar{padding-top:12px;padding-bottom:12px}.heading{padding:17px 0}h1{font-size:31px}.prompt{min-height:137px;padding:10px}.scene{height:260px}.target{font-size:62px}.feedback-row{min-height:75px;padding:12px 22px}.welcome{min-height:440px}.welcome-copy{padding:28px 9%}.welcome-pond{min-height:420px}.welcome h2{font-size:38px}footer{padding:8px 0}.boardbar{padding:11px 22px}.writing-surface{height:210px}.writing{padding-top:5px}.writing .small{margin:5px 0}.write-tools button{min-height:40px;padding:7px 12px}}@media(max-width:760px){.topbar{padding:14px 5%;flex-wrap:wrap}.brand{font-size:25px}.topbar nav{gap:2px;flex-wrap:wrap}.topbar nav .quiet{padding:8px;min-width:43px}.topbar nav .quiet span{display:none}main{padding:0 4%}.heading{align-items:flex-start;padding:20px 0;gap:15px}.heading h1{font-size:27px}.heading h1 span{display:none}.eyebrow{font-size:8px;letter-spacing:1.4px}.stages{gap:4px;flex-wrap:wrap;max-width:135px;justify-content:flex-end}.stage{width:30px;height:30px;font-size:16px}.welcome{grid-template-columns:1fr}.welcome-copy{padding:30px 7%}.welcome-pond{min-height:300px;grid-row:1}.welcome-copy>p:not(.eyebrow):not(.small){font-size:16px}.welcome h2{font-size:35px}.launch-settings{flex-direction:column;gap:12px}.hero-frog{width:30%;top:39%;left:35%}.hero-leaf{top:70%}.hello{top:12%;font-size:14px}.sun{top:9%;width:42px;height:42px}.boardbar{gap:8px;flex-wrap:wrap;padding:12px}.badge{font-size:11px;padding:6px 10px}.scope-badge,.round-label{font-size:10px}.prompt{min-height:155px}.instruction{font-size:16px}.target{font-size:54px}.scene{height:260px}.leaves{inset:35px 4% 60px;gap:7%}.leaf{width:45%;max-width:240px;padding:15px;font-size:43px}.leaf svg{width:92%;max-height:130px}.frog{width:88px;left:calc(50% - 44px)}.leaf .result-mark{top:12px;right:17px;font-size:22px}.feedback-row{align-items:stretch;flex-direction:column;padding:14px;gap:10px}.feedback-row #feedback{max-width:100%;font-size:14px;min-height:22px}.actions{justify-content:flex-end}.actions button{padding:10px 13px}footer{flex-wrap:wrap;gap:4px 15px;padding-top:8px}footer>span:last-child{display:none}.form-grid{grid-template-columns:1fr}.tab{padding:0 16px 18px}.dialog-head{padding:16px}.dialog-head h2{font-size:23px}.tabs{padding:10px;gap:3px;top:89px}.tabs button{padding:8px 12px;font-size:13px}.oral-gate button{font-size:12px;padding:9px}.writing{padding:12px}.write-tools button{font-size:12px;padding:9px}.writing-surface{height:210px}.position-dot{width:14px;height:14px}.position-dots{gap:7px}.position-arrow{display:none}}

@media(min-width:900px) and (max-height:820px){.writing-active .heading{padding:10px 0 12px}.writing-active .boardbar{padding:7px 22px}.writing-active .prompt{min-height:100px;padding:7px;gap:4px}.writing-active .target{font-size:46px}.writing-active .instruction{font-size:15px}.writing-active .writing{padding:6px 25px}.writing-active .writing-surface{height:190px}.writing-active .write-tools{margin-bottom:8px}.writing-active .writing .small{font-size:11px;margin:3px 0}.writing-active #writingDone{min-height:40px;padding:8px 15px}.writing-active .feedback-row{min-height:65px}.writing-active #feedback{font-size:14px}}
