.skip-link{position:absolute;left:12px;top:-100px;z-index:100;padding:10px 14px;background:var(--paper,#fffdf8);color:var(--ink,#192a37);border:2px solid var(--teal,#147d78);border-radius:10px;font-weight:700}
.skip-link:focus{top:12px}
.site-menu{max-width:1120px;margin:0 auto;padding:0 24px 12px;display:flex;align-items:center;flex-wrap:nowrap;gap:6px}
.site-menu a,.site-more summary{display:inline-flex;align-items:center;min-height:42px;padding:7px 12px;border-radius:9px;color:var(--ink,#192a37);text-decoration:none;font-size:.93rem;font-weight:700;white-space:nowrap}
.site-menu a:hover,.site-menu a[aria-current="page"],.site-more summary:hover,.site-more summary.has-current{background:#e0f0ea;color:#12665f}
.site-menu a:focus-visible,.site-more summary:focus-visible,.stage2-flow a:focus-visible{outline:3px solid #b87724;outline-offset:3px}
.site-more{position:relative;margin-left:auto}
.site-more summary{cursor:pointer;list-style:none}
.site-more summary::-webkit-details-marker{display:none}
.site-more summary::after{content:'⌄';margin-left:8px;font-size:1.1em;line-height:1}
.site-more[open] summary::after{transform:rotate(180deg)}
.site-more-panel{position:absolute;right:0;top:calc(100% + 6px);z-index:50;display:grid;min-width:230px;padding:8px;background:var(--paper,#fffdf8);border:1px solid var(--line,#dce6e3);border-radius:12px;box-shadow:0 12px 30px #162b3229}
.site-more-panel a{white-space:normal}
.mobile-menu-toggle{display:none}
.stage2-flow{display:flex;gap:12px;margin:28px 0}
.stage2-flow a{flex:1;min-width:0;padding:16px 18px;border:1px solid #eacb8b;border-radius:13px;background:#fff4df;color:#6b4a14;text-decoration:none;font-weight:750}
.stage2-flow a span{display:block;margin-bottom:4px;font-size:.69rem;font-weight:850;letter-spacing:.08em}
.stage2-flow a:hover{text-decoration:underline;border-color:#b07625}
.feature-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:38px}
#dersler>.grid{grid-template-columns:repeat(4,minmax(0,1fr));grid-auto-rows:1fr}
#dersler>.grid>.card{display:flex;flex-direction:column;min-width:0;min-height:248px;padding:22px}
#dersler>.grid>.card h3{overflow-wrap:anywhere}
#dersler>.grid>.card>a{display:inline-flex;align-items:center;justify-content:center;align-self:flex-start;min-height:44px;margin-top:auto;padding:10px 15px;border:1px solid var(--blue,#2563eb);border-radius:10px;background:var(--blue,#2563eb);color:#fff;text-decoration:none;font-weight:750;line-height:1.25;box-shadow:0 4px 12px #1d4ed820}
#dersler>.grid>.card>a:hover{background:#1d4ed8;border-color:#1d4ed8;color:#fff}
#dersler>.grid>.card>a:focus-visible{outline:3px solid #f6bf69;outline-offset:3px}
html[data-theme=dark] #dersler>.grid>.card>a{background:#b0eedd;border-color:#b0eedd;color:#1c3d3a}
html[data-theme=dark] #dersler>.grid>.card>a:hover{background:#d7ffef;border-color:#d7ffef;color:#1c3d3a}
@media(max-width:1099px){#dersler>.grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:639px){#dersler>.grid{grid-template-columns:minmax(0,1fr)}#dersler>.grid>.card{min-height:0}}
.tool-feature{display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;gap:20px;min-height:280px;padding:25px 28px;border:1px solid #bdded4;border-radius:20px;background:#eaf5ed}
.feature-icon{display:grid;place-items:center;width:46px;height:46px;margin-bottom:15px;border-radius:13px;background:#d4ece5;color:#12665f}
.feature-icon svg{width:27px;height:27px}
.tool-feature h2{margin:0 0 7px;font-size:1.65rem}
.tool-feature p{margin:0;color:#40565c}
.tool-feature a{display:inline-flex;align-items:center;min-height:44px;padding:10px 15px;border-radius:10px;background:var(--teal);color:white;text-decoration:none;font-weight:800;white-space:nowrap}
.tool-feature a:focus-visible{outline:3px solid #b87724;outline-offset:3px}
html[data-theme=dark] .site-menu a,html[data-theme=dark] .site-more summary{color:var(--ink)}
html[data-theme=dark] .site-menu a:hover,html[data-theme=dark] .site-menu a[aria-current="page"],html[data-theme=dark] .site-more summary:hover,html[data-theme=dark] .site-more summary.has-current{background:#48655d;color:#d7ffef}
html[data-theme=dark] .stage2-flow a{background:#5a513f;border-color:#a18b5d;color:#ffe6b1}
html[data-theme=dark] .tool-feature{background:#42615a;border-color:#73958b}
html[data-theme=dark] .tool-feature p{color:#e3ece6}
html[data-theme=dark] .feature-icon{background:#5b8075;color:#e3fff5}
html[data-theme=dark] .feature-grid .tool-feature a:not(.button){background:#b0eedd;color:#1c3d3a}
@media(max-width:900px){.feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}header .nav>a:not(.brand){display:none}.mobile-menu-toggle{display:inline-flex;align-items:center;min-height:44px;margin:0 20px 10px;padding:8px 14px;border:1px solid var(--line,#dce6e3);border-radius:10px;background:var(--paper,#fffdf8);color:var(--ink,#192a37);font:inherit;font-weight:750;cursor:pointer}.mobile-menu-toggle:focus-visible{outline:3px solid #b87724;outline-offset:3px}.site-menu{display:none;padding:0 16px 12px;align-items:stretch;flex-direction:column;gap:2px}.site-menu.is-open{display:flex}.site-menu a,.site-more summary{min-height:44px;padding:9px 12px}.site-more{margin-left:0}.site-more-panel{position:static;min-width:0;margin:2px 0 6px 12px;box-shadow:none;border:0;border-left:2px solid var(--line,#dce6e3);border-radius:0;background:transparent}.site-more-panel a{padding-left:14px}}
@media(max-width:620px){.stage2-flow{flex-direction:column}.feature-grid{grid-template-columns:1fr;gap:14px}.tool-feature{min-height:0;padding:22px}}
.lesson-progress{margin:24px 0;padding:20px 24px;border:1px solid var(--line,#dce6e3);border-radius:18px;background:var(--paper,#fffdf8)}
.lesson-progress h2{margin:0 0 8px}.lesson-progress p{margin:6px 0 14px}
.lesson-progress button{min-height:44px;padding:10px 16px;border:1px solid var(--teal,#147d78);border-radius:10px;background:var(--paper,#fffdf8);color:var(--teal,#147d78);font:inherit;font-weight:750;cursor:pointer}
.lesson-progress button[aria-pressed=true]{background:var(--teal,#147d78);color:var(--paper,#fffdf8)}
.math-steps{white-space:normal;overflow-wrap:normal}
.lesson-progress button:focus-visible{outline:3px solid #b87724;outline-offset:3px}
.progress-message{font-size:.9rem;color:var(--muted,#54636b)}
html[data-theme=dark] .lesson-progress{background:var(--paper);border-color:var(--line)}
html[data-theme=dark] .lesson-progress button{background:#435b60;color:var(--ink);border-color:var(--line)}
html[data-theme=dark] .lesson-progress button[aria-pressed=true]{background:#b0eedd;color:#1c3d3a}