:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#263d33;background:#f6f5ef;font-synthesis:none;--movement:#755027}*{box-sizing:border-box}body{margin:0}button,input{font:inherit}button{cursor:pointer;border:1px solid #c9cec4;border-radius:8px;background:transparent;color:#263d33;padding:12px 18px;font-weight:600;font-size:14px}button:hover{background:#e7e9df}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #32617f;outline-offset:4px}button:disabled{cursor:default;opacity:.55}header{height:92px;border-bottom:1px solid #dfe1d7;display:flex;align-items:center;justify-content:space-between;padding:0 4.5vw}.brand{display:flex;align-items:center;gap:12px;text-decoration:none;color:inherit;font-size:12px;font-weight:750;letter-spacing:2px}.brand-icon{font-size:34px;font-weight:400;letter-spacing:0}.beta{font-size:9px;letter-spacing:1px;border:1px solid #c8cdbf;padding:4px 6px;border-radius:4px}.view-tools{display:flex;gap:10px}.view-tools button:first-child{border-color:transparent}main{max-width:1600px;margin:auto;padding:40px 4.5vw 20px}.class-heading{display:flex;align-items:center;justify-content:space-between;margin-bottom:30px}.eyebrow{font-size:11px;letter-spacing:2px;font-weight:750;margin:0 0 12px}h1{font-family:Georgia,serif;font-size:clamp(30px,3.2vw,48px);letter-spacing:-1.2px;font-weight:400;margin:0;overflow-wrap:anywhere}.class-heading button{font-size:13px}.class-heading button span{margin-left:20px}.workspace{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(310px,1fr);gap:26px}.clock-panel{background:color-mix(in srgb,var(--movement) 7%,#fffef9);border:1px solid color-mix(in srgb,var(--movement) 24%,#fffef9);border-top:5px solid var(--movement);border-radius:15px;padding:28px 34px 0;overflow:hidden;display:flex;flex-direction:column;min-height:490px;color:var(--movement)}.clock-top{display:flex;justify-content:space-between;align-items:center;gap:12px}.clock-top .eyebrow{margin:0}.status{font-size:11px;background:#ffffff90;border-radius:20px;padding:7px 11px;font-weight:600}.clock-panel h2{font-size:clamp(24px,2.8vw,40px);letter-spacing:-1px;margin:32px 0 10px;line-height:1.15;overflow-wrap:anywhere}.clock-panel p#description{margin:0;font-size:15px;line-height:1.6;min-height:24px;overflow-wrap:anywhere}.countdown{font-variant-numeric:tabular-nums;font-size:clamp(76px,10.5vw,160px);font-weight:650;line-height:1.1;letter-spacing:-7px;margin:22px 0 10px}.clock-caption{font-size:10px;letter-spacing:1.6px;font-weight:700;margin:0 0 28px}.movement-track,.period-track{height:5px;border-radius:10px;background:#263d3314;overflow:hidden}.movement-track>div{background:var(--movement);height:100%}.up-next{display:flex;align-items:center;gap:20px;padding:23px 0;margin-top:auto;border-top:1px solid #263d3318;color:#263d33}.up-next .eyebrow{font-size:9px;margin:0;white-space:nowrap}.up-next strong{font-size:14px;overflow-wrap:anywhere}.up-next>span:last-child{margin-left:auto;font-size:12px;white-space:nowrap}.period-panel{border:1px solid #d8ddcf;border-radius:15px;padding:28px;background:#fafbf5}.period-top{display:flex;justify-content:space-between;gap:8px}.period-top .eyebrow{font-size:10px}.period-top>span{font-size:11px;color:#667360}.total-countdown{font-size:64px;letter-spacing:-3px;font-weight:500;font-variant-numeric:tabular-nums;line-height:1.1}.period-panel>p{font-size:12px;color:#64715e;margin:12px 0 22px}.period-track>div{background:#405841;height:100%}.rhythm-title{display:flex;align-items:center;justify-content:space-between;margin:28px 0 10px}.rhythm-title h2{font-size:14px;margin:0}.rhythm-title>span{font-size:11px;color:#64715e}ol{list-style:none;margin:0;padding:0}li{display:flex;align-items:center;gap:12px;min-height:47px;padding:9px 10px;margin:3px -10px;border-radius:7px;font-size:12px;line-height:1.4;border:1px solid transparent}li .step{color:var(--row-color);font-size:10px;font-weight:700;border-left:3px solid var(--row-color);padding-left:8px}li>span:nth-child(2){flex:1}li strong{font-size:12px;white-space:nowrap}li small{font-weight:400;font-size:10px}li.current{border-color:color-mix(in srgb,var(--row-color) 25%,transparent);background:color-mix(in srgb,var(--row-color) 8%,transparent);font-weight:650}li.done .step{opacity:.5}li.done>span:nth-child(2){text-decoration:line-through;color:#6a7466}#allocation{margin:18px 0 0;font-size:11px;line-height:1.5}.controls{display:flex;align-items:center;justify-content:space-between;gap:24px;margin:24px 0 36px}.control-buttons{display:flex;gap:10px}.primary{background:#293f34;color:#fffdf6;border-color:#293f34;min-width:150px}.primary:hover{background:#3c5748}.quiet{border-color:transparent}.controls p{font-size:11px;color:#667360;max-width:240px;line-height:1.6}footer{display:flex;justify-content:space-between;border-top:1px solid #dfe1d7;padding-top:19px;font-size:9px;letter-spacing:1px;color:#65715f;gap:20px}footer span:last-child{letter-spacing:0}dialog{border:1px solid #cbd1c2;border-radius:16px;padding:28px;max-width:700px;width:calc(100% - 32px);max-height:90vh;background:#fafbf5;color:#263d33}dialog::backdrop{background:#10251cc0}dialog h2{margin:0;font-family:Georgia,serif;font-size:30px;font-weight:400}dialog p{font-size:13px;line-height:1.6}.dialog-heading{display:flex;justify-content:space-between;align-items:center}.dialog-heading .eyebrow{font-size:9px}.form-top{display:grid;grid-template-columns:1fr 130px;gap:16px}label{display:flex;flex-direction:column;font-size:12px;font-weight:600;gap:7px;margin:12px 0}input{width:100%;border:1px solid #bdc7b8;background:#fffefa;border-radius:6px;padding:10px;color:#263d33}fieldset{border:1px solid #d5dccc;border-radius:8px;margin:18px 0;padding:0 15px}legend{font-size:12px;padding:0 5px}.dialog-actions{display:flex;justify-content:flex-end;gap:10px;margin-top:20px}#form-error{color:#a02d29}.student .teacher-only,.student footer,.student #control-note{display:none}.student .workspace{grid-template-columns:minmax(0,2fr) minmax(280px,.85fr)}.student .countdown{font-size:clamp(100px,14vw,230px)}.student .clock-panel h2{font-size:clamp(32px,3.5vw,60px)}.student .clock-panel #description{font-size:clamp(18px,1.8vw,28px)}.student .clock-caption{font-size:14px}.student .up-next strong{font-size:20px}.student main{padding-top:28px}.student .controls{justify-content:center;margin-bottom:10px}.student .rhythm-title,.student #rhythm,.student #allocation{display:none}.student .total-countdown{font-size:clamp(56px,6.5vw,105px)}.student .period-panel{align-self:stretch}.student .period-top{flex-direction:column}.student .period-top .eyebrow{font-size:14px}.student .period-top>span{margin-bottom:25px;font-size:16px}.student .period-panel>p{font-size:17px}.student .clock-panel{min-height:470px}@media(min-width:1600px){.countdown{font-size:165px}}@media(max-width:850px){header{height:76px;padding:0 24px}main{padding:28px 24px}.workspace,.student .workspace{grid-template-columns:1fr}.period-panel{padding:24px}.period-top{float:right;flex-direction:column}.total-countdown{font-size:54px}.controls{align-items:flex-start;flex-direction:column;gap:5px}.controls p{max-width:none}.clock-panel{min-height:460px}.countdown{font-size:120px}.student .period-top{float:right}.student .countdown{font-size:140px}.student .period-panel{padding:20px}.student .period-panel>p{margin-bottom:12px}.student .period-top>span{margin:0}.student .total-countdown{font-size:60px}}@media(max-width:500px){header{padding:0 16px}.brand{font-size:10px;gap:7px;letter-spacing:1px}.beta{display:none}.view-tools{gap:2px}.view-tools button{padding:10px;font-size:11px}.view-tools button span{display:none}main{padding:24px 16px}.class-heading{align-items:flex-start;gap:14px}.class-heading button{font-size:11px;padding:10px;max-width:110px}.class-heading button span{display:none}.eyebrow{font-size:9px}.clock-panel{padding:22px 20px 0;min-height:420px}.clock-panel h2{font-size:29px}.clock-top{gap:6px}.clock-top .eyebrow{font-size:9px;letter-spacing:1px}.status{font-size:9px}.countdown{font-size:108px;letter-spacing:-5px}.clock-caption{font-size:9px;letter-spacing:1px}.up-next{gap:10px}.up-next strong{font-size:13px}.up-next .eyebrow{font-size:8px}.control-buttons{width:100%;flex-wrap:wrap}.control-buttons button{padding:13px;flex:1;font-size:12px;white-space:nowrap}.primary{min-width:130px}footer{line-height:1.8;font-size:8px}.form-top{grid-template-columns:1fr 95px;gap:10px}dialog{padding:20px}.student .countdown{font-size:112px}.student .clock-panel h2{font-size:32px}.student .up-next strong{font-size:16px}.student .clock-caption{font-size:11px}.student .period-top .eyebrow{font-size:10px}.student .period-top>span{font-size:12px}}@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important}}#rhythm li{background:color-mix(in srgb,var(--row-color) 11%,#fffef9);border:1px solid color-mix(in srgb,var(--row-color) 25%,#fffef9);border-left:5px solid var(--row-color);margin-top:7px;margin-bottom:7px;color:var(--row-color)}#rhythm li .step{background:var(--row-color);color:#fff;border:0;border-radius:5px;padding:5px 6px}#rhythm li.current{background:color-mix(in srgb,var(--row-color) 19%,#fffef9);outline:2px solid var(--row-color);outline-offset:1px}#rhythm li.done .step{opacity:1}#rhythm li.done>span:nth-child(2){color:var(--row-color)}.up-next{border-top:4px solid var(--next-color);color:var(--next-color);background:color-mix(in srgb,var(--next-color) 8%,#fffef9);margin-left:-34px;margin-right:-34px;padding-left:34px;padding-right:34px}@media(max-width:500px){.up-next{margin-left:-20px;margin-right:-20px;padding-left:20px;padding-right:20px}}.preset-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin:-6px 0 26px;padding:16px 20px;background:#eef0e7;border:1px solid #d8ddcf;border-radius:12px}.preset-bar label{margin:0;gap:6px;min-width:200px;flex:1;max-width:340px}.preset-bar select{font:inherit;font-size:14px;color:#263d33;background:#fffef9;border:1px solid #bdc7b8;border-radius:6px;padding:10px;width:100%}.preset-bar select:focus-visible{outline:3px solid #32617f;outline-offset:3px}.preset-bar p{font-size:11px;line-height:1.5;color:#52614c;flex:1;min-width:140px;margin:0}@media(max-width:500px){.preset-bar{padding:14px;gap:10px}.preset-bar label{max-width:none;flex-basis:100%}.preset-bar button{font-size:11px;padding:10px}.preset-bar p{flex-basis:100%}}.phase-actions{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0 16px}.phase-actions button{padding:8px 12px;font-size:12px}footer{flex-wrap:wrap}.footer-brand{font-weight:600;letter-spacing:.04em}.footer-version{font-weight:400;letter-spacing:0}
