:root{
  --fg:#22202A;--muted:#6A6472;--line:#E3DDE6;--bg:#F7F4F6;--card:#FFFFFF;
  --accent:#7D4A72;--accent-soft:#F3EAF1;
  --good:#2F7A55;--good-soft:#E6F2EB;--ng:#B23A3A;--ng-soft:#F8E4E3;--warn:#93650F;--warn-soft:#F7EDD8;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--fg);font-family:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Yu Gothic",sans-serif;font-size:16px;line-height:1.7}
p{margin:0 0 8px}
button{font:inherit;cursor:pointer}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

.bar{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;padding:10px 16px;background:var(--accent);color:#fff;font-size:14px}
.brand{font-weight:700;letter-spacing:.04em}
main{max-width:560px;margin:0 auto;padding:16px 16px 48px;display:grid;gap:12px}
.card{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:16px}
h1{font-size:20px;margin:0 0 12px;line-height:1.4}
h2{font-size:17px;margin:0 0 10px}
.eyebrow{margin:0;font-size:12px;color:var(--accent);font-weight:700}
.muted{color:var(--muted)}
.small{font-size:13px}
.facts{display:grid;grid-template-columns:6.5em 1fr;gap:4px 8px;margin:0 0 12px}
.facts dt{color:var(--muted);font-size:14px}
.facts dd{margin:0}

.primary{display:block;width:100%;margin-top:12px;padding:13px 16px;border:0;border-radius:10px;background:var(--accent);color:#fff;font-weight:700}
.primary:disabled{opacity:.4;cursor:default}
.ghost{display:block;width:100%;margin-top:8px;padding:12px 16px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--fg)}
.actions{display:grid}

/* 場面 */
.scene-head{display:flex;gap:8px;align-items:baseline;font-weight:700;margin-bottom:10px}
.scene-head .no{color:var(--accent);font-size:20px}
.star{color:var(--warn)}
.bubble{background:var(--accent-soft);border-radius:12px;padding:10px 12px;margin:8px 0}
.bubble .who{font-size:12px;color:var(--accent);font-weight:700}
.bubble .act{font-size:14px;color:var(--muted)}
.sheet{width:100%;border-collapse:collapse;font-size:14px;margin:6px 0 10px}
.sheet th{width:2em;vertical-align:top;text-align:left;color:var(--accent);padding:6px 4px;border-top:1px solid var(--line)}
.sheet td{padding:6px 4px;border-top:1px solid var(--line)}
.sheet .q{font-size:12px;color:var(--muted)}
.lead{font-weight:700;margin:0}
.ask{font-weight:700;margin:12px 0 6px}
.own{display:grid;gap:6px;margin-top:12px;font-size:14px;color:var(--muted)}
textarea{width:100%;font:inherit;font-size:16px;padding:10px;border:1px solid var(--line);border-radius:10px;resize:vertical;color:var(--fg);background:#fff}
textarea[readonly]{background:var(--bg)}
.choices{display:grid;gap:8px}
.choice{display:grid;grid-template-columns:1.6em 1fr;gap:4px 6px;text-align:left;padding:12px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--fg);line-height:1.6}
.choice b{color:var(--accent)}
.choice[aria-pressed="true"]{border-color:var(--accent);background:var(--accent-soft)}
.choice:disabled{cursor:default}
.choice:disabled:not([aria-pressed="true"]){opacity:.5}
.grade{grid-column:2;font-size:12px;color:var(--warn)}
.ura{background:var(--warn-soft);color:var(--warn);border-radius:8px;padding:8px 10px;font-size:13px;margin:8px 0}

/* 自己採点 */
.rate{border:0;padding:0;margin:0 0 14px;display:grid;grid-template-columns:repeat(5,1fr);gap:6px}
.rate legend{font-weight:700;margin-bottom:6px;padding:0}
.rate input{position:absolute;opacity:0;pointer-events:none}
.rate label{display:block;text-align:center;padding:10px 0;border:1px solid var(--line);border-radius:10px;background:#fff;cursor:pointer}
.rate input:checked + label{background:var(--accent);color:#fff;border-color:var(--accent)}
.rate input:focus-visible + label{outline:2px solid var(--accent);outline-offset:2px}

/* 結果 */
.verdict{text-align:center}
.badge{display:inline-block;padding:4px 14px;border-radius:99px;font-weight:700}
.badge.good{background:var(--good-soft);color:var(--good)}
.badge.warn{background:var(--warn-soft);color:var(--warn)}
.badge.ng{background:var(--ng-soft);color:var(--ng)}
.score{font-size:15px;margin:6px 0}
.score b{font-size:44px;line-height:1.1;margin-right:2px;font-variant-numeric:tabular-nums}
.axis{margin-bottom:12px}
.axis-head{display:flex;justify-content:space-between;font-size:14px}
.meter{height:10px;background:var(--bg);border-radius:99px;overflow:hidden;margin:2px 0}
.meter i{display:block;height:100%;background:var(--accent)}
.honne{margin:0 0 10px}
.honne.ok{color:var(--good)}
.honne.miss b{color:var(--ng)}
.ng-card,.fb,.own-row{border-top:1px solid var(--line);padding-top:10px;margin-top:10px}
h2 + .ng-card,h2 + .fb,h2 + .own-row,p + .ng-card{border-top:0;padding-top:0;margin-top:0}
.quote{background:var(--bg);border-radius:8px;padding:8px 10px;margin:0 0 6px}
.tag{display:inline-block;font-size:12px;padding:0 8px;border-radius:99px;background:var(--bg);margin-right:6px}
.tag.ng{background:var(--ng-soft);color:var(--ng);font-weight:700}
.ref{font-size:13px;color:var(--muted);margin:4px 0 0}
.better{font-size:14px;color:var(--good)}
.scene-ref{font-size:13px;font-weight:700;color:var(--accent);margin:0 0 4px}
.k{display:inline-block;font-size:12px;color:var(--muted);margin-right:6px}
.hit{font-size:14px;color:var(--warn);margin:4px 0 0}
.trend{font-variant-numeric:tabular-nums}
.confirm{display:flex;gap:8px;align-items:center;margin-top:8px;font-weight:700}
.confirm input{width:20px;height:20px}

/* 会話のつながり（2026-10-30） */
.thread{display:grid;gap:2px}
.bubble .line + .line{margin-top:4px}
.bubble.staff{background:var(--card);border:1px solid var(--accent);margin-left:12%}
.bubble.past{opacity:.72}
.hair{border:1px solid var(--line);border-radius:10px;padding:10px 12px;margin:0 0 12px}
.hair .facts{margin:6px 0 0;font-size:14px}
.hair-images{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:6px;margin-top:6px}
.hair-images img{width:100%;height:auto;border-radius:8px;display:block}
.choice.persona strong{font-weight:700}