/* 도전장 레이어(js/battlekit.js) — 인라인 카드는 다른 .answer_shadow 박스(공유·규칙·랭킹)와 같은 흰 박스 하나. 안쪽에 박스를 또 만들지 않는다 */
.bk-card{margin-top:16px;padding:14px 16px;text-align:left}
.bk-card .bk-row{display:flex;align-items:center;gap:12px}
.bk-card .bk-ico{flex-shrink:0;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:1.3rem;background:linear-gradient(135deg,rgba(124,58,237,.14),rgba(14,165,233,.14))}
.bk-card .bk-row.chal .bk-ico{background:linear-gradient(135deg,rgba(249,115,22,.22),rgba(239,68,68,.18))}
.bk-card .bk-txt{flex:1;min-width:0;font-size:.95rem;font-weight:700;color:var(--text,#1f2937);line-height:1.35;word-break:keep-all}
.bk-card .bk-txt b{font-weight:900}
.bk-card .bk-row.chal .bk-txt b{color:#c2410c}
[data-theme="dark"] .bk-card .bk-row.chal .bk-txt b{color:#fdba74}
.bk-card .bk-txt small{display:block;margin-top:2px;font-size:.76rem;font-weight:600;color:var(--muted,#6b7280);line-height:1.45}
.bk-card .bk-cta{flex-shrink:0;height:44px;padding:0 18px;border:0;border-radius:22px;cursor:pointer;font-family:inherit;font-size:.9rem;font-weight:900;color:#fff;background:linear-gradient(135deg,#f97316,#ef4444);box-shadow:0 6px 16px rgba(239,68,68,.28);white-space:nowrap;-webkit-tap-highlight-color:transparent}
.bk-card .bk-cta:active{transform:translateY(1px)}
.bk-card .bk-mini{flex-shrink:0;font-size:.8rem;font-weight:800;color:#c2410c;text-decoration:none;padding:9px 12px;border-radius:20px;background:rgba(249,115,22,.12)}
[data-theme="dark"] .bk-card .bk-mini{color:#fdba74}
.bk-card .bk-mine{margin-top:10px;padding-top:10px;border-top:1px solid rgba(128,128,128,.18);display:flex;flex-direction:column;gap:6px}
.bk-card .bk-mine-row{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:4px 0;text-decoration:none;font-size:.8rem;font-weight:700;color:var(--text,#1f2937)}
.bk-card .bk-mine-row .t{min-width:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.bk-card .bk-mine-row .n{flex-shrink:0;color:#7c3aed;font-weight:900}
[data-theme="dark"] .bk-card .bk-mine-row .n{color:#c4b5fd}
@media (max-width:480px){.bk-card{padding:12px 14px}.bk-card .bk-row{flex-wrap:wrap}.bk-card .bk-cta{width:100%;margin-top:4px}.bk-card .bk-row.chal .bk-mini{margin-left:auto}}
/* 토스트 — 폭이 좁으면 글과 버튼이 두 줄로 접힌다(한 글자씩 세로로 늘어지던 문제, 10-08) */
.bk-toast{position:fixed;left:50%;bottom:28px;transform:translateX(-50%) translateY(20px);z-index:99998;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px 12px;width:max-content;max-width:calc(100vw - 32px);box-sizing:border-box;padding:10px 16px;border-radius:20px;background:#0f172a;color:#fff;font-size:.86rem;font-weight:800;box-shadow:0 10px 30px rgba(0,0,0,.35);opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;line-height:1.35}
.bk-toast>span{flex:1 1 160px;min-width:0;text-align:center;word-break:keep-all;overflow-wrap:anywhere}
.bk-toast.on{opacity:1;transform:translateX(-50%) translateY(0);pointer-events:auto}
.bk-toast .bk-toast-btn{flex:0 0 auto;height:36px;padding:0 14px;border:0;border-radius:99px;cursor:pointer;font-family:inherit;font-size:.82rem;font-weight:900;color:#fff;background:linear-gradient(135deg,#f97316,#ef4444);white-space:nowrap}
/* 모달·오버레이(고정 다크) */
.bk-mask{position:fixed;inset:0;z-index:99999;background:rgba(6,8,18,.82);display:flex;align-items:center;justify-content:center;padding:18px;animation:bkFade .2s ease}
.bk-modal{width:100%;max-width:420px;max-height:calc(100vh - 36px);max-height:calc(100dvh - 36px);overflow:auto;background:#0d1020;border:1px solid rgba(255,255,255,.08);border-radius:20px;box-shadow:0 20px 60px rgba(0,0,0,.6);animation:bkPop .25s ease;color:#fff;font-family:inherit}
.bk-h{padding:18px 18px 4px;text-align:center}
.bk-k{display:inline-block;font-size:11px;font-weight:800;letter-spacing:.12em;color:#ffd447;background:rgba(255,212,71,.12);padding:4px 11px;border-radius:999px}
.bk-b{padding:14px 18px 18px;color:#c3c9e6;text-align:center;font-size:14px;line-height:1.6}
.bk-p{margin:0 0 12px;word-break:keep-all}
.bk-p b{color:#fff}
.bk-p small{display:block;margin-top:4px;font-size:12px;color:#8f97bd}
.bk-score{color:#fff;font-weight:800;margin-bottom:10px;font-size:15px}
.bk-score b{color:#ffd447;font-size:1.25em}
.bk-score small{display:block;font-size:12px;color:#8f97bd;font-weight:700;margin-top:2px}
.bk-label{display:block;text-align:left;font-size:12px;font-weight:800;color:#8f97bd;margin:0 0 5px 2px}
.bk-input{width:100%;box-sizing:border-box;height:48px;background:#161a2e;border:1px solid rgba(255,255,255,.14);border-radius:12px;color:#fff;padding:0 14px;font-size:16px;font-weight:700;text-align:center;margin:0 0 6px;font-family:inherit;outline:none}
.bk-input:focus{border-color:#ffd447;box-shadow:0 0 0 3px rgba(255,212,71,.18)}
.bk-err{display:none;color:#ff8a9a;font-size:12px;font-weight:700;margin-bottom:8px}
.bk-linkbox{display:flex;gap:6px;margin:4px 0 12px}
.bk-linkbox input{flex:1;min-width:0;height:44px;background:#161a2e;border:1px solid rgba(255,255,255,.14);border-radius:10px;color:#cfd4ee;padding:0 11px;font-size:12px;font-family:inherit}
.bk-copy{height:44px;padding:0 14px;border:0;border-radius:10px;background:#ffd447;color:#1a1300;font-weight:900;cursor:pointer;font-family:inherit;white-space:nowrap}
.bk-btn{display:flex;align-items:center;justify-content:center;width:100%;box-sizing:border-box;min-height:52px;padding:14px;border-radius:14px;font-size:15px;font-weight:900;text-decoration:none;border:0;cursor:pointer;margin-top:9px;color:#fff;text-align:center;font-family:inherit;-webkit-tap-highlight-color:transparent}
.bk-btn.p{background:linear-gradient(135deg,#ff416c,#ff4b2b);box-shadow:0 8px 20px rgba(255,65,108,.38);margin-top:4px}
.bk-btn.g{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:#dfe3f5}
.bk-btn.t{background:transparent;color:#8f97bd;min-height:40px;font-weight:700;font-size:13px}
.bk-btn:disabled{opacity:.6;cursor:default}
.bk-arena{display:flex;min-height:140px;position:relative;margin:8px 14px 0}
.bk-sd{flex:1;padding:20px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#fff;position:relative;border-radius:16px}
.bk-sd.r{background:linear-gradient(135deg,#ff416c,#b3123c);clip-path:polygon(0 0,100% 0,72% 100%,0 100%);border-radius:16px 0 0 16px}
.bk-sd.b{background:linear-gradient(135deg,#2b5cff,#0b2fa8);clip-path:polygon(28% 0,100% 0,100% 100%,0 100%);margin-left:-14%;border-radius:0 16px 16px 0}
.bk-sd .rl{font-size:10px;font-weight:800;letter-spacing:.1em;opacity:.85}
.bk-sd .nk{font-size:14px;font-weight:900;margin:5px 0 7px;word-break:break-all;max-width:120px}
.bk-sd .sc{font-size:24px;font-weight:900;line-height:1;font-variant-numeric:tabular-nums}
.bk-sd .sc small{font-size:11px;font-weight:700;margin-left:2px;opacity:.85}
.bk-sd.win{box-shadow:inset 0 0 0 3px #ffd447}
.bk-sd.lose{filter:grayscale(.5) brightness(.72)}
.bk-crown{position:absolute;top:-12px;left:50%;transform:translateX(-50%);font-size:22px}
.bk-vs{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);z-index:5;font-size:24px;font-weight:900;font-style:italic;color:#fff;background:#0d1020;width:54px;height:54px;border-radius:50%;display:flex;align-items:center;justify-content:center;border:3px solid #ffd447;box-shadow:0 0 0 4px #0d1020}
.bk-verdict{font-size:22px;font-weight:900;text-align:center;padding:14px 12px 0;letter-spacing:-.01em;word-break:keep-all}
.bk-verdict.win{color:#ffd447}.bk-verdict.lose{color:#ff6b81}.bk-verdict.draw{color:#9aa3c7}
@keyframes bkPop{from{transform:scale(.92);opacity:0}to{transform:scale(1);opacity:1}}
@keyframes bkFade{from{opacity:0}to{opacity:1}}
@media (prefers-reduced-motion:reduce){.bk-mask,.bk-modal{animation:none}}