/* 上部HUD共通仕様書 v1 | 仮実装
   役割：共通HUDの表示・通知・コンディションバーの見た目だけを管理。
   本番フレーム/金装飾/最終アイコンは後工程で差し替える。
*/

.top.top-dashboard{
  position:absolute!important;
  inset:0 0 auto 0!important;
  height:var(--ui-top-hud-height)!important;
  min-height:0!important;
  box-sizing:border-box!important;
  display:grid!important;
  grid-template-columns:minmax(0,.75fr) minmax(0,.9fr) minmax(0,1.55fr) minmax(0,.9fr) minmax(0,1fr) 40px!important;
  align-items:stretch!important;
  gap:0!important;
  padding:0 3px!important;
  background:rgba(7,12,17,.88)!important;
  border-bottom:1px solid rgba(229,183,100,.42)!important;
  box-shadow:0 3px 12px rgba(0,0,0,.22),inset 0 -1px 0 rgba(255,220,150,.08)!important;
  backdrop-filter:blur(4px)!important;
  -webkit-backdrop-filter:blur(4px)!important;
  z-index:500!important;
}
.top.top-dashboard::before{content:none!important}
.top.top-dashboard > *{position:relative;z-index:1}

.top-hud-cell{
  min-width:0;
  min-height:0;
  display:flex;
  align-items:center;
  gap:4px;
  padding:0 4px;
  overflow:hidden;
  white-space:nowrap;
  border-left:1px solid rgba(111,126,138,.28);
}
.top-hud-cell:first-child{border-left:0}
.top-hud-cell span{
  flex:0 0 auto;
  color:#81909d;
  font-size:clamp(7px,.52vw,9px);
  font-weight:800;
}
.top-hud-cell b{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:#edf2f5;
  font-size:clamp(8px,.62vw,11px);
  font-weight:900;
}
.top-hud-player b{color:#f1d39a}
.top-hud-gold b{color:#f0c66f}
.top-hud-location b{color:#e8edf0}
.top-hud-notification-slot{padding:0 3px}
.top-hud-notification{
  width:100%;
  height:100%;
  min-height:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:4px;
  border:1px solid rgba(229,183,100,.34);
  border-radius:4px;
  background:rgba(51,40,25,.34);
  color:#f0d19a;
  font-family:inherit;
  font-size:clamp(7px,.52vw,9px);
  font-weight:900;
  line-height:1;
  cursor:pointer;
}
.top-hud-notification[hidden]{display:none}
.top-hud-notification:hover,.top-hud-notification:focus-visible{
  border-color:rgba(229,183,100,.72);
  background:rgba(68,51,27,.58);
  outline:none;
}
.top-hud-notification-icon{color:#9fd39d;font-size:1.05em}
.top-hud-settings{
  width:100%;
  min-width:40px;
  min-height:0;
  display:grid;
  place-items:center;
  border:0;
  border-left:1px solid rgba(111,126,138,.28);
  border-radius:0;
  background:transparent;
  color:#e5c27e;
  font-family:inherit;
  font-size:16px;
  line-height:1;
  cursor:pointer;
}
.top-hud-settings:hover,.top-hud-settings:focus-visible{
  color:#ffe0a5;
  background:rgba(55,44,28,.34);
  outline:none;
}

/* 旧HUD表示要素が残っている場合も、新HUDには表示しない。 */
.top-vitals,.top-shop-pair,.top-world-pair,.top-nav-stack,.top-pair,.top-tool-stack,#battleTestBadge{display:none!important}

/* 旧フローティング探索通知は共通HUDの通知スロットへ統合。 */
#explorationIndicator{display:none!important}

/* 共通HUD直下の条件バー。通常時はDOM自体を非表示。 */
.condition-bar{
  position:absolute;
  left:0;
  right:0;
  top:var(--ui-top-hud-height);
  height:var(--ui-condition-bar-height);
  min-height:20px;
  box-sizing:border-box;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  align-items:center;
  gap:0;
  padding:1px 6px;
  background:rgba(8,13,18,.88);
  border-bottom:1px solid rgba(80,96,108,.42);
  box-shadow:0 2px 8px rgba(0,0,0,.16);
  z-index:490;
}
.condition-bar[hidden]{display:none}
.condition-item{
  min-width:0;
  height:100%;
  display:grid;
  grid-template-columns:auto auto minmax(28px,1fr);
  align-items:center;
  gap:5px;
  padding:0 8px;
  border-left:1px solid rgba(111,126,138,.22);
}
.condition-item:first-child{border-left:0}
.condition-item>span{
  font-size:clamp(7px,.52vw,9px);
  font-weight:900;
}
.condition-item>b{
  min-width:0;
  white-space:nowrap;
  font-size:clamp(8px,.58vw,10px);
  color:#e4eaed;
}
.condition-hp>span{color:#ff9fa5}
.condition-mp>span{color:#9bc9ff}
.condition-hunger>span{color:#e3c783}
.condition-track{
  min-width:28px;
  height:5px;
  display:block;
  overflow:hidden;
  border:1px solid rgba(76,91,101,.72);
  border-radius:99px;
  background:#0a1015;
}
.condition-track em{
  display:block;
  width:0;
  height:100%;
  border-radius:inherit;
  background:#78a96f;
}
.condition-hp .condition-track em{background:#b66c72}
.condition-mp .condition-track em{background:#5d88b8}
.condition-hunger .condition-track em{background:#a68a50}

@media (max-width:700px) and (orientation:landscape){
  .top.top-dashboard{grid-template-columns:minmax(0,.7fr) minmax(0,.85fr) minmax(0,1.35fr) minmax(0,.85fr) minmax(0,.9fr) 38px!important;padding:0 2px!important}
  .top-hud-cell{padding:0 3px}
  .top-hud-cell span{font-size:7px}
  .top-hud-cell b{font-size:8px}
  .top-hud-notification{font-size:7px;min-height:0}
  .top-hud-settings{min-width:28px;min-height:0;font-size:15px}
  .condition-item{grid-template-columns:auto auto minmax(24px,1fr);gap:3px;padding:0 3px}
  .condition-item>span,.condition-item>b{font-size:7px}
  .condition-track{height:4px}
}

/* v1.8.122 compact HUD
   HUD height is intentionally about half of the previous v1.8.121 height.
   Child controls must fit inside the compact bar; page start position is
   calculated by ui-layout-master.css from the same canonical height token.
*/
.top.top-dashboard{
  min-height:0!important;
  padding:0 3px!important;
}
.top-hud-cell{
  min-height:0!important;
  padding:0 4px!important;
}
.top-hud-notification{
  min-height:0!important;
  height:100%!important;
}
.top-hud-settings{
  min-height:0!important;
  min-width:28px!important;
  height:100%!important;
  font-size:16px!important;
}
