/* Phone layout only. Desktop card dimensions and the selected visual system stay intact. */
.category-switcher{display:none}
.category-picker-list{display:grid;gap:6px;overflow-y:auto;min-height:0;overscroll-behavior:contain}
.picker-category-link{display:flex;align-items:center;gap:12px;min-height:52px;padding:10px 12px;border-radius:10px}
.picker-category-link>.icon{width:22px;height:22px}
.picker-category-link.is-active{background:var(--yellow-tint)}
.picker-category-name{flex:1;min-width:0;overflow-wrap:anywhere}
.picker-category-count{font-size:14px;line-height:20px;color:var(--muted);white-space:nowrap}
.picker-selected,.picker-selected-space{width:18px;height:18px;flex-shrink:0}
#category-picker-dialog[open]{display:flex;flex-direction:column;overflow:hidden;max-height:min(620px,calc(100dvh - 48px))}
#category-picker-dialog .dialog-header,#category-picker-dialog .dialog-search{flex-shrink:0}
@media(max-width:620px){
 .directory-filters{display:none}
 .category-switcher{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:24px;min-height:44px}
 .category-current{display:flex;align-items:center;gap:10px;min-width:0;font-size:16px;line-height:24px}
 .category-current-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .category-current small{font-size:14px;color:var(--muted);white-space:nowrap}
 .category-switcher .secondary-button{flex-shrink:0;min-height:44px;font-size:14px;padding:8px 12px}
 .category-switcher .icon{width:16px;height:16px}
 #category-picker-dialog{position:fixed;inset:auto 0 0;margin:0;width:100%;max-width:none;max-height:75dvh;padding:20px 20px calc(24px + env(safe-area-inset-bottom));border-radius:20px 20px 0 0;border-bottom:0}
 #category-picker-dialog[open]{max-height:75dvh}
 .is-home .content{padding-top:24px}
 .home-heading{margin-bottom:20px}
 .home-heading h1{font-size:24px;line-height:32px}
 .topic-title{font-size:28px;line-height:36px;margin-bottom:6px}
 .feature-map .map-preview{max-width:180px}
 .feature-steps{margin-top:16px;margin-bottom:16px}
 .feature-steps .step-number{width:36px;height:36px;font-size:24px;line-height:32px}
 .feature-steps .step-label{font-size:16px;line-height:24px}
 .feature-steps .step-caption{font-size:12px;line-height:20px}
 .feature-actions .primary-button{min-height:48px}
 .other-topic-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}
 .choice-card{display:flex;flex-direction:column;align-items:stretch;gap:4px;padding:12px;text-align:left}
 .choice-card-art{align-self:center;width:100%}
 .choice-card .topic-card-art{height:112px;margin-bottom:4px}
 .choice-card .topic-name{font-size:16px;line-height:24px;white-space:normal}
 .choice-card .topic-name span[lang=en]{font-size:18px}
 .choice-card .topic-category{font-size:12px;line-height:20px;margin:2px 0 8px}
 .choice-card .topic-select{min-height:40px;width:100%;font-size:14px}
 .results-grid,.directory-group .results-grid{--phone-card:160px;grid-template-columns:repeat(auto-fill,var(--phone-card));gap:12px}
 .results-grid .result-card,.directory-group.is-single .result-card{width:var(--phone-card);height:288px}
 .results-grid .topic-card-link,.directory-group.is-single .topic-card-link{padding:10px}
 .results-grid .topic-card-art,.directory-group.is-single .topic-card-art{height:136px;margin-bottom:8px}
 .results-grid .topic-name{font-size:16px;line-height:24px;padding-right:24px}
 .results-grid .topic-name span[lang=en]{font-size:18px}
 .results-grid .topic-summary,.directory-group .topic-summary{font-size:14px;line-height:20px;margin-top:6px}
 .results-grid .topic-card-arrow,.directory-group.is-single .topic-card-arrow{top:154px;right:8px;width:24px;height:24px}
 .results-grid .topic-card-favorite{opacity:1;background:var(--paper)}
 .directory-group{margin-bottom:28px}
 .directory-group>h2{font-size:18px;line-height:28px;margin-bottom:12px}
 .directory-filters{flex-wrap:wrap;gap:8px}
 .mobile-reader-top{gap:8px}
 .mobile-reader-title h1{font-size:28px;line-height:36px}
 .mobile-reader-title [lang=en]{font-size:30px}
 body[data-step=qa] .reader-map,body[data-step=speak] .reader-map{max-width:170px}
 body[data-step=qa] .reader-map img,body[data-step=speak] .reader-map img{max-height:227px}
 .mobile-reader-steps{margin-bottom:16px}
 body[data-step=qa] .reader-visual .map-mode-tabs,body[data-step=speak] .reader-visual .map-mode-tabs{display:flex}
 .reader-visual .map-mode-tabs{max-width:260px;margin:0 auto 12px;gap:8px}
 .reader-visual .map-mode-tabs .learning-tab{min-height:44px;flex:1;font-size:14px;line-height:20px;white-space:nowrap}
 .reader-visual .reader-zoom-shortcut{min-width:44px;min-height:44px}
 .qa-card{border-radius:12px}
 .audio-play{min-height:44px}
 .qa-pager .text-link{min-height:44px}
 .audio-rate select{min-height:44px}
 .audio-buttons .text-link{min-height:44px}
 .mobile-nav{padding-bottom:calc(8px + env(safe-area-inset-bottom));box-shadow:0 -4px 20px rgb(48 50 56 / 3%)}
}
@media(max-width:374px){
 .results-grid,.directory-group .results-grid{--phone-card:148px}
 .results-grid .result-card,.directory-group.is-single .result-card{height:308px}
 .choice-card{padding:10px}
}
@media(max-width:340px){
 .results-grid,.directory-group .results-grid{--phone-card:136px}
 .results-grid .result-card,.directory-group.is-single .result-card{height:328px}
 .results-grid .topic-summary{font-size:14px;line-height:20px}
}