:root {
  color-scheme: dark;
  --ink: #f8f1df;
  --muted: #aaa1b7;
  --panel: rgba(31, 25, 49, 0.88);
  --panel-2: #29213d;
  --line: rgba(255, 255, 255, 0.09);
  --gold: #ffd56a;
  --purple: #a97aff;
  --green: #72dfaa;
  --danger: #ff8d91;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  background: #100d1c;
  color: var(--ink);
}

* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: radial-gradient(circle at top, #251b3c 0, #100d1c 45%); }
button { font: inherit; }
.ambient { position: fixed; width: 24rem; height: 24rem; border-radius: 50%; filter: blur(100px); opacity: .14; pointer-events: none; }
.ambient-one { background: #8c55ff; right: -8rem; top: -6rem; }
.ambient-two { background: #ffc14d; left: -10rem; bottom: -10rem; }
.shell { width: min(1040px, 100%); margin: auto; padding: 28px 20px 70px; position: relative; }
.topbar { display: flex; align-items: flex-start; justify-content: space-between; gap: 24px; }
.eyebrow { color: var(--gold); letter-spacing: .18em; font-weight: 800; font-size: .7rem; margin: 0 0 3px; }
h1, h2, h3, p { margin-top: 0; }
h1 { font-family: Georgia, serif; font-size: clamp(2rem, 6vw, 3.4rem); margin-bottom: 0; letter-spacing: -.035em; }
h2 { font-family: Georgia, serif; font-size: 1.55rem; }
.treasury-view { position: relative; flex: 0 1 560px; width: min(560px, 62vw); min-height: 176px; border-radius: 18px; isolation: isolate; }
.wealth-vault { position: absolute; z-index: 0; inset: 0; overflow: hidden; border: 1px solid rgba(255,213,106,.28); border-radius: 18px; background: #130f1d url("/assets/vault-interior.webp") center / cover no-repeat; box-shadow: inset 0 0 34px #0009, 0 16px 36px #08051066; perspective: 460px; }
.wealth-vault::before { content: ""; position: absolute; z-index: 1; inset: 0; pointer-events: none; background: radial-gradient(ellipse at 50% 63%, transparent 25%, rgba(5,3,10,.08) 60%, rgba(5,3,10,.54) 112%); box-shadow: inset 0 0 22px rgba(0,0,0,.48); }
.wealth-vault::after { content: ""; position: absolute; z-index: 3; inset: 0; pointer-events: none; border-radius: inherit; background: linear-gradient(180deg, rgba(255,220,151,.05), transparent 24%, transparent 78%, rgba(0,0,0,.12)); }
.vault-wealth { position: absolute; z-index: 4; inset: 0; }
.vault-coin-stack { position: absolute; z-index: var(--stack-z); left: var(--stack-x); bottom: var(--stack-y); width: var(--stack-width); height: var(--stack-height); border-radius: 55% 55% 2px 2px; transform: translateX(-50%) rotate(var(--stack-tilt)); transform-origin: 50% 100%; background: repeating-linear-gradient(to bottom,#fff1a0 0 1px,#e8a82a 1.5px 3.8px,#834506 4px 5px); box-shadow: inset 1px 0 1px #fff0a077,inset -1px 0 1px #6b3208,0 2px 3px #0008; }
.vault-coin-stack::before { content: ""; position: absolute; left: 0; right: 0; top: -1px; height: 3px; border-radius: 50%; background: radial-gradient(circle at 35% 30%,#fff4b1,#e6a72a 48%,#854606 82%); border: .5px solid #ffd96b; }
.vault-coin { position: absolute; z-index: var(--coin-z); left: var(--coin-x); bottom: var(--coin-y); width: var(--coin-size); height: calc(var(--coin-size) * .62); border-radius: 50%; background: linear-gradient(#fff0a0, #e9a92a 45%, #8b4a08); box-shadow: 0 .5px 0 #552605, 0 0 2px #ffd65c; transform: translateX(-50%); }
.vault-gem { position: absolute; z-index: var(--gem-z); left: var(--gem-x); bottom: var(--gem-y); width: var(--gem-size); height: var(--gem-size); object-fit: contain; transform: translateX(-50%) rotate(var(--gem-tilt)); filter: drop-shadow(0 0 2px #b897ff) drop-shadow(0 1px 1px #000); }
.vault-gem.gem-family-enchanted { filter: drop-shadow(0 0 3px #80fff1) drop-shadow(0 0 6px #49a6ff); animation: enchanted-vault-pulse 1.8s ease-in-out infinite; }
.wallet { position: relative; z-index: 6; display: flex; gap: 6px; padding: 9px; flex-wrap: wrap; justify-content: flex-end; align-items: flex-start; }
.mode-toggle { position: fixed; z-index: 55; right: 12px; top: 10px; border: 1px solid #6f657d; border-radius: 999px; padding: 7px 11px; background: #211a2f; color: #bdb4c8; font-size: .68rem; font-weight: 900; letter-spacing: .12em; cursor: pointer; }
.mode-toggle.dev { border-color: #f1bd54; background: #5a3817; color: #ffe6a5; box-shadow: 0 0 16px #f2b54455; }
.dev-panel { position: fixed; z-index: 50; right: 12px; top: 49px; width: min(310px, calc(100vw - 24px)); display: grid; gap: 8px; padding: 12px; border: 1px solid rgba(241,189,84,.38); border-radius: 14px; background: rgba(20,14,31,.95); box-shadow: 0 18px 45px #000a; backdrop-filter: blur(18px); }
.dev-panel[hidden] { display: none; }
.dev-panel-title { display: flex; justify-content: space-between; align-items: baseline; color: var(--gold); }
.dev-panel-title span { color: var(--muted); font-size: .66rem; }
.dev-panel .mini-button { width: 100%; }
.dev-wealth-control { position: static; display: grid; grid-template-columns: 1fr; gap: 5px; min-height: 31px; padding: 8px; border: 1px solid rgba(169,122,255,.28); border-radius: 10px; background: rgba(34,25,51,.88); }
.dev-wealth-control[hidden] { display: none; }
.dev-wealth-control label { display: flex; justify-content: space-between; gap: 8px; color: #cbb9e7; font-size: .61rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; white-space: nowrap; }
.dev-wealth-control output { color: var(--gold); font-weight: 700; letter-spacing: 0; text-transform: none; }
.dev-wealth-control input { width: 100%; accent-color: #d8a84d; cursor: ew-resize; }
.dev-remove-item { position: absolute; z-index: 6; right: 8px; top: 42px; width: 25px; height: 25px; border: 1px solid #ff9a9d88; border-radius: 50%; background: #4c2029e8; color: #ffc1c3; font-size: 1.1rem; font-weight: 900; line-height: 1; cursor: pointer; box-shadow: 0 4px 12px #0008; }
.artifact-editor { position: fixed; z-index: 70; inset: 0; padding: min(6vh,55px) 20px 20px; background: rgba(7,5,12,.76); backdrop-filter: blur(8px); overflow: auto; }
.artifact-editor[hidden] { display: none; }
.artifact-editor-window { width: min(1180px,100%); margin: auto; border: 1px solid rgba(255,213,106,.34); border-radius: 16px; background: #1d1629; box-shadow: 0 25px 80px #000d; overflow: hidden; }
.item-manager-window { width: min(1500px,100%); }
.catalog-manager-window { width: min(1500px,100%); }.mission-manager-window { width: min(1850px,100%); }
.artifact-editor-head { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.artifact-editor-head div { display: grid; } .artifact-editor-head span { color: var(--muted); font-size: .7rem; }
.artifact-table-wrap { overflow: auto; }
.artifact-editor table { width: 100%; min-width: 1120px; border-collapse: collapse; }
.item-manager-window table { min-width: 1400px; }
.catalog-manager-window table { min-width: 1380px; }.mission-manager-window table { min-width: 2300px; }
.artifact-editor th,.artifact-editor td { padding: 9px; border-bottom: 1px solid var(--line); text-align: left; font-size: .75rem; }
.artifact-editor th { color: var(--gold); background: #261d35; }
.artifact-sort-button { display: flex; justify-content: space-between; align-items: center; gap: 8px; width: 100%; padding: 2px 0; border: 0; background: transparent; color: #cbb9e7; font: inherit; font-weight: 800; text-align: left; cursor: pointer; white-space: nowrap; }
.artifact-sort-button i { color: #776d85; font-size: .58rem; font-style: normal; }.artifact-sort-button:hover,.artifact-sort-button:focus-visible,.artifact-sort-button.active { color: var(--gold); outline: none; }.artifact-sort-button.active i { color: var(--gold); }
.artifact-editor input:not([type="checkbox"]),.artifact-editor select { width: 100%; min-width: 90px; border: 1px solid var(--line); border-radius: 7px; padding: 7px; background: #120e1c; color: var(--ink); }
.artifact-editor textarea { width: 220px; min-height: 68px; resize: vertical; border: 1px solid var(--line); border-radius: 7px; padding: 7px; background: #120e1c; color: var(--ink); font: inherit; }
.catalog-portrait,.catalog-mission-art { width: 76px; height: 76px; overflow: hidden; border: 1px solid rgba(255,213,106,.28); border-radius: 12px; background: #110d18; }.catalog-portrait img,.catalog-mission-art img { width: 100%; height: 100%; display: block; object-fit: cover; }.catalog-mission-art { width: 112px; height: 66px; }
.artwork-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; min-width: 190px; margin-top: 7px; }.artwork-actions .mini-button { min-height: 30px; padding: 5px 7px; white-space: nowrap; }.artwork-actions .art-generate { border-color: rgba(169,122,255,.5); color: #d9c2ff; }
.artifact-editor td small { display: block; margin-top: 4px; color: var(--muted); white-space: nowrap; }
.editor-item-card { width: 112px; overflow: hidden; padding: 0; border: 1px solid rgba(255,255,255,.2); border-radius: 10px; background: #171120; color: var(--ink); text-align: left; box-shadow: 0 7px 18px #0007; cursor: zoom-in; transition: transform .16s ease,box-shadow .16s ease,border-color .16s ease; }
.editor-item-card:hover,.editor-item-card:focus-visible { transform: translateY(-2px) scale(1.02); border-color: var(--gold); box-shadow: 0 10px 24px #000b,0 0 15px rgba(255,213,106,.16); outline: none; }
.editor-item-card.epic { border-color: #b96dff99; }.editor-item-card.legendary { border-color: #ffc45eaa; }.editor-item-card.mythic { border-color: #ff78dfbb; }.editor-item-card.rare { border-color: #8eaaff88; }.editor-item-card.uncommon { border-color: #69dfa388; }
.editor-card-art { position: relative; display: grid; place-items: center; height: 82px; overflow: hidden; background: radial-gradient(circle,#493760,#15101e 72%); }
.editor-card-art img { width: 100%; height: 100%; object-fit: cover; }.editor-card-art .glyph { font-size: 2.1rem; }
.editor-item-card > b,.editor-item-card > small { display: block; padding: 5px 7px 0; line-height: 1.15; }.editor-item-card > b { font-family: Georgia,serif; font-size: .68rem; }.editor-item-card > small { padding-bottom: 6px; color: var(--muted); font-size: .56rem; text-transform: uppercase; }
.editor-item-card > em { display: block; padding: 0 7px 7px; color: var(--gold); font-size: .52rem; font-style: normal; letter-spacing: .05em; text-transform: uppercase; }
.manager-head-actions { display: flex !important; grid-auto-flow: column; align-items: center; gap: 8px; }
.manual-item-form { display: grid; grid-template-columns: repeat(7,minmax(105px,1fr)) auto; gap: 10px; align-items: end; padding: 13px 16px; border-bottom: 1px solid var(--line); background: #171121; }
.catalog-create-form { display: grid; grid-template-columns: repeat(7,minmax(115px,1fr)) auto; gap: 10px; align-items: end; padding: 13px 16px; border-bottom: 1px solid var(--line); background: #171121; }.mission-create-form { grid-template-columns: repeat(4,minmax(140px,1fr)); }.catalog-create-form label { display: grid; gap: 5px; color: var(--muted); font-size: .64rem; text-transform: uppercase; letter-spacing: .05em; }
.manual-item-form label { display: grid; gap: 5px; color: var(--muted); font-size: .64rem; text-transform: uppercase; letter-spacing: .05em; }
.manual-item-form .manual-check { display: flex; align-items: center; padding-bottom: 8px; }
.draft-form-actions { display: grid; grid-template-columns: max-content max-content; gap: 7px; align-items: end; }.draft-form-actions small { grid-column: 1/-1; max-width: 260px; color: var(--muted); font-size: .58rem; line-height: 1.3; text-transform: none; }.ai-draft-button { border-color: rgba(169,122,255,.62) !important; color: #e3d2ff !important; box-shadow: 0 0 14px rgba(169,122,255,.09); }
.mission-gem-create { grid-column: 1/-1; display: grid; grid-template-columns: repeat(3,minmax(260px,1fr)); gap: 8px; margin: 0; padding: 12px; border: 1px solid rgba(169,122,255,.25); border-radius: 12px; }.mission-gem-create legend { padding: 0 7px; color: var(--gold); font-size: .67rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }.mission-gem-form-row { display: grid; grid-template-columns: 1.25fr repeat(3,.8fr); gap: 6px; align-items: end; padding: 8px; border: 1px solid var(--line); border-radius: 9px; background: #120e1c; }.mission-gem-form-row > span { display: flex; align-items: center; gap: 5px; padding-bottom: 7px; color: var(--ink); font-size: .68rem; text-transform: none; }.mission-gem-form-row label { font-size: .52rem; }.mission-gem-form-row input { min-width: 52px !important; padding: 6px !important; }
.mission-gem-button { display: grid; gap: 4px; width: 220px; text-align: left; }.mission-gem-button b { color: var(--gold); }.mission-gem-button small { max-width: 205px; overflow: hidden; text-overflow: ellipsis; color: var(--muted) !important; font-size: .56rem !important; white-space: nowrap; }
.mission-gem-window { width: min(820px,100%); }.mission-gem-editor-grid { display: grid; gap: 8px; padding: 16px; }.mission-gem-edit-row { display: grid; grid-template-columns: 1.4fr repeat(3,1fr); gap: 12px; align-items: end; padding: 12px; border: 1px solid var(--line); border-radius: 11px; background: #15101f; }.mission-gem-edit-row > span { display: grid; grid-template-columns: auto 1fr; gap: 2px 8px; align-items: center; }.mission-gem-edit-row > span .gem-mark { grid-row: 1/3; }.mission-gem-edit-row > span small { color: var(--muted); font-size: .58rem; text-transform: uppercase; }.mission-gem-edit-row label { display: grid; gap: 5px; color: var(--muted); font-size: .59rem; font-weight: 800; letter-spacing: .05em; text-transform: uppercase; }
.mini-button.danger { border-color: #9b4457; color: #ffb2bd; }
.gallery-window { width: min(1320px,100%); }
.art-gallery-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(145px,1fr)); gap: 13px; max-height: calc(100vh - 150px); overflow: auto; padding: 16px; }
.gallery-art-card { display: grid; gap: 6px; overflow: hidden; padding: 0 0 9px; border: 1px solid var(--line); border-radius: 11px; background: #120e1c; color: var(--ink); text-align: left; cursor: pointer; }
.gallery-art-card:hover:not(:disabled),.gallery-art-card:focus-visible { border-color: var(--gold); transform: translateY(-2px); }
.gallery-art-card:disabled { cursor: default; opacity: 1; }
.gallery-art-card img { width: 100%; aspect-ratio: 1; object-fit: cover; background: #0c0912; }
.gallery-art-card.mission-art img { aspect-ratio: 16 / 9; }
.gallery-art-card span,.gallery-art-card small { padding: 0 9px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gallery-art-card span { font-family: Georgia,serif; font-size: .72rem; }.gallery-art-card small { color: var(--muted); font-size: .57rem; }
.gallery-loading { grid-column: 1/-1; padding: 60px; color: var(--muted); text-align: center; }
@media (max-width:900px) { .manual-item-form,.catalog-create-form,.mission-create-form { grid-template-columns: repeat(2,minmax(120px,1fr)); }.mission-gem-create { grid-template-columns: 1fr; }.mission-gem-edit-row { grid-template-columns: 1fr repeat(3,1fr); } }
.item-art-preview { z-index: 90; display: grid; place-items: center; padding: 18px; cursor: zoom-out; }
.item-art-preview[hidden] { display: none; }
.item-preview-window { position: relative; width: min(680px,calc(100vw - 36px)); cursor: default; }
.preview-close { position: absolute; z-index: 5; right: -12px; top: -12px; display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid rgba(255,213,106,.55); border-radius: 50%; background: #261b33; color: #fff1bd; font-size: 1.55rem; line-height: 1; cursor: pointer; box-shadow: 0 8px 24px #000c; }
.full-item-card { overflow: hidden; border: 2px solid rgba(255,255,255,.22); border-radius: 24px; background: linear-gradient(145deg,#2c213c,#130e1c); box-shadow: 0 32px 100px #000f,inset 0 0 60px rgba(255,255,255,.025); }
.full-item-card.epic { border-color: #b96dffbb; }.full-item-card.legendary { border-color: #ffc45ed0; }.full-item-card.mythic { border-color: #ff78dfd0; }.full-item-card.rare { border-color: #8eaaffaa; }.full-item-card.uncommon { border-color: #69dfa3aa; }
.full-item-art { position: relative; display: grid; place-items: center; width: 100%; aspect-ratio: 1; overflow: hidden; background: radial-gradient(circle,#493760,#15101e 72%); }
.full-item-art img { width: 100%; height: 100%; object-fit: cover; display: block; }.full-item-art .glyph { font-size: 8rem; }
.full-item-copy { display: grid; gap: 9px; padding: 18px 22px 22px; background: linear-gradient(180deg,rgba(22,15,31,.93),#130e1c); }
.full-item-kicker { color: var(--gold); font-size: .68rem; font-weight: 900; letter-spacing: .15em; text-transform: uppercase; }
.full-item-copy h2 { margin: 0; font-family: Georgia,serif; font-size: clamp(1.35rem,4vw,2rem); }
.full-item-stats { display: flex; gap: 8px; flex-wrap: wrap; }.full-item-stats > * { padding: 6px 9px; border: 1px solid var(--line); border-radius: 999px; color: var(--muted); font-size: .7rem; }.full-item-stats strong { color: #fff0b5; }
@media (max-height: 800px) { .item-preview-window { width: min(520px,calc(100vw - 36px)); }.full-item-copy { padding: 12px 16px 15px; } }
.generator-window { width: min(720px,100%); }
.generator-form { display: grid; grid-template-columns: 1fr 1fr; gap: 15px; padding: 18px; }
.generator-form > label,.generator-counts label { display: grid; gap: 6px; color: var(--gold); font-size: .7rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.generator-form fieldset,.generator-summary { grid-column: 1/-1; margin: 0; padding: 14px; border: 1px solid var(--line); border-radius: 12px; }
.generator-form legend { padding: 0 7px; color: var(--gold); font-size: .72rem; font-weight: 850; }
.generator-counts { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.generator-summary { display: grid; gap: 4px; color: var(--muted); font-size: .72rem; }.generator-summary b { color: var(--ink); }
.generator-form .button { grid-column: 1/-1; }
.binding.stock { color: #b8eecf; background: rgba(68,173,119,.1); border: 1px solid rgba(105,223,163,.22); }
@media (max-width: 620px) { .generator-form { grid-template-columns: 1fr; }.generator-form > label { grid-column: 1/-1; }.generator-counts { grid-template-columns: repeat(2,1fr); } }
.kit-viewer-window { width: min(900px,100%); }
.kit-viewer-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; padding: 16px; }
.kit-view-card { position: relative; display: flex; flex-direction: column; min-width: 0; min-height: 330px; padding: 13px; border: 1px solid var(--line); border-radius: 15px; background: #241b33; box-shadow: inset 0 0 34px rgba(0,0,0,.2); }
.kit-view-card.common { border-color: rgba(255,255,255,.15); }
.kit-view-card.uncommon { border-color: rgba(105,223,163,.4); }
.kit-view-card.rare { border-color: rgba(123,157,255,.55); }
.kit-view-card.epic { border-color: rgba(190,117,255,.62); box-shadow: inset 0 0 36px rgba(168,85,255,.1); }
.kit-view-card.legendary { border-color: rgba(255,190,65,.78); box-shadow: inset 0 0 44px rgba(255,174,42,.14); }
.kit-view-card.mythic { border-color: rgba(255,95,215,.8); box-shadow: inset 0 0 48px rgba(213,66,255,.18); }
.kit-view-card .gear-visual { max-height: none; }
.kit-view-card h3 { margin: 10px 0 4px; }
.kit-view-card .gear-meta { margin: 8px 0 12px; }
.kit-view-card .button { margin-top: auto; }
.kit-view-card.empty { text-align: left; padding: 13px; }
.kit-view-card.empty .gear-visual { opacity: .48; }
.kit-slot-label { margin-bottom: 7px; color: var(--gold); font-size: .65rem; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.wallet > span { padding: 8px 11px; border: 1px solid rgba(255, 213, 106, .35); background: rgba(25,16,26,.86); border-radius: 999px; color: #d9cfae; white-space: nowrap; box-shadow: 0 3px 12px #0008; }
.wallet > span b { color: var(--gold); }
.wallet .gems { border-color: rgba(169, 122, 255, .25); background: rgba(169, 122, 255, .09); }
.wallet .gems b { color: #c4a5ff; }
.gem-wallet { display: flex; gap: 4px; flex-wrap: wrap; justify-content: flex-end; max-width: 385px; }
.gem-balance { display: inline-flex; align-items: center; gap: 3px; padding: 5px 7px; border: 1px solid rgba(169,122,255,.28); background: rgba(24,18,40,.88); border-radius: 999px; color: #d8cfdf; font-size: .72rem; box-shadow: 0 3px 9px #0006; }
.gem-balance b { color: var(--ink); }
.gem-mark { position: relative; display: inline-block; width: 20px; height: 20px; flex: 0 0 auto; }
.gem-mark img { width: 100%; height: 100%; display: block; object-fit: contain; filter: drop-shadow(0 1px 3px #000a); }
@keyframes enchanted-vault-pulse { 50% { filter: drop-shadow(0 0 4px #fff) drop-shadow(0 0 8px #49f6ff); } }
.tabs { display: flex; gap: 5px; margin: 28px 0 18px; padding: 5px; background: rgba(8, 6, 14, .45); border: 1px solid var(--line); border-radius: 14px; width: fit-content; }
.tab { border: 0; background: transparent; color: var(--muted); padding: 10px 15px; border-radius: 10px; cursor: pointer; }
.tab.active { color: var(--ink); background: var(--panel-2); box-shadow: 0 2px 8px #09061180; }
.hidden { display: none !important; }
.section-heading { display: flex; justify-content: space-between; align-items: end; gap: 18px; margin: 26px 0 12px; }
.section-heading h2, .section-heading p { margin-bottom: 0; }
.subtle { color: var(--muted); font-size: .9rem; }
.grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: 18px; padding: 17px; box-shadow: 0 18px 35px rgba(0,0,0,.14); backdrop-filter: blur(16px); }
.mission { position: relative; overflow: hidden; display: flex; flex-direction: column; }
.mission::after { content: ""; position: absolute; width: 90px; height: 90px; border-radius: 50%; background: var(--accent, #6b4fa0); filter: blur(55px); right: -10px; top: -15px; opacity: .38; }
.mission-art { position: relative; z-index: 1; aspect-ratio: 3 / 2; margin: -17px -17px 14px; overflow: hidden; background: #171121; }
.mission-art::after { content: ""; position: absolute; inset: auto 0 0; height: 42%; background: linear-gradient(transparent, rgba(26,19,39,.9)); pointer-events: none; }
.mission-art img { width: 100%; height: 100%; display: block; object-fit: cover; transition: transform .45s ease; }
.mission:hover .mission-art img { transform: scale(1.035); }
.long-run-badge { position: absolute; z-index: 2; right: 9px; top: 9px; padding: 5px 8px; border: 1px solid rgba(255,213,106,.42); border-radius: 999px; background: rgba(20,13,28,.82); color: var(--gold); font-size: .6rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; backdrop-filter: blur(8px); }
.mission h3 { margin-bottom: 6px; }
.mission-meta, .gear-meta { color: var(--muted); font-size: .82rem; }
.reward-line { color: #dbcfa9; font-size: .88rem; min-height: 42px; }.dev-reward-note { display: block; margin-top: 4px; color: #e0bd75; font-size: .58rem; font-weight: 800; letter-spacing: .04em; text-transform: uppercase; }
.mission-requirements { display: grid; gap: 5px; margin: 0 0 13px; padding: 10px; border: 1px solid var(--line); border-radius: 10px; background: rgba(7,5,12,.3); }
.mission-requirements > b { margin-bottom: 2px; color: #d8c9aa; font-size: .68rem; letter-spacing: .06em; text-transform: uppercase; }
.requirement { display: flex; justify-content: space-between; gap: 10px; color: var(--muted); font-size: .72rem; }
.requirement strong { color: #b8adc2; }
.requirement.met span,.requirement.met strong { color: #82ddb0; }
.requirement.missing span,.requirement.missing strong { color: #db8e8e; }
.requirement.pending span { color: #d6c58e; }
.prepared-adventurer { padding: 7px 10px; border: 1px solid rgba(255,213,106,.25); border-radius: 999px; color: var(--gold); font-size: .72rem; }
.mission .mission-button { margin-top: auto; }
.default-load-note { margin: 12px 0; padding: 9px; border: 1px solid rgba(114,223,170,.2); border-radius: 9px; background: rgba(58,137,97,.08); color: #9bd9ba; font-size: .72rem; text-align: center; }
.button { width: 100%; border: 1px solid rgba(255, 213, 106, .28); border-radius: 11px; color: #21180b; background: linear-gradient(135deg, #ffe39a, #f2ba46); font-weight: 800; padding: 11px 13px; cursor: pointer; position: relative; z-index: 1; }
.button:hover { filter: brightness(1.08); transform: translateY(-1px); }
.button:disabled { filter: grayscale(.6); opacity: .48; cursor: not-allowed; transform: none; }
.button.secondary { color: var(--ink); background: #392d50; border-color: var(--line); }
.mission-button { min-height: 58px; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; line-height: 1.05; }
.mission-button span { display: block; white-space: nowrap; }
.mission-button small { display: block; font-size: .72rem; font-weight: 700; opacity: .72; white-space: nowrap; }
.kit-selector { display: flex; gap: 8px; margin: 12px 0; }
.kit-chip { flex: 1; color: var(--muted); border: 1px solid var(--line); background: rgba(255,255,255,.025); border-radius: 10px; padding: 7px; cursor: pointer; font-size: .78rem; }
.kit-chip.selected { color: var(--ink); border-color: rgba(255,213,106,.4); background: rgba(255,213,106,.08); }
.kit-chip.busy { opacity: .45; }
.expedition-contract { display: flex; align-items: center; justify-content: space-between; gap: 18px; border-color: rgba(255,213,106,.22); }
.expedition-contract > div { display: grid; gap: 3px; }
.expedition-contract b { font-family: Georgia,serif; font-size: 1.15rem; }
.expedition-contract span:not(.contract-kicker) { color: var(--muted); font-size: .8rem; }
.expedition-contract .mini-button { flex: 0 0 auto; }
.contract-kicker { color: var(--gold); font-size: .61rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.empty-contract { border-style: dashed; }
.tavern-hero { position: relative; min-height: 180px; display: flex; align-items: end; overflow: hidden; padding: 28px; border: 1px solid rgba(255,190,88,.25); border-radius: 20px; background: radial-gradient(circle at 78% 45%,rgba(255,170,65,.22),transparent 25%),linear-gradient(105deg,#2d1830,#171121 62%); box-shadow: inset 0 0 60px #0006; }
.tavern-hero::after { content: "♨"; position: absolute; right: 10%; top: 21%; color: #ffd989; font-size: 5rem; opacity: .22; filter: drop-shadow(0 0 18px #ffae42); }
.tavern-hero h2 { margin: 0 0 6px; font-size: 2.25rem; }
.tavern-hero p:last-child { max-width: 540px; margin: 0; color: #c9bdcf; }
.tavern-contract { margin-top: 14px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 18px; border-color: rgba(255,213,106,.25); }
.tavern-contract h3 { margin: 4px 0; }
.tavern-contract p { margin: 0; color: var(--muted); }
.tavern-contract .button { width: auto; min-width: 180px; }
.tavern-contract-actions { display: flex; gap: 8px; }
.tavern-grid { grid-template-columns: repeat(2,1fr); }
.tavern-card { position: relative; display: grid; grid-template-columns: 62px 1fr; column-gap: 14px; }
.tavern-card.busy { opacity: .62; }
.adventurer-portrait { grid-row: 1 / span 3; width: 62px; height: 72px; display: grid; place-items: center; border: 1px solid rgba(255,213,106,.22); border-radius: 15px; background: radial-gradient(circle,#49375d,#21172f); font-size: 2rem; box-shadow: inset 0 0 20px #0007; }
.adventurer-portrait img,.portrait img { width: 100%; height: 100%; display: block; object-fit: cover; border-radius: inherit; }
.tavern-card h3 { margin: 18px 0 3px; font-family: Georgia,serif; font-size: 1.2rem; }
.tavern-card > .subtle { margin: 0; }
.tavern-status { position: absolute; right: 17px; top: 13px; color: var(--gold); font-size: .65rem; }
.origin-badge { grid-column: 1 / -1; width: fit-content; margin-top: 10px; padding: 4px 8px; border: 1px solid rgba(126,202,164,.24); border-radius: 999px; color: #9bd9ba; background: rgba(58,137,97,.08); font-size: .65rem; }
.origin-badge.traveler { border-color: rgba(179,130,255,.28); color: #c9adf4; background: rgba(137,82,206,.09); }
.adventurer-level { grid-column: 1 / -1; margin: 14px 0 8px; padding: 10px 12px; border: 1px solid rgba(255,213,106,.14); border-radius: 10px; background: #130f1d88; }
.adventurer-level > b,.adventurer-level > span { display: block; }
.adventurer-level > span,.adventurer-level > small { color: var(--muted); font-size: .72rem; }
.xp-track { height: 5px; margin-top: 7px; overflow: hidden; border-radius: 999px; background: #08060d; }
.xp-track i { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg,#b273ff,#ffe28a); box-shadow: 0 0 7px #b273ff; }
.fallen-memorial { margin-top: 22px; padding: 20px; border: 1px solid rgba(192,174,202,.15); border-radius: 16px; background: linear-gradient(135deg,#16121d,#0d0b11); }
.fallen-memorial > div:first-child span { color: #9f91a8; font-size: .65rem; letter-spacing: .18em; }
.fallen-memorial h3 { margin: 3px 0 14px; font-family: Georgia,serif; }
.fallen-list { display: grid; grid-template-columns: repeat(2,1fr); gap: 8px; }
.fallen-entry { display: grid; grid-template-columns: auto 1fr; column-gap: 9px; align-items: center; padding: 9px; border-radius: 9px; background: #09070d99; filter: grayscale(.75); }
.fallen-entry > span { grid-row: 1 / span 2; font-size: 1.35rem; opacity: .65; }
.fallen-entry > span { width: 38px; height: 38px; overflow: hidden; border-radius: 9px; }.fallen-entry > span img { width: 100%; height: 100%; object-fit: cover; }
.fallen-entry small { color: #8d8492; }
.default-kit { grid-column: 1 / -1; display: grid; gap: 4px; margin: 14px 0; padding: 11px; border: 1px solid var(--line); border-radius: 11px; background: rgba(0,0,0,.14); }
.default-kit b { color: #d9caa5; font-size: .78rem; }
.default-kit span { color: var(--muted); font-size: .72rem; }
.tavern-actions { grid-column: 1 / -1; display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.tavern-actions.single-action { grid-template-columns: 1fr; }
.tavern-actions .button { min-height: 51px; padding: 9px; font-size: .76rem; }
.cannot-afford { grid-column: 1 / -1; margin-top: 7px; color: var(--danger); font-size: .7rem; text-align: center; }
.contract-actions { display: flex; gap: 7px; }
.party-equipment-window { width: min(940px,100%); }
.planner-head-actions { display: flex !important; gap: 7px; }
.planner-mission-summary { padding: 14px 16px 0; }
.planner-mission-summary.active { display: grid; grid-template-columns: minmax(170px,.55fr) 1fr; gap: 16px; align-items: center; padding-bottom: 14px; border-bottom: 1px solid var(--line); background: linear-gradient(90deg,rgba(255,213,106,.06),transparent); }
.planner-mission-summary.active > div:first-child { display: grid; }
.planner-mission-summary.active .mission-requirements { grid-template-columns: repeat(3,1fr); margin: 0; }
.planner-mission-summary.active .mission-requirements > b { grid-column: 1 / -1; }
.planner-mission-summary.active .requirement { display: grid; gap: 2px; }
.planner-adventurer-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; padding: 16px; }
.planner-adventurer { position: relative; display: grid; grid-template-columns: 62px 1fr; gap: 5px 12px; padding: 13px; border: 1px solid var(--line); border-radius: 14px; background: #241b33; }
.planner-adventurer.qualified { border-color: rgba(114,223,170,.38); box-shadow: inset 0 0 25px rgba(70,180,122,.06); }
.planner-adventurer .adventurer-portrait { grid-row: 1 / span 2; }
.planner-adventurer h3,.planner-adventurer p { margin: 0; }
.planner-adventurer p { color: var(--muted); font-size: .75rem; }
.planner-rank { position: absolute; right: 13px; top: 12px; color: var(--gold); font-size: .66rem; }
.planner-stats { grid-column: 1 / -1; display: flex; gap: 6px; margin-top: 7px; }
.planner-stats span { flex: 1; padding: 6px; border-radius: 7px; background: #120e1c; color: var(--muted); font-size: .68rem; text-align: center; }
.planner-adventurer .button { grid-column: 1 / -1; margin-top: 5px; }
.party-power-strip { display: flex; justify-content: space-between; align-items: center; padding: 11px 16px; border-bottom: 1px solid var(--line); color: var(--muted); font-size: .78rem; }
.party-power-strip b { color: var(--gold); font-size: 1rem; }
.party-kit-presets { display: grid; gap: 9px; padding: 13px 16px; border-bottom: 1px solid var(--line); background: #171121; }
.party-kit-presets > div:first-child { display: flex; justify-content: space-between; gap: 12px; align-items: baseline; }
.party-kit-presets > div:first-child span { color: var(--muted); font-size: .68rem; }
.party-kit-preset-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(155px,1fr)); gap: 8px; }
.party-kit-preset { display: grid; gap: 3px; padding: 9px 11px; border: 1px solid var(--line); border-radius: 10px; background: #251c35; color: var(--ink); text-align: left; cursor: pointer; }
.party-kit-preset:hover:not(:disabled),.party-kit-preset.selected { border-color: var(--gold); background: #342642; }
.party-kit-preset span { color: var(--muted); font-size: .65rem; }.party-kit-preset small { color: var(--gold); font-size: .58rem; text-transform: uppercase; letter-spacing: .08em; }
.party-kit-preset:disabled { opacity: .42; cursor: not-allowed; }
.party-equipment-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; padding: 16px; }
.party-slot-card { display: flex; flex-direction: column; min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 15px; background: #241b33; }
.party-slot-card.uncommon { border-color: rgba(105,223,163,.4); }
.party-slot-card.rare { border-color: rgba(123,157,255,.55); }
.party-slot-card.epic { border-color: rgba(190,117,255,.62); }
.party-slot-card.legendary { border-color: rgba(255,190,65,.78); box-shadow: inset 0 0 35px rgba(255,174,42,.11); }
.party-slot-card.mythic { border-color: rgba(255,95,215,.8); box-shadow: inset 0 0 40px rgba(213,66,255,.14); }
.party-slot-card h3 { margin: 10px 0 4px; }
.party-slot-card .gear-meta { min-height: 30px; margin-bottom: 8px; }
.party-item-select { display: grid; gap: 5px; margin-top: auto; }
.party-item-select > span { color: var(--gold); font-size: .65rem; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }
.party-equipment-footer { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; padding: 0 16px 16px; }
.active-run { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 15px; }
.field-party-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.field-party-grid .active-run { position: relative; grid-template-columns: auto 1fr; padding-top: 34px; }
.field-party-grid .active-run .active-run-actions { grid-column: 1 / -1; }
.party-slot-number { position: absolute; left: 14px; top: 11px; color: var(--gold); font-size: .62rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.field-party-slot { position: relative; min-height: 170px; display: grid; align-content: center; gap: 13px; padding-top: 38px; border-style: dashed; }
.field-party-slot b { font-family: Georgia,serif; font-size: 1.05rem; }.field-party-slot p { margin: 4px 0 0; color: var(--muted); font-size: .76rem; }
.portrait { width: 48px; height: 48px; border-radius: 14px; display: grid; place-items: center; font-size: 1.6rem; background: #352b4c; }
.active-run h3, .active-run p { margin-bottom: 3px; }
.progress { height: 7px; background: #110e1c; border-radius: 9px; overflow: hidden; margin-top: 8px; }
.progress > span { display: block; height: 100%; background: linear-gradient(90deg, var(--purple), var(--gold)); border-radius: inherit; transition: width .4s; }
.forge-status { color: #cdb9f4; font-size: .72rem; margin: 7px 0 0 !important; letter-spacing: .02em; }
.claim { width: auto; min-width: 110px; }
.active-run-actions { display: grid; grid-template-columns: minmax(110px,.55fr) 1fr; gap: 8px; }
.active-run-actions .claim { width: 100%; }.cancel-run { border-color: rgba(255,137,144,.35); color: #ffc1c6; background: #45232d; }
@media (max-width:760px) { .field-party-grid { grid-template-columns: 1fr; } }
.kit-card { border-top: 2px solid var(--gold); }
.kit-title { display: flex; justify-content: space-between; align-items: center; }
.power { color: var(--gold); font-weight: 800; }
.kit-actions { display: flex; gap: 6px; margin-top: 11px; }
.mini-button { border: 1px solid var(--line); background: #382d4c; color: var(--ink); border-radius: 8px; padding: 7px 10px; cursor: pointer; font-size: .76rem; }
.mini-button:hover { filter: brightness(1.14); }
.mini-button:disabled { opacity: .38; cursor: not-allowed; }
.mini-button.danger { color: #ffafb2; }
.new-kit-form { display: flex; gap: 6px; }
.new-kit-form input { min-width: 0; border: 1px solid var(--line); background: rgba(0,0,0,.2); color: var(--ink); border-radius: 9px; padding: 8px 10px; }
.slots { display: grid; gap: 8px; margin-top: 13px; }
.slot { display: flex; align-items: center; gap: 9px; padding: 9px; background: rgba(0,0,0,.15); border-radius: 10px; font-size: .86rem; }
.slot .glyph { font-size: 1.15rem; }
.slot small { color: var(--muted); margin-left: auto; }
.inventory { grid-template-columns: repeat(4, 1fr); }
.gear { min-height: 260px; display: flex; flex-direction: column; position: relative; }
.gear.common { border-color: rgba(255,255,255,.11); }
.gear.uncommon { border-color: rgba(105, 223, 163, .32); }
.gear.rare { border-color: rgba(123, 157, 255, .45); box-shadow: inset 0 0 32px rgba(87, 117, 255, .06); }
.gear.epic { border-color: rgba(190, 117, 255, .52); box-shadow: inset 0 0 36px rgba(168, 85, 255, .1); }
.gear.legendary, .store-card.legendary { border-color: rgba(255, 190, 65, .72); box-shadow: inset 0 0 44px rgba(255, 174, 42, .13), 0 16px 44px rgba(220, 126, 24, .1); }
.gear.mythic, .store-card.mythic { border-color: rgba(255, 95, 215, .76); box-shadow: inset 0 0 48px rgba(213, 66, 255, .16), 0 16px 48px rgba(127, 53, 255, .15); }
.gear.artifact:not(.legendary):not(.mythic) { border-color: rgba(255, 213, 106, .62); box-shadow: inset 0 0 42px rgba(255, 192, 64, .12), 0 16px 42px rgba(130, 72, 255, .12); }
.gear.artifact::before { content: "✦"; position: absolute; z-index: 2; left: 10px; top: 8px; color: var(--gold); text-shadow: 0 0 12px var(--gold); }
.gear.selected-kit-item { border-color: rgba(255,220,119,.9); box-shadow: inset 0 0 32px rgba(255,204,91,.09),0 0 15px rgba(175,105,255,.2); }
.kit-twinkle-border { position: absolute; z-index: 5; inset: -2px; border: 2px solid rgba(255,221,124,.7); border-radius: inherit; pointer-events: none; animation: selected-kit-border 2.2s ease-in-out infinite; }
.kit-twinkle-border i { position: absolute; width: 9px; height: 9px; background: #fff6ba; clip-path: polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%); filter: drop-shadow(0 0 4px #fff) drop-shadow(0 0 8px #d48aff); animation: item-twinkle 1.6s ease-in-out infinite; }
.kit-twinkle-border i:nth-child(1) { left: 12%; top: -5px; }.kit-twinkle-border i:nth-child(2) { right: 13%; top: -5px; animation-delay: -.8s; }.kit-twinkle-border i:nth-child(3) { right: -5px; top: 34%; animation-delay: -1.25s; }.kit-twinkle-border i:nth-child(4) { right: 20%; bottom: -5px; animation-delay: -.45s; }.kit-twinkle-border i:nth-child(5) { left: 16%; bottom: -5px; animation-delay: -1.05s; }.kit-twinkle-border i:nth-child(6) { left: -5px; top: 58%; animation-delay: -.2s; }
.stack-count { position: absolute; z-index: 3; left: 10px; top: 10px; min-width: 30px; padding: 4px 7px; border-radius: 999px; background: #fff0b6; color: #30200a; font-weight: 900; font-size: .74rem; text-align: center; box-shadow: 0 4px 12px #0007; }
.gear-visual { width: 100%; aspect-ratio: 1; max-height: 190px; border-radius: 13px; display: grid; place-items: center; overflow: hidden; position: relative; background: radial-gradient(circle, rgba(255,213,106,.12), rgba(0,0,0,.2)); }
.gear-visual img { width: 100%; height: 100%; object-fit: cover; display: block; animation: reveal-art .45s ease-out; }
.gear-visual .glyph { font-size: 3rem; filter: drop-shadow(0 8px 15px #0008); }
.item-vfx { position: absolute; z-index: 2; inset: 0; overflow: hidden; pointer-events: none; mix-blend-mode: screen; }
.named-item-shine { position: absolute; z-index: 2; inset: 0; overflow: hidden; pointer-events: none; background: radial-gradient(circle at 72% 18%,rgba(255,255,226,.18),transparent 19%); }
.named-item-shine::after { content: ""; position: absolute; top: -45%; bottom: -45%; left: -55%; width: 24%; rotate: 18deg; background: linear-gradient(90deg,transparent,rgba(255,249,211,.2),transparent); filter: blur(3px); animation: named-item-sheen 5.8s ease-in-out infinite; }
.item-vfx i { position: absolute; display: block; pointer-events: none; }
.vfx-twinkle i { width: 7px; height: 7px; left: 14%; top: 18%; background: #fff7bd; clip-path: polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%); filter: drop-shadow(0 0 5px #ffd45f); animation: item-twinkle 1.7s ease-in-out infinite; }
.vfx-twinkle i:nth-child(2) { left: 76%; top: 13%; animation-delay: -.4s; }
.vfx-twinkle i:nth-child(3) { left: 84%; top: 48%; animation-delay: -1.1s; scale: 1.3; }
.vfx-twinkle i:nth-child(4) { left: 21%; top: 69%; animation-delay: -.8s; scale: .65; }
.vfx-twinkle i:nth-child(5) { left: 62%; top: 78%; animation-delay: -1.45s; }
.vfx-twinkle i:nth-child(6) { left: 44%; top: 29%; animation-delay: -.2s; scale: .55; }
.vfx-twinkle i:nth-child(7) { left: 72%; top: 62%; animation-delay: -1.25s; scale: .75; }
.vfx-twinkle i:nth-child(8) { left: 35%; top: 50%; animation-delay: -1.6s; scale: .8; }
.vfx-glitter-fountain i { --dx: 0px; left: 50%; bottom: 11%; width: 5px; height: 5px; border-radius: 50%; background: #e9c7ff; box-shadow: 0 0 5px #fff,0 0 10px #a65cff; animation: glitter-fountain 2.35s ease-in infinite; }
.vfx-glitter-fountain i:nth-child(3n+1) { --dx: -42px; background: #8ffcff; }
.vfx-glitter-fountain i:nth-child(3n+2) { --dx: 38px; background: #fff3a0; }
.vfx-glitter-fountain i:nth-child(4n) { --dx: -18px; width: 8px; height: 8px; clip-path: polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%); }
.vfx-glitter-fountain i:nth-child(2) { animation-delay: -.2s; }.vfx-glitter-fountain i:nth-child(3) { animation-delay: -.4s; }.vfx-glitter-fountain i:nth-child(4) { animation-delay: -.6s; }.vfx-glitter-fountain i:nth-child(5) { animation-delay: -.8s; }.vfx-glitter-fountain i:nth-child(6) { animation-delay: -1s; }.vfx-glitter-fountain i:nth-child(7) { animation-delay: -1.2s; }.vfx-glitter-fountain i:nth-child(8) { animation-delay: -1.4s; }.vfx-glitter-fountain i:nth-child(9) { animation-delay: -1.6s; }.vfx-glitter-fountain i:nth-child(10) { animation-delay: -1.8s; }.vfx-glitter-fountain i:nth-child(11) { animation-delay: -2s; }.vfx-glitter-fountain i:nth-child(12) { animation-delay: -2.2s; }.vfx-glitter-fountain i:nth-child(13) { animation-delay: -.35s; }.vfx-glitter-fountain i:nth-child(14) { animation-delay: -1.55s; }
.vfx-divine-aura { background: radial-gradient(circle at 50% 52%,rgba(255,249,185,.35),rgba(255,224,98,.1) 34%,transparent 67%); animation: divine-aura-pulse 2.4s ease-in-out infinite; }
.vfx-divine-aura::before,.vfx-divine-aura::after { content: ""; position: absolute; inset: 12%; border: 2px solid rgba(255,244,171,.54); border-radius: 50%; filter: drop-shadow(0 0 9px #ffe478); animation: divine-ring 5.5s linear infinite; }
.vfx-divine-aura::after { inset: 20%; border-style: dotted; animation-direction: reverse; animation-duration: 4s; }
.vfx-divine-aura i { left: 50%; top: 50%; width: 2px; height: 52%; background: linear-gradient(transparent,#fff8bc,transparent); transform-origin: 50% 0; opacity: .38; }
.vfx-divine-aura i:nth-child(2) { rotate: 60deg; }.vfx-divine-aura i:nth-child(3) { rotate: 120deg; }.vfx-divine-aura i:nth-child(4) { rotate: 180deg; }.vfx-divine-aura i:nth-child(5) { rotate: 240deg; }.vfx-divine-aura i:nth-child(6) { rotate: 300deg; }
.vfx-flame { background: linear-gradient(transparent 48%,rgba(255,62,19,.12)); filter: drop-shadow(0 0 9px #ff5a1f); }
.vfx-flame i { left: 18%; bottom: -12%; width: 20%; height: 58%; border-radius: 55% 45% 62% 38%; background: radial-gradient(ellipse at 50% 90%,#fff2a1 0 10%,#ff9a22 26%,#ef3519 58%,transparent 72%); transform-origin: 50% 100%; animation: magic-flame 1.45s ease-in-out infinite alternate; }
.vfx-flame i:nth-child(2) { left: 31%; height: 72%; animation-delay: -.7s; }.vfx-flame i:nth-child(3) { left: 45%; height: 52%; animation-delay: -.25s; }.vfx-flame i:nth-child(4) { left: 59%; height: 68%; animation-delay: -.95s; }.vfx-flame i:nth-child(5) { left: 72%; height: 48%; animation-delay: -.5s; }.vfx-flame i:nth-child(6) { left: 39%; width: 14%; height: 83%; animation-delay: -1.15s; }.vfx-flame i:nth-child(7) { left: 55%; width: 13%; height: 78%; animation-delay: -.35s; }
.vfx-starfall i { left: 12%; top: -18%; width: 7px; height: 7px; background: #fffbe0; clip-path: polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%); filter: drop-shadow(0 0 5px #fff) drop-shadow(0 0 10px #b970ff); animation: starfall-stream 2.15s linear infinite; }
.vfx-starfall i::after { content: ""; position: absolute; left: 50%; bottom: 60%; width: 2px; height: 28px; background: linear-gradient(transparent,#d8b4ff); transform: rotate(-35deg); transform-origin: bottom; }
.vfx-starfall i:nth-child(2) { left: 28%; animation-delay: -.35s; scale: .65; }.vfx-starfall i:nth-child(3) { left: 44%; animation-delay: -1.15s; scale: 1.3; }.vfx-starfall i:nth-child(4) { left: 63%; animation-delay: -.75s; }.vfx-starfall i:nth-child(5) { left: 81%; animation-delay: -1.75s; scale: .75; }.vfx-starfall i:nth-child(6) { left: 20%; animation-delay: -1.45s; }.vfx-starfall i:nth-child(7) { left: 54%; animation-delay: -.18s; scale: .55; }.vfx-starfall i:nth-child(8) { left: 73%; animation-delay: -1.05s; scale: 1.15; }.vfx-starfall i:nth-child(9) { left: 36%; animation-delay: -1.95s; }.vfx-starfall i:nth-child(10) { left: 90%; animation-delay: -.55s; scale: .6; }.vfx-starfall i:nth-child(11) { left: 8%; animation-delay: -1.3s; scale: .8; }.vfx-starfall i:nth-child(12) { left: 67%; animation-delay: -2.05s; scale: .5; }
.gear h3 { font-size: 1rem; margin: 8px 0 4px; }
.gear .button { padding: 7px; font-size: .76rem; }
.gear-actions { display: grid; gap: 6px; margin-top: auto; }
.art-button { border-color: rgba(169,122,255,.32) !important; color: #dbcaff !important; }
.rarity { text-transform: uppercase; font-size: .66rem; letter-spacing: .12em; color: var(--green); }
.rare .rarity { color: #8eaaff; } .epic .rarity { color: #cc8cff; } .legendary .rarity { color: #ffc45e; } .mythic .rarity { color: #ff78df; }
.equipped-tag { display: block; width: fit-content; max-width: 100%; margin: 7px 0 0; padding: 4px 7px; overflow: hidden; border: 1px solid rgba(255,213,106,.2); border-radius: 7px; background: rgba(255,213,106,.06); color: var(--gold); font-size: .63rem; text-overflow: ellipsis; white-space: nowrap; }
.new-haul-tag { position: absolute; z-index: 4; left: 50%; top: 9px; transform: translateX(-50%); padding: 4px 8px; border: 1px solid rgba(114,223,170,.42); border-radius: 999px; background: #173829e8; color: #a8f4cd; font-size: .6rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; box-shadow: 0 4px 13px #0008; }
.binding { display: inline-flex; width: fit-content; margin: 7px 0; border-radius: 999px; padding: 4px 7px; font-size: .62rem; font-weight: 850; letter-spacing: .055em; text-transform: uppercase; }
.binding.bound { color: #a8eaff; background: rgba(88,196,255,.12); border: 1px solid rgba(105,209,255,.25); }
.binding.unbound { color: #ffb0a1; background: rgba(255,104,79,.1); border: 1px solid rgba(255,125,92,.22); }
.gear-power-line { margin: 7px 0 0; }.item-type-icon { display: inline-grid; place-items: center; margin-left: 3px; font-size: .9rem; vertical-align: -.08em; filter: drop-shadow(0 1px 2px #0008); }
.armory-options { display: grid; justify-items: end; gap: 7px; }
.stack-toggle { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: .78rem; cursor: pointer; }
.stack-toggle input { position: absolute; opacity: 0; pointer-events: none; }
.stack-toggle span { width: 32px; height: 18px; border-radius: 999px; background: #2b233c; border: 1px solid var(--line); position: relative; transition: .2s; }
.stack-toggle span::after { content: ""; position: absolute; width: 12px; height: 12px; border-radius: 50%; left: 2px; top: 2px; background: var(--muted); transition: .2s; }
.stack-toggle input:checked + span { background: rgba(169,122,255,.34); border-color: rgba(169,122,255,.5); }
.stack-toggle input:checked + span::after { left: 16px; background: #e0ccff; }
.store-grid { align-items: stretch; }
.store-card { position: relative; display: flex; flex-direction: column; overflow: hidden; }
.store-card::after { content: ""; position: absolute; width: 140px; height: 140px; right: -40px; top: -45px; border-radius: 50%; background: currentColor; opacity: .06; filter: blur(30px); pointer-events: none; }
.store-card.epic { color: #cf9bff; border-color: rgba(190, 117, 255, .52); }
.store-card.legendary { color: #ffc65b; }
.store-card.mythic { color: #ff7fe1; }
.store-card h3 { color: var(--ink); font-family: Georgia, serif; font-size: 1.18rem; margin: 12px 0 5px; }
.store-card .button { margin-top: auto; }
.store-rarity { text-transform: uppercase; letter-spacing: .18em; font-size: .68rem; font-weight: 900; margin-bottom: 9px; }
.store-price { color: var(--gold); font-size: .82rem; font-weight: 850; letter-spacing: .04em; }
.store-visual { max-height: none; position: relative; }
.store-forging { position: absolute; bottom: 13px; color: var(--muted); font-size: .68rem; }
.store-card.sold { filter: saturate(.65); }
.store-card.sold .store-visual::after { content: "OWNED"; position: absolute; inset: 0; display: grid; place-items: center; background: rgba(15, 10, 24, .62); color: var(--gold); font-size: 1.25rem; font-weight: 950; letter-spacing: .16em; }
.store-note { margin-top: 14px; display: flex; gap: 12px; align-items: center; flex-wrap: wrap; color: var(--muted); }
.store-note b { color: var(--gold); white-space: nowrap; }
.ledger { max-width: 720px; }
.principles { display: grid; gap: 11px; counter-reset: item; padding: 0; }
.principles li { list-style: none; background: rgba(255,255,255,.025); border: 1px solid var(--line); border-radius: 12px; padding: 13px; color: #d4ccdb; }
.principles b { color: var(--ink); }
.toast { position: fixed; z-index: 20; left: 50%; top: 18px; transform: translate(-50%, -120px); opacity: 0; background: #fff1bd; color: #241a0c; border-radius: 12px; padding: 11px 16px; font-weight: 750; box-shadow: 0 12px 40px #0008; transition: .28s ease; pointer-events: none; }
.toast.show { transform: translate(-50%, 0); opacity: 1; }
.spark { position: fixed; z-index: 30; color: var(--gold); pointer-events: none; animation: sparkle .8s ease-out forwards; }
.loot-celebration { position: fixed; z-index: 25; inset: 0; overflow: hidden; pointer-events: auto; cursor: pointer; touch-action: manipulation; perspective: 900px; }
.falling-loot { position: absolute; z-index: 2; left: var(--x); top: -70px; opacity: 0; transform-style: preserve-3d; backface-visibility: visible; animation: loot-fall var(--duration) cubic-bezier(.34,.08,.7,.56) var(--delay) forwards; }
.gold-token { --loot-height: 26px; width: 26px; height: 26px; transform-style: preserve-3d; }
.coin-body { position: absolute; inset: 0; display: block; transform-style: preserve-3d; }
.coin-layer { position: absolute; inset: 0; display: block; border-radius: 50%; }
.coin-rim { transform: translateZ(var(--coin-depth)); border: 2px solid #f5c34c; background: linear-gradient(90deg, #8b4706, #d98c16 24%, #ffdf65 48%, #b96108 76%, #6f3504); box-shadow: inset 0 0 0 1px #7f4007; }
.coin-rim:nth-child(2n) { background: linear-gradient(90deg, #6e3304, #bd6910 28%, #efb83a 52%, #914706 78%, #572602); }
.coin-face { border: 2px solid #fff0a2; background: radial-gradient(circle at 34% 28%, #fff7bd 0 8%, #ffd24c 26%, #bd6b0b 72%); box-shadow: inset -3px -4px 3px #8d480a, inset 2px 2px 2px #fff1a0; backface-visibility: hidden; }
.coin-front { transform: translateZ(4px); }
.coin-back { transform: rotateY(180deg) translateZ(4px); background: radial-gradient(circle at 66% 28%, #fff2a0 0 7%, #efb82f 27%, #a95708 75%); }
.coin-face::after { content: "✦"; position: absolute; inset: 0; display: grid; place-items: center; color: #8e5109; text-shadow: 0 1px #ffe690; font-size: .7rem; font-weight: 900; }
.coin-back::after { content: "◆"; color: #743b08; }
.gem-token { --loot-height: 46px; width: 46px; height: 46px; position: absolute; animation-name: gem-fall; }
.gem-token img { width: 100%; height: 100%; display: block; object-fit: contain; filter: drop-shadow(0 5px 5px #000a) drop-shadow(0 0 8px rgba(181,112,255,.55)); }
.loot-pile-glow { position: absolute; z-index: 1; left: 8%; right: 8%; bottom: -34px; height: 90px; border-radius: 50%; background: radial-gradient(ellipse, rgba(255,211,79,.42), rgba(157,85,255,.15) 45%, transparent 72%); animation: pile-glow 2.2s ease-out .7s both; }
.loot-prize-reveal { position: absolute; z-index: 5; left: var(--card-x); bottom: var(--card-bottom); width: min(38vw, 164px); padding: 10px 10px 13px; overflow: hidden; border: 2px solid #8e6c37; border-radius: 13px; background: linear-gradient(145deg, #3d294c, #170d24 52%, #2c173c); box-shadow: inset 0 0 0 3px #180d22, inset 0 0 0 5px rgba(225,184,103,.56), 0 20px 42px #000c; text-align: center; transform-origin: 50% 100%; animation: prize-drop var(--card-duration) cubic-bezier(.3,.05,.72,.62) var(--card-delay) both; }
.loot-prize-reveal::before { content: ""; position: absolute; z-index: 0; inset: 6px; border: 1px solid rgba(255,224,154,.42); border-radius: 8px; pointer-events: none; }
.loot-prize-reveal::after { content: ""; position: absolute; z-index: 3; top: -30%; bottom: -30%; width: 35%; left: -55%; background: linear-gradient(90deg, transparent, rgba(255,249,204,.28), transparent); transform: skewX(-17deg); animation: card-foil 2.8s ease-in-out 2.7s infinite; pointer-events: none; }
.loot-prize-reveal.legendary { border-color: #f1bd54; background: linear-gradient(145deg, #5d3517, #211025 48%, #563615); box-shadow: inset 0 0 0 3px #20101d, inset 0 0 0 5px #e7b94f, 0 0 34px rgba(255,178,48,.44), 0 22px 52px #000d; }
.loot-prize-reveal.mythic { border-color: #ff87e4; background: linear-gradient(145deg, #552267, #1b0b2d 50%, #51204e); box-shadow: inset 0 0 0 3px #200c29, inset 0 0 0 5px #d963dc, 0 0 38px rgba(213,66,255,.48), 0 22px 52px #000d; }
.loot-prize-art { position: relative; z-index: 1; aspect-ratio: 1; margin: 3px; overflow: hidden; border: 1px solid rgba(255,226,153,.62); border-radius: 7px; display: grid; place-items: center; background: radial-gradient(circle, rgba(255,213,106,.18), rgba(0,0,0,.28)); box-shadow: 0 5px 15px #0008; }
.loot-prize-art img { width: 100%; height: 100%; object-fit: cover; }
.loot-prize-art .glyph { font-size: 4rem; }
.loot-prize-reveal strong, .loot-prize-reveal > span { display: block; }
.loot-prize-reveal strong { position: relative; z-index: 1; margin: 3px 9px 0; color: #fff5cf; font: 700 .86rem/1.12 Georgia, serif; text-transform: none; text-shadow: 0 2px 4px #000; }
.loot-prize-reveal > span:last-child { position: relative; z-index: 1; margin-top: 5px; color: #ffc45e; font-size: .56rem; letter-spacing: .13em; text-transform: uppercase; }
.loot-prize-reveal .card-kicker { position: relative; z-index: 1; margin-top: 7px; color: #bfa6c9; font-size: .49rem; letter-spacing: .15em; text-transform: uppercase; }
.card-corner { position: absolute; z-index: 2; color: #f4cc72; font: 700 .68rem Georgia, serif; text-shadow: 0 0 7px #ffd568; }
.card-corner.top { left: 9px; top: 8px; }
.card-corner.bottom { right: 9px; bottom: 7px; transform: rotate(180deg); }
@keyframes sparkle { to { transform: translate(var(--dx), var(--dy)) rotate(100deg) scale(.2); opacity: 0; } }
@keyframes reveal-art { from { opacity: 0; transform: scale(1.08); filter: brightness(2); } }
@keyframes named-item-sheen { 0%,68% { left: -55%; opacity: 0; } 73% { opacity: .85; } 88%,100% { left: 135%; opacity: 0; } }
@keyframes item-twinkle { 0%,100% { opacity: .18; scale: .55; rotate: 0deg; } 50% { opacity: 1; scale: 1.45; rotate: 90deg; } }
@keyframes selected-kit-border { 0%,100% { border-color: rgba(255,221,124,.45); box-shadow: 0 0 5px rgba(255,211,92,.2),inset 0 0 4px rgba(175,105,255,.08); } 50% { border-color: rgba(255,244,190,.95); box-shadow: 0 0 13px rgba(255,211,92,.48),inset 0 0 10px rgba(175,105,255,.2); } }
@keyframes glitter-fountain { 0% { opacity: 0; transform: translate(-50%,12px) scale(.25); } 18% { opacity: 1; } 48% { opacity: 1; transform: translate(calc(-50% + var(--dx)),-82px) scale(1.15); } 72% { opacity: .82; transform: translate(calc(-50% + var(--dx)),-58px) scale(.9); } 100% { opacity: 0; transform: translate(calc(-50% + var(--dx)),18px) scale(.2); } }
@keyframes divine-aura-pulse { 0%,100% { opacity: .62; filter: brightness(.9); } 50% { opacity: 1; filter: brightness(1.45); } }
@keyframes divine-ring { to { transform: rotate(360deg) scale(1.03); } }
@keyframes magic-flame { 0% { opacity: .55; transform: skewX(-7deg) scale(.82,1); filter: hue-rotate(-8deg); } 100% { opacity: .95; transform: skewX(8deg) scale(1.08,.88); filter: hue-rotate(12deg); } }
@keyframes starfall-stream { 0% { opacity: 0; transform: translate(-28px,-10px) rotate(0deg); } 12% { opacity: 1; } 75% { opacity: 1; } 100% { opacity: 0; transform: translate(42px,235px) rotate(190deg); } }
@keyframes prize-drop { 0% { opacity: 0; transform: translate(-50%, -115vh) rotate(var(--card-tilt)); } 10% { opacity: 1; } 82% { transform: translate(-50%, 0) rotate(var(--card-tilt)); } 91% { transform: translate(-50%, -18px) rotate(var(--card-tilt)); } 100% { opacity: 1; transform: translate(-50%, 0) rotate(var(--card-tilt)); } }
@keyframes card-foil { 0%,35% { left: -55%; opacity: 0; } 50% { opacity: 1; } 68%,100% { left: 125%; opacity: 0; } }
@keyframes loot-fall {
  0% { left: var(--x); top: -70px; opacity: 0; transform: rotateZ(var(--rotation-0)) rotateY(0deg) rotateX(12deg) scale(.65); }
  12% { opacity: 1; }
  38% { transform: rotateZ(var(--rotation-38)) rotateY(var(--tumble-38)) rotateX(48deg) scale(.86); }
  70% { transform: rotateZ(var(--rotation-70)) rotateY(var(--tumble-70)) rotateX(-32deg) scale(1); }
  82% { left: var(--x); top: calc(100dvh - var(--pile-y) - var(--loot-height) - env(safe-area-inset-bottom, 0px)); transform: rotateZ(var(--rotation-82)) rotateY(var(--tumble-82)) rotateX(0deg) scale(1); }
  91% { top: calc(100dvh - var(--pile-y) - var(--loot-height) - 16px - env(safe-area-inset-bottom, 0px)); transform: rotateZ(var(--rotation-91)) rotateY(var(--tumble-91)) rotateX(18deg) scale(1); }
  100% { left: var(--x); top: calc(100dvh - var(--pile-y) - var(--loot-height) - env(safe-area-inset-bottom, 0px)); opacity: 1; transform: rotateZ(var(--rotation-100)) rotateY(var(--tumble-100)) rotateX(0deg) scale(1); }
}
@keyframes gem-fall {
  0% { left: var(--x); top: -80px; opacity: 0; transform: rotateZ(var(--rotation-0)) scale(.7); }
  12% { opacity: 1; }
  82% { left: var(--x); top: calc(100dvh - var(--pile-y) - var(--loot-height) - env(safe-area-inset-bottom, 0px)); transform: rotateZ(var(--rotation-82)) scale(1); }
  91% { top: calc(100dvh - var(--pile-y) - var(--loot-height) - 18px - env(safe-area-inset-bottom, 0px)); transform: rotateZ(var(--rotation-91)) scale(1); }
  100% { left: var(--x); top: calc(100dvh - var(--pile-y) - var(--loot-height) - env(safe-area-inset-bottom, 0px)); opacity: 1; transform: rotateZ(var(--rotation-100)) scale(1); }
}
@keyframes pile-glow { from { opacity: 0; transform: scaleX(.4); } to { opacity: 1; transform: scaleX(1); } }
.empty { color: var(--muted); text-align: center; padding: 26px; }

@media (max-width: 760px) {
  .fallen-list { grid-template-columns: 1fr; }
  .grid, .inventory { grid-template-columns: 1fr 1fr; }
  .tavern-grid { grid-template-columns: 1fr; }
  .kit-viewer-grid { grid-template-columns: 1fr; }
  .planner-adventurer-grid { grid-template-columns: 1fr; }
  .topbar { display: block; }
  .treasury-view { width: 100%; min-height: 184px; margin-top: 16px; }
  .treasury-view .wallet { margin-top: 0; }
  .active-run { grid-template-columns: auto 1fr; }
  .active-run .active-run-actions { grid-column: 1 / -1; }
}
@media (max-width: 480px) {
  .shell { padding: 18px 13px 55px; }
  .topbar { display: block; }
  .wallet { justify-content: flex-start; margin-top: 13px; }
  .tabs { width: 100%; overflow-x: auto; }
  .tab { flex: 0 0 auto; padding-inline: 10px; }
  .tab { font-size: .82rem; }
  .grid, .inventory { grid-template-columns: 1fr; }
  .mission { padding: 15px; }
  .mission-art { margin: -15px -15px 14px; }
  .section-heading { align-items: stretch; flex-direction: column; }
  .new-kit-form { width: 100%; }
  .new-kit-form input { flex: 1; }
  .armory-options { justify-items: stretch; }
  .gem-wallet { justify-content: flex-start; max-width: none; }
  .expedition-contract,.tavern-contract { align-items: stretch; flex-direction: column; grid-template-columns: 1fr; }
  .tavern-contract .button { width: 100%; }
  .tavern-actions,.party-equipment-grid,.party-equipment-footer { grid-template-columns: 1fr; }
  .planner-mission-summary.active { grid-template-columns: 1fr; }
  .planner-mission-summary.active .mission-requirements { grid-template-columns: 1fr; }
  .tavern-contract-actions,.contract-actions { flex-direction: column; }
}