.inventory-header-location,.inventory-header-brandmark,.inventory-header-actions {display:none}

/* Inventory has an open header; the existing bound workspace pickers remain
   in their own row, and the phone's context dialog keeps its separate layout. */
@media screen and (min-width:721px) {
  html[data-theme] body:has(#content .inventory-page)>#header.site-header {
    position:relative;top:auto;display:grid;grid-template-columns:auto minmax(0,1fr) auto auto;
    align-items:center;gap:10px 16px;min-height:0;padding:0;border:0;
    border-radius:0;background:transparent;color:var(--erp-ink);box-shadow:none;
    backdrop-filter:none;-webkit-backdrop-filter:none;
  }
  html[data-theme] body:has(#content .inventory-page)>#header>.brand {display:flex;grid-column:1;grid-row:1;min-width:0}
  html[data-theme] body:has(#content .inventory-page)>#header .brand-logo {width:126px;height:36px}
  html[data-theme] body:has(#content .inventory-page)>#header .inventory-header-location {display:flex;align-items:center;gap:10px;grid-column:2;grid-row:1;min-width:0;font-size:15px;line-height:1.4}
  html[data-theme] body:has(#content .inventory-page)>#header .inventory-header-location>h1 {margin:0;padding:0;font:inherit;letter-spacing:inherit}
  html[data-theme] body:has(#content .inventory-page)>#header .inventory-header-back {display:grid;place-items:center;flex:none;width:44px;height:44px;border:0;border-radius:50%;background:transparent;color:var(--erp-muted);text-decoration:none}
  html[data-theme] body:has(#content .inventory-page)>#header .inventory-header-back svg {width:20px;height:20px}
  html[data-theme] body:has(#content .inventory-page)>#header .identity {display:contents;margin:0}
  html[data-theme] body:has(#content .inventory-page)>#header :is(.mobile-character-profile,.mobile-settings-action) {display:none}
  html[data-theme] body:has(#content .inventory-page)>#header .desktop-header-actions {display:flex;align-items:center;grid-column:3;grid-row:1;gap:6px;margin:0}
  html[data-theme] body:has(#content .inventory-page)>#header :is(.desktop-quick-action,.desktop-profile) {display:grid;place-items:center;width:44px;height:44px;min-width:44px;min-height:44px;margin:0;padding:0;border:1px solid var(--erp-line);border-radius:50%;background:transparent;color:var(--erp-ink);box-shadow:none;transform:none}
  html[data-theme] body:has(#content .inventory-page)>#header .desktop-quick-action>svg {width:19px;height:19px}
  html[data-theme] body:has(#content .inventory-page)>#header .desktop-profile {grid-column:4;grid-row:1;padding:3px}
  html[data-theme] body:has(#content .inventory-page)>#header .desktop-profile-avatar {width:36px;height:36px;font-size:12px}
  html[data-theme] body:has(#content .inventory-page)>#header .desktop-profile-copy {display:none}
  html[data-theme] body:has(#content .inventory-page)>#header .warehouse-context {display:grid;grid-column:1/-1;grid-row:2;grid-template-columns:repeat(2,minmax(0,1fr));align-items:start;gap:10px;width:min(520px,100%);max-width:100%;min-width:0;margin:0;padding:0}
  html[data-theme] body:has(#content .inventory-page)>#header .warehouse-context.is-simple {grid-template-columns:repeat(2,minmax(0,1fr));width:min(520px,calc(100% - 172px))}
  html[data-theme] body:has(#content .inventory-page)>#header :is(.warehouse-group-control,.warehouse-control,.cabinet-context-slot,.cabinet-control) {grid-column:auto;min-width:0;width:100%;max-width:none;margin:0}
  html[data-theme] body:has(#content .inventory-page)>#header .context-field-label {position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
  html[data-theme] body:has(#content .inventory-page)>#header .warehouse-context .unit-trigger {width:100%;min-height:44px;padding:8px 12px;gap:8px;border:1px solid var(--erp-line);border-radius:999px;background:var(--erp-surface);color:var(--erp-ink);font-size:13px;line-height:1.4;box-shadow:none}
  html[data-theme] body:has(#content .inventory-page)>#header .warehouse-context .unit-value {min-width:0;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  html[data-theme] body:has(#content .inventory-page)>#header .warehouse-context :is(.warehouse-trigger-icon,.unit-chevron) {display:block;flex:none;width:17px;height:17px;color:var(--erp-muted)}
  html[data-theme] body:has(#content .inventory-page)>#header .cabinet-context-links {position:absolute;left:calc(100% + 12px);top:0;display:flex;align-items:center;justify-content:flex-start;flex-wrap:nowrap;gap:12px;width:160px;margin:0;padding:0}
  html[data-theme] body:has(#content .inventory-page)>#header .cabinet-context-links a {display:flex;align-items:center;min-height:44px;font-size:12px;line-height:1.4;white-space:nowrap;color:var(--erp-muted)}
  html[data-theme] body:has(#content .inventory-page)>#header :is(.desktop-quick-action,.desktop-profile,.inventory-header-back):hover {background:var(--erp-soft);color:var(--erp-ink)}
  html[data-theme] body:has(#content .inventory-page)>#header :is(button,a):focus-visible {outline:2px solid var(--erp-focus);outline-offset:3px}
}

@media screen and (min-width:1180px) {
  html[data-theme] body:has(#content .inventory-page)>#header.site-header {
    grid-template-columns:clamp(76px,6.4vw,112px) minmax(160px,1fr) auto auto 44px;gap:12px;min-height:60px;padding:8px 0;margin-bottom:20px;
  }
  html[data-theme] body:has(#content .inventory-page)>#header>.brand {justify-self:start}
  html[data-theme] body:has(#content .inventory-page)>#header .brand-logo {display:none}
  html[data-theme] body:has(#content .inventory-page)>#header .inventory-header-brandmark {display:block;width:32px;height:32px}
  html[data-theme] body:has(#content .inventory-page)>#header .inventory-header-back {background:color-mix(in srgb,var(--erp-soft) 80%,transparent);border:0}
  html[data-theme] body:has(#content .inventory-page)>#header .inventory-header-actions {display:flex;align-items:center;grid-column:3;grid-row:1;min-width:0}
  html[data-theme] body:has(#content .inventory-page)>#header .inventory-header-actions:empty {display:none}
  html[data-theme] body:has(#content .inventory-page)>#header .inventory-primary-actions {display:flex;align-items:center;gap:2px;min-width:0;margin:0}
  html[data-theme] body:has(#content .inventory-page)>#header .inventory-primary-actions :is(.button,.invoice-import-action,#warehouse-manage) {
    display:inline-flex;align-items:center;justify-content:center;gap:7px;height:44px;min-height:44px;margin:0;padding:10px 14px;border:0;border-radius:15px;
    background:color-mix(in srgb,var(--erp-soft) 80%,transparent);color:var(--erp-ink);font-size:12px;font-weight:500;line-height:1.4;text-decoration:none;box-shadow:none;white-space:nowrap;
  }
  html[data-theme] body:has(#content .inventory-page)>#header .inventory-primary-actions :is(.button,.invoice-import-action,#warehouse-manage):hover {background:var(--erp-soft)}
  html[data-theme] body:has(#content .inventory-page)>#header .inventory-primary-actions :is(.button,.invoice-import-action,#warehouse-manage)>svg {flex:none;width:16px;height:16px}
  html[data-theme] body:has(#content .inventory-page)>#header .inventory-primary-actions #warehouse-manage {width:44px;min-width:44px;padding:0}
  html[data-theme] body:has(#content .inventory-page)>#header .desktop-header-actions {grid-column:4;gap:6px}
  html[data-theme] body:has(#content .inventory-page)>#header .desktop-profile {grid-column:5}
  html[data-theme] body:has(#content .inventory-page)>#header .desktop-quick-action {border:0;background:color-mix(in srgb,var(--erp-soft) 80%,transparent)}

  /* The one live set of workspace selectors reads as metadata beside the total. */
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] {align-self:last baseline}
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .warehouse-context {
    display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:last baseline;gap:18px;width:100%;max-width:none;min-width:0;margin:0;padding:0;
  }
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .warehouse-context.is-simple {grid-template-columns:repeat(2,minmax(0,1fr))}
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] :is(.warehouse-group-control,.warehouse-control,.cabinet-context-slot,.cabinet-control) {
    position:relative;grid-column:auto;min-width:0;width:100%;max-width:none;margin:0;
  }
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .context-field-label {
    position:absolute;top:8px;left:52px;right:23px;z-index:1;display:block;width:auto;height:20px;clip-path:none;overflow:hidden;margin:0;padding:0;
    color:var(--erp-muted);font-size:13px;font-weight:400;line-height:20px;letter-spacing:0;white-space:nowrap;text-overflow:ellipsis;pointer-events:none;
  }
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .warehouse-context .unit-trigger {
    display:grid;grid-template-columns:40px minmax(0,1fr) 16px;grid-template-rows:20px 28px;align-items:center;column-gap:12px;row-gap:0;width:100%;min-width:0;min-height:65px;padding:8px 0 9px;border:0;border-radius:14px;
    background:transparent;color:var(--erp-ink);font-size:16px;font-weight:400;line-height:1.4;box-shadow:none;
  }
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .warehouse-context .unit-trigger:hover {background:var(--erp-soft)}
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .unit-value {grid-column:2;grid-row:2;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .warehouse-trigger-icon {
    display:grid;grid-column:1;grid-row:1/3;place-items:center;width:40px;height:40px;border:1px solid var(--erp-line);border-radius:50%;color:var(--erp-muted);
  }
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .warehouse-trigger-icon>svg {width:20px;height:20px}
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .unit-chevron {grid-column:3;grid-row:1/3;width:16px;height:16px;color:var(--erp-muted)}
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .cabinet-context-links {
    position:absolute;top:calc(100% + 2px);left:52px;right:0;display:flex;justify-content:flex-start;flex-wrap:wrap;gap:0 10px;width:auto;margin:0;padding:0;
  }
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .cabinet-context-links a {display:inline-flex;align-items:center;min-height:24px;color:var(--erp-muted);font-size:13px;line-height:1.4;white-space:nowrap}
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .cabinet-control:has(.cabinet-context-status:not([hidden])) .cabinet-context-links {position:static;margin-left:52px}
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .cabinet-context-status {padding:6px 0 0 52px;color:var(--erp-muted);font-size:13px;line-height:1.4}
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] .unit-menu {z-index:30;min-width:min(260px,calc(100vw - 48px));max-width:min(360px,calc(100vw - 48px));color:var(--erp-ink);background:var(--erp-raised)}
  html[data-theme] #content .inventory-page .inventory-hero-context[data-inventory-context-host] :is(a,button):focus-visible {outline:2px solid var(--erp-focus);outline-offset:2px}
}

/* A narrow desktop directory leaves less room for the inventory actions. */
@media screen and (min-width:1180px) and (max-width:1350px) {
  html[data-theme] body.directory-open:has(#content .inventory-page)>#header.site-header {
    grid-template-columns:44px minmax(140px,1fr) auto auto 44px;gap:8px;
  }
  html[data-theme] body.directory-open #content .inventory-page .inventory-value-amount>strong {font-size:56px;letter-spacing:-2px}
  html[data-theme] body.directory-open #content .inventory-page .inventory-value-fraction {font-size:32px;letter-spacing:-1px}
  html[data-theme] body.directory-open #content .inventory-page .inventory-value-currency {font-size:24px}
  html[data-theme] body.directory-open #content .inventory-page .inventory-value-emblem {width:56px;height:56px;margin-right:12px}
  html[data-theme] body.directory-open #content .inventory-page .inventory-hero-body {gap:20px}
}

/* Mobile navigation follows the supplied video: five quiet icon slots and
   one dark sliding capsule containing only its label and green status dot. */
@media screen and (max-width:1179px) {
  html:root,html[data-theme="dark"] {--nav-clearance:104px}

  html[data-theme] #navigation.bottom-nav {
    --dock-size:54px;
    --dock-cell:100%;
    --dock-gap:0px;
    --dock-bottom-gap:max(20px,env(safe-area-inset-bottom,0px));
    --dock-surface:#f3f3f0f5;
    --dock-ink:#858782;
    --dock-active:#171717;
    --dock-active-ink:#fff;
    display:grid;
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:0;
    width:calc(100% - 40px);
    max-width:480px;
    height:64px;
    min-height:64px;
    padding:4px;
    border:1px solid #dcded8;
    border-radius:999px;
    background:var(--dock-surface);
    box-shadow:0 3px 14px #181b180a;
    backdrop-filter:blur(10px);
    -webkit-backdrop-filter:blur(10px);
  }
  html[data-theme="dark"] #navigation.bottom-nav {
    --dock-surface:#2a2a2af5;
    --dock-ink:#929292;
    --dock-active:#171717;
    --dock-active-ink:#fff;
    border-color:#202020;
    box-shadow:0 3px 14px #00000010;
  }
  html[data-theme] #navigation .nav-side {display:contents}
  html[data-theme] #navigation .nav-more {min-width:0;width:100%}
  html[data-theme] #navigation .nav-item,
  html[data-theme] #navigation .nav-item.active {
    width:100%;
    min-width:44px;
    height:54px;
    min-height:54px;
    padding:0;
    gap:0;
    border-radius:999px;
    color:var(--dock-ink);
    -webkit-tap-highlight-color:transparent;
  }
  html[data-theme] #navigation .nav-surface {display:none}
  html[data-theme] #navigation .nav-highlight {
    border:0;
    border-radius:999px;
    background:var(--dock-active);
    box-shadow:none;
    transition:none;
  }
  html[data-theme] #navigation .nav-item .nav-icon,
  html[data-theme] #navigation .nav-more[open]>summary .nav-icon {
    width:22px;
    height:22px;
    border:0;
    border-radius:0;
    background:transparent;
    color:var(--dock-ink);
    box-shadow:none;
    opacity:1;
    transform:none;
    transition:opacity 110ms ease;
  }
  html[data-theme] #navigation .nav-icon svg {
    width:22px;
    height:22px;
    stroke-width:1.65;
    transform:none;
  }
  html[data-theme] #navigation .nav-item.active:not([data-nav-selected]) .nav-icon {
    color:var(--dock-ink);
  }
  html[data-theme] #navigation .nav-item .nav-label {
    position:absolute;
    inset:17px 0 auto;
    display:block;
    width:100%;
    max-width:none;
    margin:0;
    padding:0;
    border:0;
    border-radius:0;
    background:transparent;
    color:var(--dock-active-ink);
    font-size:10.5px;
    font-weight:500;
    line-height:14px;
    letter-spacing:0;
    white-space:nowrap;
    box-shadow:none;
    opacity:0;
    transform:none;
    animation:none;
    transition:opacity 80ms ease;
    pointer-events:none;
  }
  html[data-theme] #navigation .nav-item::after {
    content:"";
    position:absolute;
    top:35px;
    left:calc(50% - 1.5px);
    width:3px;
    height:3px;
    border-radius:50%;
    background:#1ed449;
    opacity:0;
    transition:opacity 80ms ease;
    pointer-events:none;
  }
  html[data-theme] #navigation .nav-item[data-nav-selected] .nav-icon,
  html[data-theme] #navigation .nav-more[open]>summary[data-nav-selected] .nav-icon {opacity:0}
  html[data-theme] #navigation .nav-item[data-nav-selected] .nav-label,
  html[data-theme] #navigation .nav-item[data-nav-selected]::after {
    opacity:1;
    transition:opacity 100ms ease 90ms;
  }
  html[data-theme] #navigation .nav-more-panel {
    right:-3px;
    bottom:calc(100% + 16px);
    max-width:calc(100vw - 40px);
    max-height:calc(var(--dock-viewport-height,100dvh) - var(--dock-bottom-gap) - 94px);
  }
  html[data-theme] #navigation .nav-theme-toggle {color:var(--erp-ink)}
  html[data-theme] #navigation .nav-theme-toggle :is(svg,.theme-toggle-label,.theme-toggle-title) {color:inherit}
  html[data-theme] #navigation .nav-theme-toggle .theme-toggle-status {color:var(--erp-muted)}
  html[data-theme] #navigation .nav-item:focus-visible {
    outline:2px solid var(--erp-focus);
    outline-offset:-1px;
  }
}

@media screen and (max-width:1179px) and (prefers-reduced-motion:reduce) {
  html[data-theme] #navigation :is(.nav-icon,.nav-label),
  html[data-theme] #navigation .nav-item .nav-icon,
  html[data-theme] #navigation .nav-more[open]>summary .nav-icon,
  html[data-theme] #navigation .nav-item .nav-label,
  html[data-theme] #navigation .nav-item[data-nav-selected] .nav-label,
  html[data-theme] #navigation .nav-item::after,
  html[data-theme] #navigation .nav-item[data-nav-selected]::after {transition:none}
}

@media screen and (max-width:1179px) and (forced-colors:active) {
  html[data-theme] #navigation.bottom-nav {border-color:ButtonText;background:Canvas}
  html[data-theme] #navigation .nav-highlight {background:Highlight;forced-color-adjust:none}
  html[data-theme] #navigation .nav-item .nav-label {color:HighlightText;forced-color-adjust:none}
  html[data-theme] #navigation .nav-item[data-nav-selected]::after {background:HighlightText;forced-color-adjust:none}
  html[data-theme] #navigation .nav-item .nav-icon {color:ButtonText}
}