/* Boss arena: isolated selectors, existing site's palette and spacing. */
#boss-root { min-width:0; color:var(--text,#14304d); }
#boss-root *, .boss-admin-detail * { box-sizing:border-box; }
#boss-root button { cursor:pointer; }
#boss-root button:disabled { cursor:default; opacity:.55; }
#boss-root svg { width:21px; height:21px; flex-shrink:0; vertical-align:middle; }
#boss-root .primary-btn, #boss-root .secondary-btn, #boss-root .ghost-btn { display:inline-flex; align-items:center; justify-content:center; gap:9px; }
.boss-toolbar,.boss-toolbar-actions,.boss-arena-head,.boss-pick-top,.boss-history-head,.boss-task-title { display:flex; align-items:center; justify-content:space-between; gap:14px; }
.boss-toolbar { margin:8px 0 22px; }
.boss-toolbar h2 { margin:7px 0 0; font-size:clamp(23px,3vw,35px); }
.boss-toolbar-actions { flex-wrap:wrap; justify-content:flex-end; }
.boss-intro { display:flex; justify-content:space-between; align-items:center; gap:26px; padding:24px 28px; margin-bottom:22px; border-radius:24px; background:linear-gradient(110deg,#fff,#d9f1ff); border:1px solid #cfe7f7; }
.boss-intro h3 { margin:0 0 8px; font-size:24px; }
.boss-intro p { max-width:640px; margin:0; color:#526e88; line-height:1.6; }
.boss-collection-score { display:grid; gap:5px; text-align:right; flex-shrink:0; }
.boss-collection-score b { font-size:30px; color:#0574bd; }
.boss-collection-score span,.boss-collection-score small { color:#6a829a; }
.boss-access,.boss-resume { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:15px; padding:20px; border-radius:18px; background:#fff; margin-bottom:20px; border:1px solid #cfe7f7; }
.boss-resume>div { display:grid; gap:6px; }
.boss-resume span { color:#6a829a; }
.boss-catalog { display:grid; grid-template-columns:repeat(auto-fill,minmax(185px,1fr)); gap:16px; }
.boss-pick { position:relative; overflow:hidden; display:grid; gap:7px; text-align:left; padding:18px; border:1px solid #cfe7f7; border-radius:24px; background:rgba(255,255,255,.9); color:#14304d; transition:transform .2s,box-shadow .2s,border-color .2s; }
.boss-pick:hover:not(:disabled) { transform:translateY(-4px); border-color:#1597e5; box-shadow:0 14px 28px #125c8f1b; }
.boss-pick-top { font-size:14px; font-weight:800; color:#0574bd; }
.boss-pick>b { font-size:18px; }
.boss-pick>small { color:#6a829a; line-height:1.5; }
.boss-medal { color:#12805c; font-size:22px; min-height:26px; }
.boss-thumbnail { position:relative; height:150px; display:grid; place-items:center; }
.boss-thumbnail img { position:relative; z-index:1; width:155px; height:155px; object-fit:contain; }
.boss-sprite { filter:hue-rotate(var(--boss-hue,0deg)); user-select:none; }
.boss-aura { position:absolute; inset:15%; border-radius:50%; background:radial-gradient(ellipse,#35b7ff42,transparent 70%); filter:hue-rotate(var(--boss-hue,0deg)); pointer-events:none; }
.boss-rules,.boss-review { margin:22px 0; padding:18px 22px; background:#ffffffd9; border-radius:18px; border:1px solid #cfe7f7; line-height:1.65; }
.boss-rules summary,.boss-review summary { cursor:pointer; font-weight:800; }
.boss-rules p { color:#526e88; }
.boss-history-head { margin-top:28px; }
.boss-history { display:grid; gap:8px; }
.boss-history-row { display:flex; justify-content:space-between; align-items:center; gap:16px; text-align:left; width:100%; padding:15px 18px; border:1px solid #cfe7f7; border-radius:14px; background:#fff; color:#14304d; }
.boss-history-row:hover { border-color:#1597e5; }
.boss-history-row>span:first-child { display:grid; gap:4px; }
.boss-history-row small,.boss-history-row>span:not(:first-child) { font-size:13px; color:#6a829a; }
.boss-battle-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1.1fr); align-items:start; gap:20px; }
.boss-arena,.boss-task-card { border-radius:24px; border:1px solid #cfe7f7; background:#fff; padding:24px; min-width:0; box-shadow:0 12px 40px #125c8f0a; }
.boss-arena { position:sticky; top:90px; overflow:hidden; background:linear-gradient(#fff,#effaff); }
.boss-arena-head h3 { margin:0 0 5px; font-size:clamp(23px,2.8vw,32px); }
.boss-arena-head span { color:#6a829a; font-size:13px; }
.boss-phase { flex-shrink:0; border-radius:20px; padding:6px 11px; background:#e9f6ff; }
.boss-health { margin-top:20px; min-width:0; flex:1; }
.boss-health>div:first-child { display:flex; justify-content:space-between; gap:8px; font-size:13px; margin-bottom:9px; }
.boss-health b { display:inline-flex; align-items:center; gap:7px; }
.boss-health strong { white-space:nowrap; }
.boss-health-track { height:13px; overflow:hidden; background:#dbedf8; border-radius:15px; }
.boss-health-track i { display:block; height:100%; border-radius:15px; background:linear-gradient(90deg,#35b7ff,#0574bd); transition:width .55s ease; }
.boss-health.is-player .boss-health-track i { background:linear-gradient(90deg,#54d991,#1ba477); }
.boss-health.is-player svg { color:#1ba477; width:17px!important; }
.boss-stage { height:360px; position:relative; display:grid; place-items:center; isolation:isolate; }
.boss-figure { z-index:2; width:100%; height:100%; animation:boss-float 4s ease-in-out infinite; }
.boss-stage .boss-sprite { width:100%; height:100%; object-fit:contain; position:relative; z-index:2; }
.boss-floor { position:absolute; z-index:0; bottom:2%; width:85%; height:32px; border:3px solid #69c9ff; box-shadow:0 0 18px #35b7ff88,inset 0 0 15px #35b7ff55; border-radius:50%; opacity:.6; }
.boss-orbit { position:absolute; z-index:1; width:75%; aspect-ratio:1; border:1px dashed #85cfff; border-radius:50%; animation:boss-orbit 26s linear infinite; opacity:.55; }
.boss-stage[data-emblem="1"] .boss-orbit { border-radius:22%; transform:rotate(45deg); }
.boss-stage[data-emblem="2"] .boss-orbit { border-style:double; border-width:5px; }
.boss-stage[data-emblem="3"] .boss-orbit { clip-path:polygon(50% 0,100% 25%,100% 75%,50% 100%,0 75%,0 25%); border-radius:0; background:#d9f1ff66; }
.phase-2 .boss-aura { background:radial-gradient(ellipse,#35b7ff80,transparent 72%); }
.phase-3 .boss-aura { background:radial-gradient(ellipse,#35b7ffbb,transparent 72%); animation:boss-pulse 1.8s infinite; }
.phase-2 .boss-sprite { filter:hue-rotate(var(--boss-hue,0deg)) saturate(1.3) contrast(1.03); }
.phase-3 .boss-sprite { filter:hue-rotate(var(--boss-hue,0deg)) saturate(1.7) contrast(1.12); }
.boss-player { display:flex; align-items:end; gap:14px; }
.boss-player .boss-health { margin:0; }
.boss-shield { padding:10px!important; font-size:12px!important; flex-shrink:0; }
.boss-shield[aria-pressed="true"] { background:#1597e5!important; color:white!important; box-shadow:0 0 0 4px #1597e526; }
.boss-task-card { display:grid; gap:17px; }
.boss-task-title h3 { margin:0; font-size:24px; }
.boss-streak { color:#0574bd; font-size:12px; font-weight:800; }
.boss-steps { display:flex; gap:8px; }
.boss-steps i { flex:1; height:7px; border-radius:8px; background:#e2ebf1; }
.boss-steps .done { background:#1597e5; }
.boss-steps .current { background:#b0e2ff; box-shadow:0 0 0 1px #1597e5; }
.boss-task-image-link { display:block; width:100%; }
.boss-task-image,.boss-context img { display:block; width:100%; height:auto; object-fit:contain; }
.boss-context summary { color:#0574bd; cursor:pointer; margin-bottom:12px; }
.boss-task-card form { display:grid; gap:10px; }
.boss-task-card label { font-weight:800; }
#boss-answer { width:100%; min-height:74px; resize:vertical; font:inherit; border:1px solid #acd9f5; border-radius:14px; padding:14px; background:white; color:#14304d; }
#boss-answer:focus { outline:3px solid #35b7ff33; border-color:#1597e5; }
.boss-attack { min-height:54px; font-size:18px!important; }
.boss-shield-hint { font-size:12px; color:#6a829a; margin:0; }
.boss-combat-rules { display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; padding-top:14px; border-top:1px solid #e4f1fa; font-size:13px; color:#6a829a; }
.boss-combat-rules span:first-child b { color:#12805c; }
.boss-combat-rules span:last-child b { color:#c23b4a; }
.boss-task-footer { display:flex; flex-wrap:wrap; gap:8px; justify-content:space-between; }
#boss-message { margin:0; color:#0574bd; font-size:14px; line-height:1.5; overflow-wrap:anywhere; }
#boss-message:empty { display:none; }
#boss-message.is-error,.boss-image-error { color:#a12b39; }
.boss-impact { position:absolute; z-index:4; top:35%; font-size:56px; font-weight:950; color:#0574bd; opacity:0; text-shadow:0 2px 0 white; }
.effect-hit .boss-figure { animation:boss-hit .65s both,boss-float 4s .65s infinite; }
.effect-hurt .boss-figure { animation:boss-attack .65s both,boss-float 4s .65s infinite; }
.effect-hurt .boss-player { animation:boss-hit .65s; }
.effect-shield .boss-player { animation:boss-shield .8s; }
.effect-hit .boss-impact,.effect-hurt .boss-impact,.effect-shield .boss-impact { animation:boss-damage 1.1s both; }
.effect-hurt .boss-impact { color:#c23b4a; }
.boss-defeated .boss-figure { opacity:.3; transform:translateY(20px) scale(.85); animation:none; }
.boss-finish-icon { font-size:56px; color:#1597e5; text-align:center; }
.boss-task-card>h3 { font-size:28px; margin:0; }
.boss-task-card>p { margin:0; line-height:1.6; }
.boss-result-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin:10px 0; }
.boss-result-stats span { display:grid; gap:7px; color:#6a829a; font-size:12px; }
.boss-result-stats b { font-size:27px; color:#0574bd; }
.boss-badges { display:flex; flex-wrap:wrap; gap:8px; }
.boss-badges span { color:#0574bd; background:#e7f6ff; border-radius:20px; padding:8px 12px; font-size:12px; font-weight:800; }
.boss-review article { padding-top:18px; margin-top:18px; border-top:1px solid #cfe7f7; }
.boss-review h4 { margin:0 0 10px; }
.boss-review img { max-width:800px; }
.boss-answer-comparison { overflow-wrap:anywhere; white-space:pre-wrap; }
.boss-answer-comparison p { margin:10px 0; }
.boss-loading { padding:50px 20px; text-align:center; color:#0574bd; }
.boss-admin-detail { margin-top:20px; }
@keyframes boss-float { 0%,100% { transform:translateY(0); } 50% { transform:translateY(-9px); } }
@keyframes boss-orbit { to { transform:rotate(360deg); } }
@keyframes boss-pulse { 50% { opacity:.4; transform:scale(1.18); } }
@keyframes boss-hit { 20% { transform:translateX(10px) rotate(2deg); } 45% { transform:translateX(-8px); } 75% { transform:translateX(4px); } }
@keyframes boss-attack { 40% { transform:scale(1.12) translateY(12px); } }
@keyframes boss-shield { 40% { box-shadow:0 0 25px #1597e5; } }
@keyframes boss-damage { 10% { opacity:1; transform:translateY(0) scale(1.15); } 100% { opacity:0; transform:translateY(-65px); } }
@media(min-width:1600px) { .boss-stage { height:450px; } }
@media(max-width:1100px) { .boss-battle-grid { grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr); gap:14px; } .boss-arena,.boss-task-card { padding:18px; } .boss-stage { height:300px; } .boss-player { flex-direction:column; align-items:stretch; } }
@media(max-width:760px) { .boss-battle-grid { grid-template-columns:1fr; } .boss-arena { position:relative; top:auto; } .boss-stage { height:190px; } .boss-player { flex-direction:row; align-items:end; } .boss-toolbar { align-items:flex-start; flex-wrap:wrap; gap:14px; } .boss-toolbar-actions { justify-content:flex-start; } .boss-intro { padding:20px; flex-direction:column; align-items:flex-start; gap:16px; } .boss-collection-score { text-align:left; } .boss-catalog { grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; } .boss-pick { padding:12px; border-radius:18px; } .boss-pick>b { font-size:15px; } .boss-pick>small { font-size:11px; } .boss-thumbnail { height:125px; } .boss-thumbnail img { width:125px; height:125px; } .boss-history-row { flex-wrap:wrap; gap:8px; } .boss-arena-head h3 { font-size:25px; } .boss-task-title h3 { font-size:22px; } }
@media(prefers-reduced-motion:reduce) { #boss-root *,#boss-root *::before,#boss-root *::after { animation:none!important; transition:none!important; } }
.boss-quick-choice { background:linear-gradient(130deg,#e1f4ff,#fff)!important; border-color:#8bcef5!important; }
.boss-quick-choice b { color:#0574bd; }
/* Decorative artwork must not cover controls or size the grid by its bitmap. */
.boss-stage { overflow:hidden; pointer-events:none; }
.boss-figure { position:absolute; inset:0; min-width:0; min-height:0; pointer-events:none; }
.boss-stage .boss-sprite { display:block; max-width:100%; max-height:100%; }
@media(max-width:760px) {
  .boss-player { flex-direction:column; align-items:stretch; gap:12px; }
  .boss-player .boss-health { width:100%; }
  .boss-shield { width:100%; }
}
