/* ニコニコ見つけを 教室の 掲示の ように ならべる（2026-10-14。紙の「ニコニコ見つけ」の 掲示に 合わせた）。
   子どもの「みんなの ニコニコ」と、先生の「ニコニコ見つけを 映す」の 両方が 読む。中みは engine.js の KP.nikoBoard */
.nb { background:#fff; border-radius:18px; padding:14px 16px 18px; box-shadow:0 4px 0 rgba(0,0,0,.06); color:#343a40; }
.nb-head { display:flex; flex-wrap:wrap; align-items:center; gap:10px 18px; margin-bottom:14px; }
.nb-title { display:flex; gap:5px; }
.nb-t { display:inline-flex; align-items:center; justify-content:center; width:1.3em; height:1.3em; font-size:clamp(26px,3vw,42px); font-weight:900;
  color:var(--c); background:var(--b); border-radius:6px; transform:rotate(var(--r)); box-shadow:0 3px 0 rgba(0,0,0,.08); }
.nb-range { font-size:17px; font-weight:bold; color:#7a6a45; }
.nb-total { display:flex; align-items:center; gap:6px; font-size:20px; font-weight:900; color:#5c4f2e; }
.nb-flower { display:inline-flex; align-items:center; justify-content:center; width:2.2em; height:2.2em; border-radius:50%; background:#fff;
  border:3px dotted #e03131; color:#e03131; font-size:22px; box-shadow:0 0 0 4px #fff, 0 0 0 7px #ffc9c9; }
.nb-bubble { margin-left:auto; position:relative; background:#fff; border:3px solid #868e96; border-radius:18px; padding:7px 56px 7px 14px;
  font-size:14px; font-weight:bold; color:#5c4f2e; line-height:1.5; }
.nb-bubble b { display:block; color:#e03131; font-size:19px; }
.nb-face { position:absolute; right:8px; top:50%; transform:translateY(-50%); font-size:34px; }
.nb-cols { column-width:240px; column-gap:16px; }
.nb-day { break-inside:avoid; break-after:avoid; text-align:center; margin:4px 0 12px; }
.nb-day span { display:inline-block; background:var(--c); color:#4a3f2a; font-size:17px; font-weight:900; padding:4px 24px;
  clip-path:polygon(0 0,100% 0,calc(100% - 12px) 50%,100% 100%,0 100%,12px 50%); }
.nb-note { display:inline-block; width:100%; break-inside:avoid; position:relative; background:var(--bg); border-radius:4px;
  padding:15px 12px 8px; margin:0 0 14px; transform:rotate(var(--rot)); box-shadow:0 2px 0 rgba(0,0,0,.07); }
.nb-note::before { content:''; position:absolute; top:-7px; left:50%; width:58px; height:16px; margin-left:-29px; background:var(--tape);
  opacity:.75; transform:rotate(-3deg); border-radius:2px; }
.nb-note.all { background:#fff3bf; }
.nb-to { font-size:18px; font-weight:900; color:var(--to); background:linear-gradient(transparent 62%, var(--hl) 62%); word-break:keep-all; overflow-wrap:anywhere; }
/* 分かち書きの 空白で 行を かえる（ことばの とちゅうで 切らない）。空白の ない 長い 文だけ とちゅうで 切る */
.nb-body { font-size:16px; line-height:1.6; margin-top:4px; white-space:pre-wrap; word-break:keep-all; overflow-wrap:anywhere; }
.nb-from { text-align:right; font-size:14px; font-weight:bold; color:#5c4f2e; margin-top:2px; }
.nb-deco { break-inside:avoid; text-align:center; font-size:30px; margin:-4px 0 12px; }
.nb-empty { text-align:center; font-size:20px; color:#7a6a45; padding:30px 10px; white-space:pre-line; }
/* わたしに とどいた */
.nb-date { font-size:13px; font-weight:bold; color:#7a6a45; margin-bottom:2px; }
.nb-mark { display:inline-block; font-size:12px; font-weight:bold; border-radius:999px; padding:0 8px; margin-left:6px; background:#fff; }
.nb-mark.new { color:#e03131; border:2px solid #ffa8a8; }
.nb-mark.fix { color:#1971c2; border:2px solid #a5d8ff; }
.nb-mark.all { color:#a61e4d; border:2px solid #fcc2d7; }
.nb-note.new { box-shadow:0 0 0 3px #ffa8a8, 0 2px 0 rgba(0,0,0,.07); }
/* テレビに 大きく */
.nb.big .nb-cols { column-width:clamp(240px,21vw,400px); }
.nb.big .nb-day span { font-size:clamp(17px,1.5vw,26px); }
.nb.big .nb-to { font-size:clamp(18px,1.55vw,28px); }
.nb.big .nb-body { font-size:clamp(16px,1.4vw,25px); }
.nb.big .nb-from { font-size:clamp(14px,1.15vw,20px); }
.nb.big .nb-total { font-size:clamp(20px,1.8vw,30px); }
.nb.big .nb-bubble { font-size:clamp(14px,1.2vw,20px); }
.nb.big .nb-bubble b { font-size:clamp(19px,1.6vw,28px); }
@media (max-width:520px) {
  .nb { padding:12px 10px; }
  .nb-bubble { margin-left:0; }
}