/* World boss HUD (roadmap item 18, src/world-boss-hud.js, docs: file tools/docs/world-boss.md). Loaded before hud-reference.css.
   Temporary look: CSS only in deep red and gold. Codex art (file tools/docs/art/world-boss/) plugs in by setting the three
   variables below to url(...) — no JS change: banner background 1200×160, boss icon 128×128, HP frame 9-slice 640×56. */
:root{--world-boss-banner-art:none;--world-boss-icon-art:none;--world-boss-frame-art:none}
#world-boss-banner,#world-boss-chip,#world-boss-bar,#world-boss-result{font:12px Tahoma,"Noto Sans Thai",sans-serif;color:#fff4dc;box-sizing:border-box}
#world-boss-banner[hidden],#world-boss-chip[hidden],#world-boss-bar[hidden],#world-boss-result[hidden]{display:none}
/* Banner: top centre, slides down for 8 s, never takes clicks. */
#world-boss-banner{position:absolute;z-index:6;top:18%;left:50%;display:flex;align-items:center;gap:10px;width:min(620px,calc(100vw - 24px));padding:12px 18px;border:2px solid #f2c45a;border-radius:12px;
 background:var(--world-boss-banner-art),linear-gradient(180deg,#7e1d16f2,#4a0f0cf2);background-size:cover;box-shadow:0 0 0 1px #3a0907,0 8px 24px #0009;pointer-events:none;user-select:none;transform:translate(-50%,-14px);opacity:0}
#world-boss-banner.is-showing{animation:world-boss-banner 8s ease forwards}
@keyframes world-boss-banner{0%{transform:translate(-50%,-14px);opacity:0}6%{transform:translate(-50%,0);opacity:1}88%{transform:translate(-50%,0);opacity:1}100%{transform:translate(-50%,-10px);opacity:0}}
.world-boss-banner-icon,.world-boss-icon,.world-boss-chip-icon{flex:none;display:inline-grid;place-items:center;width:28px;height:28px;border-radius:50%;background:var(--world-boss-icon-art),radial-gradient(circle at 35% 30%,#ffe9a6,#d8932b 60%,#7a3a0c);background-size:cover;box-shadow:0 0 0 2px #3a0907}
.world-boss-banner-icon::before,.world-boss-icon::before,.world-boss-chip-icon::before{content:"♛";color:#5a1208;font:900 15px/1 serif}
.world-boss-banner-text{font-weight:bold;font-size:15px;line-height:1.35;text-shadow:0 1px 2px #000a}
#world-boss-banner[data-tone="escaped"],#world-boss-banner[data-tone="cancelled"]{border-color:#c9b78f;background:linear-gradient(180deg,#4b3a2cf2,#2d2219f2)}
/* Chip: top centre, small; tap shows where to go (no warp button: answer 71). */
#world-boss-chip{position:absolute;z-index:4;top:150px;left:50%;transform:translateX(-50%);display:grid;gap:3px;max-width:min(320px,calc(100vw - 24px));min-height:0;padding:5px 12px;border:1.5px solid #f2c45a;border-radius:16px;
 background:linear-gradient(180deg,#6d1913ee,#3f0c09ee);box-shadow:0 3px 10px #0007;color:#fff4dc;cursor:pointer;text-align:left}
#world-boss-chip:focus-visible{outline:3px solid #f0c75e;outline-offset:2px}
.world-boss-chip-head{display:flex;align-items:center;gap:7px;white-space:nowrap}
.world-boss-chip-icon{width:20px;height:20px}.world-boss-chip-icon::before{font-size:11px}
.world-boss-chip-time{padding:1px 6px;border-radius:6px;background:#1d0907;color:#ffd78f;font-weight:bold;font-variant-numeric:tabular-nums}
.world-boss-chip-more{display:block;color:#ffe2bf;font-size:11px;white-space:normal}
/* Bar: in the boss's map and channel. */
#world-boss-bar{position:absolute;z-index:4;top:150px;left:50%;transform:translateX(-50%);display:grid;gap:5px;width:min(420px,calc(100vw - 2*min(330px,38vw)));min-width:240px;padding:7px 10px 8px;
 border:2px solid #f2c45a;border-radius:11px;background:var(--world-boss-frame-art),linear-gradient(180deg,#5c1510f0,#330a08f0);background-size:100% 100%;box-shadow:0 4px 14px #0008;pointer-events:none;user-select:none}
.world-boss-head{display:flex;align-items:center;gap:7px;min-width:0}
.world-boss-icon{width:22px;height:22px}.world-boss-icon::before{font-size:12px}
.world-boss-name{flex:1;min-width:0;overflow:hidden;color:#ffd766;font-size:13px;text-overflow:ellipsis;white-space:nowrap}
.world-boss-level{flex:none;padding:1px 6px;border-radius:5px;background:#b8452f;color:#fff3e6;font-weight:bold;font-size:11px}
.world-boss-time{flex:none;color:#ffd78f;font-weight:bold;font-variant-numeric:tabular-nums}
.world-boss-hp{--hp:1;position:relative;height:16px;overflow:hidden;border:1px solid #f2c45a88;border-radius:6px;background:#2a0b08}
.world-boss-hp>i{position:absolute;inset:0;background:linear-gradient(180deg,#ff6a4e,#c3271b);transform:scaleX(var(--hp));transform-origin:left;transition:transform .2s linear}
#world-boss-bar[data-band="mid"] .world-boss-hp>i{background:linear-gradient(180deg,#ffa24e,#d26a1b)}
#world-boss-bar[data-band="low"] .world-boss-hp>i{background:linear-gradient(180deg,#ffe07a,#d9a21f)}
.world-boss-hp-text{position:relative;display:block;color:#fffaf0;font:bold 11px/16px Tahoma,sans-serif;text-align:center;text-shadow:0 1px 2px #000c;font-variant-numeric:tabular-nums}
.world-boss-mine{color:#ffe9c4;font-size:12px}
.world-boss-top-toggle{justify-self:start;min-height:0;padding:2px 8px;border:1px solid #f2c45a66;border-radius:8px;background:#0004;color:#ffe2bf;font:11px Tahoma,"Noto Sans Thai",sans-serif;cursor:pointer;pointer-events:auto}
.world-boss-top{display:grid;gap:2px;margin:0;padding:0 0 0 18px;font-size:11px}
.world-boss-top[hidden]{display:none}
.world-boss-top li{display:flex;justify-content:space-between;gap:10px}
.world-boss-top-name{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.world-boss-top-share{flex:none;color:#ffd78f;font-variant-numeric:tabular-nums}
/* Result card: not modal, never blocks walking keys; × or Escape. */
#world-boss-result{position:absolute;z-index:5;top:150px;left:50%;transform:translateX(-50%);display:grid;gap:5px;width:min(400px,calc(100vw - 24px));padding:12px 34px 12px 14px;border:2px solid #f2c45a;border-radius:12px;
 background:linear-gradient(180deg,#5c1510f2,#2c0907f2);box-shadow:0 6px 18px #0009}
.world-boss-result-title{color:#ffd766;font-size:14px}
.world-boss-result-note{color:#ffe2bf;font-size:11px}
.world-boss-result-close{position:absolute;top:6px;right:6px;display:grid;place-items:center;width:26px;height:26px;min-height:0;padding:0;border:1px solid #f2c45a88;border-radius:7px;background:#0004;color:#fff3e6;font:bold 16px/1 Tahoma,sans-serif;cursor:pointer}
.world-boss-result-close:hover,.world-boss-result-close:focus-visible{background:#b8452f}
@media (max-width:600px){#world-boss-chip,#world-boss-bar,#world-boss-result{top:130px}#world-boss-bar{width:calc(100vw - 24px);min-width:0}#world-boss-banner{top:14%;padding:9px 12px}.world-boss-banner-text{font-size:13px}}
@media (max-height:500px) and (orientation:landscape){#world-boss-chip,#world-boss-bar,#world-boss-result{top:58px}#world-boss-bar{width:min(300px,44vw);min-width:0;padding:4px 8px 5px;gap:3px}.world-boss-top{display:none}.world-boss-top-toggle{display:none}#world-boss-banner{top:12%;width:min(520px,60vw);padding:7px 12px}.world-boss-banner-text{font-size:12px}#world-boss-result{width:min(340px,50vw);padding:8px 30px 8px 10px}}
@media (pointer:coarse){.world-boss-result-close{width:32px;height:32px}}
@media (prefers-reduced-motion:reduce){#world-boss-banner.is-showing{animation:none;transform:translate(-50%,0);opacity:1}.world-boss-hp>i{transition:none}}