/* Mizan platform navigation — visual values are owned by central tokens. */
#theme-toggle.theme-toggle{
  position:absolute;top:var(--mizan-header-tools-offset);left:var(--mizan-header-tools-offset);right:auto;z-index:9000;
  width:var(--mizan-header-control-size);height:var(--mizan-header-control-size);margin:0;
  box-shadow:none;
}
#platform-menu-trigger.platform-menu-trigger{
  position:absolute;top:var(--mizan-header-tools-offset);right:var(--mizan-header-tools-offset);left:auto;z-index:9000;
  width:var(--mizan-header-control-size);height:var(--mizan-header-control-size);margin:0;
  box-shadow:none;
}
#firebase-admin-tab.firebase-admin-tab{
  position:absolute;top:var(--mizan-header-tools-offset);left:calc(var(--mizan-header-tools-offset) + var(--mizan-header-control-size) + var(--mizan-space-2));right:auto;z-index:9000;
  width:var(--mizan-header-control-size);height:var(--mizan-header-control-size);min-width:0;padding:0;
  display:flex;align-items:center;justify-content:center;gap:0;border-radius:var(--mizan-radius-compact);
  box-shadow:none;
}
#firebase-admin-tab.firebase-admin-tab span{display:none}
#firebase-admin-tab.firebase-admin-tab[hidden]{display:none}
.platform-menu-trigger:hover{border-color:var(--mizan-menu-button-border-hover);transform:translateY(-1px)}
.platform-sidebar{position:fixed;inset:0;z-index:12000;pointer-events:none;visibility:hidden}
.platform-sidebar.is-open{pointer-events:auto;visibility:visible}
.platform-sidebar-backdrop{position:absolute;inset:0;background:var(--mizan-sidebar-backdrop);opacity:0;transition:opacity var(--mizan-sidebar-backdrop-duration) ease;backdrop-filter:blur(var(--mizan-blur-backdrop))}
.platform-sidebar.is-open .platform-sidebar-backdrop{opacity:1}
.platform-sidebar-panel{
  position:absolute;top:0;right:0;width:min(var(--mizan-sidebar-panel-width),var(--mizan-sidebar-panel-viewport-cap));height:100%;overflow-y:auto;
  background:var(--mizan-sidebar-panel-bg);border-left:1px solid var(--mizan-sidebar-panel-border);box-shadow:var(--mizan-sidebar-panel-shadow);
  transform:translateX(var(--mizan-sidebar-hidden-offset));transition:transform var(--mizan-sidebar-panel-duration) var(--mizan-ease-standard);padding:var(--mizan-sidebar-panel-padding);
}
.platform-sidebar.is-open .platform-sidebar-panel{transform:translateX(0)}
.platform-sidebar-close{
  position:absolute;top:var(--mizan-sidebar-close-offset);left:var(--mizan-sidebar-close-offset);width:var(--mizan-sidebar-close-size);height:var(--mizan-sidebar-close-size);border:1px solid var(--mizan-sidebar-close-border);
  border-radius:var(--mizan-radius-11);background:var(--mizan-sidebar-close-bg);color:var(--mizan-sidebar-close-fg);cursor:pointer;
}
.platform-sidebar-brand{padding:var(--mizan-sidebar-brand-padding);border-bottom:1px solid var(--mizan-sidebar-brand-border);margin-bottom:var(--mizan-sidebar-brand-margin)}
.platform-sidebar-brand strong{display:block;font-size:var(--mizan-sidebar-brand-title-size);color:var(--mizan-heading)}
.platform-sidebar-brand span{display:block;font-size:var(--mizan-sidebar-caption-size);margin-top:var(--mizan-sidebar-caption-offset);line-height:var(--mizan-sidebar-caption-line-height);color:var(--mizan-muted)}
.platform-sidebar-heading{color:var(--mizan-accent-text);font-size:var(--mizan-sidebar-heading-size);font-weight:900;margin:var(--mizan-sidebar-heading-margin)}
.platform-sidebar-nav{display:grid;gap:var(--mizan-sidebar-item-gap)}
.platform-sidebar-item{
  width:100%;display:flex;align-items:center;gap:var(--mizan-sidebar-item-icon-gap);text-align:right;padding:var(--mizan-sidebar-item-padding);
  border:1px solid transparent;border-radius:var(--mizan-radius-compact);background:transparent;color:var(--mizan-text);
  font:inherit;font-size:var(--mizan-sidebar-item-font-size);font-weight:700;cursor:pointer;transition:all var(--mizan-duration-regular) var(--mizan-ease-standard);
}
.platform-sidebar-item i{width:var(--mizan-sidebar-item-icon-width);text-align:center;font-size:var(--mizan-sidebar-item-icon-size);color:var(--mizan-accent-text)}
.platform-sidebar-item:hover,.platform-sidebar-item.is-active{
  background:var(--mizan-sidebar-item-active-bg);border-color:var(--mizan-sidebar-item-active-border);color:var(--mizan-sidebar-item-active-fg);
}
.platform-sidebar-item:hover i,.platform-sidebar-item.is-active i{color:var(--mizan-sidebar-item-active-fg)}
.platform-sidebar-sub{display:grid;gap:var(--mizan-sidebar-sub-gap);margin-right:var(--mizan-sidebar-sub-indent);padding-right:var(--mizan-sidebar-sub-padding);border-right:1px solid var(--mizan-sidebar-sub-border)}
.platform-sidebar-sub .platform-sidebar-item{font-size:var(--mizan-sidebar-sub-font-size);padding:var(--mizan-sidebar-sub-item-padding)}
.platform-sidebar-divider{height:1px;background:var(--mizan-sidebar-divider);margin:var(--mizan-sidebar-divider-margin)}
.platform-sidebar-account{
  display:grid;gap:var(--mizan-sidebar-account-gap);margin-top:var(--mizan-sidebar-account-offset);padding:var(--mizan-sidebar-account-padding);border:1px solid var(--mizan-sidebar-account-border);
  border-radius:var(--mizan-radius-md);background:var(--mizan-sidebar-account-bg);box-shadow:var(--mizan-sidebar-account-shadow);
}
.platform-sidebar-account-user{display:flex;align-items:center;gap:var(--mizan-sidebar-account-user-gap);margin-bottom:var(--mizan-sidebar-account-user-margin);min-width:0}
.platform-sidebar-account-avatar{
  width:var(--mizan-sidebar-avatar-size);height:var(--mizan-sidebar-avatar-size);flex:0 0 var(--mizan-sidebar-avatar-size);display:grid;place-items:center;border-radius:50%;
  background:var(--mizan-sidebar-avatar-bg);color:var(--mizan-white);font-weight:900;
}
.platform-sidebar-account-user>div:last-child{min-width:0}
.platform-sidebar-account-user strong,.platform-sidebar-account-user span{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.platform-sidebar-account-user strong{font-size:var(--mizan-sidebar-account-name-size);color:var(--mizan-heading)}
.platform-sidebar-account-user span{font-size:var(--mizan-sidebar-account-meta-size);color:var(--mizan-muted);margin-top:var(--mizan-sidebar-account-meta-offset)}
.platform-sidebar-account-action{
  width:100%;display:flex;align-items:center;justify-content:center;gap:var(--mizan-sidebar-action-gap);padding:var(--mizan-sidebar-action-padding);
  border:1px solid var(--mizan-sidebar-action-border);border-radius:var(--mizan-radius-sm);
  background:var(--mizan-sidebar-action-bg);color:var(--mizan-sidebar-action-fg);font:inherit;font-size:var(--mizan-sidebar-action-font-size);font-weight:800;
  cursor:pointer;transition:all var(--mizan-duration-regular) var(--mizan-ease-standard);
}
.platform-sidebar-account-action:hover{background:var(--mizan-sidebar-action-bg-hover);color:var(--mizan-sidebar-action-fg-hover);border-color:var(--mizan-sidebar-action-border-hover)}
.platform-sidebar-account-action[hidden]{display:none}
.platform-sidebar-item[hidden]{display:none}

/* Header action icons use the existing central button tokens. */
#platform-menu-trigger.platform-menu-trigger{
  display:grid;place-items:center;border:1px solid var(--mizan-menu-button-border);border-radius:var(--mizan-radius-compact);
  background:var(--mizan-menu-button-bg);color:var(--mizan-menu-button-fg);box-shadow:none;
  font-size:var(--mizan-font-size-lg);transition:var(--mizan-transition-color),var(--mizan-transition-elevation);
}
#platform-menu-trigger.platform-menu-trigger:hover{
  background:var(--mizan-menu-button-bg-hover);border-color:var(--mizan-menu-button-border-hover);
  color:var(--mizan-menu-button-fg-hover);box-shadow:none;
}
#theme-toggle.theme-toggle{
  display:grid;place-items:center;border:1px solid var(--mizan-menu-button-border);border-radius:var(--mizan-radius-compact);
  background:var(--mizan-menu-button-bg);color:var(--mizan-menu-button-fg);box-shadow:none;
  font-size:var(--mizan-font-size-lg);transition:var(--mizan-transition-color),var(--mizan-transition-elevation);
}
#theme-toggle.theme-toggle:hover{
  background:var(--mizan-menu-button-bg-hover);border-color:var(--mizan-menu-button-border-hover);
  color:var(--mizan-menu-button-fg-hover);box-shadow:none;
}

