.quest-launcher { position: fixed; z-index: 36; right: max(12px, calc((100vw - 660px) / 2 + 12px)); bottom: calc(190px + env(safe-area-inset-bottom)); width: 70px; padding: 0; border: 0; background: none; color: #fff0bc; text-shadow: 0 2px 2px #000; display: none; }
body[data-screen="hub"] .quest-launcher, body[data-screen="castle"] .quest-launcher { display: grid; justify-items: center; }
.quest-launcher img { width: 64px; height: 64px; filter: drop-shadow(0 3px 3px #0009); }
.quest-launcher strong { margin-top: -5px; font-size: 13px; }
.quest-launcher i { position: absolute; top: 5px; right: 7px; width: 13px; height: 13px; border: 2px solid #ffe688; background: #ff553d; border-radius: 50%; }
.quest-dialog { width: min(550px, calc(100% - 16px)); max-width: none; height: min(760px, calc(100dvh - 32px)); max-height: calc(100dvh - 32px); padding: 0; overflow: hidden; color: #fff; background: #4d4e69; border: 3px solid #aab9e5; border-radius: 15px; box-shadow: inset 0 0 0 4px #727d9f, 0 6px #293348, 0 15px 80px #0009; }
.quest-dialog[open] { display: flex; flex-direction: column; }
.quest-dialog::backdrop { background: #080d20ac; }
.quest-dialog > header { flex-shrink: 0; display: flex; gap: 8px; align-items: center; justify-content: space-between; margin: 0; padding: 9px 12px; border-bottom: 5px solid #343b63; background: linear-gradient(#9caedc, #6c78a3 68%, #535d85); }
.quest-dialog > header img { width: 33px; height: 33px; }
.quest-dialog > header h2 { font-family: inherit; font-weight: 800; line-height: 1.15; font-size: 23px; margin: 0; color: #fff; text-shadow: 0 2px #323a54; }
.quest-dialog > header button { width: 38px; min-height: 38px; padding: 0; font-size: 30px; color: #fff; background: linear-gradient(#fa92bc, #d23776); border: 2px solid #ffc9dc; border-radius: 8px; box-shadow: 0 3px #713553; }
.quest-content { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.quest-activity { position: relative; isolation: isolate; flex-shrink: 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); align-items: center; padding: 12px 6px 6px; background: #626080; border-bottom: 2px solid #777491; }
#quest-activity-progress { position: absolute; z-index: -1; top: 34px; left: 8.333%; width: 83.334%; height: 15px; border: 2px solid #30384d; background: #30384d; accent-color: #23dce8; }
#quest-activity-progress::-webkit-progress-bar { background: #30384d; }
#quest-activity-progress::-webkit-progress-value { background: linear-gradient(#66f6ff, #119fcf); transition: width .25s ease; }
#quest-activity-progress::-moz-progress-bar { background: #23dce8; }
.quest-points { display: grid; text-align: center; line-height: 1.1; }
.quest-points span { font-size: 30px; color: #70e0fb; text-shadow: 0 2px #173b69; }
.quest-points b { color: #56ffb7; font-size: 17px; }
.quest-points small { font-size: 10px; color: #dedff8; }
.quest-chests { display: grid; grid-column: 2 / -1; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 3px; }
.quest-chests button { position: relative; min-width: 0; padding: 2px; border: 1px solid transparent; background: none; color: #fff; border-radius: 6px; }
.quest-chest-art { display: block; width: min(100%, 58px); aspect-ratio: 1; margin: auto; background: url('/art/summoning/chest-atlas.webp') 0 0 / 200% 200% no-repeat; filter: saturate(.65); }
.quest-chests b { display: block; font-size: 13px; }
.quest-chests .is-ready { border-color: #fee086; background: #9a804633; }
.quest-chests .is-ready .quest-chest-art { filter: drop-shadow(0 0 4px #ffd158); }
.quest-chests .is-claimed .quest-chest-art { background-position: 0 100%; filter: saturate(.8); }
.quest-row.is-claimed { opacity: .6; }
.quest-chests span { position: absolute; top: 0; right: 0; font-size: 15px; color: #94ff65; text-shadow: 0 1px 2px #000; }
.quest-prizes { margin: 0; padding: 7px 12px; min-height: 40px; font-size: 11px; line-height: 1.35; color: #fff0b0; background: #3e415c; }
#quest-list { flex: 1; min-height: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-width: thin; }
.quest-row { display: grid; grid-template-columns: 44px minmax(0, 1fr) 65px; gap: 10px; align-items: center; min-height: 94px; padding: 13px 12px; border-bottom: 1px solid #71718d; }
.quest-row:nth-child(even) { background: #ffffff06; }
.quest-medal { display: grid; place-items: center; border: 2px solid #7bacdb; background: linear-gradient(135deg, #26385f, #526e9c, #273d58); height: 48px; color: #f6de83; font-size: 27px; text-shadow: 0 2px #222; }
.quest-medal small { font-size: 12px; color: white; margin-top: -9px; }
.quest-row h3 { font-size: 13px; line-height: 1.4; margin: 0 0 9px; color: #fff; }
.quest-meter { position: relative; height: 16px; }
.quest-meter progress { display: block; width: 100%; height: 16px; accent-color: #24d7e3; border: 1px solid #28273a; border-radius: 2px; background: #292a40; }
.quest-meter progress::-webkit-progress-bar { background: #292a40; }
.quest-meter progress::-webkit-progress-value { background: linear-gradient(#5bf7ff, #16c3d9); }
.quest-meter progress::-moz-progress-bar { background: #21d7e1; }
.quest-meter span { position: absolute; inset: 0; text-align: center; font-size: 11px; font-weight: 800; text-shadow: 0 1px 2px #000, 1px 0 #000; }
.quest-row button { min-width: 0; width: 100%; min-height: 36px; padding: 3px; font-size: 14px; }
.quest-go { border: 2px solid #d5fa96; border-radius: 6px; color: #344912; background: linear-gradient(#e6ff9a, #a2e53b 50%, #7fb82b); font-weight: 800; box-shadow: 0 3px #436219; }
.quest-row button:disabled { background: #515870; color: #d0d6e4; border-color: #7c83a3; box-shadow: none; }
.quest-status { flex-shrink: 0; min-height: 15px; margin: 0; padding: 3px 10px; font-size: 11px; color: #bbffd6; }
.quest-content footer { display: flex; flex-shrink: 0; align-items: center; gap: 12px; padding: 9px 12px; border-top: 1px solid #8788a3; background: #43485f; }
.quest-content footer > div { flex: 1; min-width: 0; }
.quest-content footer b { color: #5cffb7; font-size: 13px; }
.quest-content footer small { display: block; font-size: 10px; color: #d4d5e8; line-height: 1.3; margin-top: 3px; }
.quest-content footer button { min-width: 110px; min-height: 39px; padding: 6px 15px; font-size: 14px; }
.quest-tabs { display: grid; grid-template-columns: repeat(3, 1fr); flex-shrink: 0; gap: 3px; padding: 0 7px 7px; background: #43485f; }
.quest-tabs button { min-height: 45px; border: 1px solid #8996c2; border-radius: 0 0 8px 8px; background: linear-gradient(#555c84, #333d61); color: #fff; font-weight: 800; }
.quest-tabs [aria-selected="true"] { background: linear-gradient(#899fd6, #596fc0); border-color: #c3deff; box-shadow: inset 0 -3px #9cc4ff; }
#quest-locked { flex: 1; padding: 30px; text-align: center; }
.quest-dialog [hidden] { display: none !important; }
.quest-dialog :focus-visible, .quest-launcher:focus-visible { outline: 3px solid #fff19b; outline-offset: 2px; }
@media (max-width: 400px) { .quest-row { gap: 7px; padding: 12px 9px; } .quest-dialog > header h2 { font-size: 21px; } }
@media (prefers-reduced-motion: reduce) { #quest-activity-progress::-webkit-progress-value { transition: none; } }
