.loot-window { width:min(550px,calc(100vw - 18px)); max-width:none; height:min(760px,calc(100dvh - 38px)); max-height:calc(100dvh - 38px); padding:0; overflow:hidden; border:3px solid #acbde9; border-radius:14px; background:linear-gradient(125deg,#555871,#44445f); color:#fff; box-shadow:inset 0 0 0 4px #737d9d,0 6px #303751,0 20px 80px #0009; }
.loot-window[open] { display:flex; flex-direction:column; }
.loot-window::backdrop { background:#080d20ab; backdrop-filter:blur(2px); }
.loot-window > .loot-window-header { flex-shrink:0; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:9px 12px; border-bottom:5px solid #363c65; background:linear-gradient(#a3b2dd,#717da7 70%,#59638a); }
.loot-window-header > span { width:30px; color:#d9ebff; font-size:24px; text-align:center; }
.loot-window-header h2 { margin:0; color:#fff; font:800 25px/1.2 Arial,sans-serif; text-shadow:0 2px #353b56; }
.loot-window-header .dialog-close { width:38px; height:38px; min-height:38px; padding:0; border:2px solid #ffc5db; border-radius:8px; color:white; font-size:30px; background:linear-gradient(#fa8eb8,#d33172); box-shadow:0 3px #713554; }
.loot-window-body { flex:1; min-height:0; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; padding:7px 12px 12px; }
.loot-window-body > section:not([hidden]) { min-height:100%; display:flex; flex-direction:column; }
.loot-time { position:relative; display:grid; justify-items:center; gap:3px; padding:5px 35px 12px; font-size:14px; font-weight:700; }
.loot-time strong { color:#48ffc2; font-size:16px; font-variant-numeric:tabular-nums; }
.loot-info-button { position:absolute; right:3px; top:6px; padding:0; width:30px; min-height:30px; border:2px solid #b1c6e6; border-radius:5px; background:linear-gradient(#a1bad5,#426089); color:#fff; font:bold 23px/1 Georgia,serif; text-shadow:0 2px #273950; }
.loot-income { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:6px; padding:10px 0; border-block:2px solid #797a93; margin-bottom:10px; }
.loot-income span { display:flex; align-items:center; justify-content:center; gap:5px; min-width:0; color:#ffec71; font-size:13px; }
.loot-income img { width:28px; height:32px; object-fit:contain; }
.loot-reward-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:12px; align-content:start; padding:16px 12px; border:2px solid #8a8ca5; border-radius:5px; background:#35364e77; min-height:220px; }
#loot-items { flex:1; }
.loot-actions { display:grid; grid-template-columns:1fr 1fr; gap:16px; align-items:stretch; }
.loot-actions .loot-action { width:100%; max-width:none; margin:0; min-height:52px; }
#quick-loot { background:linear-gradient(#fff8a9 0 45%,#ffd72d 46%,#ffb316); }
.loot-actions small { display:block; font-size:11px; margin-top:3px; }
#quick-loot-status { margin:8px 0 2px; }
#loot-refresh { align-self:center; min-height:32px; font-size:12px; }
.loot-reward-card { position:relative; min-width:0; width:100%; padding:2px; aspect-ratio:1; border:2px solid #d0d4e0; background:radial-gradient(ellipse at center,#565973,#171e2b); box-shadow:inset 0 0 4px #fff7,0 2px 3px #202038; border-radius:0; }
.loot-reward-card img { display:block; width:100%; height:100%; aspect-ratio:1; object-fit:contain; }
.loot-reward-card strong { position:absolute; bottom:1px; right:2px; color:#fff; font-size:13px; line-height:1; text-shadow:0 1px 2px #000,1px 0 #000; }
.loot-reward-card small { position:absolute; bottom:0; left:1px; color:#ffeb62; font-size:12px; letter-spacing:-3px; text-shadow:0 1px #594619; }
.loot-reward-card.starter { border-color:#68d68c; }.loot-reward-card.rare { border-color:#69b6f0; }.loot-reward-card.epic { border-color:#bb75ec; }.loot-reward-card.legendary { border-color:#ead076; }.loot-reward-card.ancient { border-color:#f39a52; }.loot-reward-card.mystic { border-color:#ef4979; }
.loot-window p.loot-caption { margin:9px 0; text-align:center; color:#e3e4f4; font-size:12px; line-height:1.4; }
.loot-empty { grid-column:1/-1; text-align:center; color:#c8cbdc; }
.loot-action { display:block; margin:12px auto 16px; width:180px; max-width:90%; min-height:48px; padding:8px 12px; border:2px solid #fff1a4; border-radius:6px; color:#3c3e23; font-size:17px; font-weight:800; text-shadow:0 1px #fff9; box-shadow:inset 0 0 0 3px #ffffff33,0 4px #866223; }
.loot-green { background:linear-gradient(#e0ff91 0 43%,#a9e52d 45%,#83c721); border-color:#d5fa8f; box-shadow:inset 0 0 0 3px #ffffff33,0 4px #3f702a; }
.loot-gold { background:linear-gradient(#fff188 0 43%,#ffcb25 45%,#ffb117); }
.loot-action:disabled { filter:grayscale(.85); opacity:.65; cursor:not-allowed; }
.loot-tabs { flex-shrink:0; display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:0 48px 5px; border-top:4px solid #8e9ac4; }
.loot-tabs button { position:relative; border:2px solid #737b9f; border-top:0; border-radius:0 0 10px 10px; min-height:52px; padding:9px; color:#fff; font-size:16px; font-weight:750; background:linear-gradient(#626784,#37384f); text-shadow:0 2px #303044; box-shadow:0 3px #252d45; }
.loot-tabs [aria-selected=true] { background:linear-gradient(#8b9ed4,#7387cb); border-color:#b4c4fa; box-shadow:inset 0 -4px 6px #9db6ff,0 3px #323a59; }
.treasure-badge { position:absolute; right:4px; top:4px; width:11px; height:11px; border:2px solid #ffe894; border-radius:50%; background:#ff633e; box-shadow:0 0 3px #ffd053; }
.treasure-progress { flex-shrink:0; display:flex; align-items:center; gap:7px; min-height:80px; padding:7px; border:2px solid #7f829e; background:#33334960; border-radius:5px; }
.treasure-progress img { width:53px; height:53px; object-fit:contain; }
.treasure-progress > div { position:relative; flex:1; text-align:center; min-width:0; }
.treasure-progress strong { display:block; color:#58ffc2; font-size:12px; line-height:1.35; margin-bottom:10px; }
.treasure-progress progress { width:100%; height:18px; border:1px solid #202037; background:#242539; border-radius:3px; accent-color:#22d6c7; }
.treasure-progress progress::-webkit-progress-bar { background:#242539; }
.treasure-progress progress::-webkit-progress-value { background:linear-gradient(#62eed5,#05a8b5); }
.treasure-progress span { position:absolute; bottom:3px; inset-inline:0; color:white; font:bold 11px Arial,sans-serif; text-shadow:0 1px 2px #000; }
.treasure-display { flex:1; position:relative; display:flex; flex-direction:column; align-items:center; margin-top:6px; padding:16px 10px 4px; border:2px solid #7f829e; border-radius:4px; background:radial-gradient(ellipse at 50% 50%,#64547545,#33334f66); }
.treasure-display h3,.treasure-result h3 { margin:0; color:white; font-size:21px; text-align:center; text-shadow:0 2px #25273a; }
.treasure-display h3 { width:75%; background:#30304766; padding:5px; border-radius:4px; }
.treasure-display .loot-info-button { top:18px; right:12px; }
.treasure-stage { width:100%; flex:1; display:grid; grid-template-columns:32px minmax(0,1fr) 32px; align-items:center; justify-items:center; min-height:120px; }
.treasure-stage > img { width:min(100%,230px); max-height:29dvh; aspect-ratio:1; object-fit:contain; filter:drop-shadow(0 12px 10px #17152766); }
.treasure-arrow { min-width:32px; min-height:44px; padding:0; border:0; color:#adbbf3; background:none; font-size:27px; text-shadow:0 3px #2b2a45; }
.treasure-display .loot-action { margin:7px auto; }
.treasure-choices { flex-shrink:0; display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:5px; padding:7px 3px 0; }
.treasure-choice { position:relative; display:grid; justify-items:center; min-width:0; border:2px solid transparent; border-radius:6px; background:none; padding:2px; color:#fff; }
.treasure-choice img { width:64px; max-width:100%; height:55px; object-fit:contain; }
.treasure-choice span { font-size:10px; white-space:nowrap; }
.treasure-choice strong { font-size:14px; text-shadow:0 1px #191b2d; }
.treasure-choice[aria-pressed=true] { background:#a293cc27; border-color:#d9c78f; }
.treasure-result { flex:1; padding:18px 0 5px; }
.treasure-result .loot-reward-grid { margin-top:14px; min-height:0; padding:8px; gap:8px; border:0; background:none; }
.treasure-hero-reward { grid-column:1/-1; display:grid; justify-items:center; color:white; gap:4px; padding:5px; }
.treasure-hero-reward img { width:112px; height:112px; object-fit:contain; background:radial-gradient(#667ca1,#28314b); border:2px solid #d2a754; }
.treasure-hero-reward span { color:#ffdb51; letter-spacing:2px; }
.treasure-hero-reward small { color:#b9ffd8; }
.loot-info-dialog { background:#484a67; border:3px solid #aab9e5; color:#fff; }
.loot-info-dialog p,.loot-info-dialog li { color:#e4e7ff; font-size:13px; line-height:1.65; }
.loot-bonus-open { width:auto; padding:4px 6px; font:700 12px Arial,sans-serif; }
.loot-time:has(.loot-bonus-open) { padding-inline:70px; }
.idle-bonus-dialog { height:min(850px,calc(100dvh - 28px)); max-height:calc(100dvh - 28px); }
.idle-bonus-dialog #loot-info-content { flex:1; overflow:auto; padding:8px 12px; min-height:0; scrollbar-width:thin; }
#idle-bonus-footer { flex-shrink:0; padding:3px 0 8px; border-top:2px solid #838eaf; background:linear-gradient(#646c92,#454c72); }
.idle-bonus-dialog .loot-window-header h2 { font:800 22px/1.2 Arial,sans-serif; }
.idle-bonus-summary { display:grid; grid-template-columns:1.35fr repeat(3,1fr); align-items:center; gap:6px; padding:5px 0; }
.idle-bonus-summary > div { display:flex; align-items:center; justify-content:center; gap:4px; color:#5cffb4; font-size:13px; }
.idle-bonus-summary img { width:23px; height:26px; object-fit:contain; }
.idle-bonus-summary .idle-bonus-power { flex-direction:column; align-items:flex-start; color:#fff276; }
.idle-bonus-power small { font-size:10px; }
.idle-bonus-roster { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px 16px; padding:9px 5px; }
.idle-bonus-hero { position:relative; aspect-ratio:1; min-width:0; max-height:82px; border:2px solid #a6b3d4; background:radial-gradient(#7571ad,#30324a); box-shadow:inset 0 0 0 3px #626986,0 2px 3px #20223c; display:grid; place-items:center; }
.idle-bonus-hero img { width:100%; height:100%; object-fit:contain; }
.idle-bonus-hero > b { position:absolute; top:1px; right:3px; font-size:12px; text-shadow:0 1px 3px #000; }
.idle-bonus-hero > small { position:absolute; bottom:1px; left:0; right:0; text-align:center; color:#ffe775; font-size:11px; letter-spacing:-1px; text-shadow:0 1px 2px #000; }
.idle-bonus-hero > span { color:#aab4d4; font-size:23px; }
.idle-bonus-hero.is-locked { opacity:.65; border-color:#747a96; }
.idle-bonus-dialog p.idle-bonus-note { text-align:center; font-weight:700; color:#fff28c; margin:5px 0 12px; line-height:1.4; }
.idle-income-sheet { padding:8px; border:3px solid #b6bdd5; border-radius:6px; background:linear-gradient(#eaf2f7,#d8e4ed); color:#253850; }
.idle-income-sheet h3 { margin:3px 0; text-align:center; font-size:15px; }
.idle-income-sheet .idle-bonus-summary > div { color:#087e50; }
.idle-income-sheet .idle-bonus-summary .idle-bonus-power { color:#5f4d1b; }
.idle-income-sheet table { width:100%; border-collapse:collapse; font-variant-numeric:tabular-nums; table-layout:fixed; }
.idle-income-sheet caption { background:#afb8cf; padding:5px; font-weight:800; }
.idle-income-sheet th,.idle-income-sheet td { padding:7px 1px; text-align:center; font-size:12px; overflow-wrap:anywhere; }
.idle-income-sheet thead th { font-size:10px; color:#4c576a; }
.idle-income-sheet tbody th { text-align:left; }
.idle-income-sheet tbody tr:nth-child(odd) { background:#fff5; }
.idle-income-sheet td:last-child { font-weight:800; }
.income-exp { color:#00769c; }.income-gold { color:#8c6700; }.income-souls { color:#a02d9d; }
.idle-bonus-dialog .idle-income-sheet p { color:#087749; font-size:11px; line-height:1.45; margin:8px 0 0; }
.idle-drop-details { margin-top:12px; font-size:12px; color:#e4e7ff; }
.idle-drop-details summary { cursor:pointer; font-weight:700; padding:7px; background:#34395088; border-radius:4px; }
.idle-bonus-dialog .loot-action { margin:12px auto 8px; }
@media(max-height:700px) { .idle-bonus-roster { gap:5px 12px; padding-block:5px; }.idle-bonus-hero { width:min(100%,46px); justify-self:center; }.idle-income-sheet th,.idle-income-sheet td { padding-block:4px; }.idle-bonus-dialog p.idle-bonus-note { font-size:11px; margin-bottom:6px; }.idle-bonus-dialog .loot-action { min-height:40px; margin:5px auto; }.idle-bonus-dialog .loot-window-header h2 { margin:2px 0; } }
@media(max-width:390px) { .idle-bonus-roster { gap:8px 12px; }.idle-bonus-summary > div { font-size:11px; gap:2px; }.idle-bonus-summary img { width:19px; }.idle-income-sheet th,.idle-income-sheet td { font-size:10px; }.idle-bonus-dialog .loot-window-header h2 { font-size:19px; }.idle-bonus-dialog #loot-info-content { padding:6px 9px; } }
.loot-window button:focus-visible { outline:3px solid #ffe280; outline-offset:2px; }
@media(max-width:480px) { .loot-window-header h2 { font-size:22px; }.loot-window-body { padding:6px 10px 8px; }.loot-income { gap:3px; }.loot-income span { font-size:11px; gap:3px; }.loot-income img { width:23px; height:28px; }.loot-reward-grid { gap:9px; padding:14px 9px; }.loot-reward-card strong { font-size:11px; }.loot-reward-card small { font-size:11px; }.loot-tabs { padding-inline:42px; }.loot-tabs button { font-size:14px; }.treasure-progress img { width:42px; height:46px; }.treasure-progress strong { font-size:10px; }.treasure-stage > img { width:min(100%,205px); }.treasure-display h3 { font-size:18px; }.treasure-choice span { font-size:9px; } }
@media(max-height:670px) { .loot-window { height:calc(100dvh - 18px); max-height:calc(100dvh - 18px); }.loot-window-header { min-height:48px; }.loot-reward-grid { min-height:150px; }.treasure-progress { min-height:64px; }.treasure-display { padding-top:8px; }.treasure-stage > img { max-height:23dvh; }.treasure-choices img { height:40px; }.loot-window p.loot-caption { margin:6px 0; }.loot-action { margin:8px auto; min-height:43px; }.loot-tabs button { min-height:44px; } }
