/* Browser layout: the controls get their own rows; only the article feed scrolls. */
:root{--safe-top:.3rem;--safe-bottom:.3rem;--top-bar-height:6.2rem;--bottom-bar-height:6.2rem}
body{padding:0}
.app-shell{display:grid;grid-template-rows:auto minmax(0,1fr) auto;height:100dvh;min-height:0}
.top-bar,.bottom-bar{position:static;transform:none;width:100%;min-height:0;overflow:visible;touch-action:manipulation}
.top-bar{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;padding:10px}
.top-actions{display:contents}
.top-actions .text-button{min-width:0;min-height:42px;padding:6px;font-size:.8rem;line-height:1.2;white-space:normal;overflow-wrap:anywhere}
.top-bar .brand{justify-self:end;width:42px;height:42px;min-height:42px}
.top-bar .brand-logo{width:36px;height:36px;border-radius:10px}
.feed{grid-row:2;min-width:0;min-height:0;height:100%}
.feed .info-card,html[data-accessible="true"] .feed .info-card{min-height:100%;padding:12px;justify-content:flex-start}
.card-content{padding:14px 12px 20px;min-width:0;overflow-wrap:anywhere}
.bottom-bar{grid-row:3;display:flex;flex-wrap:wrap;gap:6px;padding:8px 10px 12px;align-items:stretch}
.bottom-bar .control-button{flex:1 1 auto;min-width:0;max-width:100%;min-height:42px;padding:8px 12px;font-size:.82rem;line-height:1.25;white-space:normal;overflow-wrap:anywhere}
.storage-notice{top:50%}
.topic-editor,.theme-editor,.legal-editor,.access-editor,.language-editor{padding:10px}
.topic-panel{max-height:calc(100dvh - 20px);padding:12px}
.editor-header>div{min-width:0}.editor-header h2{font-size:1.3rem;overflow-wrap:anywhere}
.topic-options{grid-template-columns:repeat(auto-fit,minmax(min(100%,9.5rem),1fr))}
.topic-choice{min-width:0}.topic-choice input{flex-shrink:0}.topic-choice span{min-width:0;overflow-wrap:anywhere}
.theme-choice{grid-template-columns:2.4rem minmax(0,1fr) auto;gap:8px;padding:10px}
.theme-choice>span{min-width:0;overflow-wrap:anywhere}.theme-swatch{width:100%}.choice-state{max-width:4.5rem}
@media(min-width:400px){.top-bar{grid-template-columns:repeat(5,minmax(0,1fr)) 42px;gap:4px}.top-actions .text-button{padding-inline:4px}}
.feed:focus-visible{outline:2px solid var(--accent-strong);outline-offset:-3px}
.ad-settings{display:none}
.demo-legal-note{padding:1rem;border:1px solid var(--line);border-radius:12px;margin-bottom:1rem!important}
.theme-editor .editor-note{display:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}