/* Compact shared public navigation, using the same palette and line icons as the app. */
.ui-icon{display:inline-block;width:20px;height:20px;flex:none;vertical-align:middle}
.blog-top{min-height:76px;padding-top:12px;padding-bottom:12px}
.blog-top nav a{display:flex;align-items:center;justify-content:center;gap:7px;min-height:44px}
.blog-brand span{line-height:1.2;white-space:nowrap}.blog-brand b{display:block;font-size:10px;text-transform:uppercase;letter-spacing:.18em;margin-top:5px}
.theme-picker{flex:none}.public-theme{width:120px;max-width:100%;padding:8px 10px}
.blog-foot a{display:inline-flex;align-items:center;min-height:44px}
@media(max-width:900px){
 .blog-top{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:8px 12px;padding:12px 16px 8px}
 .blog-top .blog-brand{font-size:18px;gap:8px;min-width:0}.blog-brand .logo{width:30px;height:30px}
 .blog-top .theme-picker{grid-column:2;grid-row:1}.blog-top nav{grid-row:2;grid-column:1/-1;order:initial;width:100%;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:4px;overflow:visible}
 .blog-top nav a{font-size:13px;padding:8px 4px;gap:5px}.blog-top nav .ui-icon{width:17px;height:17px}
 .public-theme{width:108px;margin:0;font-size:12px}.blog-main{padding-top:20px}
}
@media(max-width:360px){.blog-top{padding-left:12px;padding-right:12px}.blog-top .blog-brand{font-size:16px}.blog-top nav a{font-size:12px}.blog-top nav .ui-icon{width:15px;height:15px}.public-theme{width:100px}}