/* そらレース（ソラカケル対戦）— ロビー & ルーム */

/* hidden属性を必ず優先させる。
   これが無いと .btn{display:inline-flex} や .sr-result-backdrop{display:flex} が
   UAスタイルの [hidden]{display:none} に勝ってしまい、結果モーダルや
   再戦ボタンが「非表示のはずなのに常に見える」バグになる（jinro.css の
   .jr-modal[hidden] と同じ対策の全体版）。 */
[hidden] { display: none !important; }

/* ---------------- ロビー ---------------- */
.sr-lead{margin:-6px 0 16px;font-size:.92rem;color:var(--ink-muted,#a59fd6)}
.sr-active-note{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding:12px 16px;border-radius:12px;background:rgba(255,207,69,.1);border:1px solid rgba(255,207,69,.4);margin-bottom:16px;font-size:.9rem}
.sr-active-note a{color:var(--gold,#ffcf45);font-weight:700}
.sr-active-note form{margin:0}
.sr-create-details{margin-bottom:20px}
.sr-create-details>summary{display:inline-block;cursor:pointer;list-style:none;padding:11px 22px;border-radius:999px;background:linear-gradient(135deg,var(--primary,#ff5e7d),var(--primary-deep,#e8345d));color:#fff;font-weight:700}
.sr-create-details>summary::-webkit-details-marker{display:none}
.sr-create-form{margin-top:14px;display:flex;flex-direction:column;gap:12px;max-width:420px}
.sr-fld{display:flex;flex-direction:column;gap:5px;font-size:.84rem;color:var(--ink-muted,#a59fd6)}
.sr-fld input,.sr-fld select{padding:9px 12px;border-radius:10px;border:1px solid var(--border,#322a63);background:var(--bg-deep,#14102b);color:var(--ink,#f4f1ff);font-family:inherit}
.sr-room-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px;margin-bottom:24px}
.sr-room-card{background:var(--panel,#1e1840);border:1px solid var(--border,#322a63);border-radius:12px;padding:16px 18px;display:flex;flex-direction:column;gap:8px}
.sr-room-card-head{display:flex;align-items:center;gap:8px}
.sr-room-card-name{font-family:var(--font-display,sans-serif);font-size:1.02rem;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sr-room-card-status{flex:none;font-size:.72rem;padding:2px 10px;border-radius:999px;font-weight:700}
.sr-room-card-status.is-lobby{color:var(--mint,#3ee0c8);background:rgba(62,224,200,.12);border:1px solid rgba(62,224,200,.35)}
.sr-room-card-status.is-racing{color:var(--gold,#ffcf45);background:rgba(255,207,69,.12);border:1px solid rgba(255,207,69,.35)}
.sr-room-card-meta{font-size:.82rem;color:var(--ink-muted,#a59fd6);display:flex;gap:14px}
.sr-room-card-members{font-size:.78rem;color:var(--ink-dim,#756f9f);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sr-room-card form,.sr-room-card .btn{margin:0;align-self:flex-end}
.sr-room-empty{grid-column:1/-1;text-align:center;color:var(--ink-dim,#756f9f);padding:40px 0;font-size:.92rem}
.sr-rules-panel{margin-bottom:24px}
.sr-rules-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:10px 20px;font-size:.88rem;color:var(--ink-muted,#a59fd6)}
.sr-rules-grid b{color:var(--ink,#f4f1ff)}

/* ---------------- ルーム ---------------- */
.sr-room-head{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin-bottom:14px}
.sr-room-title{font-family:var(--font-display,sans-serif);font-size:1.3rem;margin:0}
.sr-room-status{font-size:.74rem;padding:3px 12px;border-radius:999px;font-weight:700;color:var(--gold,#ffcf45);background:rgba(255,207,69,.12);border:1px solid rgba(255,207,69,.35)}
.sr-leave-form{margin:0 0 0 auto}
.sr-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:18px;align-items:start}
.sr-main{min-width:0}
.sora-stage{position:relative}
.sr-side{display:flex;flex-direction:column;gap:14px}
.sr-panel-title{font-family:var(--font-display,sans-serif);font-size:1rem;margin:0 0 10px;display:flex;align-items:center;gap:8px}
.sr-timer{margin-left:auto;font-size:.85rem;color:var(--gold,#ffcf45);font-weight:700}

/* メンバー */
.sr-members{display:flex;flex-direction:column;gap:8px}
.sr-member{display:flex;align-items:center;gap:9px;font-size:.9rem}
.sr-member.is-away{opacity:.45}
.sr-member-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sr-member-name small{color:var(--ink-dim,#756f9f)}
.sr-member-char{font-size:.72rem;color:var(--ink-dim,#756f9f)}
.sr-host-mark{flex:none}

/* キャラ選択 */
.sr-char-picker{display:flex;flex-wrap:wrap;gap:7px}
.sr-char-btn{display:flex;align-items:center;gap:6px;padding:6px 11px;border-radius:999px;border:1px solid var(--border,#322a63);background:var(--bg-deep,#14102b);color:var(--ink,#f4f1ff);font-size:.8rem;cursor:pointer;font-family:inherit}
.sr-char-btn .dot{width:10px;height:10px;border-radius:50%;background:var(--c,#888);flex:none}
.sr-char-btn.is-active{border-color:var(--c,#ff5e7d);box-shadow:0 0 0 1px var(--c,#ff5e7d) inset}
.sr-char-btn:hover{border-color:var(--c,#ff5e7d)}

/* 開始まわり */
.sr-start-area{margin-top:14px}
.sr-start-hint{font-size:.8rem;color:var(--ink-dim,#756f9f);text-align:center;margin-top:8px}

/* ライブ順位 */
.sr-rank{display:flex;flex-direction:column;gap:6px}
.sr-rank-row{display:flex;align-items:center;gap:8px;font-size:.86rem;padding:6px 8px;border-radius:9px;background:var(--bg-deep,#14102b)}
.sr-rank-row.is-me{outline:1px solid var(--mint,#3ee0c8)}
.sr-rank-row.is-dead{opacity:.55}
.sr-rank-pos{flex:none;width:2em;text-align:center;font-weight:700}
.sr-rank-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.sr-rank-name small{color:var(--ink-dim,#756f9f)}
.sr-rank-dist{flex:none;font-size:.78rem;color:var(--ink-muted,#a59fd6)}
.sr-rank-score{flex:none;font-weight:700;color:var(--gold,#ffcf45);min-width:3.5em;text-align:right}
.sr-rank-empty{text-align:center;color:var(--ink-dim,#756f9f);font-size:.85rem;padding:12px 0}

/* カウントダウン */
.sr-countdown{position:absolute;inset:0;z-index:30;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;background:rgba(12,10,34,.55);border-radius:inherit;pointer-events:none}
.sr-countdown-num{font-family:var(--font-display,sans-serif);font-size:5rem;font-weight:800;color:#fff;text-shadow:0 6px 30px rgba(0,0,0,.6);animation:srPulse 1s ease infinite}
.sr-countdown-sub{font-size:.9rem;color:var(--ink-muted,#a59fd6)}
@keyframes srPulse{0%{transform:scale(1)}50%{transform:scale(1.12)}100%{transform:scale(1)}}

/* 結果モーダル */
.sr-result-backdrop{position:fixed;inset:0;z-index:120;background:rgba(8,6,24,.7);backdrop-filter:blur(3px);display:flex;align-items:center;justify-content:center;padding:20px}
.sr-result-card{background:var(--panel,#1e1840);border:1px solid var(--border,#322a63);border-radius:18px;padding:26px 28px;max-width:480px;width:100%;max-height:85vh;overflow:auto;box-shadow:0 30px 80px -20px rgba(0,0,0,.8)}
.sr-result-title{font-family:var(--font-display,sans-serif);font-size:1.3rem;text-align:center;margin-bottom:16px}
.sr-result-list{display:flex;flex-direction:column;gap:8px;margin-bottom:18px}
.sr-result-row{display:flex;align-items:center;gap:9px;font-size:.92rem;padding:9px 12px;border-radius:11px;background:var(--bg-deep,#14102b)}
.sr-result-row.is-me{outline:1px solid var(--mint,#3ee0c8)}
.sr-result-row .sr-rank-pos{width:2.6em}
.sr-result-row .sr-rank-name{flex:1}
.sr-result-detail{flex:none;font-size:.78rem;color:var(--ink-muted,#a59fd6)}
.sr-result-actions{display:flex;flex-direction:column;gap:8px;align-items:center}

/* マルチ中はソロ用UIを抑制（windrunner.js が #wrRoot に .wr-multi を付ける） */
.wr-multi .wr-start{display:none!important}
.wr-multi .wr-pause-btn{display:none!important}
.wr-multi #wrRetryBtn{display:none!important}

/* レスポンシブ */
@media(max-width:900px){
    .sr-layout{grid-template-columns:1fr}
    .sr-side{flex-direction:column}
    .sora-room-page{--sr-room-gutter:clamp(5px,1.5vw,12px)}
    .sora-room-page .sora-stage{
        width:calc(100% + var(--sr-room-gutter) + var(--sr-room-gutter));
        margin-inline:calc(0px - var(--sr-room-gutter));
    }
    .sora-room-page .wr-root,
    .sora-room-page .wr-canvas{
        max-width:none;
        border-radius:0;
    }
}
@media(max-width:720px){
    .sr-room-head{padding-inline:6px}
}
.sr-lock-setting{display:flex;align-items:center;gap:8px;font-size:.84rem;color:var(--ink-muted,#a59fd6)}
.sr-lock-setting input{width:18px;height:18px;accent-color:var(--primary,#ff5e7d)}
.sr-password-setting{min-width:220px}
.sr-join-password{max-width:145px;margin:0 7px 7px 0;padding:7px 9px;border:1px solid var(--border,#322a63);border-radius:9px;background:var(--bg-deep,#14102b);color:var(--ink,#f4f1ff)}
.sr-access-settings{display:grid;gap:8px;margin:14px 0;padding:11px;border:1px solid var(--border,#322a63);border-radius:11px;background:rgba(255,255,255,.03)}
.sr-access-settings small{min-height:1em;color:var(--mint,#3ee0c8)}
