/* =====================================================
   results.css — STEP 4 AI予想結果
===================================================== */

/* Loading */
#loadingArea{text-align:center;padding:80px 20px}
.loading-horse{font-size:3.5rem;margin-bottom:20px;display:block;animation:horseRun 1s ease-in-out infinite alternate}
@keyframes horseRun{from{transform:translateX(-10px)}to{transform:translateX(10px)}}
.loading-bar-wrap{max-width:380px;margin:0 auto 16px;background:var(--navy2);border-radius:10px;height:6px;overflow:hidden}
.loading-bar{height:100%;background:linear-gradient(90deg,var(--primary2),var(--primary),var(--gold),var(--primary2));background-size:200%;animation:loadBar 1.5s ease infinite;border-radius:10px}
@keyframes loadBar{0%{background-position:200%}100%{background-position:0%}}
.loading-text{font-size:1rem;color:var(--primary);font-weight:700}
.loading-steps{font-size:.78rem;color:var(--muted);margin-top:6px}

/* Race header */
#raceHeader{margin-bottom:20px}
.race-name{font-size:1.4rem;font-weight:800;margin-bottom:10px}
.race-meta{display:flex;flex-wrap:wrap;gap:7px}
.badge{font-size:.75rem;padding:4px 10px;background:var(--navy3);border:1px solid var(--border);border-radius:20px;color:var(--muted)}
.risk-badge{border-color:rgba(34,197,94,.25);color:var(--primary)}
.result-section-title{font-size:.95rem;font-weight:700;color:var(--gold);margin-bottom:16px;display:flex;align-items:center;gap:8px}
.result-section-title::after{content:'';flex:1;height:1px;background:var(--border)}

