:root{
  --bg:#f5f7fa; --card:#fff; --ink:#1d2733; --muted:#6c7785;
  --line:#dfe5ec; --accent:#235789; --accent-soft:#eaf2f8;
}
*{box-sizing:border-box}
body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--ink);line-height:1.55}
.topbar{background:#fff;border-bottom:1px solid var(--line);padding:14px 24px;display:flex;justify-content:space-between;gap:20px;align-items:center;position:sticky;top:0}
.brand{font-weight:800;font-size:1.25rem;text-decoration:none;color:var(--ink)}
.subtitle{color:var(--muted);font-size:.9rem;margin-left:8px}
nav{display:flex;gap:14px;flex-wrap:wrap}
nav a{color:var(--accent);text-decoration:none}
.container{max-width:1000px;margin:28px auto;padding:0 18px}
.card,.subcard{background:var(--card);border:1px solid var(--line);border-radius:12px;padding:20px}
.subcard{background:#fafbfd}
.narrow{max-width:520px;margin:40px auto}
.stack{display:grid;gap:16px}
.grid.two{display:grid;grid-template-columns:1fr 1fr;gap:14px}
label{display:grid;gap:6px;font-weight:600}
input,select,textarea{width:100%;border:1px solid #bcc7d3;border-radius:8px;padding:10px 12px;font:inherit;background:#fff}
textarea{resize:vertical}
button,.button{display:inline-block;border:none;border-radius:8px;background:var(--accent);color:#fff;padding:10px 16px;text-decoration:none;cursor:pointer;font:inherit}
.secondary{background:#e8edf2;color:#27323d}
.actions{display:flex;justify-content:flex-end;gap:10px;flex-wrap:wrap}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:14px}
.steps span{background:#e9edf2;padding:10px;border-radius:8px;text-align:center;font-size:.9rem}
.steps .active{background:var(--accent);color:#fff;font-weight:700}
.flash{padding:10px 14px;border-radius:8px;margin-bottom:12px}
.flash.success{background:#e9f6ed}.flash.error{background:#fdecec}
.page-head{display:flex;justify-content:space-between;gap:16px;align-items:center}
.stats{display:flex;gap:14px;margin:18px 0}
.stat{background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px;min-width:140px;display:grid}
.stat strong{font-size:1.6rem}.stat span,.muted{color:var(--muted)}
.item-list{padding-left:20px}.pill{background:var(--accent-soft);padding:3px 8px;border-radius:999px;font-size:.8rem}
.pill.input-speech{background:#f0e9f8;color:#654386}.pill.input-text{background:#edf1f5;color:#4e5a66}
.data-table{width:100%;border-collapse:collapse}.data-table th,.data-table td{padding:10px;border-bottom:1px solid var(--line);text-align:left}
.table-scroll{overflow-x:auto}.teacher-classes{margin-bottom:16px}.teacher-students .data-table{min-width:760px}
.teacher-confirmed-transcript,.teacher-read-only{margin-top:16px}
.text-block{white-space:pre-wrap;background:#fafbfd;border:1px solid var(--line);padding:14px;border-radius:8px}
.speaking-record{margin-top:16px}.speaking-record h2,.speaking-record h3{margin-bottom:6px}.speaking-record h3{margin-top:16px;font-size:1rem}
@media(max-width:700px){
  .topbar{align-items:flex-start;flex-direction:column}
  .grid.two{grid-template-columns:1fr}
  .steps{grid-template-columns:1fr 1fr}
  .page-head{align-items:flex-start;flex-direction:column}
}

.prompt-text{margin-top:10px;line-height:1.7}.prompt-box strong{display:block;margin-bottom:8px}

.compare-grid,.feedback-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:16px 0}
.inline-form{display:inline}
@media(max-width:700px){
  .compare-grid,.feedback-grid{grid-template-columns:1fr}
}

.diff-block{line-height:1.9}
.diff-del{
  background:#fde8e8;
  color:#9f1d1d;
  text-decoration:line-through;
  padding:1px 3px;
  border-radius:3px;
}
.diff-add{
  background:#e7f5e9;
  color:#1f6b2a;
  padding:1px 3px;
  border-radius:3px;
}
.diff-legend{display:flex;gap:10px;flex-wrap:wrap;font-size:.9rem}
.legend-del,.legend-add{padding:3px 8px;border-radius:999px}
.legend-del{background:#fde8e8;color:#9f1d1d;text-decoration:line-through}
.legend-add{background:#e7f5e9;color:#1f6b2a}
.decision-row{
  border:1px solid var(--line);
  border-radius:10px;
  padding:14px;
  background:#fff;
  display:grid;
  gap:12px;
}


/* REFLECT v0.1.5 */
.input-mode-row{display:flex;gap:10px;flex-wrap:wrap}
.input-mode-option{display:flex;align-items:center;gap:8px;border:1px solid var(--line);border-radius:9px;padding:9px 12px;background:#fff}
.input-mode-option input{width:auto}
.input-mode-option span{display:grid}
.input-mode-option small{color:var(--muted);font-weight:400}
.disabled-option{opacity:.55}
.draft-metrics{display:flex;gap:18px;flex-wrap:wrap;color:var(--muted);font-size:.9rem}
.soft-nudge{background:#fff8df;border:1px solid #eadca4;padding:10px 12px;border-radius:8px;font-size:.9rem}
.hidden{display:none!important}

.section-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.focus-section{margin-top:16px}
.focus-row{padding:12px 0;border-top:1px solid var(--line)}
.focus-row:first-of-type{border-top:0}
.focus-main{display:grid;gap:6px}
.compact-change{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.arrow{color:var(--muted)}
.focus-context{font-size:.9rem;color:var(--muted)}
.focus-details summary,.other-section summary,.expressions-section summary{cursor:pointer}
.focus-details p{margin:7px 0 0}
.type-badge{display:inline-block;width:max-content;padding:2px 7px;border-radius:999px;font-size:.76rem;text-transform:capitalize;background:#edf1f5;color:#42505e}
.type-badge.correction{background:#fbe9e7;color:#8b332b}
.type-badge.improvement{background:#e7f2fb;color:#285e83}
.type-badge.question{background:#f4ecfb;color:#6e4688}

.compact-choices{display:flex;gap:6px;flex-wrap:wrap;margin-top:9px}
.compact-choices .choice-btn{width:auto;min-width:82px;display:grid;gap:0;padding:7px 9px}
.choice-btn span{font-size:.74rem}
.choice-btn.selected{background:var(--accent);color:#fff;border-color:var(--accent)}
.small-link{background:transparent;color:var(--accent);border:1px solid var(--line);padding:6px 9px;border-radius:7px;font-size:.86rem;margin-top:8px}
.small-link.saved{color:#46624c;background:#edf7ef}
.small-link:disabled{opacity:.65;cursor:default}
.other-section,.expressions-section{margin-top:12px}
.other-list{display:grid;gap:0;margin-top:10px}
.other-row{display:flex;gap:10px;justify-content:space-between;align-items:flex-start;padding:10px 0;border-top:1px solid var(--line)}
.other-row:first-child{border-top:0}

.marker-strip{background:#fbfcfd;border:1px solid var(--line);border-radius:10px;padding:14px;margin-bottom:16px;display:grid;gap:8px}
.edit-marker{display:flex;gap:9px;align-items:flex-start;padding:8px 10px;border-radius:8px;background:#fff}
.marker-label{font-weight:700;white-space:nowrap}
.edit-marker.change .marker-label{color:#285e83}
.edit-marker.add .marker-label{color:#3e6c47}
.edit-marker.not_sure .marker-label{color:#80601d}

.final-check-panel{margin-top:18px}
.check-item{border-top:1px solid var(--line);padding:12px 0}
.check-item:first-of-type{border-top:0}
.check-top{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.more-help-box{background:#f4f7fa;border-left:3px solid var(--accent);padding:10px 12px;border-radius:6px}

.knowledge-review-list{display:grid;gap:10px}
.knowledge-review-row{display:grid;grid-template-columns:1.5fr 1fr;gap:14px;align-items:start;border-top:1px solid var(--line);padding-top:10px}
.knowledge-review-row:first-child{border-top:0;padding-top:0}
.compact-label{font-size:.9rem}

@media(max-width:700px){
  .compact-choices{display:grid;grid-template-columns:1fr 1fr}
  .compact-choices .choice-btn{width:100%;min-width:0}
  .other-row{display:grid}
  .knowledge-review-row{grid-template-columns:1fr}
  .edit-marker{display:grid}
}

/* v0.1.6 */
.scaffold-en{font-size:1.05rem;line-height:1.65}.inline-focus{border-top:1px solid var(--line);padding:12px 0}.focus-diff{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.decision-row{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-top:10px}.decision-question{font-size:.9rem;font-weight:600}.decision-chip{width:auto;padding:6px 9px;background:#fff;color:inherit;border:1px solid var(--line);border-radius:999px;font-size:.82rem;display:inline-flex;gap:5px;align-items:center}.decision-chip span{font-size:.76rem;color:var(--muted)}.decision-chip.selected{background:var(--accent);color:#fff;border-color:var(--accent)}.decision-chip.selected span{color:#fff}.decision-status{font-size:.87rem;margin-top:7px;color:#46624c}.question-focus{padding:10px 0;border-top:1px solid var(--line)}.reflection-reference details{margin-top:10px}.completion-card{text-align:center}.completion-mark{width:54px;height:54px;margin:0 auto 10px;border-radius:50%;display:grid;place-items:center;font-size:1.8rem;background:#edf7ef;color:#46624c}.completion-summary{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:18px 0}.completion-summary>div{display:grid;gap:3px;padding:14px;border:1px solid var(--line);border-radius:10px}.completion-actions{display:flex;gap:8px;justify-content:center;flex-wrap:wrap;margin-top:18px}@media(max-width:700px){.decision-question{width:100%}.decision-chip{flex:1 1 calc(50% - 6px);justify-content:center}.completion-summary{grid-template-columns:1fr}}

/* REFLECT v0.1.7 */
.mentor-box{border-left:4px solid #7b8fa5}.mentor-label{font-size:.78rem;font-weight:800;letter-spacing:.08em;color:var(--muted);text-transform:uppercase}.mentor-question{border-left:4px solid #8b6fa8}.tier-key{display:inline-block;padding:2px 7px;border-radius:999px;font-size:.72rem;font-weight:800;letter-spacing:.04em;margin-right:5px}.tier-key.focus{background:#fff0d8;color:#7d5314}.tier-key.language{background:#e7f2fb;color:#285e83}.tier-key.minor{background:#edf1f5;color:#65717d}.diff-map{margin-top:14px;border-top:1px solid var(--line);padding-top:10px;display:grid;gap:7px;font-size:.88rem}.mini-change{margin-left:5px}.suggestion-card{padding:14px 0;border-top:1px solid var(--line)}.suggestion-card:first-of-type{border-top:0}.focus-card{background:linear-gradient(90deg,#fffaf0 0,#fffaf0 5px,transparent 5px);padding-left:14px}.language-card{padding-left:8px}.knowledge-candidate{margin-top:10px;background:#f6f8fb;border:1px solid var(--line);border-radius:8px;padding:10px}.knowledge-item{font-size:1.05rem;font-weight:700;margin-top:4px}.compact-k{font-size:.9rem}.minor-summary{background:#fafafa}.minor-row{padding:5px 0}.minor-applied{padding:9px 12px;border-radius:8px;background:#f3f6f8;color:#53606c;margin-bottom:12px;font-size:.9rem}.edit-marker.question,.edit-marker.question_unsure{border-left:3px solid #8b6fa8}.completion-summary.one{grid-template-columns:1fr;max-width:320px;margin-left:auto;margin-right:auto}
@media(max-width:700px){.diff-map{font-size:.82rem}.suggestion-card{padding:12px 0}.knowledge-candidate{padding:9px}.mentor-box,.mentor-question{padding:16px}}

/* v0.1.8 Block 2-3: navigable steps + inline Notice & Decide */
.step-nav a,.step-nav span{background:#e9edf2;padding:10px;border-radius:8px;text-align:center;font-size:.9rem;text-decoration:none;color:inherit;display:block}
.step-nav a:hover{outline:2px solid #8a96a3;outline-offset:1px}
.step-nav .active{background:var(--accent);color:#fff;font-weight:700}
.step-nav .disabled-step{opacity:.55;cursor:not-allowed}
.parallel-drafts{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:12px}
.draft-pane{border:1px solid var(--line);border-radius:10px;padding:12px;background:#fff}
.revised-pane{background:#fbfcfd}
.draft-pane-title{font-size:.82rem;font-weight:800;letter-spacing:.04em;margin-bottom:8px;color:#56616c;text-transform:uppercase}
.change-list{margin-top:18px;border-top:1px solid var(--line);padding-top:14px}
.change-list h3{margin:0 0 4px}
.change-row{margin-top:12px;border:1px solid var(--line);border-radius:10px;padding:12px;background:#fff}
.change-row.focus{border-left:5px solid #a26818;background:#fffaf2}
.change-row.suggestion{border-left:5px solid #2f6f8f;background:#f8fbfd}
.change-row.auto_edit{border-left:5px solid #6f7780;background:#fafbfc}
.change-head{display:flex;gap:6px;align-items:center;flex-wrap:wrap;margin-bottom:10px}
.tier-key.suggestion{background:#e7f2fb;color:#285e83}
.tier-key.auto_edit{background:#edf1f5;color:#59636e}
.change-columns{display:grid;grid-template-columns:minmax(0,1fr) auto minmax(0,1fr);gap:10px;align-items:center}
.change-side{min-width:0;padding:9px 10px;border-radius:8px;border:1px solid var(--line);background:#fff;display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap}
.change-side-label{font-size:.72rem;font-weight:800;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;display:block;width:100%}
.change-arrow{font-size:1.15rem;color:#64707b;font-weight:700}
.inline-decisions{margin-top:10px}
.auto-edit-note{margin-top:9px;font-size:.86rem;color:#52606b}
.why-panel{margin-top:8px}
.diff-del{background:#fff2f0;text-decoration:line-through;text-decoration-thickness:2px;text-decoration-color:#8b3b31;border-bottom:2px solid #8b3b31;padding:0 2px}
.diff-add{background:#edf7f1;text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:#2f6d4d;text-underline-offset:2px;padding:0 2px}
.knowledge-save.saved{font-weight:700}
@media(max-width:800px){
  .parallel-drafts{grid-template-columns:1fr}
  .change-columns{grid-template-columns:1fr}
  .change-arrow{transform:rotate(90deg);justify-self:center}
}

/* v0.1.8 Block 4: comparison workspace + question set + loading state */
.review-workspace{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(320px,.9fr);gap:16px;margin-top:16px;align-items:start}
.comparison-panel,.changes-panel{min-width:0}
.section-head-simple h2,.changes-panel h2{margin-top:0}
.compact-comparison{margin-top:10px}
.draft-pane-title{text-transform:none;letter-spacing:0;font-size:.9rem}
.side-change-list{margin-top:8px;padding-top:0;border-top:0;display:grid;gap:10px}
.side-change-list .change-row{margin-top:0}
.change-compact-diff{display:flex;gap:8px;align-items:center;flex-wrap:wrap;font-size:.98rem}
.change-compact-diff .change-arrow{font-size:1rem}
.why-inline{display:grid;gap:2px;margin-top:10px;padding-top:8px;border-top:1px dashed var(--line);font-size:.88rem}
.question-list{display:grid;gap:12px;margin-top:12px}
.question-card{background:#fff;border:1px solid var(--line);border-radius:10px;padding:14px}
.question-number{font-size:.76rem;font-weight:800;color:#6e4688;letter-spacing:.04em}
.question-support{display:grid;grid-template-columns:1fr 1fr;gap:12px;background:#f8f6fb;border-radius:8px;padding:10px 12px;margin-top:8px}
.question-support p{margin:0}
.question-placement{margin-bottom:0}
.english-support-visible{margin-top:10px;padding-top:10px;border-top:1px solid var(--line)}
.useful-language-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.compact-k-card{margin-top:0;height:100%}
.loading-overlay{position:fixed;inset:0;background:rgba(245,247,250,.88);display:grid;place-items:center;z-index:9999;padding:24px}
.loading-card{background:#fff;border:1px solid var(--line);border-radius:14px;padding:22px 26px;box-shadow:0 10px 35px rgba(29,39,51,.12);display:grid;justify-items:center;gap:10px;text-align:center;max-width:380px}
.loading-mascot{position:relative;width:78px;height:78px;display:grid;place-items:center;color:#8a5518;font-weight:800;font-size:1.15rem}
.loading-mascot img{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:contain}
.loading-mascot .mentor-avatar-fallback{position:absolute;inset:0;display:grid;place-items:center;border-radius:50%;background:#f4eadb;border:1px solid #dfc9a8}
.loading-spinner{width:34px;height:34px;border:4px solid #d8e0e8;border-top-color:var(--accent);border-radius:50%;animation:reflect-spin .8s linear infinite}
@keyframes reflect-spin{to{transform:rotate(360deg)}}
@media(max-width:900px){
  .review-workspace{grid-template-columns:1fr}
  .useful-language-list{grid-template-columns:1fr}
}
@media(max-width:700px){
  .question-support{grid-template-columns:1fr}
}


/* v0.1.8 Block 5: Step 2 two-box workspace */
.two-box-workspace{grid-template-columns:minmax(0,1.25fr) minmax(340px,1fr);gap:18px}
.unified-diff-panel{position:sticky;top:14px}
.diff-legend{display:flex;gap:16px;align-items:center;flex-wrap:wrap;margin:10px 0 14px;font-size:.84rem;color:var(--muted)}
.diff-legend>span{display:flex;gap:7px;align-items:center}
.legend-sample{font-size:.82rem;font-weight:700;padding:2px 5px;border-radius:4px}
.unified-diff-text{font-size:1.03rem;line-height:1.9;min-height:160px;background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px}
.diff-help{margin:10px 0 0}
.changes-panel{max-height:calc(100vh - 120px);overflow:auto;scrollbar-gutter:stable}
.changes-panel>.muted{margin-bottom:10px}
@media(max-width:900px){
  .two-box-workspace{grid-template-columns:1fr}
  .unified-diff-panel{position:static}
  .changes-panel{max-height:none;overflow:visible}
}

/* v0.1.8 Block 6: linked Draft comparison ↔ Changes */
.diff-change-marker{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:22px;margin-left:5px;padding:0 6px;border:1.5px solid currentColor;border-radius:999px;background:#fff;font-size:.68rem;font-weight:800;line-height:1;vertical-align:middle;cursor:pointer;box-shadow:none}
.diff-change-marker.focus{color:#7d5314;background:#fff8eb}
.diff-change-marker.suggestion{color:#285e83;background:#f3f9fd}
.diff-change-marker.auto_edit{color:#59636e;background:#f5f6f7;min-width:21px;padding:0 5px}
.diff-change-marker:focus-visible,.change-context-link:focus-visible{outline:3px solid rgba(45,105,140,.28);outline-offset:2px}
.change-context-link{display:block;width:100%;margin:9px 0 8px;padding:9px 10px;border:1px solid var(--line);border-radius:8px;background:#fff;text-align:left;color:inherit;cursor:pointer;font:inherit;line-height:1.55}
.change-context-link:hover{background:#f8fafc}
.change-context-label{display:block;margin-bottom:4px;font-size:.72rem;font-weight:800;color:var(--muted);letter-spacing:.03em;text-transform:none}
.change-context-text{display:block;font-size:.91rem}
.change-row.linked-highlight{box-shadow:0 0 0 3px rgba(47,111,143,.18);transition:box-shadow .15s ease}
.diff-change-marker.linked-highlight{box-shadow:0 0 0 4px rgba(47,111,143,.20);transform:scale(1.05);transition:box-shadow .15s ease,transform .15s ease}
.change-compact-diff{font-size:.94rem}
@media(max-width:900px){
  .diff-change-marker{min-width:23px;height:21px}
}

/* v0.1.8 Block 7: quieter cross-reference markers in the reading panel. */
.diff-change-marker{
  display:inline-flex;align-items:center;justify-content:center;
  min-width:1.35rem;height:1.35rem;padding:0 .28rem;margin:0 .14rem;
  border:1px solid #667381;border-radius:999px;background:#fff;color:#35414d;
  font-size:.70rem;font-weight:800;line-height:1;vertical-align:middle;
}
.diff-change-marker:hover{background:#f2f5f7}
.mentor-comment-short{max-width:62ch;margin-bottom:.35rem}

/* v0.1.8 Block 8: stable Focus controls and quieter knowledge cues */
.focus-decision-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.focus-decision-grid .decision-chip{
  width:100%;
  justify-content:center;
  min-height:38px;
}
.knowledge-source-label{
  font-size:.72rem;
  font-weight:800;
  letter-spacing:.03em;
  color:var(--muted);
  margin-bottom:4px;
}
.learner-noticed-k{border-style:dashed}
@media(min-width:1180px){
  .focus-decision-grid{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media(max-width:520px){
  .focus-decision-grid{grid-template-columns:1fr 1fr}
  .focus-decision-grid .decision-chip{font-size:.78rem;padding:7px 6px}
}

/* v0.1.8 Block 9: stable Focus buttons + optional expression exploration */
.focus-decision-grid{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.focus-decision-grid .decision-chip{
  min-width:0;
  min-height:48px;
  flex-direction:column;
  gap:2px;
  white-space:nowrap;
}
.focus-decision-grid .decision-chip span{white-space:nowrap}
@media(min-width:1180px){
  .focus-decision-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:520px){
  .focus-decision-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .focus-decision-grid .decision-chip{font-size:.78rem;padding:7px 5px;white-space:normal}
  .focus-decision-grid .decision-chip span{white-space:normal}
}
.no-change-state{display:grid;gap:10px}
.no-change-state p{margin:0}
.explore-alternative-btn{justify-self:start;max-width:100%;white-space:normal}
.explore-status{margin-top:2px}
.alternative-results{display:grid;gap:10px;margin-top:4px}
.alternative-card{border:1px solid var(--line);border-radius:10px;background:#fff;padding:12px}
.alternative-card p{margin:8px 0 0}
.alternative-label{font-size:.76rem;font-weight:800;color:var(--muted);margin-bottom:7px}
.alternative-compare{display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:.96rem}
.original-expression{padding:3px 6px;border-radius:5px;background:#f4f5f6;color:#4f5964}
.alternative-expression{padding:3px 6px;border-radius:5px;background:#edf7ef;color:#216b36;font-weight:700}

/* v0.1.8 Block 10: compact, noticeable Refmy mentor message */
.mentor-intro{display:grid;grid-template-columns:46px minmax(0,1fr);gap:12px;align-items:start;margin:14px 0 22px;padding:15px;border:2px solid #406a85;border-radius:14px;background:#eef6fa}
.mentor-avatar{position:relative;width:46px;height:46px;border-radius:50%;display:grid;place-items:center;background:#f4eadb;color:#8a5518;border:1px solid #dfc9a8;font-weight:800;font-size:1rem;box-shadow:0 1px 2px rgba(30,40,50,.05);overflow:hidden}
.mentor-avatar img{position:relative;z-index:1;display:block;width:100%;height:100%;object-fit:contain;transform:scale(1.08);transform-origin:center}
.mentor-avatar-fallback{position:absolute;inset:0;display:grid;place-items:center}
.mentor-speech{position:relative;border:1px solid var(--line);border-left:4px solid #7b8fa5;border-radius:12px;background:#fff;padding:12px 14px}
.mentor-speech:before{content:"";position:absolute;left:-9px;top:16px;width:14px;height:14px;background:#fff;border-left:1px solid var(--line);border-bottom:1px solid var(--line);transform:rotate(45deg)}
.mentor-speech-head{display:flex;align-items:center;gap:9px;flex-wrap:wrap;margin-bottom:5px}
.mentor-note-label{font-size:.76rem;font-weight:700;color:#6d7884;background:#f3f5f7;border-radius:999px;padding:2px 8px}
.mentor-intro .mentor-note-label{font-size:.95rem;color:#183d56;background:#dcecf5;padding:4px 9px}
.mentor-intro .mentor-speech{min-width:0;border-left:5px solid #406a85;box-shadow:0 3px 10px rgba(24,61,86,.09)}
.mentor-intro .mentor-comment-short{font-size:1.08rem;line-height:1.6}
.mentor-speech .mentor-label{font-size:.72rem}
.mentor-speech .mentor-comment-short{margin:.1rem 0 .22rem;max-width:78ch;font-size:1rem;line-height:1.55}
.mentor-comment-ja{margin:0;color:var(--muted);font-size:.91rem;line-height:1.55}
.mentor-intro .mentor-comment-short,.mentor-intro .mentor-comment-ja{font-weight:700}
.mentor-follow-up{margin-top:14px;padding-top:13px;border-top:1px solid #cbdde8}
.mentor-follow-up .question-list{margin-top:0}
.mentor-follow-up .question-card{background:#f8fbfd}
.question-support-details{margin:10px 0}
.question-support-details summary{cursor:pointer;color:#285e83;font-size:.88rem;font-weight:700}
@media(max-width:560px){.mentor-intro{grid-template-columns:38px minmax(0,1fr);gap:9px;padding:11px}.mentor-avatar{width:38px;height:38px;font-size:.9rem}.mentor-speech{padding:10px 12px}.mentor-speech:before{top:13px}}

/* v0.1.8 Block 11: make punctuation-only edits visibly different from word corrections */
.diff-punct-add{
  display:inline-block;
  margin-left:1px;
  padding:0 3px;
  border-radius:4px;
  background:#fff4cc;
  color:#6b5200;
  font-weight:800;
  text-decoration:none;
  border-bottom:2px dotted #9b7a13;
}
.diff-punct-del{
  display:inline-block;
  margin:0 1px;
  padding:0 3px;
  border-radius:4px;
  background:#f5f1e8;
  color:#6a6255;
  text-decoration:line-through;
  text-decoration-thickness:2px;
  border-bottom:2px dotted #8d8170;
}
.mentor-input-k{border-left:4px solid #b98a45;background:#fffaf1}


/* v0.1.8 Block 12: learner-controlled Alternative decisions */
.alternative-decision-grid{margin-top:10px}
.alternative-card .decision-status{margin-top:7px}


/* Block 13 v2: compact alpha-test export tools */
.alpha-test-tools{margin-top:18px;}
.alpha-test-tools summary{cursor:pointer;font-weight:700;}
.alpha-test-actions{display:flex;gap:12px;align-items:center;flex-wrap:wrap;margin-top:12px;}
.test-report-preview{width:100%;margin-top:12px;font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono",monospace;font-size:.82rem;line-height:1.45;}

.knowledge-later-note{margin:12px 0 4px;padding:9px 12px;border-left:3px solid var(--line)}

/* Block 14: reflection-time Knowledge selection */
.reflection-knowledge-candidates{display:grid;gap:10px}
.reflection-k-candidate{display:grid;grid-template-columns:auto minmax(0,1fr);gap:10px;align-items:start;border:1px solid var(--line);border-radius:10px;padding:12px;background:#fff;cursor:pointer}
.reflection-k-candidate>input{margin-top:4px;transform:scale(1.15)}
.reflection-k-body{display:grid;gap:3px}
.reflection-k-body strong{font-size:1.02rem}


/* v0.1.8 Block 16: episode-first Step 1 + nearby regenerate control */
.mode-fieldset{border:0;padding:0;margin:0;min-width:0}
.mode-fieldset legend{font-weight:700;margin-bottom:2px}
.required-mark{color:#9b3d3d}
.mode-help{margin:.15rem 0 .55rem}
.mode-choice-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.mode-choice{position:relative;display:flex;align-items:center;border:1px solid var(--line);border-radius:10px;background:#fff;padding:10px 12px;cursor:pointer;min-width:0}
.mode-choice input{position:absolute;opacity:0;pointer-events:none}
.mode-choice span{display:grid;gap:2px}
.mode-choice small{color:var(--muted);font-size:.76rem;font-weight:400}
.mode-choice:hover{border-color:#aab3bd}
.mode-choice:focus-within{outline:2px solid rgba(64,105,145,.24);outline-offset:2px}
.mode-choice.selected{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:#f7fafc}
.draft-entry-guide{display:grid;gap:3px;padding:10px 12px;border-left:4px solid #7b8fa5;background:#f7f9fb;border-radius:8px;font-size:.92rem}
.comparison-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.regenerate-near-draft{flex:0 0 auto;margin:0}
.compact-action{padding:8px 12px;font-size:.84rem;white-space:nowrap}
.regenerate-action{display:inline-flex;align-items:center;gap:6px;background:var(--accent-soft);color:var(--accent);border:1px solid #8fb0cc;font-weight:700;box-shadow:0 1px 2px rgba(35,87,137,.08)}
.regenerate-action:hover{background:#dcebf6;border-color:var(--accent)}
.regenerate-action:focus-visible{outline:3px solid rgba(35,87,137,.22);outline-offset:2px}
@media(max-width:700px){.mode-choice-row{grid-template-columns:1fr}.comparison-head{display:grid}.regenerate-near-draft{justify-self:start}.regenerate-action{min-height:44px}}

/* v0.1.8 Block 17: Step 3 production, diff awareness, and optional Final Check */
.final-diff-card{margin-top:6px}.diff-baseline-toggle{display:flex;gap:6px;flex-wrap:wrap}.diff-baseline-toggle .small-link{border:1px solid var(--line);border-radius:999px;padding:6px 10px;background:#fff}.diff-baseline-toggle .small-link.selected{border-color:var(--accent);background:#f2f7fa;font-weight:700}.final-check-callout{border:1px solid #d8c89c;background:#fffcf4}.final-check-head{display:flex;justify-content:space-between;gap:16px;align-items:flex-start}.final-check-head h2{margin-bottom:5px}.optional-tag{font-size:.72rem;font-weight:700;color:var(--muted);background:#f2f2ee;border-radius:999px;padding:3px 7px;vertical-align:middle}.check-status{font-size:.8rem;color:var(--muted);white-space:nowrap}.check-status.done{color:#46624c;font-weight:700}.final-check-button{margin-top:4px}.final-check-results{margin-top:16px;border-top:1px solid #e5dcc1;padding-top:8px}.check-clear{margin:10px 0;color:#46624c}.soft-reminder-dialog{max-width:520px;border:1px solid var(--line);border-radius:14px;padding:22px;box-shadow:0 18px 60px rgba(0,0,0,.18)}.soft-reminder-dialog::backdrop{background:rgba(30,38,45,.28)}.soft-reminder-dialog h3{margin-top:0}.more-help-button[disabled]{opacity:.65;cursor:wait}@media(max-width:700px){.final-check-head{display:block}.check-status{display:inline-block;margin-bottom:8px}.diff-baseline-toggle{margin-top:8px}}

/* v0.1.8 Block 40: identify Step 2 Use changes beside the editable Final Draft. */
.final-draft-heading{display:flex;justify-content:space-between;align-items:baseline;gap:12px;flex-wrap:wrap}
.final-draft-heading label{font-weight:700}
.editable-note{font-size:.8rem;color:var(--muted)}
.applied-step2-panel{border:1px solid #cbdde9;border-left:4px solid #4c7fa3;border-radius:10px;padding:13px 14px;background:#f7fbfe;display:grid;gap:8px}
.applied-step2-head{display:flex;justify-content:space-between;gap:12px;align-items:center}
.applied-count{min-width:1.75rem;height:1.75rem;border-radius:999px;display:grid;place-items:center;background:#e2f0f8;color:#285e83;font-size:.82rem;font-weight:800}
.applied-step2-panel p{margin:0}
.applied-step2-list{display:grid;gap:7px}
.applied-step2-item{display:flex;align-items:center;gap:9px;flex-wrap:wrap;padding-top:7px;border-top:1px solid #dbe8f0}
.applied-step2-item:first-child{padding-top:0;border-top:0}
.applied-step2-change{display:flex;align-items:center;gap:7px;flex-wrap:wrap;min-width:0}
@media(max-width:560px){.applied-step2-item{display:grid}.applied-step2-change{font-size:.92rem}}
.step1-date-field{max-width:310px}.step1-date-field input{max-width:260px}.mode-fieldset{margin-top:2px}

.check-status.stale{color:#946515;font-weight:700}

/* Block 45: local-only, mobile-first Step 1 recording preview. */
.speech-recorder{display:grid;gap:14px;border:1px solid #b9cedd;border-left:4px solid #4c7fa3;border-radius:12px;padding:16px;background:#f7fbfe}
.speech-recorder-head{display:flex;justify-content:space-between;align-items:flex-start;gap:12px}
.speech-recorder-head h2{margin:0 0 4px;font-size:1.08rem}.speech-recorder-head p{margin:0}
.local-only-badge{flex:0 0 auto;border-radius:999px;background:#e2f0f8;color:#285e83;padding:5px 9px;font-size:.75rem;font-weight:800}
.speech-privacy-notice{border:1px solid #d9e3e9;border-radius:10px;background:#fff;padding:12px 14px;font-size:.9rem}
.speech-privacy-notice ul{margin:7px 0 0;padding-left:1.2rem}.speech-privacy-notice li+li{margin-top:5px}
.speech-status{margin:0;font-weight:700}.speech-error{margin:0;border-left:4px solid #a34c4c;background:#fff5f5;padding:9px 11px;color:#7c3030}
.field-error{margin:4px 0 8px;color:#9f1239;font-weight:700;font-size:.92rem}
.speech-state-panel{display:grid;justify-items:start;gap:11px}.recording-indicator{display:flex;align-items:center;gap:8px}
.recording-indicator span{width:12px;height:12px;border-radius:50%;background:#b74242}.recording-time{font-size:1.35rem;font-variant-numeric:tabular-nums;font-weight:800}
.recording-warning{margin:0;color:#8a5b12;font-weight:750}.speech-actions{display:flex;gap:8px;flex-wrap:wrap}
#recording-playback{width:min(100%,520px)}.speech-recorder button:disabled{opacity:.55;cursor:not-allowed}
.speech-transcribing{grid-template-columns:48px minmax(0,1fr);align-items:center}.speech-transcribing .loading-mascot{grid-row:1/3;width:48px;height:48px}
.speech-review{justify-items:stretch}.transcript-field{display:grid;gap:6px;width:100%}.transcript-field p{margin:0}
.raw-transcript{min-height:5rem;border:1px solid #cddbe4;border-radius:9px;background:#fff;padding:11px 12px;white-space:pre-wrap;overflow-wrap:anywhere}
#edited-transcript{width:100%;box-sizing:border-box}.speech-review .speech-actions{margin-top:2px}
@media(max-width:560px){.speech-recorder{padding:13px}.speech-recorder-head{display:grid}.local-only-badge{justify-self:start}.speech-actions{display:grid;width:100%}.speech-actions button,.speech-state-panel>button{width:100%;min-height:44px}}


/* v0.1.8 Block 18: neutral decisions, clearer anchors, and Final Check choice */
.decision-prompt{margin-top:9px;font-size:.76rem;font-weight:750;color:#5d6873;letter-spacing:.01em}
.decision-chip{transition:background .12s ease,border-color .12s ease,box-shadow .12s ease,transform .08s ease}
.decision-chip:hover{border-color:#8795a3;background:#f7f9fb;box-shadow:0 1px 2px rgba(30,40,50,.06)}
.decision-chip.selected::before{content:"✓";font-weight:900;margin-right:1px}
.placement-anchor{display:inline-block;padding:1px 5px;border-radius:5px;background:#f2f5f7;color:#34404c;font-weight:650}
.final-check-choice{display:flex;gap:9px;align-items:center;flex-wrap:wrap;margin-top:8px}
.final-check-choice .final-check-button,.final-check-choice .final-check-next-primary,.final-check-choice .final-check-skip{margin-top:0}
.final-check-next-primary{font-weight:750}
.diff-change-marker{position:relative;z-index:1;margin-left:.24rem;margin-right:.34rem;vertical-align:.08em;white-space:nowrap}
@media(max-width:560px){.final-check-choice{display:grid;grid-template-columns:1fr}.final-check-choice button{width:100%}}

/* Block 21: keep the Step 3 jump action visually attached to its anchor text. */
.placement-line{display:inline-flex;align-items:center;gap:6px;flex-wrap:wrap}
.inline-jump{margin-top:0;vertical-align:middle;padding:4px 8px;white-space:nowrap}

/* Block 23: explicit learner decisions for each current Final Check item. */
.final-check-decisions{display:flex;gap:7px;align-items:center;flex-wrap:wrap;margin:10px 0 4px}
.final-check-decision{position:relative;display:grid;gap:1px;min-width:92px;padding:7px 10px;border:1px solid var(--line);border-radius:9px;background:#fff;color:inherit;font-weight:750}
.final-check-decision span{font-size:.75rem;font-weight:500;color:var(--muted)}
.final-check-decision:hover{border-color:#8795a3;background:#f7f9fb}
.final-check-decision.selected{border-color:var(--accent);box-shadow:inset 0 0 0 1px var(--accent);background:#f2f7fa}
.final-check-decision.selected::before{content:"✓";position:absolute;margin-left:-4px}
.final-check-decision-status{flex-basis:100%;min-height:1.2em;font-size:.82rem}
.final-check-next-primary:disabled{opacity:.5;cursor:not-allowed}
@media(max-width:520px){.final-check-decisions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.final-check-decision{min-width:0;padding:7px 4px}.final-check-decision-status{grid-column:1/-1}}
.admin-form,.admin-memberships{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:1rem}.admin-form label{display:grid;gap:.35rem}.admin-class-heading,.membership-row{display:flex;align-items:center;justify-content:space-between;gap:1rem}.admin-class-heading h2{margin-bottom:.25rem}.membership-row{padding:.35rem 0;border-bottom:1px solid #e5e7eb}.membership-row small{display:block;color:#64748b}.membership-add{margin-top:.75rem}.table-wrap{overflow-x:auto}
.admin-class{margin-bottom:12px}
.admin-class-summary{cursor:pointer;display:flex;align-items:center;gap:10px;flex-wrap:wrap;list-style:none}
.admin-class-summary::-webkit-details-marker{display:none}
.admin-class-summary::before{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);flex:none}
.admin-class[open]>.admin-class-summary::before{transform:rotate(45deg)}
.admin-class-summary:focus-visible{outline:3px solid var(--accent);outline-offset:4px}
.admin-class-name{font-size:1.1rem;font-weight:700;overflow-wrap:anywhere}
.admin-class-summary .muted{margin-left:auto;font-size:.9rem}
.admin-class-body{margin-top:16px;border-top:1px solid var(--line);padding-top:16px}
.admin-class-heading h3{margin:0}
.class-code-value{display:block;box-sizing:border-box;width:100%;margin-top:8px;padding:12px 14px;border:1px solid var(--line);border-radius:8px;background:#f5f7fa;color:var(--ink);font-family:inherit;font-size:1.18rem;font-weight:700;line-height:1.5;letter-spacing:.035em;overflow-wrap:anywhere;user-select:all}
.admin-rename-form{margin-bottom:1rem}.current-code-status{border:1px solid var(--line);border-radius:8px;background:#f5f7fa;padding:12px;margin-bottom:14px}.current-code-status p{margin:8px 0 0}.form-heading{display:block;width:100%;margin-bottom:4px}
@media(max-width:700px){.admin-class-summary .muted{margin-left:0;width:100%}.admin-class-heading{align-items:flex-start;flex-wrap:wrap}}
.research-export-card fieldset{border:1px solid var(--line);border-radius:12px;padding:1rem}.research-choice-grid{display:grid;gap:.65rem}.research-student-choice{display:flex;align-items:flex-start;gap:.55rem}.research-student-choice small{display:block;color:var(--muted);margin-top:.15rem}.research-filter-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1rem}.research-filter-grid label{display:block;margin-top:.35rem}.warning-choice,.warning-panel{border-left:4px solid #c98500;padding-left:.8rem}.research-counts{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem 1rem}.research-counts div{display:flex;justify-content:space-between;border-bottom:1px solid var(--line)}.research-counts dt,.research-counts dd{margin:0}@media(max-width:700px){.research-filter-grid{grid-template-columns:1fr}.research-counts{grid-template-columns:1fr}}

/* Block 66: responsive UI and presentation consistency. */
.journal-list{list-style:none;margin:0;padding:0;display:grid;gap:0}
.journal-list-item{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:13px 0;border-bottom:1px solid var(--line);min-width:0}
.journal-list-item:last-child{border-bottom:0}
.journal-list-main{display:grid;gap:7px;min-width:0}
.journal-title{font-weight:700;overflow-wrap:anywhere}
.journal-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.status-badge{display:inline-flex;align-items:center;width:max-content;border-radius:999px;padding:3px 9px;font-size:.78rem;font-weight:800}
.status-draft{background:#fff3d6;color:#79540e}
.status-completed{background:#e7f5eb;color:#2f6840}
.journal-action{font-weight:700;white-space:nowrap}

.checkbox-choice{display:flex;align-items:flex-start;gap:.6rem;width:100%;padding:.45rem .5rem;border-radius:8px;cursor:pointer;line-height:1.45}
.checkbox-choice:hover{background:#f5f8fa}
.checkbox-choice:focus-within{outline:2px solid rgba(35,87,137,.25);outline-offset:1px}
.checkbox-choice input[type="checkbox"]{flex:0 0 auto;width:1.1rem;height:1.1rem;margin:.18rem 0 0;padding:0;cursor:pointer}
.checkbox-choice>span{min-width:0;overflow-wrap:anywhere}
.research-filter-grid .checkbox-choice{display:flex;margin-top:.25rem}

@media(max-width:900px){
  .two-box-workspace{grid-template-columns:minmax(0,1fr);width:100%}
  .comparison-panel,.changes-panel,.unified-diff-text,.change-row{min-width:0;max-width:100%}
  .change-context-text,.change-compact-diff,.why-inline{overflow-wrap:anywhere;word-break:normal}
}
@media(max-width:700px){
  .topbar{padding:12px 14px;min-width:0}
  .topbar>div,.topbar nav{width:100%;min-width:0}
  .topbar nav{gap:8px 14px}
  .topbar nav a{overflow-wrap:anywhere}
  .container{margin:16px auto;padding:0 12px;min-width:0}
  .card,.subcard{padding:15px;min-width:0}
  .review-workspace{min-width:0;width:100%}
  .journal-list-item{align-items:flex-start;flex-direction:column;gap:8px}
  .journal-action{white-space:normal}
  .journal-table{min-width:680px}
  .journal-table-wrap{overflow-x:auto}
}
@media(max-width:520px){
  .step-nav a,.step-nav span{padding:9px 6px;font-size:.82rem;line-height:1.35;overflow-wrap:normal}
  .focus-decision-grid .decision-chip{min-height:54px;line-height:1.2}
  .focus-decision-grid .decision-chip span{display:block}
  .question-card .decision-row{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;width:100%}
  .question-card .decision-row .decision-chip{width:100%;min-width:0;min-height:48px;justify-content:center;white-space:normal;line-height:1.25}
  .question-card .decision-row .decision-chip span{display:block;white-space:normal}
  .diff-legend{align-items:flex-start;flex-direction:column;gap:7px}
}

/* Public release: RefMy delivery. The face crop stays legible at avatar size. */
.mentor-avatar{width:56px;height:56px;background:#fff4e6}
.mentor-avatar img{transform:none}
.mentor-intro{grid-template-columns:56px minmax(0,1fr)}
.brand-mascot{display:block;width:96px;height:96px;margin:0 auto 4px;object-fit:contain}
@media(max-width:560px){
  .mentor-intro{grid-template-columns:52px minmax(0,1fr)}
  .mentor-avatar{width:52px;height:52px}
}
@media(prefers-reduced-motion:reduce){
  .loading-spinner{animation-duration:4s}
  *{scroll-behavior:auto!important}
}

/* Public release: PWA, notices, and error pages. */
.topbar nav{align-items:center}
body{padding-left:env(safe-area-inset-left);padding-right:env(safe-area-inset-right)}
.topbar{padding-top:calc(14px + env(safe-area-inset-top));z-index:10}
.offline-banner{position:sticky;top:0;z-index:20;background:#7a4b00;color:#fff;padding:10px 16px;padding-top:calc(10px + env(safe-area-inset-top));font-weight:700;line-height:1.45}
.offline-banner span{display:block;font-weight:400;font-size:.88rem}
.site-footer{max-width:1000px;margin:24px auto;padding:0 18px calc(18px + env(safe-area-inset-bottom));font-size:.88rem;color:var(--muted)}
.privacy-note{border-left:4px solid #7b8fa5;background:#f7f9fb;padding:9px 12px;border-radius:8px;font-size:.9rem}
.privacy-link{font-size:.9rem}
.privacy-page h2{margin-top:1.6rem;font-size:1.1rem}
.standalone-notice{background:#fff8df;border:1px solid #eadca4;padding:10px 12px;border-radius:8px;font-size:.9rem}
.install-help{margin-bottom:16px}
.install-help summary{cursor:pointer;font-weight:700;min-height:28px}
.install-steps{padding-left:1.2rem;margin-bottom:0}
.install-steps li+li{margin-top:6px}
.login-google-intro{margin:18px 0 0;padding-top:14px;border-top:1px solid var(--line);font-size:.9rem;color:var(--muted)}
.admin-links{display:flex;gap:8px;flex-wrap:wrap}
.error-card{text-align:center}
.error-status{font-size:2.4rem;font-weight:800;margin:0;color:var(--muted)}
@media(max-width:700px){
  .topbar{padding-top:calc(12px + env(safe-area-inset-top))}
  button,.button,.topbar nav a{min-height:40px}
}