/* v0.9.44 canonical UI system: navigation, inventory, shop, hero and item flows. */
body.theme-ashen{
  --ui-accent:#65c7b4;
  --ui-accent-strong:#86e2d0;
  --ui-accent-bg:rgba(30,94,81,.68);
  --ui-surface:rgba(17,20,19,.9);
  --ui-surface-raised:rgba(23,27,25,.95);
  --ui-tabs-surface:rgba(22,25,24,.94);
  --ui-tab-idle:rgba(35,39,37,.62);
  --ui-border:rgba(109,126,119,.42);
  --ui-border-strong:rgba(101,199,180,.72);
  --ui-radius-sm:9px;
  --ui-radius-md:13px;
  --ui-radius-lg:18px;
  --ui-gap-xs:5px;
  --ui-gap-sm:8px;
  --ui-gap-md:12px;
  --ui-control-height:40px;
  --ui-bottom-nav-height:64px;
}

body.theme-ashen .app{
  width:min(calc(100% - 24px),1180px);
  padding-bottom:calc(var(--ui-bottom-nav-height) + env(safe-area-inset-bottom) + 18px);
}

body.theme-ashen .screen-panel{
  min-width:0;
}

body.theme-ashen .content-heading{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:10px;
  min-width:0;
  margin:0 0 10px;
}
body.theme-ashen .content-heading>span{
  min-width:0;
  color:#efe8d7;
  font:800 clamp(18px,3vw,24px)/1.1 system-ui,sans-serif;
  overflow-wrap:anywhere;
}
body.theme-ashen .content-heading>small{
  flex:0 1 auto;
  color:#99a59f;
  font:700 11px/1.25 system-ui,sans-serif;
  text-align:right;
}
body.theme-ashen .inventory-content-heading .menu-count{
  color:#d8e1dc;
}
body.theme-ashen .inventory-visible-count:empty{display:none}

body.theme-ashen .section-tabs,
body.theme-ashen .hero-tabs,
body.theme-ashen .path-tabs,
body.theme-ashen .inventory-mode-tabs{
  display:grid;
  gap:4px;
  margin:0 0 12px;
  padding:4px;
  border:1px solid var(--ui-border);
  border-radius:var(--ui-radius-md);
  background:linear-gradient(180deg,var(--ui-tabs-surface),rgba(16,19,18,.96));
  box-shadow:inset 0 1px rgba(255,255,255,.025);
  overflow:visible;
}
body.theme-ashen .path-tabs,
body.theme-ashen .inventory-mode-tabs{grid-template-columns:repeat(3,minmax(0,1fr))}
body.theme-ashen .section-tab,
body.theme-ashen .hero-tab,
body.theme-ashen .path-tab-button,
body.theme-ashen .inventory-mode-tab{
  display:flex;
  align-items:center;
  justify-content:center;
  min-width:0;
  min-height:var(--ui-control-height);
  padding:8px 7px;
  border:1px solid transparent;
  border-radius:var(--ui-radius-sm);
  background:var(--ui-tab-idle);
  color:#aeb7b2;
  font:800 11px/1.1 system-ui,sans-serif;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  box-shadow:none;
}
body.theme-ashen .section-tab.active,
body.theme-ashen .hero-tab.active,
body.theme-ashen .path-tab-button.active,
body.theme-ashen .inventory-mode-tab.active{
  border-color:var(--ui-border-strong);
  background:linear-gradient(180deg,var(--ui-accent-bg),rgba(11,31,27,.9));
  color:#ecf8f4;
  box-shadow:inset 0 1px rgba(222,255,247,.1),0 0 0 1px rgba(101,199,180,.07);
}
body.theme-ashen .section-tab:focus-visible,
body.theme-ashen .inventory-category-button:focus-visible,
body.theme-ashen .nav-button:focus-visible{
  outline:2px solid var(--ui-accent-strong);
  outline-offset:2px;
}

