/* クチリピ 1.4.0 web-new(2026-10-23)。色は既存の --k-* を使う(明暗は app.css 側で切り替わる) */
.n140-small{font-size:.85rem;line-height:1.6}
.n140-lead{margin:0 0 16px}
.n140-row{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:8px}
.n140-acts{display:flex;flex-wrap:wrap;gap:10px;justify-content:center;margin-top:16px}
.n140-acts .btn{min-height:44px}
.n140-tools{display:flex;justify-content:flex-end;margin:-4px 0 10px}
.n140-check{display:inline-flex;align-items:center;gap:8px;min-height:44px;font-size:.9rem;cursor:pointer}
.n140-check input{width:20px;height:20px;accent-color:var(--k-brick,#A63828)}
.n140-link{border:0;background:none;padding:6px 0;min-height:36px;color:var(--k-muted,#6B605A);font:inherit;font-size:.82rem;text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.n140-fb{margin-top:10px}
.n140-fb:empty{display:none}

/* N2 発音記号 */
.n140-ipa{margin-top:12px;padding:10px 12px;border-radius:14px;background:var(--k-plane2,#F0DCC2);color:var(--k-ink,#24201F)}
.n140-ipa[hidden]{display:none}
.n140-ipa-h{font-size:.78rem;font-weight:800;color:var(--k-muted,#6B605A);margin-bottom:6px}
.n140-ipa-list{display:flex;flex-wrap:wrap;gap:6px 14px}
.n140-ipa-i{font-size:.95rem;font-family:"Lucida Grande","Segoe UI","Noto Sans","Helvetica Neue",Arial,sans-serif;overflow-wrap:anywhere}
.n140-ipa-i b{font-weight:800;margin-right:2px}
.n140-ipa-i.weak b{color:var(--k-brick,#A63828)}
.n140-ipa-inline{font-weight:500;color:var(--k-muted,#6B605A);font-family:"Lucida Grande","Segoe UI","Noto Sans",Arial,sans-serif}

/* N1 教養講義: 英文と和訳を並べる */
.n140-lec-slot{margin-top:12px}
.n140-seg{display:inline-flex;gap:4px;padding:4px;border-radius:99px;background:var(--k-plane2,#F0DCC2);max-width:100%;flex-wrap:wrap}
.n140-segb{min-height:40px;padding:0 14px;border:0;border-radius:99px;background:transparent;color:var(--k-ink,#24201F);font:inherit;font-size:.85rem;font-weight:700;cursor:pointer}
.n140-segb.on{background:var(--k-plane1,#FFF8EF)}
.n140-par-wrap{margin-top:10px}
.n140-par-wrap[hidden]{display:none}
.n140-par-tools{display:flex;flex-wrap:wrap;align-items:center;gap:4px 14px;margin-bottom:6px}
.n140-par{display:flex;flex-direction:column;gap:4px;padding:6px;max-height:min(62vh,560px);overflow:auto;border-radius:16px;background:var(--k-plane2,#F0DCC2);overscroll-behavior:contain;scroll-behavior:smooth}
.n140-pr{display:flex;gap:10px;padding:10px 12px;border-radius:12px;background:var(--k-plane1,#FFF8EF);cursor:pointer;transition:background-color .2s ease}
.n140-pr:focus-visible{outline:none;background:var(--k-apricot,#FFD09A);color:var(--k-on-apricot,#24201F)}
.n140-pr .n140-t{flex:none;width:3.2em;font-size:.75rem;color:var(--k-muted,#6B605A);font-variant-numeric:tabular-nums;padding-top:3px}
.n140-pt{flex:1;min-width:0}
.n140-pt .en{font-size:.98rem;line-height:1.6;overflow-wrap:anywhere}
.n140-pt .jp{font-size:.86rem;line-height:1.6;color:var(--k-muted,#6B605A);margin-top:2px}
.n140-pr.on{background:var(--k-apricot,#FFD09A);color:var(--k-on-apricot,#24201F)}
.n140-pr.on .en{font-weight:700;color:var(--k-on-apricot,#24201F)}
.n140-pr.on .jp,.n140-pr.on .n140-t{color:var(--k-on-apricot,#24201F)}
@media (prefers-reduced-motion:reduce){.n140-par{scroll-behavior:auto}.n140-pr{transition:none}}

/* N3 選んで進む会話 */
.n140-chat{display:flex;flex-direction:column;gap:10px;margin:0 0 14px}
.n140-bub{max-width:88%;padding:12px 14px;border-radius:18px}
.n140-bub.them{align-self:flex-start;background:var(--k-plane1,#FFF8EF);border-bottom-left-radius:6px}
.n140-bub.you{align-self:flex-end;background:var(--k-apricot,#FFD09A);color:var(--k-on-apricot,#24201F);border-bottom-right-radius:6px}
.n140-bub.you .en,.n140-bub.you .jp,.n140-bub.you .n140-who,.n140-bub.you .n140-vscore{color:var(--k-on-apricot,#24201F)}
.n140-bub .en{font-weight:700;line-height:1.55;overflow-wrap:anywhere}
.n140-bub .n140-ja{font-size:.86rem;margin-top:4px}
.n140-who{font-size:.72rem;font-weight:800;opacity:.75;margin-bottom:2px}
.n140-bub .n140-play{margin-top:8px}
.n140-nojp .n140-ja{display:none}
.n140-note{margin-top:8px;font-size:.84rem}
.n140-vscore{margin-top:6px;font-size:.84rem}
.n140-vscore b{font-size:1.05rem}
.n140-choices .q-opt{display:flex;flex-direction:column;align-items:flex-start;gap:2px;text-align:left}
.n140-choices .q-opt .en{font-weight:700}
.n140-choices .q-opt .n140-ja{font-size:.82rem;opacity:.85}
.n140-choices.n140-nojp .n140-ja{display:none}
.n140-voice{margin-top:10px}
.n140-phrase .btn{margin-top:6px}

/* N3 英語で推理 */
.n140-clue .en b{color:var(--k-brick,#A63828)}

/* N4 みんなで点数くらべ */
.n140-chips{margin:6px 0 4px}
.n140-chips .chip{min-height:44px;min-width:64px}
.n140-names{display:grid;gap:6px;margin:4px 0 8px}
.n140-input{width:100%;min-height:48px;border-radius:var(--k-control,16px);border:0;background:var(--k-plane2,#F0DCC2);color:var(--k-ink,#24201F);font:inherit;padding:0 14px;box-sizing:border-box}
.n140-notes{margin:12px 0}
.n140-notes p{margin:4px 0}
.n140-turn h2{margin:8px 0}
.n140-turnno{font-size:.85rem;font-weight:800;color:var(--k-muted,#6B605A);margin:0}
.n140-big{font-size:1.25rem;font-weight:800;line-height:1.5;margin:6px 0;overflow-wrap:anywhere}
.n140-psent .btn.teal{margin-top:14px}
.n140-rec.on{background:var(--k-brick,#A63828);color:var(--k-on-brick,#fff)}
.n140-lite{padding:12px;border-radius:16px;background:var(--k-plane2,#F0DCC2)}
.n140-lite-s{font-size:.9rem}
.n140-lite-s b{font-size:2rem;font-weight:900;font-variant-numeric:tabular-nums}
.n140-lite-s b.ok{color:#2F6B4F}.n140-lite-s b.ng{color:var(--k-brick,#A63828)}
.n140-words{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}
.n140-w{display:inline-flex;padding:2px 10px;border-radius:99px;font-weight:700;font-size:.85rem}
.n140-w.ok{background:#DCEBE0;color:#2F6B4F}.n140-w.ng{background:#F7DFD8;color:#A63828}
.n140-rank{display:flex;align-items:center;gap:12px;padding:10px 12px;border-radius:16px;background:var(--k-plane2,#F0DCC2);margin:8px 0}
.n140-rank.top{background:var(--k-apricot,#FFD09A);color:var(--k-on-apricot,#24201F)}
.n140-rank .pos{flex:none;width:34px;height:34px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;font-weight:900;background:var(--k-plane1,#FFF8EF);color:var(--k-ink,#24201F)}
.n140-rank .nm{flex:1;font-weight:800;overflow-wrap:anywhere}
.n140-rank .sc{font-weight:900;font-size:1.2rem;font-variant-numeric:tabular-nums}
.n140-tblwrap{overflow-x:auto;margin-top:6px}
.n140-tbl{width:100%;border-collapse:separate;border-spacing:0 6px;font-size:.88rem}
.n140-tbl th,.n140-tbl td{padding:8px 8px;text-align:left;vertical-align:top}
.n140-tbl td{background:var(--k-plane2,#F0DCC2)}
.n140-tbl tr td:first-child{border-radius:12px 0 0 12px}
.n140-tbl tr td:last-child{border-radius:0 12px 12px 0}
.n140-tbl th{font-size:.78rem;color:var(--k-muted,#6B605A);white-space:nowrap}
.n140-tbl td.sc{text-align:right;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.n140-tbl td.en{min-width:12em;overflow-wrap:anywhere}
.n140-url{display:block;padding:10px;border-radius:12px;background:var(--k-plane2,#F0DCC2);font-size:.8rem;overflow-wrap:anywhere;margin:8px 0}

/* N6 シャドーイング */
.n140-shrow .en{font-weight:700}
.n140-avg{font-weight:800;margin-top:12px}
.n140-avg:empty{display:none}

@media (prefers-color-scheme:dark){
  .n140-w.ok{background:#1F2B24;color:#8FC4A5}.n140-w.ng{background:#2E211E;color:#FF9E86}
  .n140-lite-s b.ok{color:#8FC4A5}.n140-lite-s b.ng{color:#FF9E86}
  .n140-ipa-i.weak b,.n140-clue .en b{color:#FF9E86}
}

/* ---- 1.4.0 の色(DESIGN-2.0.md 4.1)。Apple の青は使わない。遊ぶ・みんなで = スカイ、教養講義(聞く)= 緑、主役のボタン = テラコッタ ---- */
:root{--n140-sky:#3E8EF7;--n140-sky-bg:#DDEBFE;--n140-sky-ink:#14427E;--n140-mint:#2FB36F;--n140-mint-bg:#DDF3E6;--n140-mint-ink:#145C37;
  --n140-them-bg:#F6E7D4;--n140-them-ink:#24201F;--n140-you-bg:#FFD09A;--n140-you-ink:#24201F;--n140-pos-bg:#14427E;--n140-pos-ink:#FFFFFF}
@media (prefers-color-scheme:dark){:root{--n140-sky:#7DB4FF;--n140-sky-bg:#17304F;--n140-sky-ink:#DDEBFE;--n140-mint:#5FD497;--n140-mint-bg:#173526;--n140-mint-ink:#DDF3E6;
  --n140-them-bg:#2E2623;--n140-them-ink:#F7EDE2;--n140-you-bg:#E6B075;--n140-you-ink:#1A1615;--n140-pos-bg:#7DB4FF;--n140-pos-ink:#1A1615}}
/* 一覧(#/play): 遊ぶ棚 = スカイの地と文字 */
[data-n140-hub] h3{display:flex;align-items:center;gap:8px}
[data-n140-hub] h3::before{content:"";flex:none;width:10px;height:10px;border-radius:50%;background:var(--n140-sky)}
[data-n140-hub] .row{background:var(--n140-sky-bg)!important}
[data-n140-hub] .row .row-title,[data-n140-hub] .row .row-sub,[data-n140-hub] .row .chev{color:var(--n140-sky-ink)!important}
/* 会話の吹き出し */
.n140-bub.them{background:var(--n140-them-bg);color:var(--n140-them-ink)}
.n140-bub.them .en,.n140-bub.them .jp{color:var(--n140-them-ink)}
.n140-bub.you{background:var(--n140-you-bg);color:var(--n140-you-ink)}
.n140-bub.you .en,.n140-bub.you .jp,.n140-bub.you .n140-who,.n140-bub.you .n140-vscore,.n140-bub.you .note{color:var(--n140-you-ink)}
/* 推理: 手がかりの番号とできごとの面 = スカイ */
.n140-clue .en b{color:var(--n140-sky-ink)}
.n140-mys{background:var(--n140-sky-bg)!important}
.n140-mys h3,.n140-mys .en,.n140-mys .jp{color:var(--n140-sky-ink)!important}
/* 点数くらべ: 1位の札 = スカイの地 */
.n140-rank.top{background:var(--n140-sky-bg);color:var(--n140-sky-ink)}
.n140-rank.top .pos{background:var(--n140-pos-bg);color:var(--n140-pos-ink)}
.n140-turnno{color:var(--n140-sky-ink)}
/* 教養講義の対訳: 読み上げ中の文 = 聞くの緑 */
.n140-pr.on{background:var(--n140-mint-bg);color:var(--n140-mint-ink)}
.n140-pr.on .en,.n140-pr.on .jp,.n140-pr.on .n140-t{color:var(--n140-mint-ink)}
@media (prefers-color-scheme:dark){.n140-clue .en b,.n140-ipa-i.weak b{color:var(--n140-sky)}}

.n140-consent{margin:12px 0;padding:10px 12px;border-radius:14px;background:var(--n140-sky-bg);color:var(--n140-sky-ink)}
.n140-consent p{margin:0 0 4px;color:var(--n140-sky-ink)}
.n140-consent .n140-check{color:var(--n140-sky-ink)}

/* 22:5x 補足の文字を置かない: レベルは右の札、済みは丸の印 */
[data-n140-hub] .row{display:flex;align-items:center;gap:10px}
.n140-lv{flex:none;padding:2px 10px;border-radius:99px;background:var(--n140-sky-ink);color:#FFFFFF;font-size:.78rem;font-weight:800;font-family:var(--k-latin,inherit)}
.n140-done{flex:none;width:24px;height:24px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;background:#145C37;color:#FFFFFF;font-size:.8rem;font-weight:900}
@media (prefers-color-scheme:dark){.n140-lv{background:var(--n140-sky);color:#1A1615}.n140-done{background:var(--n140-mint);color:#1A1615}}
.n140-intro-en{font-size:1.05rem;line-height:1.7}
.n140-vscore b{font-size:1.15rem;margin-right:1px}

/* 24:0x 前の版(515f0ccc)の見た目はそのまま(DESIGN-2.0 4.0a)。既存のカード・行・選択肢・札の影と丸は作り直さない。新しく足した部品だけ線を使わず塗りと余白で分ける */