:root{color-scheme:light;--ink: #17202a;--muted: #667085;--paper: #f6f1e7;--card: #fffdf8;--line: #ded8cc;--green: #35b56f;--green-soft: #e7f6ed;--orange: #f0a229;--orange-soft: #fff0d7;--red: #e95555;--red-soft: #fde6e4;--shadow: 0 24px 70px rgba(66, 55, 37, .1);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100vh;color:var(--ink);background:radial-gradient(circle at 9% 8%,rgba(240,162,41,.08),transparent 24rem),radial-gradient(circle at 92% 95%,rgba(53,181,111,.08),transparent 28rem),var(--paper)}button,input{font:inherit}button{color:inherit}.app-shell{min-height:100vh;display:flex;flex-direction:column}.topbar{height:74px;display:flex;align-items:center;justify-content:space-between;padding:0 clamp(20px,4vw,64px);border-bottom:1px solid rgba(124,112,92,.18);background:#f6f1e7db;-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.brand{display:inline-flex;align-items:center;gap:11px;color:var(--ink);text-decoration:none;font-size:1.3rem;font-weight:800;letter-spacing:-.04em}.brand em{color:#8a7250;font-size:.72em;font-style:normal;font-weight:700;letter-spacing:-.02em}.brand-mark{display:flex;align-items:flex-end;gap:2px;width:27px;height:27px;transform:rotate(-2deg)}.brand-mark span{width:7px;border-radius:4px}.brand-mark span:nth-child(1){height:17px;background:var(--green)}.brand-mark span:nth-child(2){height:23px;background:var(--orange)}.brand-mark span:nth-child(3){height:12px;background:var(--red)}.header-actions{display:flex;gap:8px}.icon-button{min-height:40px;display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid var(--line);border-radius:11px;background:#ffffff7a;cursor:pointer;font-size:.82rem;font-weight:650;transition:.2s ease}.icon-button:hover{background:#fff;border-color:#c9c1b4;transform:translateY(-1px)}.icon-button svg{width:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.icon-button[aria-pressed=false] .sound-wave{opacity:.2}.main-layout{width:min(1440px,100%);margin:auto;padding:clamp(22px,3.5vw,52px) clamp(18px,4vw,64px);display:grid;grid-template-columns:minmax(520px,1fr) minmax(330px,430px);gap:clamp(28px,4vw,64px);align-items:center}.timer-stage{min-width:0}.stage-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:20px;margin-bottom:22px}.eyebrow{margin:0 0 6px;color:#8a7250;font-size:.71rem;font-weight:800;letter-spacing:.17em;text-transform:uppercase}h1,h2{margin:0;letter-spacing:-.045em}h1{font-family:Georgia,Times New Roman,serif;font-size:clamp(2rem,3.2vw,3.25rem);font-weight:500;line-height:1.05}h2{font-size:1.36rem;line-height:1.2}.status-pill{flex:none;display:flex;align-items:center;gap:8px;padding:9px 12px;border-radius:999px;background:var(--green-soft);color:#197745;font-size:.76rem;font-weight:750;transition:.25s ease}.status-pill[data-phase=orange]{background:var(--orange-soft);color:#9a5c05}.status-pill[data-phase=red],.status-pill[data-phase=done]{background:var(--red-soft);color:#a82e2e}.status-pill[data-phase=paused]{background:#ece9e3;color:#635d54}.status-dot{width:7px;height:7px;border-radius:50%;background:currentColor;box-shadow:0 0 0 4px color-mix(in srgb,currentColor 14%,transparent)}.clock-wrap{display:grid;grid-template-columns:minmax(340px,570px) 112px;justify-content:center;align-items:center;gap:clamp(18px,3vw,38px)}.clock{--green-end: 60%;--red-start: 85%;position:relative;width:min(100%,570px);aspect-ratio:1;border-radius:50%;filter:drop-shadow(0 26px 38px rgba(52,45,34,.13))}.zone-ring{position:absolute;inset:0;border-radius:50%;background:conic-gradient(from 0deg,var(--green) 0 var(--green-end),var(--orange) var(--green-end) var(--red-start),var(--red) var(--red-start) 100%)}.zone-ring:after{content:"";position:absolute;inset:19px;border-radius:50%;background:var(--card)}.ticks{position:absolute;inset:0;z-index:3;pointer-events:none}.tick{position:absolute;inset:0;width:2px;height:100%;margin:auto;transform-origin:center}.tick:before{content:"";display:block;width:2px;height:10px;margin-top:5px;border-radius:2px;background:#ffffffa6}.tick.major{width:3px}.tick.major:before{width:3px;height:17px;background:#fffffff2}.clock-face{position:absolute;z-index:2;inset:29px;overflow:hidden;border-radius:50%;background:var(--card);box-shadow:inset 0 0 0 1px #4539280f}.clock-face:before{content:"";position:absolute;inset:7%;border-radius:50%;background:radial-gradient(circle,color-mix(in srgb,var(--phase-color) 14%,white) 0,color-mix(in srgb,var(--phase-color) 6%,white) 58%,transparent 59%);transition:background .4s ease}.elapsed-shade{position:absolute;inset:0;background:conic-gradient(from 0deg,rgba(24,32,42,.075) calc(var(--progress) * 1turn),transparent 0)}.clock-center{position:absolute;z-index:4;inset:23%;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50%;text-align:center}.phase-label{margin-bottom:7px;color:color-mix(in srgb,var(--phase-color) 78%,#17202a);font-size:clamp(.72rem,1.2vw,.9rem);font-weight:800;letter-spacing:.1em;text-transform:uppercase;transition:color .25s}.time-display{font-variant-numeric:tabular-nums;font-size:clamp(4rem,8.2vw,7.25rem);font-weight:760;line-height:.95;letter-spacing:-.075em}.time-caption{margin-top:13px;color:var(--muted);font-size:clamp(.72rem,1.1vw,.88rem)}.hand{position:absolute;z-index:3;left:calc(50% - 2px);top:6%;width:4px;height:44%;transform-origin:50% 100%;transform:rotate(calc(var(--progress) * 1turn));transition:transform .15s linear}.hand:before{content:"";position:absolute;inset:0;border-radius:4px;background:#28323b;box-shadow:0 2px 6px #0000002e}.hand span{position:absolute;top:-3px;left:-3px;width:10px;height:10px;border-radius:50%;background:#28323b}.clock-pin{position:absolute;z-index:5;top:50%;left:50%;width:17px;height:17px;border:4px solid var(--card);border-radius:50%;background:#28323b;transform:translate(-50%,-50%);box-shadow:0 2px 7px #00000038}.zone-legend{display:flex;flex-direction:column;gap:11px}.zone-legend>div{display:grid;grid-template-columns:11px 1fr;column-gap:9px;align-items:center;padding-bottom:10px;border-bottom:1px solid var(--line)}.zone-legend>div:last-child{border:0}.legend-swatch{grid-row:1 / span 2;width:10px;height:34px;border-radius:6px}.legend-swatch.green{background:var(--green)}.legend-swatch.orange{background:var(--orange)}.legend-swatch.red{background:var(--red)}.zone-legend strong{font-size:.75rem}.zone-legend small{color:var(--muted);font-size:.68rem}.timer-actions{display:flex;justify-content:center;gap:10px;margin-top:24px}.primary-button,.secondary-button{min-height:48px;display:inline-flex;justify-content:center;align-items:center;gap:9px;padding:12px 23px;border-radius:13px;font-weight:760;cursor:pointer;transition:.2s ease}.primary-button{border:1px solid var(--ink);color:#fff;background:var(--ink);box-shadow:0 8px 20px #17202a26}.primary-button:hover{background:#2b3845;transform:translateY(-1px)}.primary-button svg{width:19px;fill:currentColor}.primary-button.is-paused svg path{d:path("M7 5h4v14H7V5Zm6 0h4v14h-4V5Z")}.secondary-button{border:1px solid var(--line);background:transparent}.secondary-button:hover:not(:disabled){background:#fff9;transform:translateY(-1px)}.secondary-button:disabled{opacity:.42;cursor:not-allowed}.secondary-button svg{width:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.shortcut-hint{margin:13px 0 0;color:#857f74;text-align:center;font-size:.7rem}.shortcut-hint span{margin:0 6px}kbd{padding:2px 5px;border:1px solid #d3ccbf;border-bottom-width:2px;border-radius:4px;background:#ffffff73;font-family:inherit;font-size:.65rem}.settings-panel{padding:29px;border:1px solid rgba(129,115,91,.2);border-radius:24px;background:#fffdf8e0;box-shadow:var(--shadow);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.panel-heading{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:25px}.session-badge{padding:6px 9px;border-radius:8px;color:#7e6542;background:#f2eadb;font-size:.65rem;font-weight:800;text-transform:uppercase;letter-spacing:.08em}.setting-section+.setting-section{margin-top:27px;padding-top:24px;border-top:1px solid var(--line)}.setting-label{display:block;font-size:.78rem;font-weight:800}.duration-inputs{display:flex;align-items:center;gap:8px;margin-top:10px}.time-field{flex:1;position:relative;min-width:0}.time-field input{width:100%;height:70px;padding:7px 12px 22px;border:1px solid var(--line);border-radius:14px;outline:none;color:var(--ink);background:#fff;font-size:1.8rem;font-weight:760;text-align:center;font-variant-numeric:tabular-nums;transition:.2s}.time-field input:focus{border-color:#8d806d;box-shadow:0 0 0 3px #8d806d1f}.time-field span{position:absolute;left:0;right:0;bottom:9px;color:var(--muted);text-align:center;font-size:.62rem}.time-separator{font-size:1.5rem;font-weight:700}.presets{display:grid;grid-template-columns:repeat(6,1fr);gap:5px;margin-top:9px}.presets button{padding:7px 2px;border:1px solid transparent;border-radius:8px;color:var(--muted);background:#f2eee7;font-size:.65rem;font-weight:700;cursor:pointer}.presets button:hover,.presets button.active{border-color:#cfc6b8;color:var(--ink);background:#fff}.setting-title-row{display:flex;justify-content:space-between;gap:18px;align-items:flex-start}.setting-title-row p{margin:4px 0 0;color:var(--muted);font-size:.7rem}.text-button{padding:0;border:0;color:#8a7250;background:transparent;font-size:.65rem;font-weight:750;cursor:pointer;white-space:nowrap}.text-button:hover{text-decoration:underline}.range-setting{display:block;margin-top:21px}.range-copy{display:flex;justify-content:space-between;color:#424b55;font-size:.71rem;font-weight:650}.range-copy span{display:flex;align-items:center;gap:7px}.range-copy i{width:8px;height:8px;border-radius:50%;background:var(--green)}.orange-range .range-copy i{background:var(--red)}.range-copy output{font-variant-numeric:tabular-nums;font-weight:800}.range-setting input{width:100%;margin:11px 0 0;accent-color:var(--green);cursor:pointer}.orange-range input{accent-color:var(--red)}.timeline{display:flex;gap:3px;height:10px;margin-top:23px}.timeline span{width:var(--size);border-radius:3px;transition:width .2s ease}.timeline-green{background:var(--green)}.timeline-orange{background:var(--orange)}.timeline-red{background:var(--red)}.timeline-labels{display:flex;justify-content:space-between;margin-top:6px;color:#968f84;font-size:.58rem}.classroom-tip{display:flex;align-items:flex-start;gap:11px;margin-top:25px;padding:14px;border-radius:13px;background:#f1ede5}.classroom-tip svg{flex:none;width:20px;fill:none;stroke:#806842;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.classroom-tip p{display:flex;flex-direction:column;gap:3px;margin:0;font-size:.67rem;line-height:1.45}.classroom-tip span{color:var(--muted)}.completion-dialog[hidden]{display:none}.completion-dialog{position:fixed;z-index:20;inset:0;display:grid;place-items:center;padding:20px;background:#17202a8c;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.dialog-card{width:min(430px,100%);padding:38px;border-radius:24px;background:var(--card);box-shadow:0 30px 90px #0003;text-align:center;animation:dialog-in .35s ease both}.dialog-icon{display:grid;place-items:center;width:56px;height:56px;margin:0 auto 18px;border-radius:50%;color:#fff;background:var(--green);font-size:1.5rem;font-weight:900}.dialog-card h2{font-family:Georgia,Times New Roman,serif;font-size:2rem;font-weight:500}.dialog-card>p:not(.eyebrow){margin:10px 0 24px;color:var(--muted)}.dialog-card .primary-button{width:100%}.toast{position:fixed;z-index:30;left:50%;bottom:24px;padding:10px 15px;border-radius:10px;color:#fff;background:var(--ink);box-shadow:0 10px 35px #0000002e;font-size:.75rem;font-weight:650;transform:translate(-50%,20px);opacity:0;pointer-events:none;transition:.25s ease}.toast.visible{transform:translate(-50%);opacity:1}@keyframes dialog-in{0%{opacity:0;transform:translateY(14px) scale(.97)}}@media(max-width:980px){.main-layout{grid-template-columns:1fr;max-width:760px}.settings-panel{grid-row:1}.clock-wrap{grid-template-columns:minmax(320px,520px) 105px}}@media(max-width:600px){.topbar{height:64px;padding:0 16px}.button-label{display:none}.icon-button{width:40px;padding:8px;justify-content:center}.main-layout{padding:22px 14px 34px}.settings-panel{padding:22px 18px;border-radius:19px}.stage-heading{align-items:flex-start;flex-direction:column}.clock-wrap{display:flex;flex-direction:column}.clock{width:min(100%,430px)}.clock-face{inset:23px}.zone-ring:after{inset:15px}.zone-legend{width:100%;display:grid;grid-template-columns:repeat(3,1fr)}.zone-legend>div{border:0;padding:0}.legend-swatch{height:28px}.timer-actions{flex-direction:column}.primary-button,.secondary-button{width:100%}.shortcut-hint{display:none}}@media(max-width:380px){.presets{grid-template-columns:repeat(3,1fr)}.time-display{font-size:3.6rem}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important}}body.fullscreen-mode .topbar,body.fullscreen-mode .settings-panel,body.fullscreen-mode .stage-heading,body.fullscreen-mode .shortcut-hint{display:none}body.fullscreen-mode .main-layout{display:flex;width:100%;min-height:100vh;padding:18px;justify-content:center}body.fullscreen-mode .timer-stage{width:100%;display:flex;flex-direction:column;justify-content:center}body.fullscreen-mode .clock-wrap{grid-template-columns:min(78vh,78vw) 120px}body.fullscreen-mode .timer-actions{margin-top:14px}.home-shell{overflow:hidden}.home-topbar{position:relative;z-index:5}.tool-count{padding:7px 11px;border:1px solid var(--line);border-radius:999px;color:#796d5e;background:#fff6;font-size:.68rem;font-weight:750}.home-main{width:min(1320px,100%);margin:0 auto;padding:0 clamp(20px,5vw,72px) 80px}.home-hero{min-height:620px;display:grid;grid-template-columns:minmax(0,.95fr) minmax(430px,1.05fr);align-items:center;gap:clamp(34px,6vw,90px);padding:64px 0 74px}.hero-copy{position:relative;z-index:2}.hero-copy h1{max-width:720px;font-size:clamp(3rem,5.3vw,5.8rem);line-height:.98}.hero-copy h1 span{color:#8a7250}.hero-intro{max-width:580px;margin:25px 0 30px;color:var(--muted);font-size:clamp(1rem,1.35vw,1.18rem);line-height:1.7}.hero-button{width:max-content;text-decoration:none}.hero-button svg,.tool-link svg{width:17px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.hero-visual{position:relative;min-height:470px}.orbit{position:absolute;border:1px solid rgba(138,114,80,.18);border-radius:50%}.orbit-one{inset:7% 5% 4% 12%}.orbit-two{inset:17% 15% 14% 23%;border-style:dashed;transform:rotate(-12deg)}.visual-card{position:absolute;z-index:2;border:1px solid rgba(129,115,91,.2);background:#fffdf8e8;box-shadow:0 28px 70px #42372524;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.visual-card-main{top:8%;left:17%;width:min(355px,65%);aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:50%;outline:13px solid rgba(53,181,111,.88);outline-offset:-13px}.visual-card-main:after{content:"";position:absolute;inset:0;border-radius:50%;border-top:13px solid var(--orange);border-right:13px solid var(--red);transform:rotate(32deg)}.mini-label{position:relative;z-index:2;color:#7f7568;font-size:.65rem;font-weight:800;letter-spacing:.13em;text-transform:uppercase}.visual-card-main strong{position:relative;z-index:2;margin:10px 0;font-size:clamp(3.2rem,6vw,5.3rem);letter-spacing:-.08em;font-variant-numeric:tabular-nums}.mini-status{position:relative;z-index:2;display:flex;align-items:center;gap:7px;color:#197745;font-size:.7rem;font-weight:750}.mini-status i{width:7px;height:7px;border-radius:50%;background:var(--green)}.visual-card-note{right:2%;bottom:10%;width:245px;padding:20px 23px;border-radius:18px;transform:rotate(3deg)}.visual-card-note span,.visual-card-note strong{display:block}.visual-card-note span{margin-bottom:5px;color:var(--muted);font-size:.68rem}.visual-card-note strong{font-family:Georgia,serif;font-size:1.35rem;font-weight:500}.shape{position:absolute;z-index:1;display:block}.shape-green{top:5%;right:8%;width:60px;height:60px;border-radius:20px 50% 30px;background:var(--green);transform:rotate(18deg)}.shape-orange{left:3%;bottom:17%;width:50px;height:50px;border-radius:50%;background:var(--orange)}.shape-red{right:11%;top:43%;width:34px;height:72px;border-radius:999px;background:var(--red);transform:rotate(52deg)}.tools-section{scroll-margin-top:30px;padding:clamp(42px,6vw,76px);border:1px solid rgba(129,115,91,.16);border-radius:34px;background:#fffdf8b8;box-shadow:var(--shadow)}.section-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:35px;margin-bottom:34px}.section-heading h2{font-family:Georgia,serif;font-size:clamp(2.3rem,4vw,3.8rem);font-weight:500}.section-heading>p{max-width:420px;margin:0;color:var(--muted);font-size:.9rem;line-height:1.65}.tools-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.tool-card{min-width:0;overflow:hidden;display:grid;grid-template-columns:minmax(210px,.85fr) 1.15fr;min-height:330px;border:1px solid var(--line);border-radius:23px;color:inherit;background:#fffdf8;text-decoration:none;transition:transform .25s ease,border-color .25s ease,box-shadow .25s ease}a.tool-card:hover{border-color:#c1b7a8;box-shadow:0 20px 45px #4237251a;transform:translateY(-4px)}.tool-illustration{position:relative;display:grid;place-items:center;overflow:hidden;background:#e7f3e9}.tool-illustration:before,.tool-illustration:after{content:"";position:absolute;width:130px;height:130px;border-radius:50%;background:#ffffff5c}.tool-illustration:before{top:-45px;left:-40px}.tool-illustration:after{right:-55px;bottom:-50px}.mini-clock{position:relative;z-index:2;width:175px;aspect-ratio:1;display:grid;place-items:center;border:13px solid var(--green);border-right-color:var(--orange);border-bottom-color:var(--red);border-radius:50%;background:var(--card);box-shadow:0 20px 35px #30533b26;transform:rotate(-5deg)}.mini-clock span{font-size:2.25rem;font-weight:800;letter-spacing:-.07em;transform:rotate(5deg)}.mini-clock i{position:absolute;left:50%;top:12%;width:3px;height:38%;border-radius:4px;background:var(--ink);transform-origin:bottom;transform:rotate(38deg)}.arithmetic-illustration{background:#f7c28f}.mini-operation{position:relative;z-index:2;width:190px;padding:28px 18px 18px;border-radius:48% 52% 47% 53%;background:#fff;box-shadow:0 18px 28px #80461229;text-align:center;transform:rotate(-3deg)}.mini-operation>strong{color:#984509;font-size:1.35rem}.mini-operation>span{display:grid;grid-template-columns:repeat(4,1fr);gap:5px;margin-top:20px}.mini-operation i{display:grid;place-items:center;height:30px;border:3px solid var(--green);border-radius:999px;background:#fff;font-size:.67rem;font-style:normal}.mini-operation i:nth-child(2){border-color:#397dc0}.mini-operation i:nth-child(3){border-color:#f1dc27}.mini-operation i:nth-child(4){border-color:#6829a8}.whiteboard-illustration{background:#dcebf4}.mini-board{position:relative;z-index:2;width:190px;height:145px;overflow:hidden;border:8px solid #fff;border-radius:8px;background-color:#fff;background-image:linear-gradient(rgba(73,143,196,.16) 1px,transparent 1px),linear-gradient(90deg,rgba(73,143,196,.16) 1px,transparent 1px);background-size:20px 20px;box-shadow:0 17px 30px #2f506729;transform:rotate(2deg)}.board-sum{position:absolute;top:54px;left:34px;color:#2369c8;font-family:Comic Sans MS,cursive;font-size:1.2rem;font-weight:700;transform:rotate(-3deg)}.board-scribble{position:absolute;display:block;width:48px;height:24px;border:4px solid;border-color:currentColor transparent transparent;border-radius:50%}.board-scribble.green{left:8px;bottom:4px;color:var(--green);transform:rotate(18deg)}.board-scribble.orange{right:5px;top:10px;color:var(--orange);transform:rotate(-20deg)}.mini-pencil{position:absolute;z-index:3;right:16%;bottom:17%;width:77px;height:12px;border-radius:999px;background:#e95555;box-shadow:0 5px 10px #462d1f26;transform:rotate(-38deg)}.mini-pencil:before{content:"";position:absolute;left:-13px;border-top:6px solid transparent;border-bottom:6px solid transparent;border-right:15px solid #d3aa77}.spark{position:absolute;z-index:3;color:#8a7250}.spark-one{top:18%;right:14%;font-size:1.4rem}.spark-two{bottom:17%;left:12%;font-size:.85rem}.tool-card-copy{display:flex;flex-direction:column;justify-content:center;padding:36px}.tool-tag{width:max-content;padding:6px 9px;border-radius:7px;color:#197745;background:var(--green-soft);font-size:.6rem;font-weight:800;letter-spacing:.08em;text-transform:uppercase}.tool-card h3{margin:15px 0 9px;font-family:Georgia,serif;font-size:2rem;font-weight:500;letter-spacing:-.035em}.tool-card p{margin:0;color:var(--muted);font-size:.82rem;line-height:1.6}.tool-link{display:flex;align-items:center;gap:5px;margin-top:23px;font-size:.77rem;font-weight:800}.coming-card{grid-template-columns:1fr;align-content:center;padding:36px;border-style:dashed;background:#f6f1e78a}.coming-icon{display:grid;place-items:center;width:48px;height:48px;margin-bottom:24px;border:1px solid #cec5b7;border-radius:15px;color:#8a7250;background:#ffffffa6;font-size:1.6rem}.coming-card .tool-tag{color:#7e6542;background:#eee6d8}.coming-card h3{font-size:1.55rem}.home-footer{width:min(1320px,calc(100% - 40px));display:flex;justify-content:space-between;align-items:center;margin:0 auto;padding:30px 0 38px;border-top:1px solid rgba(124,112,92,.18)}.home-footer p{margin:0;color:var(--muted);font-size:.72rem}.timer-nav{display:flex;align-items:center;gap:15px}.nav-separator{width:1px;height:23px;background:var(--line)}.current-tool{color:var(--muted);font-size:.75rem;font-weight:700}.back-to-tools{display:inline-flex;align-items:center;gap:5px;color:var(--muted);text-decoration:none;font-size:.75rem;font-weight:750}.back-to-tools:hover{color:var(--ink)}.back-to-tools svg{width:17px;fill:none;stroke:currentColor;stroke-width:2}.arithmetic-main{width:min(1440px,100%);margin:0 auto;padding:clamp(32px,4vw,58px) clamp(18px,4vw,64px) 65px}.arithmetic-heading{display:flex;justify-content:space-between;align-items:flex-end;gap:30px;margin-bottom:30px}.arithmetic-heading h1{font-size:clamp(2.35rem,4vw,4rem)}.arithmetic-heading>div>p:last-child{max-width:680px;margin:15px 0 0;color:var(--muted);line-height:1.65}.answer-reveal{flex:none;min-width:170px;min-height:49px;display:flex;align-items:center;justify-content:center;gap:8px;padding:10px 15px;border:1px solid #c8c0b4;border-radius:13px;color:var(--ink);background:#ffffffa6;font-size:.72rem;font-weight:800;cursor:pointer;transition:.2s ease}.answer-reveal:hover{border-color:#9e9384;background:#fff}.answer-reveal svg{width:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.answer-reveal.revealed{color:#197745;border-color:#a9d8ba;background:var(--green-soft)}.answer-reveal strong{display:grid;place-items:center;min-width:31px;height:31px;margin-left:4px;border-radius:9px;color:#fff;background:var(--green);font-size:1rem}.arithmetic-layout{display:grid;grid-template-columns:minmax(270px,330px) minmax(0,1fr);gap:25px;align-items:start}.generator-panel,.preview-panel{border:1px solid rgba(129,115,91,.2);border-radius:23px;background:#fffdf8e6;box-shadow:var(--shadow)}.generator-panel{position:sticky;top:20px;padding:25px}.generator-step{display:flex;align-items:center;gap:12px}.generator-step>span{flex:none;display:grid;place-items:center;width:33px;height:33px;border-radius:10px;color:#fff;background:#8a7250;font-size:.75rem;font-weight:850}.generator-step .eyebrow{margin-bottom:3px;font-size:.58rem}.generator-step h2{font-size:1rem}.generator-step.compact>span{background:var(--green)}.operation-picker{display:grid;grid-template-columns:repeat(2,1fr);gap:8px;margin-top:18px}.operation-picker button{display:flex;flex-direction:column;align-items:center;gap:5px;padding:13px 7px;border:1px solid var(--line);border-radius:12px;background:#fff;cursor:pointer;transition:.2s ease}.operation-picker button:hover{border-color:#b8aa97;transform:translateY(-1px)}.operation-picker button.active{border-color:#8a7250;background:#f3ebdf;box-shadow:inset 0 0 0 1px #8a7250}.operation-picker strong{font-family:Georgia,serif;font-size:1.55rem;font-weight:500;line-height:1}.operation-picker span{color:var(--muted);font-size:.61rem;font-weight:750}.generator-divider{height:1px;margin:24px 0;background:var(--line)}.generate-button{width:100%;margin-top:17px}.generate-button svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.generator-help{margin:13px 0 0;color:var(--muted);font-size:.64rem;line-height:1.5;text-align:center}.preview-panel{overflow:hidden}.preview-toolbar{min-height:67px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 17px 12px 21px;border-bottom:1px solid var(--line)}.preview-toolbar>div{display:grid;grid-template-columns:8px auto;column-gap:9px;align-items:center}.preview-dot{grid-row:1 / span 2;width:8px;height:8px;border-radius:50%;background:var(--green)}.preview-toolbar strong{font-size:.75rem}.preview-toolbar small{color:var(--muted);font-size:.59rem}.preview-menu{position:relative;z-index:5}.preview-menu summary{width:41px;height:39px;display:grid;place-items:center;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:.85rem;font-weight:900;letter-spacing:.08em;cursor:pointer;list-style:none}.preview-menu summary::-webkit-details-marker{display:none}.preview-menu summary:hover{border-color:#b8aa97}.preview-menu[open] summary{border-color:#8a7250;background:#f3eee6}.preview-menu-popover{position:absolute;top:calc(100% + 7px);right:0;width:max-content;padding:7px;border:1px solid var(--line);border-radius:12px;background:#fffdf8;box-shadow:0 15px 35px #322b2129}.download-button{display:inline-flex;align-items:center;gap:7px;padding:10px 13px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:.7rem;font-weight:800;cursor:pointer}.download-button:hover:not(:disabled){border-color:#b8aa97}.download-button:disabled{opacity:.45;cursor:wait}.download-button svg{width:17px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.canvas-frame{position:relative;padding:clamp(10px,1.6vw,20px);background:#eee8de}.canvas-frame canvas{display:block;width:100%;height:auto;border-radius:7px;background:#f69a47;box-shadow:0 10px 28px #4e361d24}.canvas-loading{position:absolute;inset:20px;display:grid;place-items:center;border-radius:7px;color:#8a7250;background:#f6e5d3;font-size:.78rem;font-weight:750}.whiteboard-page{height:100dvh;min-height:520px;overflow:hidden;display:flex;flex-direction:column;background:#e9e6df}.whiteboard-header{flex:none;height:68px;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:0 24px;border-bottom:1px solid #d5d0c7;background:#f7f4ed}.whiteboard-header-actions{display:flex;gap:8px}.board-save-status{display:inline-flex;align-items:center;gap:7px;margin-right:5px;color:#617165;font-size:.64rem;font-weight:750}.board-save-status i{width:7px;height:7px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px var(--green-soft)}.board-save-status.warning{color:#a25c27}.board-save-status.warning i{background:var(--orange);box-shadow:0 0 0 4px var(--orange-soft)}.board-header-button{min-height:42px;display:inline-flex;align-items:center;gap:8px;padding:8px 13px;border:1px solid var(--line);border-radius:11px;color:var(--ink);background:#fff;text-decoration:none;font-size:.72rem;font-weight:750;cursor:pointer}.board-header-button:hover{border-color:#b8afa1}.board-header-button svg{width:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.whiteboard-workspace{flex:1;min-height:0;display:grid;grid-template-columns:208px minmax(0,1fr);gap:12px;padding:12px}.whiteboard-toolbar{min-height:0;overflow-y:auto;display:flex;flex-direction:column;gap:0;padding:16px;border:1px solid #d6d1c8;border-radius:17px;background:#fdfbf6;box-shadow:0 12px 30px #433a2c17;scrollbar-width:thin}.toolbar-section{padding-bottom:17px}.toolbar-section+.toolbar-section{padding-top:17px;border-top:1px solid #e4ded4}.toolbar-label{display:block;margin-bottom:10px;color:#746b5f;font-size:.59rem;font-weight:850;letter-spacing:.1em;text-transform:uppercase}.color-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:7px}.color-picker button,.custom-color{position:relative;width:35px;height:35px;display:grid;place-items:center;padding:0;border:2px solid transparent;border-radius:10px;background:transparent;cursor:pointer}.color-picker button span{width:25px;height:25px;border:2px solid rgba(0,0,0,.06);border-radius:50%;background:var(--swatch)}.color-picker button.active{border-color:#9e9486;background:#f0ece5}.custom-color input{position:absolute;width:1px;height:1px;opacity:0}.custom-color span{width:25px;height:25px;display:grid;place-items:center;border-radius:50%;color:#fff;background:var(--swatch);font-size:.9rem;font-weight:800;text-shadow:0 1px 3px rgba(0,0,0,.4)}.width-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.width-picker button{height:40px;display:grid;place-items:center;padding:0;border:1px solid var(--line);border-radius:9px;background:#fff;cursor:pointer}.width-picker button.active{border-color:#7c7060;background:#eee9e1;box-shadow:inset 0 0 0 1px #7c7060}.width-picker i{width:var(--dot);height:var(--dot);border-radius:50%;background:var(--ink)}.text-size-picker{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.text-size-picker button{height:42px;display:grid;place-items:center;padding:0;border:1px solid var(--line);border-radius:9px;background:#fff;font-family:Georgia,serif;cursor:pointer}.text-size-picker button.active{border-color:#7c7060;background:#eee9e1;box-shadow:inset 0 0 0 1px #7c7060}.toolbar-action{width:100%;min-height:45px;display:flex;align-items:center;justify-content:flex-start;gap:10px;padding:10px 12px;border:1px solid var(--line);border-radius:10px;background:#fff;font-size:.7rem;font-weight:800;cursor:pointer}.toolbar-action:hover:not(:disabled),.toolbar-action.active{border-color:#8a7250;background:#f1eade}.toolbar-action svg{width:20px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.tool-picker{display:grid;gap:6px}.background-section{flex:1}.background-picker{display:grid;gap:6px}.background-picker button{min-height:40px;display:flex;align-items:center;gap:9px;padding:7px 9px;border:1px solid var(--line);border-radius:9px;background:#fff;font-size:.65rem;font-weight:750;cursor:pointer}.background-picker button.active{border-color:#397cab;background:#eaf4fa;box-shadow:inset 0 0 0 1px #397cab}.background-picker i{width:27px;height:24px;border:1px solid #d6dce1;border-radius:4px;background-color:#fff}.background-picker i.lines{background-image:repeating-linear-gradient(to bottom,transparent 0 7px,#bed8e8 7px 8px)}.background-picker i.grid{background-image:linear-gradient(#c6deeb 1px,transparent 1px),linear-gradient(90deg,#c6deeb 1px,transparent 1px);background-size:7px 7px}.reset-action{flex:none;margin-top:15px;color:#b63737;border-color:#eccaca;background:#fff8f7}.reset-action:hover:not(:disabled){border-color:#d87e7e;background:#fdeceb}.reset-action:disabled{opacity:.42;cursor:not-allowed}.board-surface{position:relative;min-width:0;min-height:0;overflow:hidden;border:1px solid #d4d0c8;border-radius:17px;background-color:#fff;box-shadow:0 12px 35px #433a2c1c}.board-surface.grid-lines{background-image:repeating-linear-gradient(to bottom,transparent 0 39px,#bcd9ec 39px 40px)}.board-surface.grid-squares{background-image:linear-gradient(#c9dfed 1px,transparent 1px),linear-gradient(90deg,#c9dfed 1px,transparent 1px);background-size:32px 32px}.board-surface canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair}.board-text-editor{position:absolute;z-index:4;width:min(340px,29vw);min-width:250px;padding:9px;border:1px solid #aaa194;border-radius:12px;background:#fffdf8;box-shadow:0 15px 40px #1f262b33}.board-text-editor textarea{width:100%;min-height:90px;resize:none;padding:10px 11px;border:1px solid var(--line);border-radius:8px;outline:none;color:var(--ink);background:#fff;font:600 1rem/1.35 Inter,Arial,sans-serif}.board-text-editor textarea:focus{border-color:#397cab;box-shadow:0 0 0 3px #397cab21}.board-text-editor>div{display:flex;justify-content:flex-end;gap:7px;margin-top:8px}.board-text-editor button{min-height:34px;padding:7px 11px;border:1px solid var(--line);border-radius:8px;background:#fff;font-size:.65rem;font-weight:800;cursor:pointer}.board-text-editor .validate-text{color:#fff;border-color:var(--ink);background:var(--ink)}.board-text-editor .validate-text:disabled{opacity:.4;cursor:not-allowed}.board-text-selection{position:absolute;z-index:3;min-width:12px;min-height:20px;border:2px dashed #397cab;border-radius:4px;transform:translate(-5px,-4px);pointer-events:none}.board-text-selection:after{content:"";position:absolute;right:-7px;bottom:-7px;width:10px;height:10px;border:2px solid #fff;border-radius:50%;background:#397cab}.board-text-selection>div{position:absolute;left:-2px;bottom:calc(100% + 5px);display:flex;align-items:center;overflow:hidden;border-radius:7px;background:#397cab;white-space:nowrap;pointer-events:auto}.board-text-selection span{padding:5px 7px;color:#fff;font-size:.55rem;font-weight:800}.board-text-selection button{align-self:stretch;padding:4px 8px;border:0;border-left:1px solid rgba(255,255,255,.3);color:#fff;background:#0000001f;font-size:.56rem;font-weight:850;cursor:pointer}.board-text-selection button:hover{background:#0000003d}.board-mode-indicator{position:absolute;right:14px;bottom:13px;padding:7px 10px;border:1px solid #cbd6df;border-radius:999px;color:#53636e;background:#ffffffdb;box-shadow:0 5px 15px #0000000f;font-size:.6rem;font-weight:800;pointer-events:none}.board-mode-indicator.eraser{color:#8b5e29;border-color:#e2ceb4;background:#fff8ede6}.board-dialog-backdrop{position:fixed;z-index:50;inset:0;display:grid;place-items:center;padding:20px;background:#17202a7a;-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px)}.board-dialog{width:min(410px,100%);padding:32px;border-radius:22px;background:var(--card);box-shadow:0 25px 80px #00000038;text-align:center}.board-dialog-icon{display:grid;place-items:center;width:52px;height:52px;margin:0 auto 16px;border-radius:50%;color:#b63737;background:var(--red-soft);font-size:1.6rem;font-weight:800}.board-dialog h2{font-family:Georgia,serif;font-size:1.75rem;font-weight:500}.board-dialog p{margin:10px 0 23px;color:var(--muted);font-size:.82rem}.board-dialog>div:last-child{display:grid;grid-template-columns:1fr 1fr;gap:9px}.board-dialog .secondary-button{width:100%}.danger-button{border:1px solid #bd3f3f;border-radius:13px;color:#fff;background:#bd3f3f;font-weight:800;cursor:pointer}:fullscreen .whiteboard-header{height:58px}@media(max-width:900px){.home-hero{min-height:auto;grid-template-columns:1fr;padding-top:55px}.hero-copy{text-align:center}.hero-intro,.hero-button{margin-left:auto;margin-right:auto}.hero-visual{width:min(570px,100%);margin:0 auto}.tools-grid{grid-template-columns:1fr}.coming-card{min-height:240px}.arithmetic-layout{grid-template-columns:1fr}.generator-panel{position:static}.operation-picker{grid-template-columns:repeat(4,1fr)}.whiteboard-workspace{grid-template-columns:176px minmax(0,1fr)}.whiteboard-toolbar{padding:12px}.color-picker{grid-template-columns:repeat(3,1fr)}}@media(max-width:600px){.home-main{padding-left:14px;padding-right:14px;padding-bottom:45px}.home-hero{padding:45px 6px 55px}.hero-copy h1{font-size:clamp(2.65rem,13vw,4rem)}.hero-visual{min-height:360px}.visual-card-main{left:11%;width:72%}.visual-card-note{right:0;bottom:5%;width:205px}.tools-section{padding:28px 18px;border-radius:24px}.section-heading{align-items:flex-start;flex-direction:column}.tool-card{grid-template-columns:1fr}.tool-illustration{min-height:250px}.tool-card-copy,.coming-card{padding:28px 25px}.home-footer{width:calc(100% - 30px)}.home-footer p,.current-tool,.nav-separator{display:none}.arithmetic-main{padding:25px 13px 40px}.arithmetic-heading{align-items:flex-start;flex-direction:column}.answer-reveal{align-self:stretch}.generator-panel{padding:20px 17px}.operation-picker{grid-template-columns:repeat(2,1fr)}.preview-toolbar{align-items:center;flex-direction:row}.back-to-tools{font-size:0}.back-to-tools svg{width:22px}.whiteboard-header{height:58px;padding:0 12px}.whiteboard-header .brand em,.whiteboard-header .current-tool,.whiteboard-header .nav-separator{display:none}.board-save-status{width:15px;margin:0;font-size:0}.board-header-button{width:40px;min-height:40px;justify-content:center;padding:7px;font-size:0}.whiteboard-workspace{display:flex;flex-direction:column-reverse;gap:7px;padding:7px}.board-surface{flex:1}.whiteboard-toolbar{flex:none;height:auto;overflow-x:auto;flex-direction:row;align-items:center;gap:9px;padding:8px;border-radius:13px}.toolbar-section,.toolbar-section+.toolbar-section{flex:none;padding:0 9px 0 0;border-top:0;border-right:1px solid #e4ded4}.toolbar-label{display:none}.color-picker{display:flex}.color-picker button:nth-child(n+5),.custom-color{display:none}.color-picker button{width:32px;height:35px}.width-picker,.text-size-picker{display:flex}.width-picker button,.text-size-picker button{width:36px}.tool-picker{display:flex}.toolbar-action{width:43px;min-height:42px;justify-content:center;padding:8px;font-size:0}.background-section{flex:none}.background-picker{display:flex}.background-picker button{width:42px;justify-content:center;padding:6px}.background-picker button span{display:none}.reset-action{margin:0}.board-mode-indicator{display:none}.board-text-editor{width:min(310px,82vw);min-width:0}}