/* Horse cards */
#rankingList{display:flex;flex-direction:column;gap:10px}
.horse-card{background:var(--navy3);border:1px solid var(--border);border-radius:var(--radius);padding:14px 18px;display:flex;align-items:flex-start;gap:12px;flex-wrap:wrap;transition:border-color .2s}
.horse-card.rank-1{border-color:rgba(245,158,11,.4);background:rgba(245,158,11,.03)}
.horse-card.rank-2{border-color:rgba(34,197,94,.3)}
.horse-card.rank-3{border-color:rgba(129,140,248,.25)}
.horse-rank-badge{min-width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:.9rem;font-weight:800;flex-shrink:0}
.rank1{background:linear-gradient(135deg,#f59e0b,#d97706);color:#000}
.rank2{background:linear-gradient(135deg,#22c55e,#16a34a);color:#000}
.rank3{background:linear-gradient(135deg,#818cf8,#6366f1);color:#fff}
.rank4,.rank5,.rank6,.rank7,.rank8{background:var(--navy2);color:var(--muted);border:1px solid var(--border)}
.horse-mark{font-size:1.7rem;font-weight:900;min-width:32px;text-align:center;line-height:1;flex-shrink:0}
.honmei{color:var(--gold)}
.taikou{color:var(--primary)}
.tanaana{color:var(--purple)}
.renka{color:var(--muted)}
.none{color:var(--muted);font-size:1.1rem}
.horse-main-info{flex:1;min-width:180px}
.horse-header-row{display:flex;align-items:center;gap:7px;margin-bottom:7px;flex-wrap:wrap}
.horse-num-badge{background:rgba(34,197,94,.12);color:var(--primary);padding:2px 7px;border-radius:4px;font-size:.72rem;font-weight:700}
.horse-name-text{font-size:1rem;font-weight:700}
.horse-jockey-text{font-size:.78rem;color:var(--muted)}
.score-bar-wrap{position:relative;background:rgba(255,255,255,.05);border-radius:5px;height:20px;overflow:hidden;margin-bottom:7px}
.score-bar{height:100%;background:linear-gradient(90deg,#16a34a,#22c55e);border-radius:5px;transition:width 1s ease}
.score-val{position:absolute;right:7px;top:50%;transform:translateY(-50%);font-size:.7rem;font-weight:700;color:var(--text)}
.horse-sub-row{display:flex;gap:7px;flex-wrap:wrap;align-items:center}
.prob-badge{font-size:.75rem;font-weight:700;color:#fff;background:rgba(245,158,11,.18);border:1px solid rgba(245,158,11,.25);padding:2px 8px;border-radius:4px}
.odds-badge{font-size:.75rem;color:var(--muted);background:var(--navy2);padding:2px 8px;border-radius:4px}
.rec-label{font-size:.72rem;font-weight:700;padding:2px 8px;border-radius:4px}
.rec-label.honmei{background:rgba(245,158,11,.12);color:var(--gold)}
.rec-label.taikou{background:rgba(34,197,94,.12);color:var(--primary)}
.rec-label.tanaana{background:rgba(129,140,248,.12);color:var(--purple)}
.rec-label.renka{background:rgba(148,163,184,.08);color:var(--muted)}
.score-breakdown{min-width:210px;flex-shrink:0}
.breakdown-item{display:flex;align-items:center;gap:6px;margin-bottom:4px}
.breakdown-label{font-size:.65rem;color:var(--muted);min-width:58px}
.mini-bar-wrap{flex:1;background:rgba(255,255,255,.04);border-radius:3px;height:6px;overflow:hidden}
.mini-bar{height:100%;background:rgba(34,197,94,.55);border-radius:3px;transition:width 1s ease}
.breakdown-val{font-size:.65rem;color:var(--text);min-width:22px;text-align:right}

/* Bets */
.bet-summary{display:flex;gap:20px;flex-wrap:wrap;background:rgba(34,197,94,.04);border:1px solid rgba(34,197,94,.12);border-radius:var(--radius-sm);padding:14px 18px;margin-bottom:14px}
.bet-summary-item{display:flex;flex-direction:column;gap:2px}
.summary-label{font-size:.72rem;color:var(--muted)}
.summary-val{font-size:1rem;font-weight:700;color:var(--text)}
.summary-val.highlight{color:var(--gold)}
.bet-list{display:flex;flex-direction:column;gap:7px}
.bet-row{display:flex;align-items:center;gap:10px;background:var(--navy3);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 14px;flex-wrap:wrap}
.bet-type-tag{font-size:.72rem;font-weight:700;background:rgba(245,158,11,.12);color:var(--gold);padding:3px 8px;border-radius:4px;white-space:nowrap;min-width:46px;text-align:center}
.bet-target{flex:1;font-size:.85rem;min-width:150px}
.bet-amount{font-size:.9rem;font-weight:700;color:var(--primary);white-space:nowrap}
.bet-return{font-size:.78rem;color:var(--muted);white-space:nowrap}
.no-bets{color:var(--muted);font-size:.88rem;padding:20px;text-align:center;border:1px dashed var(--border);border-radius:var(--radius-sm)}

/* Comments */
#aiComments{display:flex;flex-direction:column;gap:14px}
.comment-card{background:var(--navy3);border:1px solid var(--border);border-radius:var(--radius);padding:16px 18px}
.comment-header{display:flex;align-items:center;gap:9px;margin-bottom:9px;flex-wrap:wrap}
.comment-medal{font-size:1.3rem}
.comment-rank{font-size:.8rem;color:var(--muted)}
.comment-horse{font-weight:700;font-size:.95rem}
.comment-score{font-size:.72rem;background:rgba(34,197,94,.08);color:var(--primary);padding:2px 8px;border-radius:4px;margin-left:auto}
.comment-text{font-size:.84rem;color:var(--text2);line-height:1.85}

/* Charts */
.charts-grid{display:grid;grid-template-columns:2fr 1fr;gap:16px}
@media(max-width:700px){.charts-grid{grid-template-columns:1fr}}
.chart-card{background:var(--navy3);border:1px solid var(--border);border-radius:var(--radius);padding:18px}
.chart-title{font-size:.8rem;color:var(--muted);margin-bottom:12px;text-align:center;font-weight:600}

/* Disclaimer */
.disclaimer{background:rgba(239,68,68,.04);border:1px solid rgba(239,68,68,.12);border-radius:var(--radius);padding:16px 18px;font-size:.78rem;color:var(--text2);line-height:1.75;margin-top:20px}
.disclaimer strong{color:#fca5a5}

/* Reset */
.reset-area{text-align:center;margin-top:28px}
.btn-reset{background:transparent;border:1.5px solid var(--border);color:var(--muted);padding:12px 32px;border-radius:var(--radius-sm);cursor:pointer;font-size:.88rem;font-weight:600;transition:all .2s}
.btn-reset:hover{border-color:var(--primary);color:var(--primary)}

@media(max-width:768px){
  .horse-card{gap:8px}
  .score-breakdown{display:none}
  .bet-row{flex-direction:column;align-items:flex-start}
  .charts-grid{grid-template-columns:1fr}
}
