/* Pass 2 quest UI. It is intentionally separate from the legacy inventory UI. */
#questUI { position: fixed; inset: 0; z-index: 18; pointer-events: none; color: #f2e6c8; -webkit-font-smoothing: antialiased; }
#questUI button { font: inherit; }
.quest-panel { position: absolute; top: min(250px, 28vh); right: 16px; width: clamp(260px, 23vw, 340px); max-height: 42vh; overflow: auto; pointer-events: auto; border: 1px solid rgba(200,160,74,.35); border-radius: 12px; background: rgba(12,10,8,.76); box-shadow: 0 10px 28px rgba(0,0,0,.38), inset 0 1px rgba(255,240,190,.06); transition-property: opacity, transform; transition-duration: .25s; }
.quest-panel > header, .quest-log > header, .quest-dialog > header { display: flex; align-items: center; justify-content: space-between; min-height: 40px; padding: 0 12px; font: 700 13px/1 Cinzel, Georgia, serif; color: #e8d8a8; letter-spacing: .06em; }
.quest-panel header button, .quest-log header button, .quest-dialog header button { width: 40px; height: 40px; min-width: 40px; padding: 0; color: #e8d8a8; background: transparent; }
.quest-panel.collapsed { width: auto; max-height: none; border-radius: 20px; }.quest-panel.collapsed header span { display: none; }
.tracker-block { position: relative; display: block; width: calc(100% - 16px); margin: 0 8px 8px; padding: 9px 11px 9px 14px; text-align: left; border: 0; border-left: 3px solid var(--q-color); border-radius: 7px; background: rgba(255,255,255,.035); color: #ede3cc; transition-property: background, transform; transition-duration: .2s; }
.tracker-block:hover, .tracker-block.focused { background: rgba(255,212,90,.1); transform: translateX(-2px); }.tracker-title { display: flex; justify-content: space-between; gap: 8px; color: var(--q-color); font-size: 14px; font-weight: 700; }.tracker-title small { color: #b9ae96; font-size: 11px; white-space: nowrap; }
.q-return { margin-top: 7px; color: #ffd45a; font-size: 12px; animation: q-glow 2s ease-in-out infinite; }.tracker-empty, .tracker-more { padding: 0 12px 12px; color: #b9ae96; font-size: 12px; }.reward-waiting { display: block; width: calc(100% - 16px); margin: 0 8px 8px; min-height: 40px; color: #ffe59b; background: rgba(255,212,90,.1); }
.quest-log { position: absolute; top: 50%; left: 20px; width: min(840px, calc(100vw - 40px)); max-height: min(72vh, 680px); transform: translateY(-50%); overflow: hidden; pointer-events: auto; border: 1px solid rgba(200,160,74,.5); border-radius: 16px; background: linear-gradient(145deg, rgba(30,23,16,.98), rgba(9,7,5,.98)); box-shadow: 0 24px 68px rgba(0,0,0,.65); }.quest-log h2 { margin: 0; font: 700 20px Cinzel, Georgia, serif; text-wrap: balance; }.quest-log h2 small { color: #b9ae96; font: 11px Georgia, serif; }.quest-log-body { display: grid; grid-template-columns: minmax(190px, .8fr) minmax(310px, 1.4fr); max-height: calc(min(72vh, 680px) - 45px); }.quest-log nav { overflow-y: auto; padding: 4px 8px 14px; background: rgba(0,0,0,.18); }.quest-log-group h3 { margin: 13px 7px 5px; color: #b9ae96; font: 700 11px Cinzel, Georgia, serif; letter-spacing: .1em; }.quest-log-row { display: flex; width: 100%; gap: 8px; padding: 8px; text-align: left; color: #e6d9bd; background: transparent; border: 0; border-radius: 7px; }.quest-log-row:hover, .quest-log-row.selected { background: rgba(255,212,90,.11); }.quest-log-row i { width: 20px; height: 20px; flex: 0 0 20px; display: grid; place-items: center; border-radius: 50%; color: #160d05; font-style: normal; font-weight: 700; }.quest-log-row span { display: grid; gap: 2px; }.quest-log-row small { color: #b9ae96; font-size: 11px; }.quest-log article { overflow-y: auto; padding: 20px 24px; }.quest-log article h2 { color: #ffe59b; }.quest-type { margin: 0 0 4px; font: 700 11px Cinzel, Georgia, serif; letter-spacing: .12em; }.quest-giver { margin-top: 4px; color: #b9ae96; font-size: 13px; text-transform: capitalize; }.reward-bonuses span { padding: 5px 8px; border-radius: 5px; color: #ffe2a2; background: rgba(255,212,90,.09); font-size: 12px; }.quest-log footer { display: flex; flex-wrap: wrap; gap: 8px; }.quest-log footer button { min-height: 40px; padding: 9px 13px; }.danger { color: #ffb0a0 !important; }
.quest-modal { position: absolute; inset: 0; display: grid; place-items: center; pointer-events: auto; background: rgba(0,0,0,.52); }.quest-dialog { width: min(540px, calc(100vw - 32px)); max-height: min(80vh, 720px); overflow-y: auto; padding: 0 17px 17px; border: 1px solid rgba(232,190,95,.6); border-radius: 16px; background: linear-gradient(145deg, #21160e, #0d0906); box-shadow: 0 25px 70px rgba(0,0,0,.72); }.quest-dialog header h2 { margin: 2px 0 0; color: #ffe59b; font-size: 22px; }.quest-dialog header small { color: #b9ae96; letter-spacing: 0; }
.reward-card { position: absolute; top: 42%; left: 50%; width: min(540px, 90vw); transform: translate(-50%, -50%); pointer-events: auto; }.reward-card.compact { top: min(610px, 66vh); right: 16px; left: auto; width: min(340px, calc(100vw - 32px)); transform: none; }.reward-frame { position: relative; overflow: hidden; padding: 28px 32px 22px; border: 1px solid rgba(255,213,90,.7); border-radius: 18px; text-align: center; background: linear-gradient(145deg, #362311, #130b05 68%); box-shadow: 0 22px 60px rgba(0,0,0,.7), inset 0 0 30px rgba(255,185,62,.1); animation: reward-in .35s cubic-bezier(.2,1.35,.4,1) both; }.reward-frame > p { margin: 0; color: #ffd45a; font: 700 13px Cinzel, Georgia, serif; letter-spacing: .18em; }.reward-frame h2 { margin: 5px 0 16px; color: #f2e6c8; font: 700 21px Cinzel, Georgia, serif; text-wrap: balance; }.reward-rays { position: absolute; inset: -28%; opacity: .28; background: repeating-conic-gradient(from 0deg, transparent 0 12deg, #ffd45a 13deg 16deg, transparent 17deg 30deg); animation: ray-turn 30s linear infinite; }.reward-numbers { display: flex; justify-content: center; flex-wrap: wrap; gap: 14px; color: #ffe6a1; font-size: 16px; }.reward-numbers b { font-variant-numeric: tabular-nums; }.reward-items { display: flex; flex-wrap: wrap; justify-content: center; gap: 8px; margin: 17px 0; }.reward-item { display: grid; gap: 2px; min-width: 92px; padding: 8px; border-radius: 7px; font-size: 12px; color: #f2e6c8; background: rgba(255,255,255,.06); animation: item-reveal .24s ease-out both; }.reward-item small { color: #ffcf8a; }.reward-item.q-magic, .reward-choice .q-magic { box-shadow: 0 0 12px rgba(120,120,255,.55); }.reward-item.q-rare, .reward-choice .q-rare { box-shadow: 0 0 12px rgba(240,224,96,.55); }.reward-item.q-unique, .reward-choice .q-unique { box-shadow: 0 0 12px rgba(200,168,106,.65); }.reward-bonuses { display: flex; justify-content: center; flex-wrap: wrap; gap: 7px; margin: 14px 0; }.reward-choice { display: grid; gap: 8px; margin: 18px 0; }.reward-choice h3 { margin: 0; color: #ffe59b; font: 700 14px Cinzel, Georgia, serif; }.reward-choice button { min-height: 44px; padding: 9px; color: #f2e6c8; background: rgba(255,255,255,.07); }.reward-choice button:hover { transform: scale(1.02); filter: brightness(1.12); }.reward-choice kbd { margin-right: 8px; color: #ffd45a; }.reward-choice.chosen { opacity: .3; transform: scale(.9); transition: opacity .2s, transform .2s; }.reward-continue { min-height: 40px; padding: 8px 16px; color: #fff0bd; background: transparent; animation: q-fade .5s ease-out both; }
#discoveryStack { position: absolute; top: 19vh; left: 50%; width: min(640px, calc(100vw - 32px)); transform: translateX(-50%); display: grid; justify-items: center; gap: 8px; }.zone-banner, .act-title, .quest-toast { width: 100%; padding: 16px 24px; text-align: center; border: 1px solid rgba(255,212,90,.5); border-radius: 12px; background: linear-gradient(90deg, transparent, rgba(23,15,8,.9) 15%, rgba(23,15,8,.9) 85%, transparent); box-shadow: 0 12px 34px rgba(0,0,0,.5); animation: banner-in .5s cubic-bezier(.2,1.2,.4,1) both; }.zone-banner small, .act-title small, .quest-toast small { display: block; color: rgba(255,212,90,.82); font: 700 11px Cinzel, Georgia, serif; letter-spacing: .18em; }.zone-banner strong, .act-title strong, .quest-toast strong { display: block; margin: 4px 0; color: #f2e6c8; font: 700 clamp(24px, 3vw, 40px) Cinzel, Georgia, serif; text-wrap: balance; }.zone-banner span, .act-title span { color: #b9ae96; font-size: 13px; }.act-title { padding: 24px; }.act-title strong { color: #ffd45a; font-size: clamp(30px, 4vw, 52px); }.quest-toast { width: min(330px, 90vw); padding: 10px 18px; }.quest-toast strong { font-size: 19px; }.landmark-toast { position: fixed; top: min(620px, 70vh); right: 16px; display: flex; gap: 9px; align-items: center; min-width: 220px; padding: 10px; border-radius: 9px; background: rgba(12,10,8,.88); box-shadow: 0 10px 24px rgba(0,0,0,.42); animation: slide-right .25s ease-out both; }.landmark-toast span { display: grid; gap: 2px; }.landmark-toast small { color: #b9ae96; }
.level-addons { position: absolute; top: 30%; left: 50%; transform: translateX(-50%); width: min(480px, 90vw); padding: 18px; text-align: center; pointer-events: none; animation: banner-in .45s cubic-bezier(.2,1.2,.4,1) both; }.level-addons > strong { position: relative; display: block; color: #ffe59b; font: 700 clamp(42px, 7vw, 64px) Cinzel, Georgia, serif; text-shadow: 0 0 20px rgba(255,196,76,.65), 0 3px 4px #000; }.level-addons > div:last-child { position: relative; display: flex; justify-content: center; flex-wrap: wrap; gap: 8px; }.level-addons span { padding: 5px 9px; color: #fff1c2; border-radius: 5px; background: rgba(46,29,9,.72); }.level-addons .azure { color: #a8ddff; }.level-wings { position: absolute; inset: -15px 0 auto; color: rgba(255,217,111,.6); font-size: 150px; line-height: .7; }
.waypoint-dialog h3 { margin: 17px 2px 7px; color: #e8d8a8; font: 700 13px Cinzel, Georgia, serif; }.waypoint-row { display: grid; width: 100%; min-height: 44px; padding: 8px 10px; text-align: left; color: #f2e6c8; border: 0; border-radius: 6px; background: rgba(255,255,255,.035); }.waypoint-row.on:hover { background: rgba(106,200,255,.14); }.waypoint-row.off { color: #827a6a; }.waypoint-row small { color: #b9ae96; }.waypoint-row.here { outline: 1px solid rgba(255,212,90,.45); }
.hidden { display: none !important; } @keyframes q-glow { 50% { text-shadow: 0 0 10px #ffd45a; } } @keyframes reward-in { from { opacity: 0; transform: scale(.6); } to { opacity: 1; transform: scale(1); } } @keyframes item-reveal { from { opacity: 0; transform: scaleX(0); } to { opacity: 1; transform: scaleX(1); } } @keyframes ray-turn { to { transform: rotate(360deg); } } @keyframes banner-in { from { opacity: 0; transform: translateY(-18px) scale(.96); } to { opacity: 1; transform: translateY(0) scale(1); } } @keyframes slide-right { from { opacity: 0; transform: translateX(28px); } to { opacity: 1; transform: translateX(0); } } @keyframes q-fade { from { opacity: 0; } to { opacity: 1; } }
@media (max-width: 700px) { .quest-panel { top: 120px; right: 8px; width: min(300px, calc(100vw - 16px)); }.quest-log { inset: 8px; width: auto; max-height: none; transform: none; }.quest-log-body { grid-template-columns: 1fr; }.quest-log nav { max-height: 28vh; }.quest-log article { max-height: 55vh; }.reward-card.compact { right: 8px; }.landmark-toast { right: 8px; }.zone-banner, .act-title { padding: 12px; } }
@media (prefers-reduced-motion: reduce) { .quest-panel, .tracker-block { transition: none; }.q-return, .reward-frame, .reward-rays, .reward-item, .zone-banner, .act-title, .quest-toast, .landmark-toast, .level-addons { animation: none; } }
.quest-reduced-motion .quest-panel, .quest-reduced-motion .tracker-block { transition: none; }.quest-reduced-motion .q-return, .quest-reduced-motion .reward-frame, .quest-reduced-motion .reward-rays, .quest-reduced-motion .reward-item, .quest-reduced-motion .zone-banner, .quest-reduced-motion .act-title, .quest-reduced-motion .quest-toast, .quest-reduced-motion .landmark-toast, .quest-reduced-motion .level-addons { animation: none; }
.reward-xp { width: min(360px, 100%); height: 8px; margin: 10px auto 2px; overflow: hidden; border-radius: 999px; background: rgba(255,255,255,.1); }.reward-xp i { display: block; height: 100%; width: var(--xp-to); transform-origin: left; background: linear-gradient(90deg, #b56a14, #fff0a6, #d79420); box-shadow: 0 0 9px #f4bd45; animation: xp-sweep .9s ease-out both; }.reward-coins { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }.reward-coins i { position: absolute; left: 50%; top: 54%; width: 7px; height: 7px; border-radius: 50%; background: #ffd45a; box-shadow: 0 0 6px #ffd45a; animation: coin-fly .6s ease-out .9s both; animation-delay: calc(.9s + var(--coin) * .025s); }.reward-item { animation-delay: calc(1.3s + var(--item-delay)); }.reward-item img { width: 42px; height: 42px; object-fit: contain; justify-self: center; outline: 1px solid rgba(255,255,255,.1); border-radius: 5px; }.quest-reduced-motion .reward-xp i, .quest-reduced-motion .reward-coins i { animation: none; } @keyframes xp-sweep { from { width: var(--xp-from); } to { width: var(--xp-to); } } @keyframes coin-fly { to { transform: translate(calc((var(--coin) - 6) * 22px), 100px) scale(.2); opacity: 0; } }
.quest-giver { display: flex; align-items: center; gap: 7px; }.quest-giver-portrait { width: 28px; height: 28px; object-fit: cover; object-position: center 20%; border-radius: 50%; outline: 1px solid rgba(255,255,255,.1); }.quest-options { display: grid; gap: 7px; margin-top: 18px; color: #b9ae96; border-color: rgba(200,160,74,.25); }.quest-options legend { color: #e8d8a8; }.quest-options label { display: flex; align-items: center; gap: 7px; }.quest-options select { min-height: 32px; }
.waypoint-objective { display: inline-block; width: 7px; height: 7px; margin-right: 7px; border-radius: 50%; vertical-align: 1px; background: #ffd45a; box-shadow: 0 0 7px #ffd45a; }
.quest-log-group h4, .quest-log-group summary { margin: 10px 7px 4px; color: #c9b98d; font: 700 10px Cinzel, Georgia, serif; letter-spacing: .08em; cursor: pointer; }.quest-log-group details { margin: 4px 0; }
.q-progress { display: block; width: 100%; height: 3px; margin-top: 3px; overflow: hidden; border-radius: 9px; background: rgba(255,255,255,.09); }.q-progress b { display: block; height: 100%; background: #ffd45a; transition: width .2s ease-out; }.reward-card.full::before { content: ''; position: fixed; inset: 0; z-index: -1; background: rgba(0,0,0,.35); }.reward-item { border: 0; cursor: help; }.reward-choice img { width: 32px; height: 32px; object-fit: contain; vertical-align: middle; margin: 0 8px; }.reward-flying-coin { position: fixed; z-index: 40; width: 8px; height: 8px; border-radius: 50%; pointer-events: none; background: #ffd45a; box-shadow: 0 0 7px #ffd45a; transition: transform .6s ease-out, opacity .6s ease-out; }#questItemTip { position: fixed; z-index: 50; width: 240px; padding: 10px; pointer-events: none; border-radius: 8px; color: #f2e6c8; background: rgba(10,8,6,.96); box-shadow: 0 14px 30px rgba(0,0,0,.6); }

/* Timing and packed-art hooks, with readable CSS fallbacks. */
.quest-panel { background-image: var(--art-quest-tracker,none); background-size: 100% 100%; }
.quest-log { background-image: var(--art-quest-log,linear-gradient(145deg,#21190f,#0d0906)); background-size: 100% 100%; }
.quest-dialog { background-image: var(--art-quest-dialog,linear-gradient(145deg,#21160e,#0d0906)); background-size: 100% 100%; }
.reward-frame { background-image: var(--art-reward-card,linear-gradient(145deg,#362311,#130b05 68%)); background-size:100% 100%; }
.zone-banner { background-image:var(--art-zone-banner,linear-gradient(90deg,transparent,#170f08e6 15%,#170f08e6 85%,transparent)); background-size:100% 100%; }
.reward-card.full::before { box-shadow:0 0 0 100vmax rgba(0,0,0,.35); }
.reward-xp i { animation:none; width:var(--xp-from); }
.reward-xp i.xp-crossing { animation:xp-crossing .3s; }
@keyframes xp-crossing { from { background:white; box-shadow:0 0 20px white; } }
.xp-level-chip { display:block; margin-top:6px; color:#ffe59b; }
.reward-continue { animation-delay:2.5s; }
.reward-bonuses span { animation:item-reveal .25s ease-out 1.8s both; }
.reward-bonuses span:nth-child(2) { animation-delay:2.05s; }.reward-bonuses span:nth-child(3) { animation-delay:2.3s; }
.reward-card.closing { opacity:0; scale:.95; transition:opacity .25s,scale .25s; }
.reward-flying-item { position:fixed; z-index:41; pointer-events:none; transition:transform .4s ease-out,opacity .4s ease-out; }
.reward-card.compact { max-height:150px; overflow:hidden; }.compact .reward-frame { padding:10px 14px; }.compact .reward-frame h2 { font-size:15px; margin:4px 0; }.compact .reward-frame > p { font-size:10px; }.compact .reward-numbers { font-size:12px; gap:10px; }.compact .reward-items { margin:5px 0; gap:4px; }.compact .reward-item { display:block; padding:0; min-width:0; }.compact .reward-item img { width:25px; height:25px; }.compact .reward-item b,.compact .reward-bonuses,.compact .reward-continue,.compact .reward-rays,.compact .reward-xp { display:none; }.compact .reward-waiting { min-height:22px; font-size:12px; }
.level-digits { width:400px; max-width:100%; height:74px; }.level-wings { background-image:var(--art-levelup-wings,none); background-size:contain; background-repeat:no-repeat; background-position:center; }.level-addons span { animation:item-reveal .2s ease-out .15s both; }.level-addons span:nth-child(2) { animation-delay:.3s; }.level-addons span:nth-child(3) { animation-delay:.45s; }.new-skills { filter:drop-shadow(0 0 7px #79cdff); animation:q-glow 1.5s infinite; }
.tracker-marker-text { display:block; color:#b9ae96; margin-top:5px; font-size:11px; }.tracker-tick { position:absolute; right:18px; color:#ffd45a; font-style:normal; animation:tracker-tick .5s forwards; }.step-complete { animation:step-complete .6s; }
@keyframes tracker-tick { to { transform:translateY(-10px); opacity:0; } } @keyframes counter-pop { from { transform:scale(1.35); color:white; } } @keyframes step-complete { from { background:#ffd45a40; } } @keyframes done-fade { from { color:#ffd45a; } to { color:#ede3cc80; } }
.act-title::before,.act-title::after,.act-complete::before,.act-complete::after { content:''; position:fixed; left:0; width:100vw; height:8vh; background:#000; pointer-events:none; }.act-title::before,.act-complete::before { top:0; }.act-title::after,.act-complete::after { bottom:0; }.act-title { background-image:var(--art-act-ornament,none); background-size:contain; background-repeat:no-repeat; background-position:center; }.act-complete { width:min(860px,90vw); text-align:center; padding:36px; }.act-complete header { justify-content:center; }.act-complete header h2 { font-size:clamp(28px,4.5vw,56px); }.act-stats { display:flex; justify-content:center; flex-wrap:wrap; gap:28px; margin:26px 0; }.act-stats span { display:grid; gap:8px; color:#b9ae96; }.act-stats b { color:#ffe59b; font-size:23px; }
.quest-reduced-motion .reward-bonuses span,.quest-reduced-motion .level-addons span,.quest-reduced-motion .tracker-tick,.quest-reduced-motion .step-complete { animation:none; }.quest-reduced-motion .reward-card.closing { transition:none; }

#questUI:has(#questModal:not(.hidden)) #discoveryStack,#questUI:has(#rewardCard.full:not(.hidden)) #discoveryStack { visibility:hidden; }
.quest-modal { align-content:start; padding-top:9vh; box-sizing:border-box; }.quest-dialog { max-height:calc(73vh - 72px); }.quest-dialog.act-complete { max-height:70vh; }
.reward-frame > p { font-size:clamp(20px,2.5vw,30px); letter-spacing:.06em; }.reward-frame h2 { font-size:18px; }.reward-numbers { font-size:20px; }
.reward-numbers > span:first-child { background-image:var(--art-reward-xp,none); }.reward-numbers > span:last-child { background-image:var(--art-reward-gold,none); }.reward-bonuses > span:first-child { background-image:var(--art-reward-skill,none); }.reward-bonuses > span:nth-child(2) { background-image:var(--art-reward-stat,none); }.reward-numbers > span,.reward-bonuses > span { background-size:20px 20px; background-position:left center; background-repeat:no-repeat; }
#questUI:has(.act-title) { border-block:8vh solid black; box-sizing:border-box; }

.act-title::before,.act-title::after,.act-complete::before,.act-complete::after { display:none; }
#questUI:has(.act-title) { border:0; }
#questUI:has(.act-title)::before,#questUI:has(.act-title)::after,#questUI:has(.act-complete)::before,#questUI:has(.act-complete)::after { content:''; position:fixed; left:0; width:100vw; height:8vh; background:#000; pointer-events:none; }
#questUI:has(.act-title)::before,#questUI:has(.act-complete)::before { top:0; }#questUI:has(.act-title)::after,#questUI:has(.act-complete)::after { bottom:0; }
#ui:has(.act-title) #areaTitle,#questUI:has(.act-title) .quest-panel { visibility:hidden; }
.act-title { width:min(820px,92vw); box-sizing:border-box; background-color:rgba(12,10,8,.76); }.act-title strong { font-size:clamp(30px,4.3vw,52px); }

.level-addons { translate:-50% 0; transform:none; }.level-addons > div:last-child { margin-top:8px; }.level-addons > strong { font-size:clamp(34px,5vw,56px); }
.act-title { background-color:#120d08f5; }.act-title strong { margin:8px 0 14px; }
#questUI:has(.act-title) .zone-banner,#questUI:has(.act-title) .landmark-toast { display:none; }

#hudLevel { display:inline-block; }.quest-dialog { overflow-x:hidden; }.waypoint-row { margin-left:0; }
#ui:has(#levelAddons:not(.hidden)) #areaTitle { visibility:hidden; }
/* Quest dialog restyle: ornate frame like the other panels, no colored side stripes, larger readable text. */
.quest-dialog { width: min(700px, calc(100vw - 32px)); padding: 6px 26px 22px; border: 22px solid transparent; border-radius: 0; border-image: url('assets/gen/ui/panel_frame.webp') 350 350 375 350 fill / 48px 48px 51px 48px stretch; background: linear-gradient(rgba(10, 7, 4, .55), rgba(10, 7, 4, .78)), url('assets/gen/ui/panel_bg.webp') 0 0 / 420px 420px; box-shadow: 0 25px 70px rgba(0,0,0,.72); }
.quest-dialog > header { min-height: 48px; font-size: 15px; }
.quest-dialog header h2 { font-size: 28px; }
.quest-dialog header small { font-size: 15px; }
.quest-dialog footer button, .quest-dialog button.gold { min-height: 46px; padding: 8px 28px; font-size: 18px; }
.tracker-block { border-left: 0; }
/* Reward card. The ornate frame art (851 × 564) is a 9-slice, so the ribbon, crest, corners and bottom ornament
   keep their shape at any content height; the solid backing sits only under the wood. "Quest complete" goes above
   the crest, the quest name between the ribbon tails, the content inside the wood, the button below the frame.
   --u is one art pixel at the card's base width. */
#rewardCard.full { width: 600px; max-width: none; top: 46%; transform: translate(-50%, -50%) scale(var(--ui-zoom, 1)); }
#rewardCard.full .reward-frame { --u: calc(600px / 851); box-sizing: border-box; min-height: calc(564 * var(--u)); overflow: visible;
  padding: calc(150 * var(--u)) calc(92 * var(--u)) calc(112 * var(--u)); border: 0 solid transparent; border-radius: 0; box-shadow: none;
  border-image: var(--art-reward-card) 216 100 124 100 fill / calc(216 * var(--u)) calc(100 * var(--u)) calc(124 * var(--u)) stretch;
  background: radial-gradient(ellipse at 50% 35%, rgba(50, 33, 17, .98), rgba(14, 10, 6, .98) 70%) 50% calc(104 * var(--u)) / calc(100% - 100 * var(--u)) calc(100% - 170 * var(--u)) no-repeat; }
#rewardCard.full .reward-frame > p { position: absolute; left: -60px; right: -60px; bottom: calc(100% + 4px); margin: 0; font: 700 34px/1.1 Cinzel, Georgia, serif; letter-spacing: .08em; color: #ffd45a; text-shadow: 0 0 18px rgba(255, 186, 64, .5), 0 3px 3px #000; }
#rewardCard.full .reward-frame h2 { margin: 0 calc(72 * var(--u)) 4px; font: 700 23px/1.15 Cinzel, Georgia, serif; color: #f6e7c4; text-shadow: 0 2px 3px #000; }
#rewardCard.full .reward-numbers { font-size: 21px; gap: 18px; }
#rewardCard.full .reward-xp { width: min(340px, 100%); margin: 8px auto 0; }
#rewardCard.full .reward-items { display: grid; grid-template-columns: repeat(auto-fit, minmax(96px, 136px)); justify-content: center; gap: 8px; margin: 12px 0 0; }
#questUI #rewardCard .reward-item { box-sizing: border-box; min-width: 0; margin: 0; padding: 7px 6px 8px; border: 1px solid rgba(214, 170, 92, .45); border-image: none; border-radius: 6px; background: linear-gradient(rgba(66, 45, 24, .8), rgba(22, 15, 9, .9)); color: #f2e6c8; font: 600 14px/1.15 'EB Garamond', Georgia, serif; text-wrap: balance; }
#questUI #rewardCard .reward-item img { width: 40px; height: 40px; }
#rewardCard.full .reward-bonuses, #rewardCard.full .reward-choice { margin: 12px 0 0; }
#questUI #rewardCard.full .reward-continue { position: absolute; top: calc(100% + 10px); left: 0; right: 0; width: max-content; min-width: 220px; margin: 0 auto; font-size: 17px; white-space: nowrap; }
#rewardCard.compact .reward-frame { border: 1px solid rgba(214, 170, 92, .55); border-radius: 8px; background: linear-gradient(rgba(40, 28, 16, .96), rgba(14, 10, 6, .96)); box-shadow: 0 10px 26px rgba(0, 0, 0, .6); }
/* Zone banner: the banner art is the frame (no extra rounded box), and the old area-name text stays hidden meanwhile. */
.zone-banner { border: 0; border-radius: 0; box-shadow: none; }
body:has(#discoveryStack .zone-banner) #areaTitle { visibility: hidden; }
/* Larger tracker text. */
.tracker-title { font-size: 16px; }
.tracker-title small { font-size: 12.5px; }
.quest-panel > header { font-size: 15px; }
/* Phones (heat, art/production/reports/heat.md): "Return to …" keeps a still glow instead of a pulsing text shadow, which the
   page repainted every frame while a quest waited to be handed in. */
body.mobile .q-return { animation: none; text-shadow: 0 0 5px rgba(255, 212, 90, .6); }