/* Desktop keeps a full sidebar; only mobile uses the compact icon rail. */
:root{--rail-width:64px;--mobile-nav-height:calc(64px + env(safe-area-inset-bottom,0px))}
.nav-rail{display:flex;flex-direction:column;align-items:center;min-height:0;background:var(--sidebar);border-right:1px solid var(--line);position:relative;z-index:51}
.rail-channels{display:flex;flex-direction:column;align-items:center;gap:3px;padding:12px 0;overflow-y:auto;scrollbar-width:none;flex:1;min-height:0;width:100%}
.rail-channels::-webkit-scrollbar{display:none}
.rail-tools{display:flex;flex-direction:column;gap:3px;align-items:center;padding:10px 0;border-top:1px solid var(--line);width:100%;flex-shrink:0}
.nav-rail button{width:44px;height:44px;display:flex;align-items:center;justify-content:center;color:var(--muted);border-radius:5px;position:relative;flex-shrink:0}
.nav-rail button:hover{background:var(--hover);color:var(--text)}
.nav-rail button.active{background:var(--bluefill);color:var(--blue)}
.nav-rail button[aria-current="page"]:before{content:'';position:absolute;left:-10px;width:2px;height:19px;background:var(--blue);border-radius:2px}
.nav-rail svg,.mobile-nav svg,.nav-sheet svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.mobile-nav{display:none}
.nav-rail button:focus-visible,.mobile-nav button:focus-visible,.nav-sheet button:focus-visible{outline:2px solid var(--blue);outline-offset:-2px}
.layout>.sidebar,.layout.reader-wide>.sidebar{display:none;position:fixed;inset:82px auto 24px var(--rail-width);width:300px;z-index:50;visibility:visible;padding:0;background:var(--sidebar);border-right:1px solid var(--line);box-shadow:12px 0 32px #0002;overflow:auto}
.layout.filters-open>.sidebar{display:block}
.sidebar-heading .filter-close{display:block;padding:0;min-width:30px;min-height:30px;font-size:calc(20px * var(--text-scale,1));color:var(--muted)}
.filter-backdrop{position:fixed;inset:82px 0 24px var(--rail-width);z-index:49;background:#0005;width:auto;height:auto}
.filter-backdrop:not([hidden]){display:block}
.filter-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex-shrink:0;height:38px;padding:8px 11px;border:1px solid var(--line);border-radius:4px;font-size:calc(11px * var(--text-scale,1));color:var(--muted)}
.filter-toggle:hover,.filter-toggle.active{color:var(--blue);border-color:var(--blue)}
.nav-sheet{color:var(--text);background:var(--panel);border:1px solid var(--line);border-radius:10px;padding:8px 18px 12px;box-shadow:0 15px 50px #0004;max-height:calc(100dvh - 170px);overflow:auto}
.nav-sheet::backdrop{background:#0007}
.nav-sheet-heading{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);padding:2px 0 9px}
.nav-sheet-heading h2{font-size:calc(15px * var(--text-scale,1));font-weight:600;margin:0}
.nav-sheet-heading button{display:flex;align-items:center;justify-content:center;width:44px;height:44px;color:var(--muted)}
.nav-sheet nav{display:grid;padding-top:6px}
.nav-sheet nav button{display:flex;align-items:center;justify-content:space-between;text-align:left;min-height:48px;font-size:calc(13px * var(--text-scale,1));padding:10px 4px;border-radius:4px}
.nav-sheet nav button span{color:var(--muted);font-size:calc(12px * var(--text-scale,1))}
.nav-sheet nav button:hover{background:var(--hover)}
@media(min-width:921px){
 .nav-rail{display:none}
 .layout,.layout.reader-open,.layout.reader-wide{width:100%;max-width:none;margin-inline:0}
 .layout:not(.reader-open){grid-template-columns:clamp(228px,17vw,320px) minmax(320px,1.3fr) minmax(320px,.7fr)}
 .layout.reader-open{grid-template-columns:clamp(228px,17vw,320px) minmax(300px,.82fr) minmax(400px,1.18fr)}
 .layout.reader-wide{grid-template-columns:clamp(228px,17vw,320px) minmax(270px,.6fr) minmax(440px,1.4fr)}
 .layout>.sidebar,.layout.reader-wide>.sidebar{display:block;position:static;inset:auto;width:auto;min-width:0;min-height:0;z-index:auto;box-shadow:none;grid-column:1;border-right:1px solid var(--line)}
 .layout>main{grid-column:2}
 .layout>.right-panel,.layout.reader-open>.right-panel{display:block;position:static;inset:auto;grid-column:3;min-width:0;z-index:auto;border-left:1px solid var(--line)}
 .sidebar-heading .filter-close,.filter-toggle,.filter-toolbar,.filter-backdrop:not([hidden]){display:none}
 .sidebar-heading{position:sticky;top:0;z-index:4;background:var(--sidebar);padding:16px 18px 12px;gap:8px}
 .channel-group.is-expanded>.channel-trigger{top:51px}
 .layout:not(.reader-open)>.right-panel{padding:26px 24px;background:var(--sidebar)}
}
@media(min-width:921px) and (max-width:1150px){
 .layout:not(.reader-open){grid-template-columns:220px minmax(280px,1fr) minmax(300px,340px)}
 .layout.reader-open{grid-template-columns:220px minmax(280px,.8fr) minmax(370px,1.2fr)}
 .layout.reader-wide{grid-template-columns:220px minmax(250px,.6fr) minmax(400px,1.4fr)}
 .layout:not(.reader-open)>.right-panel{padding-inline:20px}
}
@media(max-width:920px){
 :root{--rail-width:48px}
 .nav-rail{display:flex;position:fixed;inset:80px auto var(--mobile-nav-height) 0;width:var(--rail-width)}
 .nav-rail button{width:44px;height:44px}
 .nav-rail svg{width:18px;height:18px}
 .nav-rail button[aria-current="page"]:before{left:-2px;height:16px}
 .rail-channels{gap:2px;padding-block:8px}
 .rail-tools{gap:2px;padding-block:6px}
 .topbar{height:54px;justify-content:space-between;gap:16px}
 .topbar .topnav{display:none}
 .topbar .theme{margin-left:auto;min-width:44px;min-height:44px}
 .statusbar{height:26px}
 .layout,.layout.reader-open,.layout.reader-wide{height:calc(100dvh - 80px - var(--mobile-nav-height));display:block;padding-left:var(--rail-width)}
 .layout>.sidebar,.layout.reader-wide>.sidebar{inset:80px auto var(--mobile-nav-height) var(--rail-width);width:min(330px,calc(100vw - var(--rail-width) - 12px))}
 .filter-backdrop{inset:80px 0 var(--mobile-nav-height) var(--rail-width)}
 .layout.reader-open>.right-panel{inset:80px 0 var(--mobile-nav-height) var(--rail-width);padding-bottom:30px}
 .reader-open .detail-heading button{min-width:44px;min-height:44px}
 .sidebar-heading .filter-close{min-width:44px;min-height:44px}
 .sidebar-heading{padding-block:10px}
 .channel-group.is-expanded>.channel-trigger{top:65px}
 .main-search .filter-toggle{display:none}
 .main-search input,.channel-panel .sidebar-fields input,.channel-panel .sidebar-fields select,.channel-panel .source-search{font-size:calc(16px * var(--text-scale,1))}
 .mobile-nav{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));position:fixed;inset:auto 0 0;height:var(--mobile-nav-height);padding:5px max(8px,env(safe-area-inset-right,0px)) calc(5px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px));background:var(--panel);border-top:1px solid var(--line);z-index:45}
 .mobile-nav button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:5px;min-width:0;min-height:48px;color:var(--muted);border-radius:5px;font-size:calc(10px * var(--text-scale,1));line-height:1.2}
 .mobile-nav button.active{color:var(--blue)}
 .mobile-nav button:hover{background:var(--hover)}
 .mobile-nav svg{width:21px;height:21px;stroke-width:1.6}
 .nav-sheet{inset:auto 12px calc(var(--mobile-nav-height) + 8px);margin:0 auto;width:calc(100% - 24px);max-width:440px}
 footer{display:none}
}
@media print{.nav-rail,.mobile-nav,.nav-sheet,.filter-backdrop,.layout.filters-open>.sidebar{display:none!important}.layout,.layout.reader-open,.layout.reader-wide{display:block;height:auto}}
