.city-boss-arrival{--cba-accent:#94e5ed;--cba-glow:#256377;position:fixed;z-index:9800;top:88px;left:50%;transform:translateX(-50%);box-sizing:border-box;display:grid;grid-template-columns:110px minmax(0,1fr);gap:16px;width:min(568px,calc(100vw - 24px));padding:23px 33px 23px 20px;overflow:hidden;border:1px solid #a69c6899;border-radius:18px;color:#f8f5e9;background:radial-gradient(ellipse at 0 40%,var(--cba-glow),transparent 55%),linear-gradient(115deg,#101d30,#101b28 55%,#17232e);box-shadow:0 18px 48px #0008,0 1px 0 #e9d58e66 inset;font:14px/1.4 system-ui,sans-serif;pointer-events:none;animation:cba-enter .4s ease-out both;isolation:isolate}
.city-boss-arrival[data-theme=mew]{--cba-accent:#f5b6dc;--cba-glow:#74365e}
.city-boss-arrival[data-theme=mewtwo]{--cba-accent:#ceb5ff;--cba-glow:#514777}
.cba-art{position:relative;display:grid;place-items:center;align-self:center;width:110px;height:110px}
.cba-orbit{position:absolute;inset:3px;border:1px solid var(--cba-accent);border-radius:50%;opacity:.28;box-shadow:0 0 0 8px #ffffff08,0 0 0 17px #ffffff04}
.cba-orbit:after{content:'';position:absolute;inset:10px;border:1px dashed var(--cba-accent);border-radius:50%;opacity:.5}
.cba-art canvas{position:relative;z-index:1;width:104px;height:104px;object-fit:contain;image-rendering:pixelated;filter:drop-shadow(0 8px 8px #0006)}
.cba-star{position:absolute;font-size:58px;color:var(--cba-accent);opacity:.13}
.cba-content{min-width:0;align-self:center}
.cba-eyebrow{display:flex;align-items:center;gap:10px;font-size:9px;font-weight:850;letter-spacing:1.8px;color:#e8d99f}
.cba-eyebrow b{font-size:8px;letter-spacing:1px;border:1px solid #d5c59066;border-radius:20px;padding:3px 7px;background:#d5c59011}
.cba-title{display:block;font-size:clamp(22px,3vw,29px);line-height:1.12;letter-spacing:-.8px;margin:8px 0 10px;color:#fff;overflow-wrap:anywhere}
.cba-location{display:flex;gap:5px 8px;align-items:center;flex-wrap:wrap;font-size:12px;color:var(--cba-accent)}
.cba-location svg{width:13px;height:16px;flex:none}.cba-location span{color:#bac4cc;font-size:10px;border-left:1px solid #76879a70;padding-left:8px}
.cba-content p{margin:9px 0 0;color:#c4cbd2;font-size:11px;line-height:1.45}
.cba-close{position:absolute;right:7px;top:7px;border:0;background:transparent;color:#c4cbd2;width:32px;height:32px;line-height:1;font-size:24px;cursor:pointer;pointer-events:auto;border-radius:50%}.cba-close:hover,.cba-close:focus-visible{background:#ffffff18;color:white;outline:2px solid var(--cba-accent);outline-offset:-3px}
.cba-time{position:absolute;bottom:0;left:0;height:2px;width:100%;background:linear-gradient(90deg,#caae62,var(--cba-accent));transform-origin:left;animation:cba-time 11s linear both;opacity:.85}
@keyframes cba-enter{from{opacity:0;transform:translate(-50%,-14px)}to{opacity:1;transform:translate(-50%,0)}}
@keyframes cba-time{to{transform:scaleX(0)}}
@media(max-width:520px){.city-boss-arrival{top:72px;grid-template-columns:70px minmax(0,1fr);gap:13px;padding:18px 25px 18px 13px;border-radius:14px}.cba-art{width:70px;height:80px}.cba-art canvas{width:78px;height:78px}.cba-orbit{inset:6px 1px}.cba-title{font-size:23px;letter-spacing:-.5px}.cba-eyebrow{font-size:8px;letter-spacing:1.2px;gap:7px}.cba-location{font-size:11px;gap:3px 6px}.cba-location span{border:0;padding:0 0 0 18px;flex-basis:100%}.cba-content p{font-size:10px;margin-top:7px}}
/* Keep the new arrival readable while the existing Ancient invitation is open. */
.city-boss-arrival{z-index:10050}
body:has(#shiny-global-card:not(.hidden)) .city-boss-arrival,
body:has(#guild-gym-ancient-card:not(.hidden)) .city-boss-arrival{top:auto;bottom:90px}
@media(prefers-reduced-motion:reduce){.city-boss-arrival,.cba-time{animation:none}.cba-time{display:none}}
