/* Home is one complete screen. Directory and learning panes keep their own rules. */
.entry-shell:has(#entry-main .channels){--header-height:clamp(54px,9dvh,78px)}
.entry-shell:has(#entry-main .channels) .bottom-nav{height:calc(60px + env(safe-area-inset-bottom));padding-top:5px;padding-bottom:calc(5px + env(safe-area-inset-bottom))}
#entry-main:has(.channels){display:grid;grid-template-rows:auto minmax(76px,.6fr) minmax(0,1.8fr) auto;gap:clamp(8px,1.5dvh,14px);overflow:hidden;scrollbar-gutter:auto;padding:8px var(--page-pad) 12px}
#entry-main:has(.channels) .page-heading{margin:0}
#entry-main:has(.channels) .eyebrow{font-size:10px;line-height:1.3;margin:0 0 5px}
#entry-main:has(.channels) h1{font-size:clamp(23px,3.4dvh,30px);line-height:1.25;margin:0 0 6px}
#entry-main:has(.channels) .lead{font-size:12px;line-height:1.4}
#entry-main:has(.channels) .stats-placeholder{min-height:0;display:flex;flex-direction:column;justify-content:space-between;padding:12px 18px;margin:0;border-radius:17px}
#entry-main:has(.channels) .section-line h2{font-size:15px;line-height:1.4}
#entry-main:has(.channels) .section-line>span:not(.status-pill){font-size:10px}
#entry-main:has(.channels) .status-pill{font-size:10px;line-height:1.2;padding:4px 9px}
#entry-main:has(.channels) .stat-grid{margin-top:8px}
#entry-main:has(.channels) .stat-grid>div{gap:5px}
#entry-main:has(.channels) .stat-grid strong{font-size:23px;line-height:1.2}
#entry-main:has(.channels) .stat-grid span{font-size:11px;line-height:1.3}
#entry-main:has(.channels) .channels{min-height:0;display:flex;flex-direction:column}
#entry-main:has(.channels) .channels>.section-line{flex:none;margin:0 0 8px}
#entry-main:has(.channels) .channel-grid{min-height:0;flex:1;grid-template-rows:minmax(128px,1.4fr) minmax(88px,.85fr);gap:10px}
#entry-main:has(.channels) .channel{min-width:0;min-height:0;display:flex;flex-direction:column;justify-content:space-between;padding:16px 20px;border-radius:17px;overflow:visible}
#entry-main:has(.channels) .channel-top{align-items:center;margin:0 0 5px}
#entry-main:has(.channels) .level-pill{font-size:10px;line-height:1.2;padding:4px 9px}
#entry-main:has(.channels) .channel-art{width:38px;height:38px}
#entry-main:has(.channels) .channel h3{font-size:22px;line-height:1.35;margin:0}
#entry-main:has(.channels) .channel p{font-size:11px;line-height:1.4;margin:5px 0}
#entry-main:has(.channels) .channel-action{font-size:12px;line-height:1.3;gap:5px}
#entry-main:has(.channels) .channel-action .icon{width:14px;height:14px}
#entry-main:has(.channels) :is(.channel-pending,.channel-flash){display:grid;grid-template-columns:18px minmax(0,1fr);grid-template-rows:auto auto auto;align-content:center;justify-content:initial;gap:4px 8px;padding:10px 16px}
#entry-main:has(.channels) :is(.channel-pending,.channel-flash)>.icon{grid-column:1;grid-row:1;width:18px;height:18px;margin:0;align-self:center}
#entry-main:has(.channels) :is(.channel-pending,.channel-flash) h3{grid-column:2;grid-row:1;font-size:16px;line-height:1.3}
#entry-main:has(.channels) :is(.channel-pending,.channel-flash) p{grid-column:1/-1;grid-row:2;font-size:11px;line-height:1.3;margin:0}
#entry-main:has(.channels) :is(.channel-pending,.channel-flash) .status-pill{grid-column:1/-1;grid-row:3;justify-self:start}
#entry-main:has(.channels) .home-note{font-size:10px;line-height:1.4;margin:0;text-align:center}
@media(max-width:600px){
 #entry-main:has(.channels) .channel{padding:12px 15px}
 #entry-main:has(.channels) .channel h3{font-size:20px}
 #entry-main:has(.channels) .channel p{font-size:10px}
 #entry-main:has(.channels) :is(.channel-pending,.channel-flash){padding:8px 12px}
 #entry-main:has(.channels) :is(.channel-pending,.channel-flash) h3{font-size:14px}
 #entry-main:has(.channels) :is(.channel-pending,.channel-flash) p{font-size:10px}
}
@media(max-height:650px){
 #entry-main:has(.channels){gap:8px;padding-top:4px;padding-bottom:8px}
 #entry-main:has(.channels) .eyebrow{font-size:9px;margin-bottom:3px}
 #entry-main:has(.channels) h1{font-size:23px;margin-bottom:4px}
 #entry-main:has(.channels) .lead{font-size:10px;line-height:1.3}
 #entry-main:has(.channels) .stats-placeholder{padding:9px 14px}
 #entry-main:has(.channels) .stat-grid{margin-top:3px}
 #entry-main:has(.channels) .stat-grid strong{font-size:20px}
 #entry-main:has(.channels) .channel{padding:9px 12px}
 #entry-main:has(.channels) .channel-top{margin-bottom:3px}
 #entry-main:has(.channels) .channel-art{width:26px;height:26px}
 #entry-main:has(.channels) .channel h3{font-size:17px;line-height:1.3}
 #entry-main:has(.channels) .channel p{font-size:10px;line-height:1.3;margin:3px 0}
 #entry-main:has(.channels) .channel-action{font-size:11px}
 #entry-main:has(.channels) :is(.channel-pending,.channel-flash){padding:8px 12px}
 #entry-main:has(.channels) :is(.channel-pending,.channel-flash) h3{font-size:14px}
 #entry-main:has(.channels) :is(.channel-pending,.channel-flash) p{margin:0}
 #entry-main:has(.channels) :is(.channel-pending,.channel-flash) .status-pill{font-size:9px;padding:3px 8px}
 #entry-main:has(.channels) .home-note{font-size:10px;line-height:1.3}
}
@media(min-width:650px) and (max-height:500px){
 .entry-shell:has(#entry-main .channels){--header-height:48px}
 .entry-shell:has(#entry-main .channels) .brand-mark{width:32px;height:32px;font-size:25px;line-height:30px}
 .entry-shell:has(#entry-main .channels) .brand{font-size:15px}
 .entry-shell:has(#entry-main .channels) .brand small{font-size:8px;margin-top:3px}
 .entry-shell:has(#entry-main .channels) .bottom-nav{height:calc(54px + env(safe-area-inset-bottom))}
 .entry-shell:has(#entry-main .channels) .bottom-nav .icon{width:20px;height:20px}
 #entry-main:has(.channels){grid-template-columns:minmax(0,.95fr) minmax(0,1.6fr);grid-template-rows:auto minmax(76px,1fr) auto;column-gap:20px;padding-bottom:8px}
 #entry-main:has(.channels) .page-heading{grid-column:1;grid-row:1}
 #entry-main:has(.channels) h1{font-size:22px}
 #entry-main:has(.channels) .stats-placeholder{grid-column:1;grid-row:2}
 #entry-main:has(.channels) .home-note{grid-column:1;grid-row:3}
 #entry-main:has(.channels) .channels{grid-column:2;grid-row:1/4}
 #entry-main:has(.channels) .channel-grid{grid-template-rows:minmax(112px,1.4fr) minmax(88px,.85fr);gap:8px}
}

#entry-main:has(.channels) .channel-flash .channel-action{grid-column:1/-1;grid-row:3;justify-self:start;font-size:11px;line-height:1.4}
