/* Component recipes from the supplied UX kit, adapted to the existing game DOM. */
:root{--bg:var(--mm-bg);--panel:var(--mm-surface);--line:#3e5137;--muted:var(--mm-muted);--ink:var(--mm-text);--accent:var(--mm-lime)}
body{background:var(--mm-bg);color:var(--mm-text)}
.ui-icon{display:inline-block;vertical-align:middle;object-fit:contain;flex-shrink:0;pointer-events:none}
.region-nav .ui-icon{width:20px;height:20px}.attribute-icon .ui-icon{width:28px;height:28px}.coin .ui-icon{width:28px;height:28px}.gem-wallet .ui-icon{width:25px;height:25px}
:is(button,a,input,select,summary,[tabindex]):focus-visible{outline:3px solid var(--mm-focus);outline-offset:3px}
:where(button,input,select){transition:background-color var(--mm-fast),border-color var(--mm-fast),box-shadow var(--mm-fast)}
:where(button:not(:disabled)):active{filter:brightness(1.08)}
button:disabled{cursor:default}
.region-nav{background:var(--mm-surface-deep);border-color:var(--mm-border);border-radius:var(--mm-radius-md)}
.region-nav button{min-height:44px;border-radius:var(--mm-radius-sm)}
.region-nav button:hover:not([aria-selected=true]){background:var(--mm-surface-raised);color:var(--mm-text)}
.region-nav button[aria-selected=true]{background:var(--mm-lime-dark);border-color:var(--mm-border-strong);color:var(--mm-lime);box-shadow:inset 0 1px #b4d98212}
.wallet{background:linear-gradient(125deg,#2c3321,var(--mm-surface));border-color:#6e654144}.wallet strong{color:var(--mm-gold);font-variant-numeric:tabular-nums}.gem-wallet{background:linear-gradient(125deg,#1d3438,#172a29);border-color:#538b9655}.gem-wallet b{color:var(--mm-gem);font-variant-numeric:tabular-nums}
.icon-btn{width:40px;height:40px;border-color:var(--mm-border);border-radius:var(--mm-radius-sm)}
.icon-btn:hover{background:var(--mm-surface-raised);border-color:var(--mm-border-strong)}
:where(.section-heading,.workbench-heading,.medal-section-title) :where(h2,h3){color:var(--mm-text)}
.hint{color:var(--mm-muted);line-height:1.5}
:where(.attribute-card,.hero-card,.pet-card,.artifact-card,.family-build,.mixed-build,.bestiary-card,.cosmetic-card){border-radius:var(--mm-radius-md);background:linear-gradient(145deg,var(--mm-surface),var(--mm-surface-deep));box-shadow:inset 0 1px #cbea7807}
:where(.attribute-card,.hero-card,.pet-card,.artifact-card,.family-build,.mixed-build,.bestiary-card) :where(p,small){line-height:1.55}
.attribute-card>h3{font-size:24px;margin-bottom:8px}.attribute-card>p{color:var(--mm-muted);min-height:30px;line-height:1.6}.attribute-card>strong{font-variant-numeric:tabular-nums}
.attribute-card .attribute-buy{min-height:44px;border-radius:var(--mm-radius-sm);font-size:11px;gap:8px}
.attribute-buy:not(:disabled){background:var(--mm-lime);border-color:var(--mm-lime);color:#192719}
.attribute-buy:disabled{background:#263321;color:#acb69a;border-color:var(--mm-border)}
.buy-toolbar{border-color:var(--mm-border);background:var(--mm-surface-deep)}
.buy-toolbar [data-buy-amount]{min-height:40px;min-width:48px}
:where(.hero-actions,.pet-toolbar,.inventory-filters,.build-toolbar) :where(button,select),.gem-upgrade{min-height:40px;border-radius:var(--mm-radius-sm)}
.gem-upgrade{border-color:#4e7777;background:#18302c;color:var(--mm-gem);line-height:1.4}
.gem-upgrade:disabled{color:#9aa99d;background:#202c24;border-color:#41513e}
.hero-card.active,.pet-card.equipped{box-shadow:inset 3px 0 var(--mm-lime),inset 0 1px #cbea7812}
.hero-card.locked,.pet-card.locked{opacity:.72}.hero-card.locked :where(h3,.passive-caption){color:#adb59c}
.hero-skill-info{border-color:#466b61!important;background:#20382e!important;border-radius:var(--mm-radius-sm);min-height:44px}
.hero-skill-info:hover{background:#29473a!important;border-color:#8ba586!important}
:where(.hero-card-top,.pet-card-top,.artifact-card-top){letter-spacing:.7px;line-height:1.5}
.active-hero{background:var(--mm-surface-deep);border-color:var(--mm-border)}
:where(.party-member,.compact-member){background:var(--mm-surface);border-color:var(--mm-border);border-radius:var(--mm-radius-md)}
.party-metrics{font-variant-numeric:tabular-nums}.party-data small{color:var(--mm-muted)}
.egg-open{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:44px;border-radius:var(--mm-radius-sm);border-color:#a08d51;background:#302e1e;color:var(--mm-gold)}
:where(.pet-toolbar,.inventory-filters) select{background:var(--mm-surface-deep);border-color:var(--mm-border);color:var(--mm-text);min-height:40px}
:where(.artifact-slot,.build-piece){border-radius:var(--mm-radius-sm)}
.artifact-slot:focus-visible,.build-piece:focus-visible{outline-color:var(--mm-focus)}
.item-detail{background:var(--mm-surface-deep);border-radius:var(--mm-radius-md);border-color:var(--mm-border)}
.auto-evolution{border-color:#557747;background:#1b2e20;color:#c8d9b3;line-height:1.6}
.family-build.on,.mixed-build.on{background:linear-gradient(135deg,#293b23,var(--mm-surface-deep));box-shadow:inset 3px 0 var(--family-color,var(--mm-lime))}
.family-bonus.enabled,.mixed-perks.enabled{background:#283f2355;color:#d5e9b4}
:where(.build-toolbar,.build-filters,.bestiary-switch) button{min-height:40px;border-radius:var(--mm-radius-sm)}
.family-build>button,.mixed-build>button{min-height:44px}
:where(.compact-pagination,.hero-pagination,.pet-pagination) button{min-width:40px;min-height:40px;border-radius:var(--mm-radius-sm)}
.prestige-panel{background:linear-gradient(120deg,#2c3520,var(--mm-surface-deep));border-color:#68784b}
.prestige-panel p,.prestige-rules{line-height:1.6}.prestige-action button{min-height:44px}
.super-panel{background:linear-gradient(120deg,#2c3934,var(--mm-surface-deep));border-radius:var(--mm-radius-md)}
.prism-reward,.cosmetic-card{border-radius:var(--mm-radius-md)}
.prism-reward.earned{background:linear-gradient(130deg,#253c34,#282d3b);border-color:#8cb5b0}
.bestiary-card.undiscovered{opacity:.65}.bestiary-switch button[aria-pressed=true]{background:var(--mm-lime-dark);color:var(--mm-lime);border-color:var(--mm-border-strong)}
dialog{max-height:88dvh;overflow-y:auto;overscroll-behavior:contain;border-radius:var(--mm-radius-lg);border-color:var(--mm-border-strong);box-shadow:0 24px 70px #050b08aa;background:var(--mm-surface-raised)}
dialog::backdrop{background:#050b08c9;backdrop-filter:blur(3px)}
dialog p{color:#c0ccb2;line-height:1.75}dialog h2{color:var(--mm-text)}
dialog .close{min-width:40px;min-height:40px;display:grid;place-items:center;border-radius:var(--mm-radius-sm)}
dialog .close:hover{background:#cbea7812}
dialog :where(.primary,.dialog-actions button,.hatch-buttons button){min-height:44px;border-radius:var(--mm-radius-sm)}
dialog .primary:not(:disabled){background:var(--mm-lime);color:#192719}
.skill-dialog{background:radial-gradient(ellipse at top right,#2b4538,var(--mm-surface-deep) 80%)}
.skill-mode button{min-height:44px}.skill-mode button[aria-pressed=true]{background:var(--mm-lime-dark);border-color:var(--mm-border-strong);color:var(--mm-lime)}
.skill-numbers{border-color:#4e7769;background:#162a23;color:var(--mm-mana)}
.skill-dialog .skill-status{font-variant-numeric:tabular-nums;color:var(--mm-mana)}
.skill-condition{background:#0c1c1366}.skill-condition small{color:#bdd39f}
.super-dialog{border-color:var(--mm-danger);background:#262d23}
.super-dialog .danger{background:#52322c;border-color:var(--mm-danger);color:#ffe7df;min-height:44px}
.super-dialog .danger:hover:not(:disabled){background:#754438}.super-dialog .danger:disabled{opacity:.5}
.super-consent{line-height:1.65;min-height:44px}.super-consent input{width:18px;height:18px}
.pity-track{height:7px;border-radius:4px;background:#172119}.pity-track i{background:var(--mm-epic)}.pity-track.legendary i{background:var(--mm-legendary)}
.notice-dialog{background:var(--mm-surface);border-color:var(--mm-border-strong)}
:where(.pet-rules,.super-history,.more-perks) summary{cursor:pointer;min-height:40px;display:flex;align-items:center;color:#becbac}
.toast{line-height:1.5;box-shadow:0 8px 32px #050b0866}
.farm-controls :where(button,input){min-height:40px;border-radius:var(--mm-radius-sm)}
@media(max-width:650px){.header-right{gap:6px}.icon-btn{width:36px;height:38px}.region-nav .ui-icon{width:18px;height:18px}.region-nav button{gap:7px}.attribute-card .attribute-buy{font-size:10px}.hero-actions button{min-height:44px}dialog{max-width:calc(100vw - 24px);padding:24px 18px}dialog h2{padding-right:22px;font-size:28px}.skill-dialog .close{right:7px;top:7px}.section-heading{gap:12px}.hint{font-size:10px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;scroll-behavior:auto!important}}
