/* テスト機能 */
.content.exam-content{max-width:1180px}
.exam-entries{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px;margin:12px 0 18px}
.exam-entry{display:flex;flex-direction:column;gap:4px;background:#fff;border:1px solid var(--border,#e8dfe2);border-radius:14px;padding:16px 18px}
.exam-entry-title{display:flex;align-items:center;gap:8px;margin:0;font-size:1.08rem}
.exam-entry-icon{width:22px;height:22px;flex:none;fill:none;stroke:#a45f72;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.exam-entry>span{color:var(--muted,#756b75);font-size:.84rem}
.exam-entry-stat{margin-top:8px;flex:1;background:#f7f4f5;border-radius:8px;padding:8px 10px;font-size:.86rem;color:#6a5d62;display:flex;align-items:center}.exam-entry-stat>div{width:100%}
.exam-entry-stat b{font-size:1rem;color:#3d3236}
.exam-entry-none{color:#a99ca1}
.exam-entry-buttons{margin-top:10px}.exam-entry-buttons button{align-self:flex-start}
/* 実施中: 枠と状況の帯だけローズ */
.exam-entry.live{border:2px solid #a45f72;padding:15px 17px}
.exam-entry.live .exam-entry-stat{background:#f6e9ed;color:#854658}.exam-entry.live .exam-entry-stat b{color:#854658}
.exam-entry-live{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 6px}.exam-entry-live+.exam-entry-live{margin-top:4px}
.exam-entry-livetext{flex:1;min-width:0}
.exam-entry-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#a45f72;margin-right:4px}
.exam-entry-end{margin-left:auto;padding:1px 8px;font-size:.74rem;color:#b0303f}
.exam-row{display:flex;align-items:center;gap:10px;padding:10px 0;border-bottom:1px solid var(--border,#e8dfe2)}
.exam-check{display:flex;align-items:center;gap:8px;margin:6px 0}
.exam-editor{display:flex;flex-wrap:wrap;gap:18px;align-items:flex-start}
.exam-toc{flex:1 1 180px;max-width:230px;position:sticky;top:var(--exam-sticky-top,90px);background:#fff;border:1px solid var(--border,#e8dfe2);border-radius:14px;padding:12px 14px;display:flex;flex-direction:column;gap:4px;font-size:.85rem;max-height:calc(100vh - var(--exam-sticky-top,90px) - 16px);overflow:hidden}
/* 見出し「目次」と合計は止めたまま、設問の一覧だけを中でスクロールする */
.exam-toc-head,.exam-toc-total{flex:none}
.exam-toc-list{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;display:flex;flex-direction:column;gap:4px}
@media(max-width:820px){.exam-toc{position:static;max-width:none;max-height:none}.exam-toc-list{max-height:40vh}}
.exam-toc a{text-decoration:none;color:inherit}
.exam-toc-page{font-weight:700;margin-top:6px}
.exam-toc-q{padding-left:12px}
.exam-toc-total{border-top:1px solid var(--border,#e8dfe2);margin-top:6px;padding-top:6px}
.exam-main{flex:999 1 560px;min-width:0;display:flex;flex-direction:column;gap:14px}
.exam-toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.exam-toolbar h1{margin:0;font-size:1.4rem;flex:1 1 auto}
.button-like{display:inline-flex;align-items:center;border:1px solid var(--border,#e8dfe2);border-radius:9px;background:#fff;padding:6px 12px;cursor:pointer;font-size:.85rem;min-height:36px}
.exam-settings{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:8px 14px}
/* 試験の設定は上下を詰める（項目が多いので3列・低めの入力欄） */
#exam-settings-card{padding:12px 18px 14px;margin:0}
#exam-settings-card h2{margin:0 0 8px;font-size:1.05rem}
.exam-settings .exam-field{gap:2px;font-size:.8rem}
#exam-settings-card .exam-settings input,#exam-settings-card .exam-settings select{min-height:34px;height:34px;padding:4px 9px;font-size:.9rem}
.exam-settings small{font-weight:400;line-height:1.4}
@media(max-width:650px){.exam-settings{grid-template-columns:1fr}}
.exam-field{display:flex;flex-direction:column;gap:4px;font-size:.85rem;font-weight:600}
.exam-field input,.exam-field select{font-weight:400}
.exam-page{background:#fff;border:1px solid var(--border,#e8dfe2);border-radius:14px;overflow:hidden}
.exam-page-head{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:10px 14px;background:linear-gradient(100deg,#f8ebef,#fbf4f6);border-bottom:1px solid var(--border,#e8dfe2)}
.exam-page-head input{flex:1 1 200px;font-weight:700}
.exam-page-no{font-size:.75rem;font-weight:700;color:#a45f72;background:#fff;border:1px solid #e3d2d8;border-radius:999px;padding:1px 10px}
.exam-page-body{padding:12px 14px;display:flex;flex-direction:column;gap:12px}
.exam-q{border:1px solid #efe6ea;border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:8px}
.exam-qhead{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.exam-qhead select{width:auto}
.exam-inline{display:flex;align-items:center;gap:4px;font-size:.85rem}
.exam-inline input{width:72px}
.exam-qtools{margin-left:auto;display:flex;gap:4px;flex-wrap:wrap}
.exam-tag{font-size:.75rem;border-radius:999px;padding:1px 10px}
.exam-tag.auto{color:#1a7a52;background:#e8f6ef}
.exam-tag.manual{color:#8a5a00;background:#fff4dc}
.exam-choices{display:flex;flex-direction:column;gap:6px}
.exam-choice{display:flex;align-items:center;gap:6px}
.exam-choice .exam-right{min-width:2.4em}   /* 正解の表示の有無でボタンの位置がずれないように */
.exam-choice input:not([type]),.exam-choice input[aria-label^="選択肢"]:not([type=radio]):not([type=checkbox]){flex:1}
.exam-choice.correct input[data-ex=choice]{border-color:#9fd8bd;background:#f2fbf6}
.exam-right{font-size:.75rem;color:#1a7a52;font-weight:700}
.exam-upload{font-size:.8rem;color:var(--muted,#756b75)}
.exam-image{display:flex;align-items:flex-end;gap:10px}
.exam-image img{max-width:280px;max-height:180px;border:1px solid var(--border,#e8dfe2);border-radius:8px}
.exam-add{display:flex;gap:6px;flex-wrap:wrap}
.exam-page-add{align-self:flex-start}
.small-note{font-size:.75rem}
#dialog:has(.exam-pv){width:min(1100px,96vw);max-width:96vw;max-height:94dvh;padding:16px 18px}
.exam-pv-banner{background:#fff4dc;border:1px solid #e3b36f;border-radius:10px;padding:8px 12px;font-size:.85rem;margin-bottom:10px}
.exam-pv-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:10px}
.exam-pv-timer{background:#f6e9ed;border:1px solid #d8b7c2;border-radius:10px;padding:4px 12px;color:#854658;font-weight:700}
.exam-pv-timer small{font-weight:400;margin-left:6px}
.exam-pv-layout{display:flex;flex-wrap:wrap;gap:14px;align-items:flex-start}
.exam-pv-layout{flex-wrap:nowrap}
/* 設問番号は縦に1列。多いときは中でスクロール */
.exam-pv-nav{flex:0 0 92px;display:flex;flex-direction:column;gap:6px;max-height:65vh;overflow-y:auto;overscroll-behavior:contain;padding-right:2px}
.exam-pv-nav .exam-pv-num{flex:none}
.exam-pv-main{flex:1 1 auto;min-width:0}
.exam-pv-num{min-height:44px;border:1px solid var(--border,#e8dfe2);border-radius:10px;background:#fff;font-weight:700}
.exam-pv-num.done{border-color:#9fd8bd;background:#f2fbf6;color:#1a7a52}
.exam-pv-num.here{border:2px solid #a45f72}
.exam-pv-main{flex:999 1 420px;min-width:0;display:flex;flex-direction:column;gap:12px}
.exam-pv-page{font-weight:700}
.exam-pv-q{background:#fff;border:1px solid var(--border,#e8dfe2);border-radius:12px;padding:12px 14px;display:flex;flex-direction:column;gap:6px}
.exam-pv-choice{display:flex;align-items:center;gap:8px;padding:4px 0}
.exam-pv-img{max-width:min(100%,420px);border:1px solid var(--border,#e8dfe2);border-radius:8px}
.exam-pv-count{text-align:right;font-size:.8rem}
.exam-pv-buttons{display:flex;gap:8px;align-items:center}

.exam-pv-nav .exam-pv-num{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:0;padding:6px 4px;line-height:1.3}
.exam-pv-nav .exam-pv-num small{font-weight:400;font-size:.75rem}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
/* 学生ビューの本文をスクロールしても、左の画面一覧は見えたままにする */
.exam-pv-nav{position:sticky;top:0;align-self:flex-start}
.exam-pv-buttons{display:flex;align-items:center;gap:8px}
.exam-pv-buttons .grow{flex:1}
/* 試験を作る画面: 保存などのボタンの帯は、スクロールしても上に止める */
.exam-toolbar{position:sticky;top:calc(var(--exam-sticky-top,90px) - 12px);z-index:6;background:var(--bg,#faf8f7);padding:8px 0;margin:-8px 0;border-bottom:1px solid transparent}
.exam-toolbar.stuck{border-bottom-color:var(--border,#e8dfe2);box-shadow:0 6px 10px -10px rgba(66,55,61,.35)}
/* 学生画面のボタン: 戻るは左端、次の画面は右端、提出は中央 */
.exam-pv-buttons{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:8px}
.exam-pv-left{justify-self:start}.exam-pv-center{justify-self:center}.exam-pv-right{justify-self:end}
/* 設問の欄: 上下を詰める（入力欄を低く、間隔を小さく） */
.exam-editor .exam-q{gap:6px;padding:10px 12px}
.exam-editor .exam-q input:not([type=radio]):not([type=checkbox]):not([type=file]),.exam-editor .exam-q select{min-height:32px;height:32px;padding:3px 9px;font-size:.9rem}
.exam-editor .exam-q textarea{padding:6px 10px;min-height:0;font-size:.95rem}
.exam-editor .exam-q input[type=file]{min-height:0;height:auto;padding:3px 6px;font-size:.8rem;border-style:dashed}
.exam-editor .exam-q .exam-field{gap:2px;font-size:.8rem}
.exam-editor .exam-choices{gap:4px}
.exam-editor .exam-choice button{min-height:30px;padding:2px 8px}
.exam-editor .exam-choices>[data-action=exam-choice-add]{min-height:30px;padding:3px 10px;align-self:flex-start}
.exam-editor .exam-inline{white-space:nowrap}.exam-editor .exam-inline input{width:5.5em}
/* 設問: 「問1」の横に問題文、その下に回答方法・配点などの行 */
.exam-qtop{display:flex;align-items:flex-start;gap:10px}
.exam-qno{flex:none;width:44px;padding-top:6px}
.exam-qtop textarea{flex:1;min-width:0}
.exam-q .exam-qhead,.exam-q .exam-qhead~*{margin-left:54px}
@media(max-width:650px){.exam-q .exam-qhead,.exam-q .exam-qhead~*{margin-left:0}}
/* ---------------- 段階2：試験を実施する（教員） */
.exam-run{display:flex;flex-direction:column;gap:14px}
.exam-run .exam-toolbar{margin:0}   /* 更新するボタンの帯は、スクロールしても上に止める（編集画面と同じ） */
.exam-run-pick{display:flex;flex-wrap:wrap;gap:10px 16px;padding:12px 18px}
.exam-run-pick .exam-field{flex:1 1 240px}
.exam-run-main{display:flex;flex-wrap:wrap;gap:16px 28px;align-items:center;border-color:#d8b7c2}
.exam-run-mode{flex:1 1 280px;display:flex;flex-direction:column;gap:6px}
.exam-run-mode p{margin:0}
.exam-switch{display:inline-flex;align-items:center;gap:8px;font-weight:700;border:1px solid var(--border,#e8dfe2);border-radius:999px;padding:4px 14px;background:#fff;color:#756b75}
.exam-switch::before{content:"";width:30px;height:18px;border-radius:9px;background:#d9d1d5;box-shadow:inset -12px 0 0 2px #fff}
.exam-switch.on{border-color:#a45f72;background:#f6e9ed;color:#854658}
.exam-switch.on::before{background:#a45f72;box-shadow:inset 12px 0 0 2px #a45f72,inset -1px 0 0 0 #fff}
.exam-run-clock{display:flex;flex-direction:column;align-items:center;min-width:180px}
.exam-run-remaining{font-size:2.4rem;font-weight:700;letter-spacing:.04em;font-variant-numeric:tabular-nums;line-height:1.1}
.exam-run-actions{display:flex;flex-direction:column;gap:8px;align-items:flex-start}
.exam-run-counts{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.exam-run-counts>span:not(.muted){background:#fff;border:1px solid var(--border,#e8dfe2);border-radius:10px;padding:6px 14px}
.exam-run-rows{display:flex;flex-direction:column}
.exam-run-row{display:grid;grid-template-columns:minmax(120px,180px) minmax(0,1fr) 150px 170px 120px;gap:10px;align-items:center;padding:7px 0;border-bottom:1px solid #f3edf0}
.exam-run-row>span:last-child{text-align:right}
@media(max-width:900px){.exam-run-row{grid-template-columns:1fr 1fr;row-gap:4px}.exam-run-row>span:last-child{text-align:left}}
.exam-progress{display:flex;align-items:center;gap:8px}
.exam-progress-track{flex:1;height:12px;background:#f2edef;border-radius:6px;overflow:hidden}
.exam-progress-track span{display:block;height:100%;background:#2a78d6}
.exam-progress-track span.full{background:#1baf7a}
.exam-progress strong{width:42px;text-align:right;font-variant-numeric:tabular-nums}
.exam-pill{display:inline-block;border-radius:999px;padding:1px 10px;font-size:.78rem;background:#f4f3f0;color:#52514e}
.exam-pill.working{background:#e8f0fb;color:#1f5aa8}
.exam-pill.done{background:#e8f6ef;color:#1a7a52}
.exam-presence{font-size:.8rem;color:#52514e}
.exam-away{color:#b04a10}
.exam-run-allreset{border-color:#f0c9d2}
.exam-run-allreset summary{cursor:pointer;font-weight:700;color:#8f3d50}
.exam-run-allreset .exam-field{max-width:420px;margin:6px 0}
/* ---------------- 段階2：試験を受ける（学生） */
.exam-take.exam-pv{max-width:1100px;margin:0 auto}
.exam-take-start{max-width:720px}
.exam-take-rules{margin:0 0 14px;padding-left:1.2em;line-height:1.9}
#take-save{font-size:.8rem;min-width:6em;text-align:right}
.exam-take .exam-pv-head{position:sticky;top:var(--exam-sticky-top,90px);z-index:5;background:var(--bg,#faf8f7);padding:8px 0}
.exam-take .exam-pv-nav{top:calc(var(--exam-sticky-top,90px) + 52px)}
.exam-pv-num.here:disabled{opacity:1;cursor:default}
/* 学生の進み具合: 1行を低くして、1画面に多くの学生を出す（名前は折り返さず、省略もしない幅を確保） */
.exam-run-rows{font-size:.85rem}
.exam-run-row{grid-template-columns:minmax(170px,max-content) minmax(140px,1fr) 150px 160px 110px;gap:8px;padding:2px 0;min-height:28px;line-height:1.3}
.exam-run-row>span:first-child{white-space:nowrap}
.exam-run-row:nth-child(even){background:#fcfafb}
.exam-progress-track{height:8px;border-radius:4px}
.exam-progress strong{font-size:.8rem;width:38px}
.exam-run-row .exam-pill{padding:0 8px;font-size:.72rem;line-height:1.6}
.exam-run-row .exam-presence{font-size:.75rem}
.exam-run-row button{min-height:24px;padding:1px 8px;font-size:.72rem;line-height:1.4}
@media(max-width:900px){.exam-run-row{grid-template-columns:minmax(150px,max-content) 1fr;padding:4px 0}}

.exam-run-limit{display:flex;flex-direction:column;gap:4px;min-width:200px}
.exam-run-limit input{max-width:140px}
.exam-run-limit-changed{color:#b04a10;font-weight:700}
.content.exam-content{margin:0 auto}   /* 内容が短いときに縦の中央へ寄らないように（.content の margin:auto を上書き） */

/* 画面の状況の横棒（実施中は直近5分で右端が今。終了後は終了時点の直近5分で止まる）。オレンジ=見ている、グレー=ほかのウィンドウ・タブ、斜線=連絡なし */
.exam-run-row{grid-template-columns:minmax(170px,max-content) minmax(110px,1fr) 140px minmax(160px,220px) 150px 110px}
.exam-activity{position:relative;display:block;height:14px;background:#faf8f9;border:1px solid #ece4e8;border-radius:3px;overflow:hidden}
.exam-activity i,.exam-activity-legend i{display:block;position:absolute;top:0;bottom:0}
.exam-activity .on,.exam-activity-legend .on{background:#f08a24}
.exam-activity .off,.exam-activity-legend .off{background:#b9b3b6}
.exam-activity .gone,.exam-activity-legend .gone{background:repeating-linear-gradient(135deg,#e7e1e4 0 3px,#faf8f9 3px 6px)}
.exam-activity::after{content:"";position:absolute;right:0;top:0;bottom:0;width:2px;background:#42373d;opacity:.55}
.exam-activity-legend{display:flex;flex-wrap:wrap;gap:4px 14px;align-items:center;margin:2px 0 6px}
.exam-activity-legend span{display:inline-flex;align-items:center;gap:5px}
.exam-activity-legend i{position:static;width:18px;height:10px;border-radius:2px}
@media(max-width:900px){.exam-run-row{grid-template-columns:minmax(150px,max-content) 1fr}.exam-activity{grid-column:1/-1}}

/* 教員のテスト画面（入口・作る・実施する）は、グループを左の列で切り替えないので、左の列を出さない */
.shell:has(> main.exam-teacher){grid-template-columns:minmax(0,1fr)}
.shell:has(> main.exam-teacher) > .sidebar{display:none}

/* テストの入口: 実施中の試験の帯 */
.exam-live{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;border-color:#a45f72;background:#fbf4f6;padding:12px 18px;margin-bottom:12px}
.exam-live strong{color:#854658}

/* ---------------- 段階3：採点・結果を見る（教員） */
.grade-actions{display:flex;flex-wrap:wrap;gap:8px 18px;align-items:center;padding:12px 18px}
.grade-buttons,.grade-send{gap:8px;align-items:center;flex-wrap:wrap}
.grade-send{flex:1 1 360px;justify-content:flex-end}
.grade-sent{color:#1a7a52;font-weight:700}
.grade-tabs{display:flex;flex-wrap:wrap;gap:6px}
.grade-tabs .selected{background:#f6e9ed;border-color:#a45f72;color:#854658;font-weight:700}
.grade-table-wrap{overflow-x:auto;background:#fff;border:1px solid var(--border,#e8dfe2);border-radius:14px}
.grade-table{border-collapse:collapse;width:100%;font-size:.85rem}
.grade-table th,.grade-table td{padding:4px 10px;border-bottom:1px solid #f3edf0;text-align:left;white-space:nowrap}
.grade-table th small{display:block;font-weight:400;color:#756b75}
.grade-table tbody tr:nth-child(even){background:#fcfafb}
.grade-table button.link{border:0;background:none;padding:0;min-height:0;color:#a45f72;text-decoration:underline;font:inherit;cursor:pointer}
.grade-cell{display:inline-block;min-width:2.6em}
.grade-cell.ok{color:#1a7a52}.grade-cell.ng{color:#b0303f}
.grade-cell.todo{background:#fff4dc;color:#8a5a00;border-radius:999px;padding:0 8px;font-size:.75rem}
.grade-cell small,.grade-todo-note{color:#8a5a00;font-size:.72rem}
.grade-question p{margin:6px 0}
.grade-model{background:#f4f9f6;border:1px solid #cfe7da;border-radius:10px;padding:8px 12px}
.grade-model p{margin:4px 0 0}
.grade-answers{display:flex;flex-direction:column;gap:8px}
.grade-answer{display:grid;grid-template-columns:minmax(150px,max-content) minmax(0,1fr) auto;gap:10px 14px;align-items:start;background:#fff;border:1px solid var(--border,#e8dfe2);border-radius:12px;padding:10px 14px}
.grade-answer.todo{border-color:#f0c98a;background:#fffaf0}
.grade-who{font-weight:700;white-space:nowrap}
.grade-text{white-space:normal;line-height:1.7}
.grade-input{display:flex;align-items:center;gap:6px;white-space:nowrap}
.grade-input input{width:5em;min-height:32px;height:32px;padding:3px 8px}
@media(max-width:800px){.grade-answer{grid-template-columns:1fr}}
.grade-detail section{border-top:1px solid #f0e8eb;padding:8px 0}
/* ---------------- 段階3：テストの結果（学生） */
.student-result{max-width:640px}
.student-result-total{font-size:1.1rem;margin:4px 0 10px}
.student-result-total strong{font-size:2rem;color:#854658}
.student-result-table{border-collapse:collapse;min-width:260px}
.student-result-table th,.student-result-table td{padding:4px 14px;border-bottom:1px solid #f0e8eb;text-align:left}

/* 採点・結果: 学生ごと／問題ごと */
.grade-seg{display:inline-flex;gap:0}.grade-seg .button{border-radius:0}.grade-seg .button:first-child{border-radius:8px 0 0 8px}.grade-seg .button:last-child{border-radius:0 8px 8px 0;margin-left:-1px}
.grade-tabs-sep{align-self:center;margin-left:10px;font-size:.78rem;color:#7a6a70}
.grade-timecell{white-space:nowrap;font-size:.82rem;color:#5a4d52}
.grade-q-help{margin:4px 0 8px;line-height:1.5}
.grade-qpage{padding:8px 14px;margin-bottom:10px}
.grade-qpage-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 14px;padding-bottom:6px;border-bottom:2px solid #f2e6ea}
.grade-time{font-size:.8rem;color:#5a4d52}.grade-time b{font-size:1rem;color:#2a5f9e;margin:0 4px}.grade-time small{color:#8a7a80}
.grade-qrow{display:grid;grid-template-columns:minmax(0,1fr) 96px;gap:12px;padding:8px 0;border-top:1px solid #f2edef}
.grade-qpage-head+.grade-qrow{border-top:0}
.grade-qtitle{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}.grade-qtitle small{font-size:.74rem}
.grade-qtitle .button{margin-left:auto;padding:2px 10px}
.grade-blank{color:#a0602a}
.grade-qbody{font-size:.86rem;margin:2px 0 4px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.grade-choices{display:grid;gap:2px}
.grade-choice{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(60px,1fr) 74px;gap:8px;align-items:center;font-size:.8rem;line-height:1.35}
.grade-choice-label{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.grade-right-mark{display:inline-block;font-size:.66rem;background:#1baf7a;color:#fff;border-radius:4px;padding:0 4px;margin-right:4px;vertical-align:1px}
.grade-choice.right .grade-choice-label{font-weight:700;color:#1a6a48}
.grade-choice-bar{height:8px;background:#f2edef;border-radius:4px;overflow:hidden}.grade-choice-bar span{display:block;height:100%;background:#b9a7ae}
.grade-choice.right .grade-choice-bar span{background:#1baf7a}
.grade-choice-num{text-align:right;font-variant-numeric:tabular-nums}.grade-choice-num small{color:#8a7a80;margin-left:4px}
.grade-qrate{display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:10px;background:#eef6f2;color:#1a6a48;padding:6px 4px;text-align:center;align-self:start}
.grade-qrate b{font-size:1.35rem;line-height:1.1}.grade-qrate small{font-size:.68rem;color:#5a6d64}
.grade-qrate.low{background:#fff1e3;color:#b0560e}.grade-qrate.low small{color:#8a5a2a}
@media (max-width:640px){.grade-choice{grid-template-columns:minmax(0,1fr) 70px;}.grade-choice-bar{grid-column:1/-1;order:3}.grade-qrow{grid-template-columns:minmax(0,1fr) 78px}}

.exam-page-tip{margin:-4px 2px 8px;font-size:.76rem;color:#7a6a70;line-height:1.4}
.exam-pv-num.static{cursor:default;user-select:none}
/* 問題ごと: ばらつき度・識別力（マウスを合わせると説明） */
.grade-metrics{margin-left:auto;display:inline-flex;gap:6px;flex-wrap:wrap}
.grade-metric{position:relative;display:inline-flex;align-items:baseline;gap:4px;font-size:.74rem;color:#5a4d52;background:#f6f2f4;border-radius:999px;padding:1px 9px;cursor:help;border-bottom:1px dotted transparent}
.grade-metric b{font-size:.86rem;color:#3d3236;font-variant-numeric:tabular-nums}.grade-metric small{font-size:.68rem;color:#8a7a80}
.grade-metric.good{background:#eaf6f0}.grade-metric.good small{color:#1a7a52}
.grade-metric.warn{background:#fff4e6}.grade-metric.warn small{color:#a0602a}
.grade-metric.bad{background:#fdeaea}.grade-metric.bad small{color:#b0303f}
.grade-metric[data-tip]:hover::after,.grade-metric[data-tip]:focus-visible::after{content:attr(data-tip);position:absolute;right:0;top:calc(100% + 6px);z-index:30;width:min(320px,80vw);white-space:pre-line;
 background:#3d3236;color:#fff;font-size:.74rem;font-weight:400;line-height:1.55;padding:8px 10px;border-radius:8px;box-shadow:0 4px 14px rgba(0,0,0,.18);text-align:left}
.grade-metric:focus-visible{outline:2px solid #a45f72;outline-offset:1px}
/* 採点・結果: 「この回を削除」は選択欄の高さに引き伸ばさず、小さいボタンのまま下にそろえる */
.exam-run-pick>.button,.exam-run-pick>button{align-self:flex-end;flex:none;min-height:0;height:auto;padding:4px 10px;font-size:.78rem;margin-bottom:4px}
.exam-run-pick>.small-note{align-self:flex-end;margin-bottom:8px}
.grade-late-note{display:block;color:#a0602a;font-size:.7rem;cursor:help}
.grade-late{margin-top:6px;border:1px dashed #d9b48a;background:#fffaf2;border-radius:8px;padding:6px 10px}
.grade-late-head{font-size:.74rem;font-weight:700;color:#a0602a;margin-bottom:2px}
.take-conflict{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:8px 0}
.take-conflict-box{border:1px solid #e3d5da;border-radius:8px;padding:8px 10px;max-height:180px;overflow:auto;font-size:.88rem;background:#fff}
@media (max-width:640px){.take-conflict{grid-template-columns:1fr}}
.take-choices{display:grid;gap:10px;margin:8px 0}.take-choice{display:grid;gap:4px}.take-choice button{justify-self:start}
/* 実施画面: 全体進捗 */
.exam-run-views{margin:6px 0}
.exam-ov{padding:12px 16px}
.exam-ov-head{align-items:center;gap:10px 16px;flex-wrap:wrap;margin-bottom:8px}
.exam-ov-big{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;padding:8px 0 4px}
.exam-ov-card{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.exam-ov-card strong{font-size:1.02rem}.exam-ov-card .muted{font-size:.78rem}
.exam-ov-ring{--p:0;width:148px;height:148px;border-radius:50%;background:conic-gradient(#a45f72 calc(var(--p)*1%),#f2edef 0);display:flex;align-items:center;justify-content:center;position:relative;margin-bottom:4px}
.exam-ov-ring::before{content:'';position:absolute;inset:14px;border-radius:50%;background:#fff}
.exam-ov-ring b{position:relative;font-size:2rem;color:#3d3236;font-variant-numeric:tabular-nums}
.exam-ov-mini{display:flex;flex-wrap:wrap;gap:6px 14px;flex:1}
.exam-ov-chip{display:inline-flex;align-items:center;gap:6px;font-size:.78rem;color:#5a4d52}.exam-ov-chip b{font-size:.92rem;color:#3d3236;min-width:2.6em;font-variant-numeric:tabular-nums}
.exam-ov-minibar{width:64px;height:6px;border-radius:3px;background:#f2edef;overflow:hidden}.exam-ov-minibar i{display:block;height:100%;background:#a45f72}
.exam-ov-page{border-top:1px solid #f2e6ea;padding:6px 0 2px}
.exam-ov-page-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;margin-bottom:2px}
.exam-ov-time,.exam-ov-here{font-size:.8rem;color:#5a4d52}.exam-ov-time b{font-size:1rem;color:#854658;margin:0 4px}.exam-ov-time small{color:#8a7a80}.exam-ov-here b{color:#3d3236}
.exam-ov-q{display:grid;grid-template-columns:110px minmax(0,1.2fr) minmax(80px,1fr) 96px;gap:10px;align-items:center;font-size:.84rem;padding:2px 0}
.exam-ov-qname{display:flex;gap:6px;align-items:baseline}.exam-ov-qname small{font-size:.7rem}
.exam-ov-qbody{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#5a4d52}
.exam-ov-q .exam-progress-track{flex:none;height:8px}
.exam-ov-qnum{text-align:right;font-variant-numeric:tabular-nums}.exam-ov-qnum small{color:#8a7a80;margin-left:4px}
@media (max-width:640px){.exam-ov-q{grid-template-columns:70px minmax(0,1fr) 84px}.exam-ov-qbody{display:none}}
.exam-ov-modes .selected{background:#f6e9ed;border-color:#a45f72;color:#854658;font-weight:700}
.grade-confirm{align-items:center;gap:8px 12px;flex-wrap:wrap;margin-top:6px}.grade-confirmed{color:#1a7a52;font-weight:700;font-size:.9rem}
/* 記述式の採点: 問題文と模範解答は、スクロールしても上に残す（長いときは枠の中でスクロール） */
.exam-grade .grade-question{position:sticky;top:calc(var(--exam-sticky-top,90px) + 46px);z-index:5;max-height:38vh;overflow:auto;box-shadow:0 6px 14px -8px rgba(60,40,50,.28)}
/* 学生: 送信できていない試験の回答が端末に残っているときの帯 */
.take-unsent{position:fixed;left:50%;transform:translateX(-50%);bottom:14px;z-index:40;display:flex;align-items:center;gap:10px;flex-wrap:wrap;max-width:min(680px,calc(100vw - 24px));
 background:#fff7e8;border:1px solid #e0b872;color:#6a4a10;border-radius:12px;padding:8px 14px;font-size:.88rem;box-shadow:0 6px 18px rgba(60,40,10,.18)}
.take-unsent b{margin:0 2px}.take-unsent-item{padding:8px 12px;margin:8px 0}
.grade-metric .grade-metric-max{color:#a99ca1}
/* 採点: 全体の得点のまとまり（平均・0点〜満点の線・受験と未採点） */
.grade-sum{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:8px 24px;align-items:center;padding-bottom:10px;margin-bottom:10px;border-bottom:1px solid #f2edef}
.grade-sum-main .l{font-size:.76rem;color:#7a6a70}.grade-sum-main b{font-size:1.9rem;line-height:1.1}.grade-sum-main small{font-size:.82rem;color:#8a7a80}
.grade-sum-temp{font-size:.72rem;color:#a0602a}
.grade-sum-range{display:flex;align-items:center;gap:8px;padding:18px 0}
.grade-sum-range .end{font-size:.7rem;color:#8a7a80;white-space:nowrap}
.grade-sum-track{position:relative;flex:1;height:8px;border-radius:4px;background:#f2edef}
.grade-sum-track .span{position:absolute;top:0;height:8px;border-radius:4px;background:#e6cdd5}
.grade-sum-track .dot{position:absolute;top:0;width:8px;height:8px;border-radius:50%;background:#a45f72}
.grade-sum-track .mk{position:absolute;top:-6px;width:3px;height:20px;margin-left:-1.5px;border-radius:2px;background:#3d3236}
.grade-sum-track .mk.med{background:#b9a7ae}
.grade-sum-track .lab{position:absolute;transform:translateX(-50%);white-space:nowrap;font-size:.7rem;color:#5a4d52}
.grade-sum-track .lab.top{bottom:14px}.grade-sum-track .lab.bottom{top:16px;font-weight:700;color:#3d3236}
.grade-sum-side{display:flex;flex-direction:column;gap:2px;font-size:.8rem;color:#5a4d52;border-left:1px solid #ebe3e6;padding-left:18px}
.grade-sum-side b{font-size:1rem;color:#3d3236;margin-left:2px}.grade-sum-side b.todo{color:#a0602a}
@media (max-width:760px){.grade-sum{grid-template-columns:1fr}.grade-sum-side{flex-direction:row;gap:16px;border-left:0;padding-left:0}}
.grade-actions>.grade-sum{flex:1 1 100%;min-width:0}
.grade-actions>.grade-confirm{flex:1 1 100%;margin-top:0}
/* 全体進捗: 指標が4つのとき・設問ごとの正答率 */
.exam-ov-big{grid-template-columns:repeat(auto-fit,minmax(170px,1fr))}
.exam-ov-q.with-rate{grid-template-columns:100px minmax(0,1.1fr) minmax(70px,1fr) 88px minmax(170px,1.15fr)}
.exam-ov-rate{display:grid;grid-template-columns:minmax(60px,1fr) 88px;gap:10px;align-items:center}
.exam-ov-rate.none{display:block;font-size:.74rem}
.exam-ov-rate .exam-progress-track span.ok{background:#1baf7a}
.exam-ov-qhead{font-size:.7rem;color:#8a7a80;padding-bottom:0}.exam-ov-qhead .exam-ov-rate{display:block}
@media (max-width:760px){.exam-ov-q.with-rate{grid-template-columns:70px minmax(0,1fr) 84px}.exam-ov-q.with-rate .exam-ov-rate{grid-column:2/-1}.exam-ov-qhead{display:none}}
/* 全体の指標: 画面が狭くても横1列に並べ、ゲージのほうを小さくする */
.exam-ov-big{grid-template-columns:repeat(var(--n,4),minmax(0,1fr));gap:clamp(6px,2vw,14px)}
.exam-ov-card{container-type:inline-size;min-width:0}
.exam-ov-ring{width:min(148px,100cqw);height:auto;aspect-ratio:1}
.exam-ov-ring::before{inset:calc(min(148px,100cqw) * .095)}
.exam-ov-ring b{font-size:clamp(.8rem,calc(min(148px,100cqw) * .215),2rem)}
.exam-ov-card strong{font-size:clamp(.68rem,10cqw,1.02rem);line-height:1.3}
.exam-ov-card .muted{font-size:clamp(.6rem,7cqw,.78rem);line-height:1.35}
/* 学生ビュー: モバイル表示（スマートフォンの幅の枠の中に出す） */
.exam-pv-bar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin-bottom:10px}.exam-pv-bar .exam-pv-banner{flex:1 1 320px;margin-bottom:0}
.exam-pv-modes .selected{background:#f6e9ed;border-color:#a45f72;color:#854658;font-weight:700}
.exam-pv-stage.mobile{display:flex;justify-content:center;background:#f2edef;border-radius:14px;padding:14px 8px}
.exam-pv-phone{width:390px;max-width:100%;height:min(720px,70dvh);overflow-y:auto;overscroll-behavior:contain;background:var(--bg,#faf8f7);border:8px solid #3d3236;border-radius:30px;padding:14px 12px;box-shadow:0 8px 24px rgba(60,40,50,.22)}
.exam-pv-phone .exam-pv-layout{gap:8px}
.exam-pv-phone .exam-pv-nav{flex:0 0 64px;max-height:none;position:static}
.exam-pv-phone .exam-pv-nav .exam-pv-num{font-size:.8rem;min-height:40px;padding:4px 2px}
.exam-pv-phone .exam-pv-main{flex:1 1 0}
.exam-pv-phone .exam-pv-buttons button{padding-left:10px;padding-right:10px;font-size:.84rem}
/* スマートフォンの幅: 「前の画面」「提出する」「次の画面」を小さくして、改行させない（学生ビューのモバイル表示と、実際の学生の画面の両方） */
.exam-pv-buttons button{white-space:nowrap}
.exam-pv-phone .exam-pv-buttons{gap:4px}
.exam-pv-phone .exam-pv-buttons button{padding:6px 8px;font-size:.78rem;min-height:36px}
@media (max-width:480px){.exam-take .exam-pv-buttons{gap:4px}.exam-take .exam-pv-buttons button{padding:6px 8px;font-size:.78rem;min-height:36px}}
.exam-pv-how{font-size:.82rem;font-weight:700;color:#854658;margin-top:2px}
.exam-run-pastnote{margin:8px 0}
.exam-toolbar .selected{background:#f6e9ed;border-color:#a45f72;color:#854658;font-weight:700}
/* 実施画面: デモモード */
.exam-run-demolink{background:none;border:0;padding:0;min-height:0;color:#854658;text-decoration:underline;font-size:.82rem;cursor:pointer}
.exam-run-demonote{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;border-color:#d9a9b6;background:#fbf4f6}
.exam-demo-list{margin:6px 0 8px 1.2em;padding:0;display:grid;gap:4px;font-size:.9rem}
.exam-run-fresh{margin:4px 0 0;line-height:1.5}
/* 「試験を選ぶ」を押したとき: 下の一覧をしばらく強調する */
@keyframes exam-flash{0%,70%{box-shadow:0 0 0 3px #a45f72,0 0 0 9px #f6e9ed;background:#fdf8f9}100%{box-shadow:0 0 0 0 transparent;background:#fff}}
.exam-flash{animation:exam-flash 2.6s ease-out}
@media (prefers-reduced-motion:reduce){.exam-flash{animation:none;outline:3px solid #a45f72;outline-offset:2px}}

/* 学生進捗共有 */
.exam-run-pick .exam-share-field{flex:0 0 176px}
.exam-run-pick>.exam-share-note{flex:1 1 100%;align-self:auto;margin:0}
.projection-exam{position:fixed;inset:0;z-index:60;background:#faf8f7;display:flex;flex-direction:column;padding:3vh 4vw;overflow:hidden}
.projection-exam[hidden]{display:none}
.projection-exam-course{font-size:clamp(.8rem,1.6vw,1.3rem);color:#756b75;font-weight:600}
.projection-exam-body{flex:1;min-height:0;display:flex;flex-direction:column;justify-content:center;gap:5vh;text-align:center}
.projection-exam h1{font-size:clamp(1.4rem,3.6vw,3.2rem);margin:0;color:#3d3236}
.projection-exam-sub{font-size:clamp(.9rem,1.8vw,1.5rem);color:#756b75;margin:.4em 0 0}
.projection-exam-wait{font-size:clamp(1.4rem,3.6vw,3rem);color:#756b75;margin:0}
.projection-exam .exam-ov-big{grid-template-columns:repeat(2,minmax(0,1fr));gap:3vw;padding:0;width:min(100%,64vw);margin:0 auto}
.projection-exam .exam-ov-card{gap:1vh}
.projection-exam .exam-ov-ring{--d:min(21vw,34vh);width:var(--d);height:var(--d);aspect-ratio:auto;margin-bottom:1.5vh}
.projection-exam .exam-ov-ring::before{inset:calc(var(--d)*.095);background:#faf8f7}
.projection-exam .exam-ov-ring b{font-size:calc(var(--d)*.215)}
.projection-exam .exam-ov-card strong{font-size:clamp(1rem,2.3vw,2.1rem)}
.projection-exam .exam-ov-card .muted{font-size:clamp(.72rem,1.4vw,1.25rem)}
.projection-exam-time{margin:1.5vh 0 0;display:flex;align-items:baseline;justify-content:center;gap:1.2vw;color:#3d3236}
.projection-exam-time span{font-size:clamp(.9rem,2vw,1.7rem);color:#756b75}
.projection-exam-time b{font-size:clamp(2.2rem,7vw,6rem);font-variant-numeric:tabular-nums;line-height:1}
.projection-exam-time b.soon{color:#8f3d50}
.projection-exam-body.time-only .projection-exam-time{flex-direction:column;align-items:center;gap:2vh;margin-top:6vh}
.projection-exam-body.time-only .projection-exam-time b{font-size:min(24vw,40vh)}
.projection-exam-body.with-gauges{gap:3.5vh}

/* 説明のボタン（i）: マウスを合わせる・フォーカスすると説明が出る */
.exam-share-label{display:flex;align-items:center;gap:6px}
.exam-info{position:relative;display:inline-flex;align-items:center;justify-content:center;width:17px;height:17px;border-radius:50%;border:1.5px solid #a45f72;color:#a45f72;font:italic 700 .72rem/1 Georgia,serif;cursor:help;flex:none}
.exam-info:hover,.exam-info:focus-visible{background:#a45f72;color:#fff;outline:none}
.exam-info[data-tip]:hover::after,.exam-info[data-tip]:focus-visible::after{content:attr(data-tip);position:absolute;right:-8px;top:calc(100% + 8px);z-index:40;width:min(360px,82vw);white-space:pre-line;text-align:left;font:400 .78rem/1.6 -apple-system,BlinkMacSystemFont,"Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;color:#fff;background:#3d3236;border-radius:8px;padding:9px 11px;box-shadow:0 4px 14px rgba(0,0,0,.18);cursor:default}

/* 正解なし（採点しない設問） */
.exam-choice-none{border-style:dashed}
.exam-choice-none label{flex:1;font-weight:600;font-size:.85rem;cursor:pointer}
.exam-choice-none label small{font-weight:400;margin-left:.4em}

/* 問題文の欄: 上下に大きさを変えられる（初めの高さは今までどおり2行） */
.exam-editor .exam-q .exam-qtop textarea{resize:vertical;overflow:auto;max-height:80vh}

/* 本人確認を新しいタブで行っている間の帯（元の画面）と、戻ってきたタブの表示 */
.stepup-wait{position:fixed;left:50%;bottom:18px;transform:translateX(-50%);z-index:2147483000;display:flex;align-items:center;gap:14px;max-width:min(92vw,720px);background:#3d3236;color:#fff;border-radius:12px;padding:10px 14px;font-size:.86rem;line-height:1.5;box-shadow:0 8px 28px rgba(0,0,0,.28)}
.stepup-wait button{flex:none;background:#fff;color:#3d3236;border:0;border-radius:8px;padding:5px 12px;cursor:pointer}
.stepup-done{position:fixed;inset:0;z-index:2147483000;background:#faf8f7;display:flex;align-items:center;justify-content:center;padding:24px;text-align:center}
.stepup-done h1{font-size:1.4rem;margin:0 0 .6em;color:#3d3236}.stepup-done p{margin:.3em 0;color:#5d5156}