body.theme-ashen .topbar{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:10px;
  min-width:0;
}
body.theme-ashen .title-row,
body.theme-ashen .brand-copy{min-width:0}
body.theme-ashen .brand-copy h1,
body.theme-ashen .world-tagline{
  max-width:100%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
body.theme-ashen .top-actions{
  display:grid;
  grid-template-columns:auto auto;
  grid-template-areas:"utilities summary";
  align-items:center;
  justify-content:end;
  gap:8px;
  min-width:0;
}
body.theme-ashen .top-utility-actions{
  grid-area:utilities;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:7px;
  min-width:0;
}
body.theme-ashen .client-refresh-button{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  min-height:32px;
  padding:5px 9px;
  border:1px solid rgba(103,128,119,.46);
  border-radius:999px;
  background:rgba(24,29,27,.88);
  color:#b9c6c0;
  font:800 10px/1 system-ui,sans-serif;
  box-shadow:inset 0 1px rgba(255,255,255,.025);
}
body.theme-ashen .client-refresh-button:hover{
  border-color:rgba(101,199,180,.64);
  color:#e4f4ef;
}
body.theme-ashen .client-refresh-button:focus-visible{
  outline:2px solid var(--ui-accent-strong);
  outline-offset:2px;
}
body.theme-ashen .client-refresh-button:disabled{opacity:.7;cursor:wait}
body.theme-ashen .client-refresh-button.refreshing .client-refresh-glyph{animation:client-refresh-spin .75s linear infinite}
body.theme-ashen .client-refresh-glyph{font-size:17px;line-height:1}
@keyframes client-refresh-spin{to{transform:rotate(360deg)}}
body.theme-ashen .top-summary{
  grid-area:summary;
  display:flex;
  align-items:center;
  gap:5px;
  min-width:0;
}
body.theme-ashen .top-summary>span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:5px 8px;
  border:1px solid rgba(94,111,104,.38);
  border-radius:999px;
  background:rgba(7,11,10,.7);
  white-space:nowrap;
}
body.theme-ashen .developer-toggle{
  flex:0 0 auto;
  margin:0;
}
body.theme-ashen:not(.developer-mode) .developer-toggle-label{
  max-width:0;
  opacity:0;
  overflow:hidden;
}
body.theme-ashen .developer-toggle-track{flex:0 0 auto}

body.theme-ashen .inventory-category-toolbar{
  margin:0 0 8px;
}
body.theme-ashen .inventory-category-scroll{
  display:flex;
  gap:6px;
  padding:1px 1px 5px;
  overflow-x:auto;
  scroll-snap-type:x proximity;
  scrollbar-width:none;
}
body.theme-ashen .inventory-category-scroll::-webkit-scrollbar{display:none}
body.theme-ashen .inventory-category-button{
  flex:0 0 auto;
  scroll-snap-align:start;
  min-width:auto;
  min-height:34px;
  padding:6px 10px;
  border:1px solid var(--ui-border);
  border-radius:999px;
  background:rgba(8,12,11,.68);
  color:#a8b1ad;
}
body.theme-ashen .inventory-category-button>span{display:none}
body.theme-ashen .inventory-category-button>small{
  font:800 10px/1 system-ui,sans-serif;
}
body.theme-ashen .inventory-category-button.active{
  border-color:var(--ui-border-strong);
  background:rgba(32,83,72,.72);
  color:#e8f7f2;
}
body.theme-ashen .inventory-section-heading{
  display:flex;
  align-items:center;
  gap:8px;
  min-height:36px;
  margin-bottom:6px;
}
body.theme-ashen .inventory-items-heading>span{
  font-size:15px;
}
body.theme-ashen .inventory-sort-compact{
  margin-left:auto;
}
body.theme-ashen .inventory-sort-compact select{
  min-height:32px;
  max-width:155px;
}
body.theme-ashen .inventory-workspace{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(300px,380px);
  gap:12px;
  align-items:start;
}
body.theme-ashen .inventory-list-pane{min-width:0}
body.theme-ashen .inventory-icon-grid{
  display:grid;
  grid-template-columns:repeat(6,minmax(0,1fr));
  gap:8px!important;
  min-width:0;
  margin:0;
}
body.theme-ashen .inventory-icon-cell{
  position:relative;
  aspect-ratio:1/1;
  min-width:0;
  min-height:64px;
  padding:5px;
  border-radius:11px;
  overflow:hidden;
}
body.theme-ashen .inventory-icon-cell .inventory-cell-icon,
body.theme-ashen .inventory-icon-cell .item-icon{
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
}
body.theme-ashen .inventory-icon-cell.active-item{
  outline:2px solid var(--ui-accent-strong);
  outline-offset:1px;
}
body.theme-ashen .inventory-inline-detail{
  position:sticky;
  top:8px;
  min-width:0;
  max-height:calc(100vh - 120px);
  overflow:auto;
  border-radius:var(--ui-radius-lg);
}
body.theme-ashen .inventory-rune-manage{
  width:100%;
  margin-top:8px;
  min-height:38px;
}
body.theme-ashen .inventory-sale-toolbar{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:8px;
  padding:8px;
  border:1px solid var(--ui-border);
  border-radius:var(--ui-radius-md);
  background:rgba(11,16,14,.72);
}
body.theme-ashen .equipment-slot-lock{
  display:grid;
  place-items:center;
  font-size:24px;
}

