@import "https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,500;12..96,700&family=Inter:wght@400;500;600;700&display=swap";*{margin:0;padding:0}:root{--bg:#f4f6f2;--surface:#fff;--tint:#e6efea;--ink:#10241f;--ink-2:#2c3f39;--muted:#3e534c;--line:#dce4df;--line-strong:#c9d6cf;--primary:#1f5c4a;--primary-dark:#123b30;--on-primary:#fff;--accent:#f2b33d;--warn-bg:#fcf1dc;--warn:#7a4e0b;--correct:#1f5c4a;--correct-bg:#e6efea;--incorrect:#9a3a1e;--incorrect-bg:#fbeae4;--shadow:0 1px 2px #10241f0f, 0 8px 24px #10241f0f;--radius:20px;--radius-sm:14px;--font-display:"Bricolage Grotesque", system-ui, sans-serif;--font-body:"Inter", system-ui, -apple-system, sans-serif;--nav-h:68px}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);font-family:var(--font-body);-webkit-font-smoothing:antialiased;margin:0;font-size:16px;line-height:1.5}a{color:var(--primary)}a:hover{color:var(--primary-dark)}:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:6px}.visually-hidden{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;overflow:hidden;position:absolute!important}.app{flex-direction:column;min-height:100vh;display:flex}.app-header{background:var(--bg);z-index:10;position:sticky;top:0}.app-header-inner{justify-content:space-between;align-items:center;gap:12px;max-width:1040px;min-height:60px;margin:0 auto;padding:10px 20px;display:flex}.wordmark{font-family:var(--font-display);letter-spacing:-.02em;color:var(--ink);align-items:center;min-height:44px;font-size:1.4rem;font-weight:700;text-decoration:none;display:flex}.wordmark:hover{color:var(--ink)}.top-nav{gap:4px;display:none}.top-nav-link{min-height:44px;color:var(--ink-2);border-radius:12px;align-items:center;padding:0 14px;font-weight:500;text-decoration:none;display:flex}.top-nav-link:hover{background:var(--tint);color:var(--ink)}.top-nav-link.active{background:var(--surface);color:var(--primary);box-shadow:var(--shadow);font-weight:600}.main-panel{width:100%;max-width:760px;padding:8px 20px calc(var(--nav-h) + 32px);flex:1;margin:0 auto}.bottom-nav{z-index:10;background:var(--surface);border-top:1px solid var(--line);padding:6px 8px calc(6px + env(safe-area-inset-bottom));grid-template-columns:repeat(3,minmax(0,1fr));display:grid;position:fixed;bottom:0;left:0;right:0}.bottom-nav-link{min-height:52px;color:var(--muted);flex-direction:column;justify-content:center;align-items:center;gap:2px;font-size:12px;font-weight:500;text-decoration:none;display:flex}.bottom-nav-link.active{color:var(--primary);font-weight:600}@media (width>=900px){.top-nav{display:flex}.bottom-nav{display:none}.main-panel{padding-bottom:64px}}.screen{flex-direction:column;gap:16px;display:flex}.screen-header{align-items:center;gap:6px;margin-left:-10px;display:flex}.screen-header.plain{margin-left:0}.screen-header h1{font-family:var(--font-display);letter-spacing:-.02em;margin:0;font-size:clamp(1.5rem,4vw,2rem);font-weight:700;line-height:1.15}.screen-header>div{flex-direction:column;display:flex}.screen-intro{color:var(--muted);margin:-4px 0 4px}.eyebrow{letter-spacing:.06em;text-transform:uppercase;color:var(--muted);font-size:12px;font-weight:600}.icon-btn{width:44px;height:44px;color:var(--ink);border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;display:flex}.icon-btn:hover{background:var(--tint);color:var(--ink)}.card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow)}.btn{border-radius:var(--radius-sm);cursor:pointer;border:none;justify-content:center;align-items:center;gap:8px;min-height:50px;padding:0 20px;font-family:inherit;font-size:15px;font-weight:600;text-decoration:none;display:inline-flex}.btn-primary{background:var(--primary);color:var(--on-primary)}.btn-primary:hover{background:var(--primary-dark);color:var(--on-primary)}.btn-secondary{background:var(--surface);color:var(--ink);border:1px solid var(--line-strong)}.btn-secondary:hover{background:var(--tint);color:var(--ink)}.btn-block{width:100%}.next-step{align-self:flex-start;margin-top:16px}.text-link{align-items:center;min-height:44px;font-weight:500;display:inline-flex}.section-head{justify-content:space-between;align-items:baseline;display:flex}.section-head h2{font-family:var(--font-display);margin:0;font-size:1.3rem;font-weight:700}.guide-card{flex-direction:column;gap:14px;padding:18px;display:flex}.guide-card-head{align-items:flex-start;gap:12px;display:flex}.guide-card-head>div{flex-direction:column;gap:4px;display:flex}.guide-card-question{margin:0;font-size:17px;font-weight:500;line-height:1.4}.guide-mark{flex-shrink:0}.choice-list{flex-direction:column;gap:8px;display:flex}.choice{border-radius:var(--radius-sm);background:var(--tint);min-height:48px;color:var(--ink);justify-content:space-between;align-items:center;padding:0 16px;font-size:15px;font-weight:500;text-decoration:none;display:flex}.choice:hover{color:var(--ink);background:#d8e7df}.choice.primary{background:var(--primary);min-height:52px;color:var(--on-primary);font-weight:600}.choice.primary:hover{background:var(--primary-dark);color:var(--on-primary)}.home-topics{flex-direction:column;gap:10px;margin-top:4px;display:flex}.topic-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;display:grid}@media (width>=640px){.topic-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}.topic-card{background:var(--surface);box-shadow:var(--shadow);color:var(--ink);border-radius:18px;flex-direction:column;gap:6px;min-height:112px;padding:16px;text-decoration:none;transition:transform .15s,box-shadow .15s;display:flex}.topic-card:hover{color:var(--ink);transform:translateY(-2px);box-shadow:0 2px 4px #10241f0f,0 14px 30px #10241f17}.topic-card-name{font-size:15px;font-weight:600;line-height:1.3}.topic-card-status{color:var(--muted);font-size:13px}.progress-track{background:var(--tint);border-radius:99px;height:6px;margin-top:auto;overflow:hidden}.progress-fill{background:var(--primary);border-radius:99px;height:100%;display:block}.guide-line{align-items:flex-start;gap:10px;padding:14px;display:flex}.guide-line p{margin:0;font-size:15px;line-height:1.45}.path{flex-direction:column;margin:0;padding:0;list-style:none;display:flex}.path-step{gap:14px;display:flex}.path-rail{flex-direction:column;flex-shrink:0;align-items:center;width:28px;display:flex}.path-dot{border:2px solid var(--line-strong);background:var(--surface);width:28px;height:28px;color:var(--on-primary);border-radius:50%;justify-content:center;align-items:center;margin-top:8px;display:flex}.path-line{background:var(--line-strong);flex:1;width:2px;min-height:16px}.path-step.done .path-dot{background:var(--primary);border-color:var(--primary)}.path-step.done .path-line{background:var(--primary)}.path-step.current .path-dot{border-color:var(--primary)}.path-step.current .path-dot:after{content:"";background:var(--accent);border-radius:50%;width:10px;height:10px}.path-body{flex-direction:column;flex:1;gap:8px;min-width:0;padding-bottom:12px;display:flex}.path-title{min-height:44px;color:var(--ink);flex-direction:column;justify-content:center;font-size:15px;font-weight:600;text-decoration:none;display:flex}.path-title:hover{color:var(--primary)}.path-sub{color:var(--muted);font-size:13px;font-weight:400}.path-count{color:var(--muted);font-size:13px;font-weight:500}.path-step:has(.trick-links) .path-title{flex-flow:wrap;justify-content:flex-start;align-items:center;gap:4px}.trick-links{flex-direction:column;gap:6px;display:flex}.trick-link{background:var(--surface);border:1px solid var(--line);min-height:44px;color:var(--ink);border-radius:12px;justify-content:space-between;align-items:center;gap:10px;padding:8px 12px;font-size:14px;text-decoration:none;display:flex}.trick-link:hover{border-color:var(--primary);color:var(--ink)}.trick-link.done{background:var(--tint);border-color:var(--tint)}.trick-link.next{background:var(--primary);border-color:var(--primary);color:var(--on-primary);min-height:48px;font-weight:600}.trick-link.next:hover{background:var(--primary-dark);color:var(--on-primary)}.trick-link-tag{flex-shrink:0;font-size:12px;font-weight:600}.trick-link.done .trick-link-tag{color:var(--primary)}.stage-tabs{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;display:grid}.stage-tab{text-align:center;background:var(--surface);border:1px solid var(--line);min-height:44px;color:var(--ink-2);border-radius:12px;justify-content:center;align-items:center;padding:4px 6px;font-size:14px;font-weight:500;line-height:1.2;text-decoration:none;display:flex}.stage-tab:hover{border-color:var(--primary);color:var(--ink)}.stage-tab.active{background:var(--primary);border-color:var(--primary);color:var(--on-primary);font-weight:600}@media (width>=700px){.stage-tabs{grid-template-columns:repeat(6,minmax(0,1fr))}}.stage-content{flex-direction:column;display:flex}.sub-selector{flex-wrap:wrap;gap:8px;margin-bottom:14px;display:flex}.sub-tab{background:var(--surface);border:1px solid var(--line-strong);min-height:44px;color:var(--ink);cursor:pointer;text-align:left;border-radius:999px;align-items:center;padding:6px 14px;font-family:inherit;font-size:14px;display:inline-flex}.sub-tab:hover{border-color:var(--primary)}.sub-tab.active{background:var(--primary);border-color:var(--primary);color:var(--on-primary);font-weight:600}.basics-display,.trick-display{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:22px}@media (width>=640px){.basics-display,.trick-display{padding:28px 32px}}.trick-header{justify-content:space-between;align-items:center;gap:12px;display:flex}.trick-category{color:var(--muted);text-transform:uppercase;letter-spacing:.06em;font-size:13px;font-weight:600}.trick-title{font-family:var(--font-display);letter-spacing:-.02em;margin:8px 0 4px;font-size:clamp(1.4rem,3.5vw,1.75rem);font-weight:700;line-height:1.2}.trick-section{margin-top:20px}.trick-section h3{font-family:var(--font-display);margin:0 0 8px;font-size:1.1rem;font-weight:700}.basics-content,.when-section p{color:var(--ink-2);margin:0;line-height:1.7}.steps-list,.walkthrough-list{margin:0;padding-left:1.3rem;line-height:1.7}.steps-list li,.walkthrough-list li{margin-bottom:6px}.example-section{background:var(--bg);border-radius:var(--radius-sm);padding:18px 20px}.example-problem{font-family:var(--font-display);margin:0 0 8px;font-size:1.35rem;font-weight:700}.example-answer{color:var(--correct);margin:8px 0 0;font-weight:600}.empty-state{text-align:center;color:var(--muted)}.empty-state h2{font-family:var(--font-display);margin:0 0 6px}.difficulty-badge{text-transform:capitalize;background:var(--tint);color:var(--primary);border-radius:999px;padding:4px 10px;font-size:12px;font-weight:600;display:inline-block}.diff-easy{background:var(--tint);color:var(--primary)}.diff-medium{color:#6b4508;background:#fcebc4}.diff-hard{color:#8a2f14;background:#f8ddd3}.diff-challenge{color:#45307a;background:#e5e0f3}.unlimited-practice,.test-mode{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);padding:20px}@media (width>=640px){.unlimited-practice,.test-mode{padding:24px 28px}}.practice-meta{margin-bottom:10px}.practice-row{flex-direction:column;gap:12px;display:flex}.practice-problem{font-family:var(--font-display);letter-spacing:-.01em;font-size:1.35rem;font-weight:700;line-height:1.35;display:block}.practice-input-row{gap:8px;display:flex}.practice-input-row input,.test-input{border:2px solid var(--line-strong);background:var(--surface);min-width:0;min-height:52px;color:var(--ink);border-radius:12px;flex:1;padding:0 14px;font-family:inherit;font-size:18px}.practice-input-row input:focus,.test-input:focus{border-color:var(--primary);outline:none}.practice-row.correct input{border-color:var(--correct);background:var(--correct-bg)}.practice-row.incorrect input{border-color:var(--incorrect);background:var(--incorrect-bg)}.practice-input-row button{background:var(--primary);min-height:52px;color:var(--on-primary);cursor:pointer;border:none;border-radius:12px;flex-shrink:0;padding:0 20px;font-family:inherit;font-size:16px;font-weight:600}.practice-input-row button:hover{background:var(--primary-dark)}.feedback{border-radius:12px;margin:0;padding:12px 14px;font-weight:600}.feedback.correct{color:var(--correct);background:var(--correct-bg)}.feedback.incorrect{color:var(--ink);background:var(--warn-bg);font-weight:500}.hints-box{flex-direction:column;gap:8px;display:flex}.hint-button{border:1px dashed var(--primary);min-height:48px;color:var(--primary);cursor:pointer;background:0 0;border-radius:12px;font-family:inherit;font-size:15px;font-weight:600}.hint-button:hover{background:var(--tint)}.hint-bubble{background:var(--bg);border-radius:var(--radius-sm);align-items:flex-start;gap:10px;padding:12px 14px;display:flex}.hints-list{color:var(--ink-2);margin:0;padding-left:1.2rem;font-size:15px;line-height:1.6}.hints-list li+li{margin-top:4px}.hints-list.worked{background:var(--bg);border-radius:var(--radius-sm);padding:12px 14px 12px 2rem}.explain-btn{min-height:44px;color:var(--primary);text-underline-offset:3px;cursor:pointer;background:0 0;border:none;align-self:center;font-family:inherit;font-size:15px;font-weight:500;text-decoration:underline}.explain-btn:hover{color:var(--primary-dark)}.test-mode{flex-direction:column;gap:14px;display:flex}.test-mode h3{font-family:var(--font-display);margin:0;font-size:1.3rem}.test-intro{color:var(--muted);margin:0}.test-mode .practice-row{border-top:1px solid var(--line);padding:14px 0}.test-mode .practice-problem{font-size:1.15rem}.q-num{color:var(--muted)}.test-submit{border-radius:var(--radius-sm);background:var(--primary);min-height:50px;color:var(--on-primary);cursor:pointer;border:none;font-family:inherit;font-size:16px;font-weight:600}.test-submit:hover{background:var(--primary-dark)}.test-group{border-radius:var(--radius-sm);flex-direction:column;gap:8px;padding:14px 16px;display:flex}.test-group h4{margin:0;font-size:15px}.test-group.solid{background:var(--correct-bg)}.test-group.review{background:var(--warn-bg)}.test-review-line,.test-review-answer{margin:0}.test-review-block{border-top:1px solid #10241f1a;flex-direction:column;gap:6px;padding-top:8px;display:flex}.test-review-block:first-of-type{border-top:none;padding-top:0}.test-all-solid{color:var(--correct);margin:0;font-weight:600}.tutor-chat{background:var(--surface);border-radius:var(--radius);box-shadow:var(--shadow);flex-direction:column;gap:12px;padding:16px;display:flex}.tutor-head{align-items:center;gap:10px;display:flex}.tutor-head>div{flex-direction:column;display:flex}.tutor-name{font-family:var(--font-display);font-size:18px;font-weight:700}.tutor-role{color:var(--muted);font-size:12px}.ai-notice{color:var(--muted);background:var(--tint);border-radius:999px;align-self:flex-start;margin:0;padding:6px 12px;font-size:13px}.tutor-intro{color:var(--muted);margin:0;font-size:14px}.tutor-messages{flex-direction:column;gap:10px;max-height:55vh;padding:2px;display:flex;overflow-y:auto}.tutor-message{border-radius:18px;max-width:88%;padding:10px 14px;font-size:15px;line-height:1.5}.tutor-message p{white-space:pre-wrap;margin:0}.tutor-message.user{background:var(--primary);color:var(--on-primary);border-bottom-right-radius:4px;align-self:flex-end}.tutor-message.assistant{background:var(--bg);border-bottom-left-radius:4px;align-self:flex-start}.tutor-message.loading{color:var(--muted)}.tutor-message-label{text-transform:uppercase;letter-spacing:.06em;opacity:.75;margin-bottom:2px;font-size:11px;font-weight:600;display:block}.tutor-chips{flex-wrap:wrap;gap:8px;display:flex}.tutor-empty{width:100%;color:var(--muted);margin:0;font-size:14px}.tutor-chip{border:1px solid var(--line-strong);background:var(--surface);min-height:44px;color:var(--ink);cursor:pointer;border-radius:999px;padding:0 14px;font-family:inherit;font-size:14px}.tutor-chip:hover:not(:disabled){border-color:var(--primary);background:var(--tint)}.tutor-error{color:var(--incorrect);margin:0;font-size:14px}.tutor-input-row{align-items:flex-end;gap:8px;display:flex}.tutor-input-row textarea{border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--bg);min-width:0;min-height:48px;color:var(--ink);resize:vertical;flex:1;padding:12px 14px;font-family:inherit;font-size:16px}.tutor-input-row textarea:focus{border-color:var(--primary);outline:none}.tutor-input-row button{border-radius:var(--radius-sm);background:var(--primary);min-height:48px;color:var(--on-primary);cursor:pointer;border:none;flex-shrink:0;padding:0 18px;font-family:inherit;font-size:15px;font-weight:600}.tutor-input-row button:disabled{background:var(--line-strong);color:var(--muted);cursor:not-allowed}.tutor-input-row button:not(:disabled):hover{background:var(--primary-dark)}.angle-diagram{max-width:360px;margin:4px 0}.angle-diagram svg{background:var(--bg);border-radius:12px;width:100%;height:auto}.angle-diagram figcaption{color:var(--muted);margin-top:4px;font-size:13px}.ad-line{stroke:var(--ink);stroke-width:2px;fill:none}.ad-shape{stroke:var(--ink);stroke-width:2px;fill:var(--tint)}.ad-arc{stroke:var(--primary);stroke-width:1.5px;fill:none}.ad-text{fill:var(--ink);font-size:14px;font-weight:600;font-family:var(--font-body)}@media (prefers-reduced-motion:reduce){*{transition:none!important}}.trick-select{flex-direction:column;gap:6px;margin-bottom:14px;display:flex}.trick-select select{border:1px solid var(--line-strong);border-radius:var(--radius-sm);background:var(--surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%2310241F' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") no-repeat right 12px center;min-height:50px;color:var(--ink);appearance:none;padding:0 40px 0 14px;font-family:inherit;font-size:16px;font-weight:500}.trick-pills{display:none}@media (width>=640px){.trick-select{display:none}.trick-pills{display:block}}.area-group{flex-direction:column;gap:10px;margin-top:8px;display:flex}.area-title{font-family:var(--font-display);margin:0;font-size:1.15rem;font-weight:700}.area-note{color:var(--muted);margin:-4px 0 2px;font-size:14px}.topic-card-tag{letter-spacing:.04em;text-transform:uppercase;color:#6b4508;background:#fcebc4;border-radius:999px;align-self:flex-start;padding:3px 8px;font-size:11px;font-weight:600}.info-section{flex-direction:column;gap:10px;padding:20px;display:flex}.info-section h2{font-family:var(--font-display);margin:0;font-size:1.2rem;font-weight:700}.info-section p{color:var(--ink-2);margin:0;line-height:1.6}.info-section .btn{align-self:flex-start}.info-list{color:var(--ink-2);flex-direction:column;gap:8px;margin:0;padding-left:1.2rem;line-height:1.55;display:flex}.info-list.compact{gap:2px}.info-list strong{color:var(--ink)}.info-small{color:var(--muted)!important;font-size:14px!important}.founder-quote{border-left:3px solid var(--accent);margin:0;padding:4px 0 4px 16px}.founder-quote p{font-size:17px;font-style:italic;line-height:1.55;color:var(--ink)!important}.founder-quote footer{color:var(--muted);margin-top:8px;font-size:14px;font-weight:600}.map-table{border:1px solid var(--line);border-radius:var(--radius-sm);flex-direction:column;display:flex;overflow:hidden}.map-row{border-top:1px solid var(--line);grid-template-columns:minmax(0,1fr);gap:2px;padding:10px 14px;display:grid}.map-row:first-child{border-top:none}.map-area{font-size:14px;font-weight:600}.map-topics{color:var(--ink-2);font-size:14px;line-height:1.5}@media (width>=640px){.map-row{grid-template-columns:200px minmax(0,1fr);gap:16px}}.home-info{grid-template-columns:minmax(0,1fr);gap:10px;margin-top:4px;display:grid}@media (width>=640px){.home-info{grid-template-columns:repeat(2,minmax(0,1fr))}}.info-link{border:1px solid var(--line-strong);min-height:64px;color:var(--ink);background:0 0;border-radius:16px;flex-direction:column;justify-content:center;gap:2px;padding:12px 16px;text-decoration:none;display:flex}.info-link:hover{background:var(--surface);color:var(--ink)}.info-link-title{font-weight:600}.info-link-sub{color:var(--muted);font-size:13px}.site-footer{border-top:1px solid var(--line);flex-wrap:wrap;justify-content:center;gap:4px 16px;margin-top:40px;padding-top:16px;display:flex}.site-footer a{min-height:44px;color:var(--muted);align-items:center;font-size:14px;display:inline-flex}.site-footer a:hover{color:var(--primary)}