.topic-category-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;display:grid}.topic-category-card{min-height:116px;color:var(--ink);background:#fff;border:1px solid #d7e3dc;border-radius:10px;align-items:flex-start;gap:12px;padding:18px 16px;text-decoration:none;transition:background .16s,border-color .16s;display:flex;position:relative}.topic-category-card:hover{background:#edf5ef;border-color:#81b5a6}.topic-category-card:active{background:#dcece2}.topic-category-icon{color:var(--teal-dark);flex-shrink:0;padding-top:2px}.topic-category-card>div{min-width:0}.topic-category-card h2{font:700 16px/1.6 var(--round);margin:0 8px 5px 0}.topic-category-card p{color:var(--muted);margin:0 0 5px;font-size:12px;line-height:1.8}.topic-category-card small{color:#526b60;font-size:11px}.topic-category-arrow{color:var(--teal-dark);position:absolute;bottom:16px;right:12px}.topic-group-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.topic-group-card{color:var(--ink);background:#fff;border:1px solid #d7e3dc;border-radius:10px;flex-direction:column;justify-content:space-between;gap:22px;padding:20px;text-decoration:none;transition:border-color .16s,background .16s;display:flex}.topic-group-card:hover{background:#f3f8f3;border-color:#81b5a6}.topic-group-kind{color:#577565;font-size:11px}.topic-group-card h2{font:700 18px/1.6 var(--round);margin:7px 0}.topic-group-card p{color:var(--muted);margin:0;font-size:13px;line-height:1.9}.topic-group-bottom{justify-content:space-between;align-items:center;gap:8px;display:flex}.topic-group-bottom small{color:var(--muted);font-size:11px}.topic-group-bottom>span{color:var(--teal-dark);white-space:nowrap;align-items:center;gap:7px;font-size:12px;display:inline-flex}.topic-usage-note{color:var(--muted);max-width:76ch;margin:30px 0 0;font-size:13px;line-height:1.9}.learning-page.topic-practice-page{max-width:1480px}.topic-practice-page .lesson-title{margin:4px 0 10px}.topic-practice-layout{grid-template-columns:minmax(0,1fr);align-items:start;gap:24px;display:grid}.topic-practice-main{min-width:0}.topic-question-sidebar{min-width:0;display:none;position:sticky;top:24px}.topic-question-caption{color:var(--muted);margin:0 0 8px;font-size:12px}.topic-question-list{overscroll-behavior:contain;scrollbar-gutter:stable;border-top:1px solid #d7e3dc;border-bottom:1px solid #d7e3dc;max-height:min(62dvh,640px);margin:0;padding:4px;list-style:none;overflow-y:auto}.topic-question-list li+li{border-top:1px solid #e6eee8}.topic-question-list button{width:100%;min-height:48px;color:var(--ink);text-align:left;background:0 0;border:0;border-radius:5px;grid-template-columns:auto minmax(0,1fr) 15px;align-items:center;gap:8px;padding:10px 12px;font-size:13px;line-height:1.65;display:grid}.topic-question-list button:hover:not(:disabled){background:#edf4ef}.topic-question-list button[aria-current=step]{color:var(--teal-dark);box-shadow:inset 3px 0 var(--teal);background:#deeee5}.topic-question-list button:focus-visible,.topic-question-trigger:focus-visible{outline:2px solid var(--teal);outline-offset:-2px}.topic-choice-number{white-space:nowrap;font-weight:600}.topic-choice-note{color:var(--muted);white-space:nowrap;text-overflow:ellipsis;min-width:0;font-size:12px;overflow:hidden}.topic-question-list button>svg{grid-area:1/3;align-self:center}.topic-practice-main .practice-workbench{overflow:visible}.topic-question-dropdown{border-bottom:1px solid #d7e3dc;padding:10px 12px;position:relative}.topic-question-trigger{width:100%;min-height:46px;color:var(--teal-dark);text-align:left;background:#fff;border:1px solid #bfd8cb;border-radius:7px;justify-content:space-between;align-items:center;gap:12px;padding:9px 12px;font-size:13px;display:flex}.topic-question-trigger>span{flex-wrap:wrap;align-items:baseline;gap:3px 12px;display:flex}.topic-question-trigger span span{color:var(--muted);font-size:12px}.topic-question-trigger svg{flex-shrink:0}.topic-question-trigger[aria-expanded=true] svg{transform:rotate(180deg)}.topic-question-popup{z-index:8;background:#fff;border:1px solid #bfd8cb;border-radius:8px;position:absolute;top:calc(100% - 3px);left:12px;right:12px;box-shadow:0 8px 24px #17363c20}.topic-question-popup-heading{justify-content:space-between;align-items:center;gap:10px;padding:4px 8px 4px 14px;font-size:13px;display:flex}.topic-question-popup .topic-question-list{border-bottom:0;max-height:min(48dvh,400px)}.topic-run-position{flex-direction:column;gap:2px;padding:6px 0;display:flex}.topic-run-position strong{color:var(--teal-dark);font-weight:500;display:none}.topic-practice-main .practice-bar{flex-wrap:wrap}@media (width>=1200px){.topic-practice-layout{grid-template-columns:224px minmax(0,1fr)}.topic-question-sidebar{display:block}.topic-question-dropdown{display:none}.topic-run-position strong{display:block}}.practice-workbench:fullscreen .topic-question-dropdown{display:block}.practice-workbench:fullscreen .topic-run-position strong{display:none}.topic-context-note{color:var(--muted);margin:-4px 0 18px;font-size:13px;line-height:1.8}.topic-mode{gap:8px;margin:0 0 16px;display:flex}.topic-mode button{color:var(--teal-dark);background:#fff;border:1px solid #bfd8cb;border-radius:6px;min-height:42px;padding:8px 14px;font-size:13px}.topic-mode button[aria-pressed=true]{background:#dfede5;border-color:#78aa96}.topic-mode button:disabled{opacity:.65;cursor:default}.topic-task-instruction,.topic-clue,.topic-chain-link,.topic-question-meaning{color:var(--muted);margin:0 0 14px;font-size:14px;line-height:1.9}.topic-question-prompt{text-wrap:pretty;max-width:32em;margin:4px auto 18px;font-size:clamp(22px,2.2vw,32px);line-height:1.8}.topic-practice-stage .practice-target h2{font:500 clamp(25px, 3vw, 40px)/1.4 var(--round);white-space:nowrap;text-wrap:nowrap;margin:4px 0}.topic-fitted-target>span{display:inline-block}.topic-practice-stage .practice-feedback:empty{min-height:0;margin:0}.topic-practice-stage .learning-keyboard{margin-top:8px}.topic-chain-link{color:var(--teal-dark);margin-bottom:0}.topic-practice-stage .practice-hint{scrollbar-width:none;margin-top:6px}.topic-practice-stage .practice-hint::-webkit-scrollbar{display:none}.topic-question-meaning{text-align:center;max-width:50ch;margin:4px auto 8px}@media (width>=900px) and (height<=800px){body:has(.topic-practice-page) .site-header{height:64px}.topic-practice-page .lesson-title{margin:2px 0 6px}.topic-practice-page .lesson-title h1{font-size:24px}.topic-practice-stage .practice-target h2{font-size:34px}.topic-practice-stage .practice-target p{font-size:13px;line-height:1.5}.topic-practice-stage .practice-hint{padding-block:3px;font-size:30px;line-height:1.35}.topic-practice-stage .topic-question-meaning{margin-block:2px 4px}.topic-practice-stage .learning-keyboard[data-size=standard]{--guide-key-height:30px;--guide-row-gap:4px}.topic-practice-stage .learning-keyboard[data-size=standard] .learning-hand{width:100px}}.topic-number-guide{background:#edf3ee;border-radius:10px;justify-content:center;align-items:center;gap:28px;margin-top:18px;padding:18px;display:flex}.topic-number-pad{grid-template-columns:repeat(3,52px);gap:6px;display:grid}.topic-number-pad button{position:relative}.topic-number-guide button{min-width:48px;min-height:43px;color:var(--ink);font:18px var(--mono);background:#fff;border:1px solid #bdd5c8;border-radius:5px}.topic-number-guide button.is-next{color:#fff;background:#327f7a;border-color:#327f7a}.topic-number-guide button:hover:not(:disabled){border-color:#327f7a}.topic-number-separators{text-align:left;max-width:240px}.topic-number-separators p{font-size:13px;line-height:1.9}.topic-number-separators button{margin:0 5px 5px 0;font-size:15px}.topic-answer-review{text-align:left;border-top:1px solid #d7e3dc;max-width:720px;margin:24px auto 0;padding-top:18px}.topic-answer-review summary{color:var(--teal-dark);cursor:pointer;font-size:14px}.topic-answer-review li{padding:10px 0;font-size:14px;line-height:1.9}.topic-answer-review li p{margin:5px 0;font-size:13px}@media (width<=480px){.topic-number-guide{flex-direction:column;gap:8px}.topic-number-separators{text-align:center}}@media (width<=1050px){.topic-category-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media (width<=750px){.topic-category-grid,.topic-group-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.topic-group-card{padding:16px}}@media (width<=480px){.topic-category-card{grid-template-columns:22px minmax(0,1fr);align-content:start;gap:5px 7px;min-height:128px;padding:14px 12px;display:grid}.topic-category-card>div{display:contents}.topic-category-icon svg{width:21px;height:21px}.topic-category-card h2{margin:0;font-size:14px}.topic-category-card p{grid-column:1/-1;margin:3px 0;font-size:11px}.topic-category-card small{grid-column:1/-1;font-size:10px}.topic-category-arrow{width:14px;bottom:12px;right:9px}.topic-group-grid{grid-template-columns:minmax(0,1fr)}}@media (prefers-reduced-motion:reduce){.topic-category-card,.topic-group-card{transition:none}}