/* App installation prompt */
.install-slot{display:flex;justify-content:flex-end;align-items:center;gap:var(--mizan-space-2);width:100%;margin:0 0 var(--mizan-install-slot-bottom-margin);padding:0 var(--mizan-install-slot-horizontal-padding);position:relative;z-index:2}
#install-app-btn{
  position:relative;left:auto;right:auto;bottom:auto;z-index:2;display:inline-flex;align-items:center;justify-content:center;gap:var(--mizan-install-button-gap);
  margin:0;padding:var(--mizan-install-button-padding);border:1px solid var(--mizan-install-button-border);border-radius:var(--mizan-radius-11);
  background:var(--mizan-install-button-bg);color:var(--mizan-install-button-fg);box-shadow:var(--mizan-install-button-shadow);
  font:inherit;font-size:var(--mizan-install-button-font-size);font-weight:800;line-height:var(--mizan-install-button-line-height);white-space:nowrap;cursor:pointer;backdrop-filter:blur(var(--mizan-blur-install));-webkit-backdrop-filter:blur(var(--mizan-blur-install));
  transition:transform var(--mizan-duration-regular) ease,border-color var(--mizan-duration-regular) ease;
}
#install-app-btn:hover{transform:translateY(-1px);border-color:var(--mizan-install-button-border-hover)}
#ios-install-hint{
  position:absolute;top:calc(100% + var(--mizan-install-hint-offset));right:0;z-index:3;max-width:min(var(--mizan-install-hint-max-width),calc(100vw - var(--mizan-install-hint-viewport-gap)));margin:0;padding:var(--mizan-install-hint-padding);
  border:1px solid var(--mizan-install-hint-border);border-radius:var(--mizan-radius-11);background:var(--mizan-install-hint-bg);
  color:var(--mizan-install-hint-fg);box-shadow:var(--mizan-install-hint-shadow);font-size:var(--mizan-install-hint-font-size);line-height:var(--mizan-install-hint-line-height);
  backdrop-filter:blur(var(--mizan-blur-hint));-webkit-backdrop-filter:blur(var(--mizan-blur-hint));
}
#ios-install-hint strong{color:var(--mizan-install-hint-heading)}
body.platform-sidebar-open{overflow:hidden}
@media(max-width:600px){
  .platform-sidebar-panel{width:min(var(--mizan-sidebar-panel-width-mobile),var(--mizan-sidebar-panel-viewport-cap-mobile))}
  .install-slot{justify-content:flex-start;margin-bottom:var(--mizan-install-slot-bottom-margin-mobile);padding:0}
  #install-app-btn{padding:var(--mizan-install-button-padding-mobile);font-size:var(--mizan-install-button-font-size-mobile)}
  #ios-install-hint{right:auto;left:0;max-width:calc(100vw - var(--mizan-install-hint-viewport-gap))}
}