body.theme-ashen .bottom-nav{
  min-height:var(--ui-bottom-nav-height);
  padding:6px max(8px,env(safe-area-inset-left)) calc(6px + env(safe-area-inset-bottom)) max(8px,env(safe-area-inset-right));
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:4px;
}
body.theme-ashen .nav-button{
  position:relative;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:2px;
  min-width:0;
  min-height:48px;
  padding:4px 2px;
  border:1px solid transparent;
  border-radius:11px;
  font-size:10px;
}
body.theme-ashen .nav-button.active{
  border-color:rgba(101,199,180,.38);
  background:rgba(31,83,72,.45);
  color:#ecf8f4;
}
body.theme-ashen .nav-button.active::after{
  content:"";
  position:absolute;
  left:28%;
  right:28%;
  bottom:2px;
  height:2px;
  border-radius:999px;
  background:var(--ui-accent-strong);
}
body.theme-ashen .nav-glyph{
  min-height:21px;
  font-size:18px;
  line-height:21px;
}

@media(max-width:767px){
  body.theme-ashen .app{width:min(calc(100% - 12px),720px)}
  body.theme-ashen .inventory-workspace{display:block}
  body.theme-ashen .inventory-inline-detail{
    position:fixed;
    z-index:2400;
    left:6px;
    right:6px;
    bottom:calc(var(--ui-bottom-nav-height) + env(safe-area-inset-bottom) + 6px);
    top:auto;
    max-height:min(76vh,720px);
    padding:0;
    border:1px solid var(--ui-border-strong);
    border-radius:18px 18px 12px 12px;
    background:#0c1110;
    box-shadow:0 -18px 50px rgba(0,0,0,.55);
    transform:translateY(calc(100% + 100px));
    opacity:0;
    pointer-events:none;
    transition:transform .2s ease,opacity .2s ease;
  }
  body.theme-ashen .inventory-inline-detail.is-open{
    transform:translateY(0);
    opacity:1;
    pointer-events:auto;
  }
  body.theme-ashen .inventory-detail-card{
    max-height:min(76vh,720px);
    overflow:auto;
    border-radius:inherit;
  }
  body.theme-ashen .inventory-detail-main{
    grid-template-columns:84px minmax(0,1fr);
  }
  body.theme-ashen .inventory-equip-comparison,
  body.theme-ashen .inventory-detail-runes{
    grid-column:1/-1;
  }
}

@media(max-width:720px){
  body.theme-ashen .top-actions{
    grid-template-columns:auto;
    grid-template-areas:"summary" "utilities";
    justify-items:end;
    gap:5px;
  }
}

@media(max-width:479px){
  body.theme-ashen .inventory-icon-grid{grid-template-columns:repeat(5,minmax(0,1fr));gap:6px!important}
  body.theme-ashen .section-tab,
body.theme-ashen .hero-tab,
body.theme-ashen .path-tab-button,
body.theme-ashen .inventory-mode-tab{
    min-height:38px;
    padding:7px 3px;
    font-size:9px;
  }
  body.theme-ashen .content-heading>small{font-size:9.5px}
  body.theme-ashen .topbar{gap:6px}
  body.theme-ashen .version{display:none}
  body.theme-ashen .top-summary>span{padding:4px 6px;font-size:10px}
  body.theme-ashen .developer-toggle{transform:scale(.88);transform-origin:right center}
  body.theme-ashen .inventory-section-heading{flex-wrap:wrap}
  body.theme-ashen .inventory-sort-compact{width:100%;margin-left:0}
  body.theme-ashen .inventory-sort-compact select{width:100%;max-width:none}
}

@media(max-width:359px){
  body.theme-ashen .inventory-icon-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:6px!important}
  body.theme-ashen .world-tagline{display:none}
  body.theme-ashen .client-refresh-label{display:none}
  body.theme-ashen .client-refresh-button{width:32px;padding:5px}
  body.theme-ashen .brand-copy h1{font-size:20px}
  body.theme-ashen .top-summary .gold{max-width:86px;overflow:hidden;text-overflow:ellipsis}
  body.theme-ashen .section-tab,
body.theme-ashen .hero-tab,
body.theme-ashen .path-tab-button,
body.theme-ashen .inventory-mode-tab{font-size:8px;letter-spacing:-.02em}
}

@media(min-width:480px) and (max-width:767px){
  body.theme-ashen .inventory-icon-grid{grid-template-columns:repeat(6,minmax(0,1fr))}
}

@media(min-width:768px){
  body.theme-ashen.screen-inventory-active .screen-panel,
body.theme-ashen.screen-hero-active .screen-panel,
body.theme-ashen.screen-map-active .screen-panel{
    padding:16px;
  }
  body.theme-ashen .inventory-icon-cell{min-height:72px}
}