/* EPIC-UI-002 LOT 1 — UI-201 + UI-202A + UI-202B */
:root{
  --ui-bg:var(--bg,#f6ead8);
  --ui-surface:var(--surface,#fff6e8);
  --ui-surface-soft:var(--surface-2,#f4e5d1);
  --ui-surface-raised:var(--surface-3,#fffaf1);
  --ui-overlay:rgba(24,18,12,.72);
  --ui-text:var(--text,#39291c);
  --ui-text-muted:var(--text-dim,#765f4b);
  --ui-accent:var(--gold,#d7aa43);
  --ui-accent-strong:var(--gold-deep,#a56f17);
  --ui-positive:var(--green,#3f9e63);
  --ui-danger:var(--red,#c84c42);
  --ui-disabled:#8a8178;
  --ui-space-1:4px;--ui-space-2:8px;--ui-space-3:12px;--ui-space-4:16px;--ui-space-5:24px;--ui-space-6:32px;
  --ui-radius-sm:4px;--ui-radius-md:8px;--ui-radius-lg:12px;--ui-radius-pill:999px;
  --ui-border:1px solid var(--border,rgba(83,60,34,.28));
  --ui-border-strong:1px solid var(--border-strong,rgba(110,76,35,.46));
  --ui-border-focus:2px solid var(--ui-accent);
  --ui-shadow-surface:0 2px 8px rgba(54,37,20,.08);
  --ui-shadow-raised:0 6px 18px rgba(54,37,20,.14);
  --ui-shadow-overlay:0 16px 42px rgba(0,0,0,.26);
  --ui-glow-reward:0 0 20px rgba(215,170,67,.42);
  --ui-fast:120ms;--ui-normal:200ms;
  --ui-control-sm:36px;--ui-control-md:44px;--ui-control-lg:52px;
  --ui-font-body:"Inter",system-ui,sans-serif;
  --ui-font-display:"VT323",monospace;
  --ui-font-pixel:"Press Start 2P",monospace;
  --ui-font-data:"IBM Plex Mono",monospace;
}
.ui-panel{background:var(--ui-surface);border:var(--ui-border);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-surface);padding:var(--ui-space-4)}
.ui-card{background:var(--ui-surface-soft);border:var(--ui-border);border-radius:var(--ui-radius-md);box-shadow:none;padding:var(--ui-space-3)}
.ui-card--raised{background:var(--ui-surface-raised);border:var(--ui-border-strong);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-raised)}
.ui-section-title{margin:0 0 var(--ui-space-3);color:var(--ui-text);font:400 22px/1 var(--ui-font-display)}
.ui-value{color:var(--ui-text);font:700 14px/1.2 var(--ui-font-data);font-variant-numeric:tabular-nums}
.ui-microtext{color:var(--ui-text-muted);font:500 10px/1.4 var(--ui-font-data)}
.ui-separator{border:0;border-top:var(--ui-border);margin:var(--ui-space-4) 0}
.ui-badge{display:inline-flex;align-items:center;justify-content:center;min-width:8px;min-height:8px;padding:2px 5px;border-radius:var(--ui-radius-pill);background:var(--ui-danger);color:#fff;font:700 9px/1 var(--ui-font-data);box-shadow:none}
.ui-progress{position:relative;overflow:hidden;height:8px;border:var(--ui-border);border-radius:var(--ui-radius-pill);background:rgba(57,41,28,.12)}
.ui-progress>.fill,.ui-progress>span,.ui-progress>i{display:block;height:100%;border-radius:inherit;background:var(--ui-accent);transition:width var(--ui-normal) ease}
.ui-tooltip{padding:var(--ui-space-2) var(--ui-space-3);border:var(--ui-border-strong);border-radius:var(--ui-radius-md);background:var(--ui-surface-raised);box-shadow:var(--ui-shadow-raised);color:var(--ui-text);font:500 10px/1.4 var(--ui-font-data)}
.ui-modal{background:var(--ui-surface-raised);border:var(--ui-border-strong);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-overlay)}
.ui-btn,.dungeon-btn,.mode-tab,.pull-btn{
  appearance:none;min-height:var(--ui-control-md);padding:0 var(--ui-space-4);border:var(--ui-border-strong);border-radius:var(--ui-radius-md);
  background:var(--ui-surface-raised);color:var(--ui-text);box-shadow:var(--ui-shadow-surface);font:600 12px/1.15 var(--ui-font-data);
  transition:transform var(--ui-fast) ease,background-color var(--ui-fast) ease,border-color var(--ui-fast) ease,box-shadow var(--ui-fast) ease,opacity var(--ui-fast) ease;cursor:pointer
}
.ui-btn:hover,.dungeon-btn:hover,.mode-tab:hover,.pull-btn:hover{border-color:var(--ui-accent-strong);background:var(--ui-surface)}
.ui-btn:active,.dungeon-btn:active,.mode-tab:active,.pull-btn:active{transform:translateY(1px);box-shadow:none}
.ui-btn:focus-visible,.dungeon-btn:focus-visible,.mode-tab:focus-visible,.pull-btn:focus-visible{outline:var(--ui-border-focus);outline-offset:2px}
.ui-btn:disabled,.dungeon-btn:disabled,.mode-tab:disabled,.pull-btn:disabled,[aria-disabled="true"].ui-btn,[aria-disabled="true"].dungeon-btn,[aria-disabled="true"].mode-tab,[aria-disabled="true"].pull-btn{cursor:default;opacity:.48;filter:grayscale(.3);box-shadow:none;transform:none}
.ui-btn--primary,.dungeon-btn:not(.secondary):not(.danger),.pull-btn{background:linear-gradient(180deg,#e3bd61,var(--ui-accent));border-color:var(--ui-accent-strong);color:#2d2115;box-shadow:0 2px 6px rgba(76,49,14,.18)}
.ui-btn--secondary,.dungeon-btn.secondary,.mode-tab{background:var(--ui-surface-soft);border-color:rgba(92,65,38,.32);color:var(--ui-text);box-shadow:none}
.mode-tab.active,.ui-btn.is-active{background:var(--ui-surface-raised);border-color:var(--ui-accent-strong);box-shadow:inset 0 -2px 0 var(--ui-accent)}
.ui-btn--danger,.dungeon-btn.danger{background:#f4ded9;border-color:rgba(168,66,54,.56);color:#7d2f28;box-shadow:none}
.shop-icon-btn{border:var(--ui-border);border-radius:var(--ui-radius-md);background:var(--ui-surface-raised);box-shadow:var(--ui-shadow-surface);color:var(--ui-text);transition:transform var(--ui-fast) ease,border-color var(--ui-fast) ease,background-color var(--ui-fast) ease}
.panel,.dungeon-card,.upgrade-shop-featured,.hero-score-box{background:var(--ui-surface);border:var(--ui-border);border-radius:var(--ui-radius-lg);box-shadow:var(--ui-shadow-surface);background-image:none;text-shadow:none}
.panel,.upgrade-shop-featured{padding:var(--ui-space-4)}
.dungeon-card,.hero-score-box{padding:var(--ui-space-3)}
.ledger-note,.item-meta{color:var(--ui-text-muted);font-family:var(--ui-font-data)}
@media(max-width:640px){
  .ui-panel,.panel,.upgrade-shop-featured{padding:var(--ui-space-3)}
  .ui-card,.dungeon-card,.hero-score-box{padding:var(--ui-space-2)}
  .ui-btn,.dungeon-btn,.mode-tab,.pull-btn{min-height:var(--ui-control-md);padding-left:var(--ui-space-3);padding-right:var(--ui-space-3)}
}

/* === FINAL ASSET PACK — DEV2 visual integration ========================== */
.ui-icon-mask {
  display:inline-block;
  width:1.5rem;
  height:1.5rem;
  flex:0 0 auto;
  background-color:currentColor;
  -webkit-mask-image:var(--ui-icon-mask);
  mask-image:var(--ui-icon-mask);
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
  -webkit-mask-size:contain;
  mask-size:contain;
  vertical-align:middle;
}
.ui-icon-mask--sm { width:1rem; height:1rem; }
.ui-icon-mask--lg { width:2rem; height:2rem; }

.ui-final-nav-icon { width:24px; height:24px; }
.ui-final-more-icon,
.ui-final-inline-icon,
.ui-final-action-icon { width:20px; height:20px; }
.ui-final-close-icon { width:16px; height:16px; }

#v2MobileNav button,
#v2MobileMore button {
  color:inherit;
}
#v2MobileNav .ui-final-nav-icon {
  margin:0 auto 2px;
}
#v2MobileMore .ui-final-more-icon {
  margin-right:8px;
}
[data-view] > .ui-final-inline-icon,
.mode-tab > .ui-final-inline-icon,
.dungeon-btn > .ui-final-action-icon,
.pull-btn > .ui-final-action-icon,
.levelup-btn > .ui-final-action-icon {
  margin-right:6px;
}

.popup-close {
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.ui-final-important-card {
  position:relative;
  overflow:visible;
}
.ui-final-section-accent {
  position:absolute;
  top:-8px;
  left:50%;
  width:64px;
  height:16px;
  transform:translateX(-50%);
  color:var(--ui-accent, #E0932A);
  pointer-events:none;
}
.result-card { position:relative; }
.ui-final-rarity-corner {
  position:absolute;
  top:3px;
  right:3px;
  width:18px;
  height:18px;
  color:currentColor;
  opacity:.72;
  pointer-events:none;
}

.ping-dot {
  -webkit-mask-image:url("../assets/ui/ornaments/notification_marker.svg");
  mask-image:url("../assets/ui/ornaments/notification_marker.svg");
  -webkit-mask-size:contain;
  mask-size:contain;
  -webkit-mask-repeat:no-repeat;
  mask-repeat:no-repeat;
  -webkit-mask-position:center;
  mask-position:center;
}

/* Pixel-art contract: ratio remains owned by existing layout. */
#battleHeroIcon,
.battle-companion-icon,
#battleStrip img[data-final-sequence] {
  image-rendering:pixelated;
  image-rendering:crisp-edges;
  object-fit:contain;
}

.ui-vfx {
  position:absolute;
  z-index:40;
  left:50%;
  top:50%;
  width:64px;
  height:64px;
  transform:translate(-50%, -50%);
  pointer-events:none;
  contain:layout paint style;
}
.ui-vfx__frame {
  display:block;
  width:64px;
  height:64px;
  object-fit:contain;
  image-rendering:pixelated;
  image-rendering:crisp-edges;
  user-select:none;
  pointer-events:none;
}
.ui-vfx-layer {
  position:absolute;
  inset:0;
  pointer-events:none;
  overflow:visible;
}

@media (max-width:640px) {
  .ui-final-nav-icon { width:22px; height:22px; }
  .ui-final-more-icon { width:19px; height:19px; }
  .ui-final-action-icon { width:18px; height:18px; }
}

@media (prefers-reduced-motion:reduce) {
  .ui-vfx { display:none; }
}
/* === /FINAL ASSET PACK ================================================== */

/* === SPRINT 2 / S2-C V2 UI MOBILE === */
.popup-overlay#achievementsPopup > .popup-card,
.popup-overlay#questsPopup > .popup-card,
.popup-overlay#shopPopup > .popup-card {
  display:flex;
  flex-direction:column;
  max-height:min(90dvh,760px);
  overflow:hidden;
}
.popup-overlay#achievementsPopup > .popup-card > .popup-header,
.popup-overlay#questsPopup > .popup-card > .popup-header,
.popup-overlay#questsPopup > .popup-card > .mode-tabs,
.popup-overlay#shopPopup > .popup-card > .popup-header,
.popup-overlay#shopPopup > .popup-card > #shopTabs {
  flex:0 0 auto;
}
.popup-overlay#achievementsPopup > .popup-card #achievementsList,
.popup-overlay#questsPopup > .popup-card #questPanelDaily,
.popup-overlay#questsPopup > .popup-card #questPanelWeekly,
.popup-overlay#shopPopup > .popup-card #dustShopSection,
.popup-overlay#shopPopup > .popup-card #starShopSection {
  min-height:0;
  overflow-y:auto;
  overscroll-behavior:contain;
}
#questSubTabDaily[data-claimable]:not([data-claimable="0"])::after,
#questSubTabWeekly[data-claimable]:not([data-claimable="0"])::after {
  content:attr(data-claimable);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:16px;
  height:16px;
  margin-left:6px;
  padding:0 4px;
  border-radius:999px;
  background:var(--ui-danger);
  color:#fff;
  font:700 9px/1 var(--ui-font-data);
}
.quest-row.quest-claimable { border-color:var(--ui-accent-strong); }
.levelup-btn,.awaken-btn,.gift-btn {
  appearance:none;
  min-height:var(--ui-control-md);
  padding:0 var(--ui-space-4);
  border:var(--ui-border-strong);
  border-radius:var(--ui-radius-md);
  background:linear-gradient(180deg,#e3bd61,var(--ui-accent));
  color:#2d2115;
  box-shadow:0 2px 6px rgba(76,49,14,.18);
  font:600 12px/1.15 var(--ui-font-data);
  cursor:pointer;
}
.awaken-btn { background:var(--ui-surface-soft); color:var(--ui-text); }
.levelup-btn:disabled,.awaken-btn:disabled,.gift-btn:disabled {
  opacity:.48; filter:grayscale(.3); cursor:default; box-shadow:none;
}
.ui-final-gift-icon { width:48px; height:48px; color:var(--ui-accent-strong); margin:8px auto; }
@media(max-width:640px) {
  .popup-overlay#achievementsPopup > .popup-card,
  .popup-overlay#questsPopup > .popup-card,
  .popup-overlay#shopPopup > .popup-card {
    max-height:calc(100dvh - 24px);
  }
}
/* === /SPRINT 2 / S2-C V2 === */


/* === S2-VISUAL INTERMEDIAIRE / UI KIT V1 — PHASE 1 ===================== */
.ui-final-nav-icon[data-ui-kit-v1],
.ui-final-more-icon[data-ui-kit-v1],
.ui-final-inline-icon[data-ui-kit-v1] {
  display:inline-block;
  flex:0 0 auto;
  image-rendering:pixelated;
  image-rendering:crisp-edges;
  background-color:transparent !important;
  -webkit-mask-image:none !important;
  mask-image:none !important;
}
#v2MobileNav .ui-final-nav-icon[data-ui-kit-v1] {
  width:30px;
  height:30px;
  margin:0 auto 1px;
}
#v2MobileMore .ui-final-more-icon[data-ui-kit-v1],
[data-view] > .ui-final-inline-icon[data-ui-kit-v1] {
  width:24px;
  height:24px;
}
@media(max-width:380px) {
  #v2MobileNav .ui-final-nav-icon[data-ui-kit-v1] {
    width:27px;
    height:27px;
  }
}
/* === /S2-VISUAL UI KIT V1 ============================================== */

.s2d-power-feedback{position:fixed;z-index:180;inset:0;display:grid;place-items:start center;padding-top:max(72px,10dvh);pointer-events:none}.s2d-power-feedback[hidden]{display:none!important}.s2d-power-feedback-card{position:relative;min-width:220px;padding:16px 22px 14px;text-align:center;overflow:visible;opacity:0;transform:translateY(-8px) scale(.98);transition:opacity 160ms ease,transform 160ms ease}.s2d-power-feedback.is-visible .s2d-power-feedback-card{opacity:1;transform:translateY(0) scale(1)}.s2d-power-feedback-card strong{display:block;font:600 18px/1.1 var(--ui-font-display)}.s2d-power-feedback-card span{display:block;margin-top:5px;font:700 13px/1 var(--ui-font-data)}.s2d-power-vfx{position:absolute;left:50%;top:0;width:64px;height:64px;transform:translate(-50%,-70%);pointer-events:none;image-rendering:pixelated}@media(max-width:640px){.s2d-power-feedback{padding-top:max(58px,8dvh)}.s2d-power-feedback-card{width:min(86vw,340px)}}