/* ============================================================
   learner-setup.css — L3 練習の設定（SPEC §5.3）専用スタイル
   出典: internal/orchestrate/2026-08-06_dojo_saas_mega/ref/learner_mock_lite.html L109-135

   命名メモ（PMO承認 2026-08-07）: モックの `.face` と `.fold` は
   L4ロープレ実機（上部バーのお客様サムネ）・L6レポート（書き起こしの折り
   たたみ）でも再利用されるクラス名のため、並行実装との衝突を避けて
   この画面専用の `.guest-face` / `.setup-fold` という名前にした
   （見た目・挙動はモックと同一）。
   ============================================================ */

.setup-head{display:flex;align-items:center;gap:12px;margin-bottom:16px}
.setup-head h1{font-size:19px;letter-spacing:.04em}

.setup{display:grid;grid-template-columns:1fr 330px;gap:18px;align-items:start}
@media(max-width:900px){.setup{grid-template-columns:1fr}}

.pick{border:1px solid var(--nvl-border);border-radius:var(--r);background:#fff;padding:14px 16px;margin-bottom:9px;cursor:pointer;transition:.15s}
.pick:hover{border-color:var(--nvl-blue)}
.pick.on{border-color:var(--nvl-blue);background:var(--nvl-tint-blue)}
.pick.locked{cursor:default}
.pick.locked:hover{border-color:var(--nvl-border)}
.pick-title{font-size:14.5px;font-weight:700;color:var(--nvl-ink);display:flex;align-items:center;gap:8px}
.pick-desc{font-size:12.5px;color:var(--nvl-muted);line-height:1.7;margin-top:4px}

.guests{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}
@media(max-width:640px){.guests{grid-template-columns:1fr 1fr}}
.guest{border:1px solid var(--nvl-border);border-radius:var(--r);background:#fff;padding:12px 10px;cursor:pointer;text-align:center;transition:.15s;min-height:44px}
.guest:hover{border-color:var(--nvl-blue)}
.guest.on{border-color:var(--nvl-blue);background:var(--nvl-tint-blue)}
.guest-face{display:block;width:64px;height:64px;flex:none;border-radius:var(--pill);overflow:hidden;margin:0 auto 8px;background:var(--nvl-bg-light)}
.guest-face img{width:100%;height:100%;object-fit:cover;object-position:center 18%;display:block}
.guest-name{font-size:13px;font-weight:500;color:var(--nvl-ink);display:block;line-height:1.5}
.guest-note{font-size:11px;color:var(--nvl-muted);line-height:1.55;display:block;margin-top:2px}
.guest-hard{font-size:10.5px;color:var(--nvl-blue);letter-spacing:.08em;margin-top:5px;display:block}

.diff{display:flex;gap:8px}
.diff button{flex:1;border:1px solid var(--nvl-border);background:#fff;border-radius:var(--r);padding:10px;font-size:13.5px;cursor:pointer;min-height:44px}
.diff button.on{border-color:var(--nvl-blue);background:var(--nvl-tint-blue-strong);color:var(--nvl-blue);font-weight:700}

.setup-fold{border:1px solid var(--nvl-border);border-radius:var(--r);background:#fff;margin-bottom:9px}
.setup-fold summary{padding:11px 14px;font-size:13px;font-weight:500;cursor:pointer;color:var(--nvl-text);list-style:none}
.setup-fold summary::-webkit-details-marker{display:none}
.setup-fold summary::before{content:"＋ ";color:var(--nvl-blue)}
.setup-fold[open] summary::before{content:"− "}
.setup-fold-body{padding:0 14px 13px;font-size:12.5px;line-height:1.9;color:var(--nvl-text)}

.setup-unlock{background:none;border:0;padding:0;margin-left:10px;color:var(--nvl-blue);font-size:12.5px;text-decoration:underline;cursor:pointer;min-height:auto}

.setup-empty-note{font-size:12.5px;color:var(--nvl-muted);line-height:1.7;padding:6px 0}
