/* Compact navigation and safe areas for browser and installed app. */
:root{scroll-padding-top:100px}:root[data-theme=light]{color-scheme:light}.app-frame{width:100%;min-width:0}.app-area,.app-area main{min-width:0;max-width:100%}
.topbar{position:sticky;top:0;z-index:120;padding:calc(12px + env(safe-area-inset-top)) 22px 12px;background:var(--surface-subtle);border-bottom:1px solid var(--line);border-radius:30px 30px 0 0;box-shadow:0 4px 12px #00000006}
.masthead{gap:12px;min-height:44px}.brand{background:#fff;border-radius:12px;padding:2px 7px}.brand img{width:130px;height:44px;object-fit:contain;max-height:none}
#navigation{gap:1px}#navigation a{padding:10px 10px;font-size:12px}
#current-company{display:flex;align-items:center;gap:8px;width:270px;min-width:270px;max-width:270px;flex:0 0 270px;height:44px;min-height:44px;border-radius:22px;background:var(--surface);border:1px solid var(--line);padding:0 12px;margin:0;box-sizing:border-box}
#current-company>.icon,#current-company>span{flex:0 0 20px;width:20px;display:inline-flex;align-items:center;justify-content:center;color:var(--muted)}
#company-switch{width:100%;min-width:0;max-width:100%;height:42px;min-height:42px;border:0;background:transparent;padding:0 18px 0 0;font-size:12.5px;font-weight:550;color:var(--ink);text-overflow:ellipsis;cursor:pointer;outline:none}
.topbar #global-search{width:165px}.header-tools{gap:8px}.navigation-panel .profile{gap:4px}.navigation-panel .profile .avatar{display:none}#current-company{order:2}.masthead>.header-tools{order:3}.navigation-panel .profile{order:4}
.product-app{padding-left:calc(20px + env(safe-area-inset-left));padding-right:calc(20px + env(safe-area-inset-right));padding-bottom:calc(20px + env(safe-area-inset-bottom))}
.login-brand{background:#fff;padding:8px 12px}.login-brand img{width:210px;max-width:100%;height:auto}
.login-form-wrap{padding-bottom:calc(40px + env(safe-area-inset-bottom))}
.document-brand{background:#fff;padding:5px 8px;border-radius:12px;object-fit:contain}
dialog{max-height:calc(100dvh - 40px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
.repeat-origin{display:inline-flex;align-items:center;color:var(--muted)}.repeat-origin .icon{width:14px;height:14px}
.theme-save-error{position:fixed;bottom:max(24px,env(safe-area-inset-bottom));left:16px;right:16px;z-index:200;padding:16px;background:var(--error-bg);color:var(--error-text);border:1px solid var(--line);border-radius:16px}
@media(max-width:1320px){
  :root{scroll-padding-top:130px}
  .masthead{display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;align-items:center;gap:8px 12px}
  .masthead>.brand{grid-column:1;grid-row:1;min-width:0}
  #navigation{grid-column:2;grid-row:1}
  .masthead>.header-tools{grid-column:3;grid-row:1;margin-left:0}
  .navigation-panel .profile{grid-column:4;grid-row:1}
  #current-company{grid-column:1/-1;grid-row:2;justify-self:start;order:initial;width:min(460px,100%);min-width:0;max-width:460px;margin-top:2px}
}
@media(max-width:1100px){
  .product-app{padding-left:calc(12px + env(safe-area-inset-left));padding-right:calc(12px + env(safe-area-inset-right))}
  .topbar{padding:calc(10px + env(safe-area-inset-top)) 16px 10px;border-radius:24px 24px 0 0}
  .masthead{grid-template-columns:auto minmax(0,1fr) auto}
  .masthead>.header-tools{grid-column:3}
  #current-company{grid-column:1/-1}
  #company-switch{font-size:16px!important}
  .navigation-panel{top:calc(12px + env(safe-area-inset-top));right:calc(12px + env(safe-area-inset-right));max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom))}
  .navigation-panel #navigation a{font-size:14px;padding:14px}
  input,select,textarea,.picker-search,.picker-trigger,.line-editor input,.line-editor select,.filters input,.filters select,.login-card input,.topbar #global-query{font-size:16px!important}
}
@media(max-width:760px){.topbar #global-search{display:none}.brand img{width:110px;height:38px}.masthead{gap:8px}#current-company{max-width:100%}}
@media(max-width:640px){
  .product-app{padding:0 env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}
  .topbar{border-radius:0;padding:calc(8px + env(safe-area-inset-top)) 10px 8px}
  .brand{padding:2px 4px}.brand img{width:110px;height:38px}
  .header-tools{gap:4px;margin-left:auto}.menu-toggle{padding:10px;width:44px;justify-content:center}.menu-toggle>span:last-child{display:none}
  .masthead{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:6px;width:100%}
  .masthead>.brand{grid-column:1;grid-row:1;min-width:0}
  .masthead>.header-tools{grid-column:3;grid-row:1;margin-left:0}
  #current-company{grid-column:1/-1;grid-row:2;width:100%;min-width:0;max-width:100%;margin-top:2px;overflow:visible}
  #company-switch{padding-left:0;padding-right:18px;font-size:16px!important}
  .login-form-wrap{padding-left:calc(22px + env(safe-area-inset-left));padding-right:calc(22px + env(safe-area-inset-right))}
}
