@import url('./royal-blue-theme-core.css?v=10');
@import url('./engagement-layout.css?v=1');
@import url('./mobile-spacing-v4.css?v=1');
@import url('./mobile-board-focus-v5.css?v=1');
@import url('./mobile-board-focus-v6.css?v=1');
@import url('./mobile-score-panel-v7.css?v=2');
@import url('./experience-polish-v8.css?v=1');
@import url('./experience-polish-v9.css?v=1');
@import url('./game-ui-final.css?v=2');
@import url('./menu-window-polish-v2.css?v=1');
@import url('./interface-refine-v3.css?v=1');

/* HUD refinement: objectives live beside the level instead of underneath it. */
.level-card{
  grid-template-columns:minmax(0,1fr) auto!important;
  align-items:center!important;
}
.level-card>div:first-child{
  display:grid!important;
  grid-template-columns:minmax(118px,max-content) minmax(0,1fr)!important;
  align-items:center!important;
  gap:10px!important;
  width:100%!important;
  min-width:0!important;
  overflow:visible!important;
}
.level-card .level-meta{
  min-width:0!important;
  margin:0!important;
  flex:0 0 auto!important;
  white-space:nowrap!important;
}
.level-card .level-meta>div:last-child{
  min-width:0!important;
  max-width:150px!important;
  overflow:hidden!important;
}
.level-card #levelLabel,
.level-card #levelType{
  display:block!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
.level-card .goals{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex-wrap:nowrap!important;
  gap:6px!important;
  min-width:0!important;
  width:auto!important;
  margin:0!important;
  padding:0!important;
  overflow:visible!important;
}
.level-card .goal{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  flex:0 0 auto!important;
  min-width:48px!important;
  height:24px!important;
  min-height:24px!important;
  padding:0 8px!important;
  gap:5px!important;
  border-radius:999px!important;
  font-size:11px!important;
  line-height:1!important;
  background:linear-gradient(180deg,rgba(6,69,145,.92),rgba(4,43,101,.94))!important;
  border:1px solid rgba(214,244,255,.56)!important;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.18),0 2px 6px rgba(0,26,70,.24)!important;
}
.level-card .goal-dot{
  width:18px!important;
  height:18px!important;
  min-width:18px!important;
  min-height:18px!important;
  flex:0 0 18px!important;
  border-radius:5px!important;
}
.level-card .goal>span:last-child{
  display:block!important;
  min-width:12px!important;
  font-size:11px!important;
  font-weight:1000!important;
  color:#fff!important;
  text-align:center!important;
  text-shadow:0 1px 2px rgba(0,22,62,.9)!important;
}
.level-card .moves{
  align-self:stretch!important;
  display:flex!important;
  flex-direction:column!important;
  align-items:center!important;
  justify-content:center!important;
  min-width:72px!important;
  margin-left:8px!important;
  padding-left:10px!important;
}

@media(max-width:759px){
  .level-card>div:first-child{
    grid-template-columns:minmax(92px,max-content) minmax(0,1fr)!important;
    gap:5px!important;
  }
  .level-card .level-meta{gap:4px!important}
  .level-card .level-meta>div:last-child{max-width:96px!important}
  .level-card .crown{width:24px!important;height:24px!important;min-width:24px!important}
  .level-card .goals{gap:4px!important}
  .level-card .goal{
    min-width:42px!important;
    height:22px!important;
    min-height:22px!important;
    padding:0 6px!important;
    gap:4px!important;
    font-size:10px!important;
  }
  .level-card .goal-dot{
    width:16px!important;
    height:16px!important;
    min-width:16px!important;
    min-height:16px!important;
    flex-basis:16px!important;
  }
  .level-card .goal>span:last-child{font-size:10px!important}
  .level-card .moves{min-width:54px!important;margin-left:4px!important;padding-left:6px!important}
}

@media(max-width:420px){
  .level-card{padding-left:4px!important;padding-right:4px!important}
  .level-card>div:first-child{
    grid-template-columns:minmax(80px,92px) minmax(0,1fr)!important;
    gap:3px!important;
  }
  .level-card .level-meta>div:last-child{max-width:68px!important}
  .level-card .level-meta small{font-size:5px!important}
  .level-card .goals{gap:3px!important}
  .level-card .goal{
    min-width:38px!important;
    height:21px!important;
    min-height:21px!important;
    padding:0 5px!important;
    gap:3px!important;
  }
  .level-card .goal-dot{
    width:15px!important;
    height:15px!important;
    min-width:15px!important;
    min-height:15px!important;
    flex-basis:15px!important;
  }
  .level-card .moves{min-width:48px!important;margin-left:3px!important;padding-left:4px!important}
}

@media(max-width:350px){
  .level-card>div:first-child{grid-template-columns:72px minmax(0,1fr)!important}
  .level-card .crown{display:none!important}
  .level-card .level-meta>div:last-child{max-width:72px!important}
  .level-card .goal{min-width:36px!important;padding:0 4px!important}
  .level-card .goal-dot{width:14px!important;height:14px!important;min-width:14px!important;min-height:14px!important;flex-basis:14px!important}
  .level-card .moves{min-width:44px!important}
}