/* Compact mobile quick navigation; desktop continues to use the full sidebar. */
.platform-mobile-nav{
  display:none;
}
@media(max-width:680px){
  body.platform-mobile-nav-enabled{
    padding-bottom:calc(var(--mizan-mobile-nav-safe-space) + env(safe-area-inset-bottom,0px));
  }
  .platform-mobile-nav{
    position:fixed;
    inset-inline:var(--mizan-space-3);
    bottom:calc(var(--mizan-space-2) + env(safe-area-inset-bottom,0px));
    z-index:9500;
    display:grid;
    grid-template-columns:repeat(4,minmax(0,1fr));
    gap:var(--mizan-space-1);
    padding:var(--mizan-space-1);
    border:1px solid var(--mizan-mobile-nav-border);
    border-radius:var(--mizan-radius-xl);
    background:var(--mizan-mobile-nav-bg);
    box-shadow:var(--mizan-mobile-nav-shadow);
    backdrop-filter:blur(var(--mizan-blur-mobile-nav));
    -webkit-backdrop-filter:blur(var(--mizan-blur-mobile-nav));
  }
  .platform-mobile-nav-item{
    display:flex;
    min-width:0;
    min-height:var(--mizan-mobile-nav-min-height);
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:var(--mizan-space-1);
    padding:var(--mizan-space-2) var(--mizan-space-1);
    border:1px solid transparent;
    border-radius:var(--mizan-radius-md);
    background:transparent;
    color:var(--mizan-mobile-nav-text);
    font:inherit;
    font-size:var(--mizan-font-size-2xs);
    font-weight:700;
    line-height:1.2;
    cursor:pointer;
    transition:var(--mizan-transition-color),var(--mizan-transition-elevation);
    -webkit-tap-highlight-color:transparent;
  }
  .platform-mobile-nav-item i{
    font-size:var(--mizan-font-size-md);
    line-height:1;
  }
  .platform-mobile-nav-item.is-active{
    border-color:var(--mizan-mobile-nav-border);
    background:var(--mizan-mobile-nav-active-bg);
    color:var(--mizan-mobile-nav-active-text);
  }
  .platform-mobile-nav-item:active{
    transform:scale(.97);
  }
}
@media(prefers-reduced-motion:reduce){
  .platform-mobile-nav-item{transition:none}
  .platform-mobile-nav-item:active{transform:none}
}
