/* お知らせと、AI対戦のローカルスタンプ。 */
.news-badge[hidden], .stamp-open[hidden], .stamp-picker[hidden] { display:none !important; }
.news-button { position:relative; padding:3px; }
.news-button img { width:28px; height:28px; object-fit:contain; }
.news-badge { position:absolute; right:0; top:-3px; min-width:20px; padding:2px 4px; border-radius:12px; background:#ce243c; color:white; border:1px solid #fff0d4; font: bold 12px/1.1 sans-serif; }
#s-home .bar-title { font-size:clamp(12px,3.6vw,18px); }
#s-home .bar > .money { font-size:14px; padding:4px; }
#s-news { background:linear-gradient(#24365e,#101c34); padding:0 10px 10px; }
#s-news .bar { justify-content:flex-start; gap:12px; }
#s-news h1 { font-size:19px; margin:0; }
#news-back { font-size:13px; padding:4px 10px; }
.news-content { min-height:0; overflow-y:auto; touch-action:pan-y; font-family:'Yu Gothic',sans-serif; }
.stamp-open { position:absolute; top:72px; left:55px; height:40px; min-height:40px; font-size:12px; padding:2px 8px; z-index:4; }
.stamp-picker { position:absolute; z-index:14; left:8px; right:8px; top:116px; bottom:calc(max(13%,76px) + 48px); background:#10203ff7; border:2px solid #eee4cd; border-radius:10px; padding:8px; display:flex; flex-direction:column; box-shadow:0 5px 20px #0009; }
.stamp-picker header { flex:none; display:flex; align-items:center; justify-content:space-between; gap:6px; padding-bottom:6px; font-size:13px; }
.stamp-picker header button { padding:3px 8px; font-size:12px; }
.stamp-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); grid-auto-rows:max-content; align-content:start; gap:6px; overflow-y:auto; touch-action:pan-y; min-height:0; }
.stamp-choice { min-width:0; padding:3px; display:flex; flex-direction:column; align-items:center; border:1px solid #7189ae; border-radius:8px; background:#203657; color:#fffbea; cursor:pointer; }
.stamp-choice img { flex:none; width:100%; height:auto; aspect-ratio:1; object-fit:contain; }
.stamp-choice span { font:bold clamp(10px,2.8vw,13px)/1.5 'Yu Gothic',sans-serif; white-space:nowrap; }
.stamp-bubbles { position:absolute; inset:0; pointer-events:none; z-index:12; overflow:hidden; }
.stamp-bubble { position:absolute; width:clamp(112px,30vw,138px); text-align:center; }
.stamp-bubble img { width:100%; height:auto; aspect-ratio:1; object-fit:contain; display:block; filter:drop-shadow(0 2px 3px #0008); }
.stamp-bubble span { display:inline-block; font:11px/1.4 'Yu Gothic',sans-serif; border-radius:8px; padding:0 6px; background:#101c34dd; }
.stamp-bubble.self { left:5px; bottom:calc(max(13%,76px) + 48px); }
.stamp-bubble.opponent { right:5px; top:26%; }
.social-result-actions { display:flex; gap:6px; margin-top:8px; }
.social-result-actions .btn { flex:1; min-width:0; padding:6px 3px; font-size:12px; letter-spacing:0; }
/* 結果のボタンと札を覆わず、結果窓の上の余白へ。 */
.versus:has(#result[style*="flex"]) .stamp-bubble { top:4px; bottom:auto; width:100px; }
.versus:has(#result[style*="flex"]) .stamp-open { visibility:hidden; }
button:focus-visible { outline:3px solid #ffe36b; outline-offset:1px; }
@media(max-height:520px) { .stamp-bubble { width:112px; } }
/* 10-17 相手のスタンプは相手の顔＋ふきだし（js/names.js の rivalFace）。真ん中の案内（.vs-note・44%）に重ならないよう、相手の陣の右上に小さく。 */
.stamp-bubble.opponent.face { width:auto; max-width:min(62%,230px); top:118px; right:6px; text-align:right; }
/* 結果の画面でも顔の吹き出しは同じ場所（上の城の札に重ねない）。ふつうの吹き出しの「上へ寄せて100px」は顔の札には使わない */
.versus:has(#result[style*="flex"]) .stamp-bubble.opponent.face { top:118px; width:auto; }
/* やめる（文字のボタン）とスタンプが重ならないよう、スタンプを右へずらす */
.versus .stamp-open { left:68px; }
.stamp-bubble.face .stamp-face-row { display:flex; align-items:center; gap:6px; background:#101c34e6; border:2px solid #eee4cd; border-radius:12px; padding:3px 9px 3px 3px; }
.stamp-bubble.face .stamp-face-row img { width:44px; height:44px; flex:none; border-radius:50%; background:#2c4470; object-fit:cover; object-position:top; filter:none; aspect-ratio:auto; }
.stamp-bubble.face .stamp-face-row b { font:bold 15px/1.3 'Yu Gothic',sans-serif; color:#fffbea; white-space:nowrap; }
.stamp-bubble.face > span { max-width:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
/* お知らせ: 一覧の行（絵・日付・未読・見出し・要点の1行目）。中身は js/news-view.js */
.news-entry { width:100%; display:grid; grid-template-columns:56px minmax(0,1fr); gap:9px; align-items:center; text-align:left; color:#fffbea; background:#13223f; border:1px solid #8195b9; border-radius:10px; padding:8px; margin:0 0 8px; cursor:pointer; font:inherit; }
.news-entry.unread { border-color:#ffd77d; box-shadow:0 0 0 1px #ffd77d55 inset; }
.ne-thumb { width:56px; height:56px; border-radius:8px; overflow:hidden; background:#0b1630; display:flex; align-items:center; justify-content:center; }
.ne-thumb > img { width:100%; height:100%; object-fit:cover; }
.ne-text { min-width:0; display:flex; flex-direction:column; gap:2px; }
.ne-meta { display:flex; justify-content:space-between; gap:6px; }
.ne-meta time { font-size:11px; color:#bed2f5; }
.ne-meta small { font-size:11px; color:#9fb0cf; }
.news-entry.unread .ne-meta small { color:#1a1100; background:#ffd77d; border-radius:8px; padding:0 6px; font-weight:bold; }
.ne-text b { font-size:14px; line-height:1.35; overflow-wrap:anywhere; }
.ne-head { font-size:11.5px; color:#c9d6ee; line-height:1.4; overflow:hidden; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
/* お知らせ: 本文 */
.news-article { padding:12px 10px 16px; background:#10203c; border:1px solid #8195b9; border-radius:10px; color:#fffbea; }
.na-hero { display:flex; gap:6px; justify-content:center; align-items:center; flex-wrap:wrap; margin:-2px 0 8px; }
.na-hero > img { flex:1 1 0; min-width:0; max-width:100%; max-height:120px; object-fit:cover; border-radius:8px; border:1px solid #8195b9; }
.na-meta { display:flex; justify-content:space-between; align-items:center; gap:6px; }
.na-meta time { font-size:12px; color:#bed2f5; }
.na-kind { font-size:11px; color:#10203c; background:#bed2f5; border-radius:8px; padding:1px 7px; font-weight:bold; }
.news-article h2 { font-size:19px; line-height:1.45; overflow-wrap:anywhere; margin:6px 0 8px; color:#ffe9a8; }
.na-points { list-style:none; margin:0 0 6px; padding:8px 10px; background:#0b1630; border:1px solid #ffd77d66; border-radius:8px; }
.na-points li { font-size:13.5px; line-height:1.55; padding-left:16px; position:relative; overflow-wrap:anywhere; }
.na-points li + li { margin-top:4px; }
.na-points li::before { content:'◆'; position:absolute; left:0; color:#ffd77d; font-size:10px; top:3px; }
.na-sec { font-size:14px; margin:14px 0 6px; padding-bottom:3px; border-bottom:1px solid #8195b955; color:#dfe8fb; }
.na-sec.down { color:#ff8f8f; } .na-sec.up { color:#7ee08a; }
.na-unit { display:grid; grid-template-columns:auto minmax(0,1fr); gap:9px; align-items:start; padding:8px; margin:0 0 7px; border-radius:9px; background:#152a4d; border-left:4px solid #6fb1ff; }
.na-unit.down { border-left-color:#ff6b6b; background:linear-gradient(90deg,#3a1a2a,#152a4d 55%); }
.na-unit.up { border-left-color:#5fd36f; background:linear-gradient(90deg,#173a2a,#152a4d 55%); }
.na-ic { position:relative; display:inline-block; width:var(--s); height:var(--s); border-radius:8px; border:2px solid var(--rc); background:#0b1630; flex:none; box-sizing:border-box; }
.na-ic img { width:100%; height:100%; object-fit:contain; display:block; }
.na-ic i { position:absolute; right:-3px; bottom:-5px; font:bold 9px/1 sans-serif; font-style:normal; color:#10203c; background:var(--rc); border-radius:6px; padding:1px 3px; }
.na-body { min-width:0; }
.na-name { display:flex; flex-wrap:wrap; align-items:baseline; gap:2px 6px; }
.na-name b { font-size:15px; }
.na-star { font-size:10px; letter-spacing:-1px; }
.na-tag { margin-left:auto; font-size:11px; font-weight:bold; }
.na-unit.down .na-tag { color:#ff8f8f; } .na-unit.up .na-tag { color:#7ee08a; }
.na-stat { display:grid; grid-template-columns:auto minmax(40px,1fr) auto; gap:6px; align-items:center; margin-top:5px; font-size:12.5px; }
.na-stat .lbl { color:#c9d6ee; min-width:3.5em; }
.na-stat .bars { display:flex; flex-direction:column; gap:2px; }
.na-stat .bars i { display:block; height:6px; border-radius:3px; min-width:3px; }
.na-stat .b-from { background:#7d8aa5; }
.na-stat.up .b-to { background:#5fd36f; } .na-stat.down .b-to { background:#ff6b6b; } .na-stat.flat .b-to { background:#6fb1ff; }
.na-stat .nums { white-space:nowrap; }
.na-stat .nums em { font-style:normal; margin:0 3px; color:#9fb0cf; }
.na-stat .nums b { font-size:15px; }
.na-stat.up .nums b, .na-stat.up small { color:#7ee08a; } .na-stat.down .nums b, .na-stat.down small { color:#ff8f8f; }
.na-stat small { margin-left:4px; font-size:11px; color:#bed2f5; }
.na-why { margin:5px 0 0; font-size:12px; line-height:1.5; color:#dfe8fb; overflow-wrap:anywhere; }
.na-wiki { display:inline-block; margin-top:6px; font-size:12px; color:#9fd0ff; text-decoration:none; border:1px solid #6fb1ff88; border-radius:12px; padding:3px 9px; }
.na-deck { display:flex; align-items:center; gap:8px; margin:0 0 6px; }
.na-faces { display:flex; gap:4px; flex-wrap:wrap; min-width:0; }
.na-deck b { margin-left:auto; font-size:15px; color:#ffd77d; }
.na-note { font-size:11px; color:#9fb0cf; margin:2px 0 0; line-height:1.5; }
.na-links { display:flex; flex-wrap:wrap; gap:6px; }
.na-link { font-size:13px; color:#10203c; background:#ffd77d; border-radius:14px; padding:6px 12px; text-decoration:none; font-weight:bold; }
/* 古いシーズンの畳み（js/social.js の .news-older・10-17 初見 C） */
.news-older { margin:0 0 8px; }
.news-older > summary { cursor:pointer; padding:10px 9px; min-height:24px; border:1px dashed #8195b9; border-radius:10px; color:#bed2f5; font-size:13px; list-style-position:inside; }
.news-older[open] > summary { margin-bottom:8px; }