/* Shared pixel navigation: the current destination has no grey tile. */
.reference-nav,.reference-nav *{box-sizing:border-box}
.reference-nav{--nav-unit:calc(min(100vw,966px)/966);position:fixed;bottom:0;left:50%;z-index:40;width:min(100%,966px);height:auto;padding-bottom:env(safe-area-inset-bottom,0px);background:#242424;color:white;border:0;border-radius:0;box-shadow:none;transform:translateX(-50%)}
.reference-nav__inner{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;gap:calc(25 * var(--nav-unit));padding:4px calc(43 * var(--nav-unit)) 0}
.reference-nav [data-nav-item]{display:flex;align-items:center;justify-content:center;justify-self:center;width:calc(146 * var(--nav-unit));aspect-ratio:1;height:calc(146 * var(--nav-unit));min-height:0;padding:calc(8 * var(--nav-unit));background:#909090;color:#fff;border:0;border-radius:0;box-shadow:none;cursor:pointer;text-decoration:none}
.reference-nav [aria-current]{background:transparent}
.reference-nav .pixel-icon{display:block;width:100%;height:100%;fill:currentColor}
.reference-nav :focus-visible{outline:2px solid white;outline-offset:-3px}
body.page-profile{padding-bottom:calc(min(100vw,966px) * 198 / 966 + env(safe-area-inset-bottom))}
.pixel-dialog{width:min(90vw,380px);padding:28px;background:#242424;color:#fff;border:2px solid #909090;border-radius:0;font:16px/1.6 var(--font-text,"Segoe UI",system-ui,sans-serif);box-shadow:none}
.pixel-dialog::backdrop{background:#0009}
.pixel-dialog h2{margin:0 0 20px;font:700 24px/1.5 var(--font-display,ConfaHubBlock,monospace)}
.pixel-dialog p{font:16px/1.5 system-ui,sans-serif}
.pixel-dialog button{min-height:44px;padding:12px 20px;background:#909090;color:white;border:0;border-radius:0;font:inherit;cursor:pointer}
.reference-drawer nav button{display:flex;align-items:center;gap:16px;min-height:52px;padding:12px;background:#3b3b3b;color:white;border:0;border-radius:0;font:700 20px/1.5 var(--font-display,ConfaHubBlock,monospace);text-align:left;cursor:pointer}
@media(min-width:1024px){
 .reference-nav{width:min(100%,1280px);height:88px;--nav-unit:.42px}
 .reference-nav__inner{grid-template-columns:repeat(5,64px);justify-content:center;max-width:590px;gap:24px;margin:auto;padding:12px 24px}
 .reference-nav [data-nav-item]{width:64px;height:64px;padding:8px}
 body.page-profile{padding-bottom:88px}
 .confahub-body.page-home .main-content{padding-bottom:88px}
}
@media(orientation:landscape) and (max-height:500px){
 .reference-nav{height:calc(64px + env(safe-area-inset-bottom,0px))}
 .reference-nav__inner{grid-template-columns:repeat(5,44px);justify-content:center;gap:clamp(12px,4vw,32px);padding:10px max(12px,env(safe-area-inset-right,0px)) 10px max(12px,env(safe-area-inset-left,0px))}
 .reference-nav [data-nav-item]{width:44px;height:44px;padding:4px}
}