/* 가이드·점수표 공통 히어로: 홈(godbal.html)과 같은 블루 대 레드 배경 + 실제 봇 메시지 모양. 테마와 상관없이 어둡다 */
/* 상단 바는 히어로 위에 투명하게 얹어 배경 빛이 끊기지 않게 */
.top{position:absolute;inset:0 0 auto;z-index:5;background:none}
body{position:relative}
.top .brand{color:#fff}
.top nav a{color:#BAC2D4}
.top nav a:hover,.top nav a[aria-current]{color:#fff}
.bh{color:#F2F4F8;background:
  linear-gradient(115deg,transparent 0 49.9%,rgba(255,255,255,.05) 50% 50.1%,transparent 50.2%),
  radial-gradient(60% 90% at 0% 10%,color-mix(in srgb,#3D7BFF 38%,transparent),transparent 70%),
  radial-gradient(55% 90% at 100% 90%,color-mix(in srgb,#F04857 32%,transparent),transparent 70%),
  #0B1020}
.bh .wrap{padding-block:124px 88px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:52px;align-items:center;text-align:left}
.bh h1{margin:0;max-width:none;font-size:clamp(32px,4.4vw,52px);line-height:1.15;font-weight:800;letter-spacing:-.04em;color:#fff}
.bh h1 em{font-style:normal;color:#8FB0FF;display:block}
.bh .lead{margin:20px 0 0;max-width:30em;color:#BAC2D4;font-size:17px}
.bh .role{margin-top:28px;background:rgba(255,255,255,.06);border-color:rgba(255,255,255,.12)}
.bh .role button{color:#BAC2D4}
.bh .role button[aria-selected="true"]{background:#fff;color:#0B1020}
.bh .cta{justify-content:flex-start}
.bh .btn.solid{background:#fff;color:#0B1020}
.bh .btn.ghost{color:#fff;box-shadow:inset 0 0 0 1.5px rgba(255,255,255,.22)}

/* 디스코드 메시지 (봇 코드의 임베드 문구 그대로) */
.xdc{background:#313338;color:#DBDEE1;border-radius:16px;padding:16px 18px 18px;font-size:14px;line-height:1.5;text-align:left;border:1px solid rgba(255,255,255,.06);box-shadow:0 2px 4px rgba(0,0,0,.25),0 28px 64px rgba(0,0,0,.45);min-width:0}
.xdc-bar{display:flex;align-items:center;gap:8px;margin:-2px 0 14px;padding-bottom:12px;border-bottom:1px solid #3F4147;color:#F2F3F5;font-weight:700;font-size:14px}
.xdc-bar span{color:#80848E;font-weight:800;font-size:18px;line-height:1}
.xdc-reply{position:relative;display:flex;align-items:center;gap:6px;padding-left:52px;margin-bottom:4px;font-size:13px;color:#B5BAC1}
.xdc-reply::before{content:"";position:absolute;left:19px;top:9px;width:28px;height:12px;border:2px solid #4E5058;border-right:0;border-bottom:0;border-radius:6px 0 0 0}
.xdc-reply b{color:#DBDEE1;font-weight:600}
.xdc-mini{width:16px;height:16px;border-radius:50%;background:#C42E3C;color:#fff;font-size:9px;font-weight:800;display:inline-flex;align-items:center;justify-content:center}
.xdc-cmd{padding:0 4px;border-radius:4px;background:rgba(88,101,242,.3);color:#C9CDFB;font-weight:500}
.xdc-msg{display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px}
.xdc-av{width:40px;height:40px;border-radius:50%;overflow:hidden}
.xdc-av img{width:40px;height:40px;display:block}
.xdc-name{font-weight:600;color:#F2F3F5}
.xdc-name .app{display:inline-block;margin-left:4px;padding:0 4px;border-radius:3px;background:#5865F2;color:#fff;font-size:10px;font-weight:700;vertical-align:2px}
.xdc-name time{margin-left:6px;color:#949BA4;font-size:12px;font-weight:400}
.xdc p{margin:0}
.xdc-text{margin:2px 0 0}
.xdc-text p{margin:0}
.xdc code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-weight:400;font-size:11.5px;padding:1px 4px;border-radius:3px;background:#1E1F22;color:#DBDEE1}
/* 디스코드 임베드의 왼쪽 색 띠: 테두리 대신 배경으로 그린다 */
.xdc-embed{position:relative;margin-top:6px;border-radius:4px;background:#2B2D31;padding:10px 14px 12px 18px;overflow:hidden}
.xdc-embed::before{content:"";position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--bar,#5865F2)}
.xdc-title{font-weight:700;color:#F2F3F5;margin-bottom:6px}
.xdc-title a{color:#00A8FC;text-decoration:none}
.xdc-desc p{margin:0}
.xdc-desc .gap{height:10px}
.xdc-field{margin-top:8px}
.xdc .xh{display:block;margin:0 0 2px;font-size:13.5px;font-weight:700;color:#F2F3F5}
.xdc-fields{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:4px 18px}
.xdc-fields p{margin:0;font-size:13.5px;line-height:1.55;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xdc .tg{color:#949BA4}
.xdc-foot{margin-top:10px;font-size:12px;color:#949BA4;line-height:1.45}
.xdc-btn{display:inline-flex;align-items:center;gap:6px;margin-top:8px;padding:6px 14px;border-radius:4px;background:#4E5058;color:#fff;font-size:13.5px;font-weight:500}
.xdc-btn.p{background:#5865F2}
.xdc-eph{margin-top:6px;font-size:12px;color:#949BA4}
.xdc-eph a{color:#00A8FC;text-decoration:none}
/* 생각하는 중 → 결과 */
.xdc-think{margin:4px 0 0;color:#949BA4;font-style:italic}
.xdc-think i{font-style:normal;animation:xdcDot 1.2s infinite}
.xdc-think i:nth-child(2){animation-delay:.2s}.xdc-think i:nth-child(3){animation-delay:.4s}
@keyframes xdcDot{0%,60%,100%{opacity:.25}30%{opacity:1}}
.xdc-think{display:none}
.xdc.thinking .xdc-think{display:block}
.xdc.thinking .xdc-out{display:none}
/* 서버 화면: 채널 목록 + 메시지 */
.xdc.win{display:grid;grid-template-columns:168px minmax(0,1fr);padding:0;overflow:hidden}
.xdc-side{background:#2B2D31;padding:12px 8px;font-size:13.5px;color:#949BA4}
.xdc-side .sv{padding:2px 8px 10px;margin-bottom:6px;border-bottom:1px solid #1F2023;font-weight:700;color:#F2F3F5}
.xdc-side .cat{font-size:11px;font-weight:700;padding:10px 8px 2px;color:#949BA4}
.xdc-side .ch{padding:4px 8px;border-radius:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.xdc-side .ch::before{content:"# ";color:#80848E}
.xdc-side .ch.on{background:#404249;color:#F2F3F5}
.xdc.win .xdc-main{padding:16px 18px 18px;min-width:0}

/* /전적검색 카드 (봇 stat_card와 같은 모양, godbal.html과 같은 코드) */
.sc{position:relative;margin-top:8px;aspect-ratio:16/9;border-radius:8px;overflow:hidden;background:#10141F;color:#E6EAF2;container-type:inline-size;font-size:1.6cqw;line-height:1.25}
.sc>img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:70% 25%}
.sc::before{content:"";position:absolute;inset:0;z-index:1;background:linear-gradient(90deg,#10141F 0%,#10141F 38%,rgba(16,20,31,.55) 62%,rgba(16,20,31,.2) 100%)}
.sc::after{content:"";position:absolute;left:0;right:0;bottom:0;height:.5cqw;z-index:2;background:#8D7FF5}
.sc-in{position:relative;z-index:2;width:56cqw;padding:3.4cqw 0 0 4.4cqw;display:flex;flex-direction:column;gap:2.2cqw}
.sc-pill{align-self:flex-start;display:flex;align-items:center;gap:.9cqw;padding:.7cqw 1.6cqw;border-radius:9cqw;background:#181E2C;border:1px solid #2A3347;font-weight:700;font-size:1.7cqw}
.sc-pill::before{content:"";width:.6cqw;height:.6cqw;border-radius:50%;background:#8D7FF5}
.sc-who{display:flex;align-items:center;gap:2cqw}
.sc-av{flex:none;width:9.4cqw;height:9.4cqw;border-radius:50%;border:.3cqw solid #8D7FF5;display:flex;align-items:center;justify-content:center;background:#E8414F;font-weight:800;font-size:4cqw;color:#fff}
.sc-nm{font-weight:800;font-size:4.2cqw;line-height:1.1}
.sc-sub{display:flex;align-items:center;gap:1.2cqw;margin-top:1cqw;font-size:1.9cqw;color:#8992A6}
.sc-sub b{padding:.4cqw 1.2cqw;border-radius:9cqw;background:#8D7FF5;color:#fff;font-size:1.9cqw}
.sc-sub strong{color:#E0B551;font-size:2.4cqw}
.sc-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:1.1cqw}
.sc-stats div{padding:1.4cqw 0;border-radius:1.25cqw;background:#181E2C;border:1px solid #2A3347;text-align:center;font-size:1.5cqw;color:#8992A6}
.sc-stats strong{display:block;margin-top:.5cqw;font-size:3.1cqw;color:#E6EAF2}
.sc-stats .w{color:#5A86F2}
.sc-mid{display:flex;gap:2.2cqw;font-size:1.5cqw;color:#8992A6}
.sc-mid>div>span{display:flex;gap:.6cqw;margin-top:.8cqw}
.sc-wl{font-style:normal;width:4cqw;padding:.8cqw 0;border-radius:.8cqw;text-align:center;font-weight:800;font-size:1.7cqw;color:#fff;background:#5A86F2}
.sc-wl.l{background:#EA5D69}
.sc-pos{font-style:normal;padding:.8cqw 1.3cqw;border-radius:9cqw;background:#20283A;border:1px solid #2A3347;font-weight:700;font-size:1.65cqw;color:#E6EAF2}
.sc-ch{display:grid;grid-template-columns:repeat(3,1fr);gap:1.1cqw}
.sc-ch div{display:flex;align-items:center;gap:1.2cqw;padding:1.6cqw 1.2cqw;border-radius:1.4cqw;background:#181E2C;border:1px solid #2A3347;font-size:1.4cqw;color:#8992A6;min-width:0}
.sc-ch img{flex:none;width:5cqw;height:5cqw;border-radius:50%}
.sc-ch b{display:block;font-size:1.9cqw;color:#E6EAF2;white-space:nowrap}
.sc-ch i{display:block;font-style:normal;font-weight:700;color:#5A86F2;white-space:nowrap}
.sc-url{position:absolute;right:4.4cqw;bottom:2.4cqw;z-index:2;font-weight:700;font-size:1.6cqw}

@media (max-width:860px){
  .bh .wrap{grid-template-columns:minmax(0,1fr);gap:32px;padding-block:128px 56px}
  .xdc.win{grid-template-columns:minmax(0,1fr)}
  .xdc-side{display:none}
}
@media (max-width:520px){
  .xdc{padding:14px 12px 14px}
  .xdc-fields{gap:4px 10px}
  .xdc-fields p{font-size:12.5px;white-space:normal}
  .xdc .xdc-foot.long{display:none}
}
@media (prefers-reduced-motion:reduce){.xdc-think i{animation:none}}
.sc-pos{white-space:nowrap}
.xdc-side .ch.v::before{content:"🔊 "}