/* Website navigation stays in the header. Compact and installed windows use tabs. */
.app-header-actions{display:none}
.comparison-count{background:var(--teal);color:white;border-radius:12px;font-size:10px;min-width:17px;padding:1px 5px;text-align:center}
.topnav{gap:16px}.header-inner{gap:18px}.nav-item{white-space:nowrap}
.bottom-nav .nav-label{display:block;font-size:11px;line-height:1.4;color:inherit;margin:0}
.account-menu{display:grid;margin:16px 0 24px}
.account-menu>button{display:flex;align-items:center;gap:13px;text-align:right;min-height:59px;padding:13px 4px;background:none;border:0;border-bottom:1px solid var(--line);font-size:15px}
.account-menu>button>.ui-icon:first-child{color:var(--teal)}
.account-menu>button>.ui-icon:last-child{margin-right:auto;width:17px;color:var(--muted)}
.account-login{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;margin-bottom:24px}
html{scroll-padding-top:95px;scroll-padding-bottom:120px}
.app-navigation{--tab-height:76px;--tab-space:calc(var(--tab-height) + env(safe-area-inset-bottom,0px))}
.app-navigation body{padding-bottom:var(--tab-space)}
.app-navigation .header{position:sticky;top:0;z-index:30;background:#f8f9f6f5;backdrop-filter:blur(16px);padding-top:env(safe-area-inset-top,0px)}
.app-navigation .header-inner{height:65px;max-width:1392px;padding-inline:max(20px,env(safe-area-inset-right,0px)) max(20px,env(safe-area-inset-left,0px));justify-content:space-between}
.app-navigation .header .topnav,.app-navigation .header-actions{display:none}
.app-navigation .app-header-actions{display:flex;gap:8px}
.app-navigation .brand{font-size:28px;gap:8px}.app-navigation .brand-icon{height:33px;width:33px;border-radius:10px}.app-navigation .brand-icon .ui-icon{width:21px;height:21px}
.app-navigation .app-header-actions .icon-button{width:44px;height:44px;border:1px solid var(--line);border-radius:14px;background:white;color:var(--teal)}
.app-navigation .bottom-nav{position:fixed;z-index:35;inset:auto 0 0;display:flex;align-items:stretch;justify-content:center;height:var(--tab-space);padding:6px max(8px,env(safe-area-inset-right,0px)) calc(6px + env(safe-area-inset-bottom,0px)) max(8px,env(safe-area-inset-left,0px));background:#fffffffa;border-top:1px solid var(--line);box-shadow:0 -6px 24px #14382c08;backdrop-filter:blur(16px)}
.app-navigation .bottom-nav>button{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;flex:1;max-width:150px;min-width:0;min-height:56px;padding:0 3px;border:0;border-radius:12px;background:transparent;color:#6a7d72;position:relative;font-size:11px}
.app-navigation .bottom-nav .nav-icon{position:relative;display:flex;align-items:center;justify-content:center;width:44px;height:30px;border-radius:10px;color:inherit;margin:0}
.app-navigation .bottom-nav .nav-icon .ui-icon{width:22px;height:22px}
.app-navigation .bottom-nav>button.active{color:#006e60;font-weight:600}
.app-navigation .bottom-nav>button.active .nav-icon{background:#e1f0e9}
.app-navigation .bottom-nav .nav-publish .nav-icon{background:var(--teal);color:white;border-radius:10px}
.app-navigation .bottom-nav .comparison-count{position:absolute;right:-3px;top:-4px;line-height:16px;min-width:18px;height:18px;padding:0 4px;box-shadow:0 0 0 2px white}
.app-navigation .bottom-nav .nav-label{white-space:nowrap}
.app-navigation .compare-dock{bottom:calc(var(--tab-space) + 12px);max-width:650px}
.app-navigation #toast{bottom:calc(var(--tab-space) + 16px)}
.app-navigation body.has-comparison #toast{bottom:calc(var(--tab-space) + 106px)}
.app-navigation body.has-comparison{padding-bottom:calc(var(--tab-space) + 100px)}
.app-navigation footer{padding-bottom:30px}
.app-navigation dialog{max-height:calc(100dvh - env(safe-area-inset-top,0px) - env(safe-area-inset-bottom,0px) - 32px)}
.installed-app .hero,.installed-app .community-band,.installed-app footer{display:none}
.installed-app .search-shell{margin-top:24px}
.installed-app #account-install{display:none}
@media(min-width:901px) and (max-width:1150px){.topnav{gap:9px}.nav-item{font-size:11px}.header-actions .text-btn{font-size:11px}.header-actions{gap:10px}.header-actions .primary{padding:11px;font-size:11px}.header-inner{gap:12px}}
@media(max-width:900px){.app-navigation .compare-dock{width:calc(100% - 24px);padding:10px 13px;gap:8px}.app-navigation .compare-mini{display:none}.app-navigation .compare-dock .primary{padding:10px 12px;font-size:11px}}
@media(pointer:coarse){.app-navigation input,.app-navigation select,.app-navigation textarea{font-size:16px!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}