* { box-sizing: border-box; }
:root { --bg:#f3f0e8; --paper:#fffdf8; --ink:#25231f; --muted:#6f6a60; --line:#d8d0c2; --deep:#263c35; --deep-hover:#1c2e28; --soft:#e9e4d9; --danger:#8d3832; --fact:#e9f1ec; --interpretation:#f3ecdd; --hypothesis:#ece9f5; --shadow:0 18px 45px rgba(52,45,33,.09); }
body { margin:0; padding-bottom:env(safe-area-inset-bottom,0px); color:var(--ink); background:var(--bg); font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Yu Gothic",sans-serif; line-height:1.65; }
button,input,textarea,select { font:inherit; } button { cursor:pointer; } button:disabled { cursor:not-allowed; opacity:.45; }
.app-header { display:grid; grid-template-columns:minmax(0,1fr) 230px; gap:32px; align-items:end; padding-top:calc(56px + env(safe-area-inset-top,0px)); padding-bottom:56px; padding-left:max(24px,calc((100vw - 1120px)/2),env(safe-area-inset-left,0px)); padding-right:max(24px,calc((100vw - 1120px)/2),env(safe-area-inset-right,0px)); color:#fff; background:linear-gradient(135deg,#20352f,#3f5c50); }
.app-header h1 { margin:6px 0 12px; font-size:clamp(2rem,5vw,3.6rem); line-height:1.15; } .lead { max-width:760px; margin:0; color:rgba(255,255,255,.82); }
.eyebrow { margin:0; font-size:.73rem; letter-spacing:.16em; font-weight:800; color:#887f70; } .app-header .eyebrow { color:#cbd7d1; }
.status-card { display:grid; padding:20px; border:1px solid rgba(255,255,255,.2); border-radius:18px; background:rgba(255,255,255,.08); } .status-card strong { font-size:3rem; line-height:1; margin:8px 0; } .status-card small { color:rgba(255,255,255,.68); }
.page-shell { width:min(1120px,calc(100% - 32px)); margin:32px auto 80px; } .utility-panel,.form-section,.save-panel { background:var(--paper); border:1px solid var(--line); border-radius:20px; box-shadow:var(--shadow); }
.utility-panel { display:flex; justify-content:space-between; gap:24px; padding:24px; margin-bottom:20px; } .utility-panel h2,.form-section h2 { margin:4px 0; } .button-cluster { display:flex; flex-wrap:wrap; gap:10px; align-items:center; justify-content:flex-end; }
.form-section { padding:clamp(22px,4vw,40px); margin-bottom:24px; } .section-heading { display:flex; justify-content:space-between; align-items:start; gap:24px; margin-bottom:28px; } .section-heading p:not(.eyebrow) { margin:4px 0 0; color:var(--muted); }
.field-grid { display:grid; gap:18px; } .two-columns { grid-template-columns:repeat(2,minmax(0,1fr)); } label { display:grid; gap:7px; margin-bottom:18px; font-weight:700; } label small { color:var(--muted); font-weight:400; }
input,textarea,select { width:100%; border:1px solid #c9c1b4; border-radius:10px; padding:11px 12px; color:var(--ink); background:#fff; } textarea { resize:vertical; } input:focus,textarea:focus,select:focus { outline:3px solid rgba(52,94,78,.18); border-color:#345e4e; } input[readonly] { background:#f0ede6; color:#5d584f; } .required-mark { color:var(--danger); font-size:.8rem; }
.separation-note { display:flex; flex-wrap:wrap; gap:10px 18px; padding:16px; margin-bottom:20px; border-radius:12px; background:#f0eee8; } .separation-note strong { width:100%; }
.key-position-list { display:grid; gap:22px; } .key-position-card { padding:24px; border:1px solid var(--line); border-radius:16px; background:#fff; } .card-heading-row { display:flex; justify-content:space-between; gap:16px; align-items:start; margin-bottom:18px; } .card-heading-row h3 { margin:3px 0 0; }
.observation-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:12px; } .observation-grid label { border-radius:12px; padding:14px; } .observation-grid label span { font-size:.78rem; letter-spacing:.08em; } .fact-field { background:var(--fact); } .interpretation-field { background:var(--interpretation); } .hypothesis-field { background:var(--hypothesis); }
fieldset { border:1px solid var(--line); border-radius:14px; padding:18px; margin:0 0 18px; } legend { font-weight:800; padding:0 8px; } legend span { color:var(--muted); font-size:.8rem; }
.primary-button,.secondary-button,.danger-button,.file-button { display:inline-flex; align-items:center; justify-content:center; min-height:42px; border-radius:10px; padding:10px 15px; font-weight:800; border:1px solid transparent; }
.primary-button { color:#fff; background:var(--deep); font-size:1.05rem; padding-inline:24px; } .primary-button:hover { background:var(--deep-hover); } .secondary-button,.file-button { color:var(--ink); background:var(--soft); border-color:#d2c9bb; } .danger-button { color:var(--danger); background:#fff2f0; border-color:#ddb7b2; } .compact-button { min-height:34px; padding:7px 10px; font-size:.82rem; } .file-button input { position:absolute; inline-size:1px; block-size:1px; opacity:0; }
.save-panel { display:flex; justify-content:space-between; gap:24px; align-items:center; padding:24px 30px; position:sticky; bottom:12px; z-index:3; } .save-panel p { margin:4px 0 0; color:var(--muted); }
.feedback { padding:18px 20px; margin:0 0 20px; border-radius:14px; border:1px solid; background:#fff; } .feedback[data-kind="success"] { border-color:#9ebfaf; background:#edf6f1; } .feedback[data-kind="warning"] { border-color:#d8bd79; background:#fff8e8; } .feedback[data-kind="error"] { border-color:#d8a49e; background:#fff0ee; } .feedback p { margin:3px 0; } .feedback ul { margin-bottom:0; }
footer { text-align:center; color:var(--muted); padding:28px; }
@media (max-width:800px) { .app-header { grid-template-columns:1fr; padding-top:calc(40px + env(safe-area-inset-top,0px)); padding-bottom:40px; } .status-card { width:min(100%,280px); } .utility-panel,.section-heading,.save-panel { flex-direction:column; align-items:stretch; } .button-cluster { justify-content:flex-start; } .two-columns,.observation-grid { grid-template-columns:1fr; } .save-panel { position:static; } .primary-button { width:100%; } }

/* Phase4: 保存済み対局Library */
.library-panel { background:var(--paper); border:1px solid var(--line); border-radius:18px; padding:30px; box-shadow:var(--shadow); margin-bottom:26px; }
.library-layout { display:grid; grid-template-columns:minmax(280px,.78fr) minmax(0,1.42fr); gap:22px; align-items:start; }
.saved-review-list { display:grid; gap:12px; max-height:760px; overflow:auto; padding-right:4px; }
.review-list-card { border:1px solid var(--line); border-radius:14px; background:#fff; overflow:hidden; }
.review-card-main { display:grid; gap:6px; width:100%; border:0; background:transparent; padding:17px; text-align:left; color:var(--ink); cursor:pointer; }
.review-card-main:hover { background:var(--soft); }
.review-card-date,.review-card-meta { color:var(--muted); font-size:.82rem; }
.review-card-excerpt { color:var(--muted); line-height:1.55; }
.review-list-card .review-actions { padding:0 14px 14px; }
.review-actions { display:flex; flex-wrap:wrap; gap:8px; }
.readiness-badge,.detail-status { display:inline-flex; width:max-content; padding:5px 9px; border-radius:999px; font-size:.76rem; font-weight:800; }
.readiness-badge[data-ready="true"],.detail-status[data-ready="true"] { background:#e7f3ec; color:#315f48; }
.readiness-badge[data-ready="false"],.detail-status[data-ready="false"] { background:#fff2d7; color:#795716; }
.saved-review-detail { min-height:320px; border:1px solid var(--line); border-radius:16px; background:#fff; padding:24px; overflow:hidden; }
.library-empty { display:grid; place-content:center; min-height:220px; text-align:center; color:var(--muted); padding:26px; }
.library-empty strong { color:var(--ink); font-size:1.05rem; }
.detail-heading-row { display:flex; justify-content:space-between; gap:18px; align-items:flex-start; padding-bottom:18px; border-bottom:1px solid var(--line); }
.detail-heading-row h3 { margin:3px 0 5px; }
.detail-heading-row p { margin:0; color:var(--muted); }
.detail-section { padding:20px 0; border-bottom:1px solid var(--line); }
.detail-section h4,.detail-two-columns h4 { margin:0 0 9px; }
.detail-text,.empty-text { white-space:pre-wrap; line-height:1.75; margin:0; }
.empty-text { color:var(--muted); }
.saved-review-detail pre { white-space:pre-wrap; overflow-wrap:anywhere; background:#f7f5ef; border-radius:10px; padding:14px; max-height:260px; overflow:auto; }
.detail-key-position { border:1px solid var(--line); border-radius:13px; padding:18px; margin-top:14px; }
.detail-subheading { display:grid; gap:3px; margin-bottom:13px; }
.detail-subheading span { color:var(--muted); font-size:.8rem; }
.detail-definition-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:0; }
.detail-definition-grid div { border-radius:10px; padding:12px; background:#f7f5ef; }
.detail-definition-grid dt { font-size:.72rem; font-weight:800; letter-spacing:.06em; }
.detail-definition-grid dd { margin:5px 0 0; white-space:pre-wrap; line-height:1.6; }
.detail-two-columns { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; padding:20px 0; }
.detail-two-columns section { min-width:0; }
.detail-status { margin-top:20px; }

@media (max-width:1000px) { .library-layout { grid-template-columns:1fr; } .saved-review-list { max-height:none; } }
@media (max-width:800px) { .library-panel { padding:20px; } .detail-heading-row { flex-direction:column; } .detail-definition-grid,.detail-two-columns { grid-template-columns:1fr; } }

/* Phase5: Obsidian向けMarkdown成果物 */
.markdown-export-panel { background:var(--paper); border:1px solid var(--line); border-radius:18px; padding:30px; box-shadow:var(--shadow); margin-bottom:26px; }
.markdown-export-panel[hidden] { display:none; }
.markdown-export-panel[data-kind="OBSERVATION_CARD_MARKDOWN"] { border-color:#9ebfaf; }
.markdown-preview { min-height:430px; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; line-height:1.55; background:#f8f7f2; }
.obsidian-help { margin-top:16px; padding:16px; border-radius:12px; background:#f0eee8; }
.obsidian-help p { margin:4px 0 0; color:var(--muted); }
.markdown-action-buttons { display:flex; flex-wrap:wrap; gap:10px; padding:18px 0; border-bottom:1px solid var(--line); }
.reflection-guidance { margin:18px 0 0; padding:14px 16px; border-radius:12px; border:1px solid #d8bd79; background:#fff8e8; }
.reflection-guidance.ready { border-color:#9ebfaf; background:#edf6f1; }
.reflection-guidance p,.reflection-guidance ul { margin:5px 0 0; }

/* Ver.1.1: KIF Import */
.kif-import-panel { background:var(--paper); border:1px solid var(--line); border-radius:18px; padding:30px; box-shadow:var(--shadow); margin-bottom:26px; }
.kif-import-controls { display:grid; grid-template-columns:max-content minmax(280px,1fr); gap:18px; align-items:stretch; }
.kif-file-button { min-width:200px; margin:0; }
.kif-drop-zone { display:grid; place-content:center; gap:4px; min-height:96px; padding:18px; border:2px dashed #b9b0a1; border-radius:14px; background:#faf8f3; text-align:center; color:var(--muted); transition:.15s ease; }
.kif-drop-zone strong { color:var(--ink); }
.kif-drop-zone[data-drag-active="true"],.kif-drop-zone:focus { border-color:#345e4e; background:#edf6f1; outline:3px solid rgba(52,94,78,.14); }
.kif-paste-panel { margin-top:18px; padding:18px; border:1px solid var(--line); border-radius:14px; background:#fff; }
.kif-paste-heading-row strong { font-size:1rem; }
.kif-paste-heading-row p { margin:5px 0 0; color:var(--muted); line-height:1.55; }
.kif-paste-label { display:block; margin:14px 0 6px; font-weight:800; }
.kif-paste-text { width:100%; min-height:190px; resize:vertical; font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace; font-size:.88rem; line-height:1.5; overflow-wrap:anywhere; }
.kif-paste-actions { margin-top:12px; }
.kif-paste-note { margin:10px 0 0; color:var(--muted); font-size:.82rem; line-height:1.5; }
.kif-import-status { margin-top:18px; padding:14px 16px; border:1px solid var(--line); border-radius:12px; background:#f7f5ef; }
.kif-import-status[data-kind="success"] { border-color:#9ebfaf; background:#edf6f1; }
.kif-import-status[data-kind="warning"] { border-color:#d8bd79; background:#fff8e8; }
.kif-import-status[data-kind="error"] { border-color:#d8a49e; background:#fff0ee; }
.kif-import-status p { margin:3px 0; }
.kif-import-status ul { margin-bottom:0; }
.kif-import-preview { margin-top:20px; padding:22px; border:1px solid var(--line); border-radius:15px; background:#fff; }
.kif-import-preview[hidden] { display:none; }
.kif-preview-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; margin:0; }
.kif-preview-grid div { min-width:0; padding:12px; border-radius:10px; background:#f7f5ef; }
.kif-preview-grid .wide { grid-column:1 / -1; }
.kif-preview-grid dt { font-size:.74rem; font-weight:800; color:var(--muted); }
.kif-preview-grid dd { margin:4px 0 0; overflow-wrap:anywhere; }
.kif-preview-notes { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin-top:16px; }
.kif-preview-notes > div { padding:14px; border:1px solid var(--line); border-radius:12px; }
.kif-preview-notes ul { margin:7px 0 0; padding-left:20px; }
.kif-apply-row { display:flex; justify-content:space-between; gap:20px; align-items:end; margin-top:18px; }
.kif-apply-row label { min-width:220px; margin:0; }
@media (max-width:800px) {
  .kif-import-panel { padding:20px; }
  .kif-import-controls,.kif-preview-grid,.kif-preview-notes { grid-template-columns:1fr; }
  .kif-paste-panel { padding:14px; }
  .kif-paste-actions { display:grid; grid-template-columns:1fr; }
  .kif-paste-actions button { width:100%; }
  .kif-paste-text { min-height:240px; font-size:16px; }
  .kif-preview-grid .wide { grid-column:auto; }
  .kif-apply-row { flex-direction:column; align-items:stretch; }
}

/* Ver.1.2: 棋譜再現盤・局面Navigation */
.shogi-replay-panel {
  background:var(--paper);
  border:1px solid var(--line);
  border-radius:18px;
  padding:30px;
  box-shadow:var(--shadow);
  margin-bottom:26px;
}
.replay-heading { align-items:flex-start; }
.replay-message {
  margin:0 0 18px;
  padding:14px 16px;
  border:1px solid var(--line);
  border-radius:12px;
  white-space:pre-wrap;
  line-height:1.6;
}
.replay-empty { background:#f7f5ef; color:var(--muted); }
.replay-warning { border-color:#d8bd79; background:#fff8e8; }
.replay-error { display:grid; gap:5px; border-color:#d8a49e; background:#fff0ee; }
.replay-error pre { margin:3px 0 0; white-space:pre-wrap; font-family:inherit; }
.replay-layout {
  display:grid;
  grid-template-columns:minmax(0,1.35fr) minmax(230px,.65fr);
  gap:24px;
  align-items:start;
}
.replay-main-column { min-width:0; }
.replay-status {
  display:flex;
  flex-wrap:wrap;
  gap:8px 15px;
  align-items:center;
  min-height:52px;
  margin-bottom:14px;
  padding:12px 14px;
  border-radius:12px;
  background:#f0eee8;
}
.replay-status strong { font-size:1.05rem; }
.replay-build-status {
  margin-left:auto;
  padding:4px 8px;
  border-radius:999px;
  font-size:.72rem;
  font-weight:800;
}
.replay-build-status[data-status="FULL"] { color:#315f48; background:#dceee4; }
.replay-build-status[data-status="PARTIAL"] { color:#795716; background:#ffedbd; }
.replay-build-status[data-status="REJECTED"] { color:var(--danger); background:#f6deda; }
.replay-board-shell {
  display:grid;
  gap:10px;
  width:min(100%,660px);
  margin-inline:auto;
}
.replay-hand {
  min-height:62px;
  display:flex;
  justify-content:space-between;
  gap:12px;
  align-items:center;
  padding:10px 14px;
  border:1px solid #bfa16d;
  border-radius:10px;
  background:#f3ddb0;
}
.replay-hand > div { display:flex; flex-wrap:wrap; gap:7px; justify-content:flex-end; }
.replay-hand-piece {
  display:inline-flex;
  min-width:34px;
  justify-content:center;
  padding:4px 7px;
  border:1px solid rgba(85,58,23,.22);
  border-radius:7px;
  background:rgba(255,255,255,.48);
  font-weight:800;
}
.replay-hand-empty { color:#746a5b; }
.shogi-board {
  width:100%;
  max-width:660px;
  margin-inline:auto;
  padding:10px 10px 12px;
  border:4px solid #5d4224;
  border-radius:5px;
  background:#dcb16a;
  box-shadow:0 10px 20px rgba(54,45,28,.16);
}
.replay-file-label-row {
  display:grid;
  grid-template-columns:repeat(9,minmax(0,1fr));
  padding:0 18px 5px 0;
  text-align:center;
  font-size:.78rem;
  font-weight:800;
  color:#4f361e;
}
.replay-board-grid {
  display:grid;
  grid-template-columns:repeat(9,minmax(0,1fr));
  aspect-ratio:1 / 1;
  border-top:1px solid #74522c;
  border-left:1px solid #74522c;
}
.replay-square {
  position:relative;
  display:grid;
  place-items:center;
  min-width:0;
  min-height:0;
  padding:0;
  border:0;
  border-right:1px solid #74522c;
  border-bottom:1px solid #74522c;
  border-radius:0;
  background:#e1b96f;
  color:#21180e;
  cursor:default;
}
.replay-square:focus-visible {
  z-index:3;
  outline:3px solid #1d5f82;
  outline-offset:-3px;
}
.replay-square.is-last-from::before,
.replay-square.is-last-to::after {
  content:"";
  position:absolute;
  pointer-events:none;
}
.replay-square.is-last-from::before {
  inset:5px;
  border:2px dashed #365f4b;
}
.replay-square.is-last-to::after {
  inset:2px;
  border:4px solid #85382e;
  box-shadow:inset 0 0 0 2px rgba(255,255,255,.5);
}
.replay-piece {
  position:relative;
  z-index:2;
  display:grid;
  place-items:center;
  width:72%;
  height:78%;
  clip-path:polygon(18% 0,82% 0,100% 100%,0 100%);
  background:#f2d699;
  border:1px solid #60431f;
  font-family:"Yu Mincho","Hiragino Mincho ProN",serif;
  font-size:clamp(1rem,3.2vw,2rem);
  font-weight:900;
  line-height:1;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.18));
}
.replay-piece.is-rotated { transform:rotate(180deg); }
.replay-piece.is-promoted { color:#9a2f25; }
.replay-rank-label {
  position:absolute;
  right:-17px;
  z-index:4;
  font-size:.72rem;
  font-weight:800;
  color:#4f361e;
}
.replay-navigation {
  display:grid;
  grid-template-columns:repeat(5,minmax(0,1fr));
  gap:9px;
  margin-top:16px;
}
.replay-navigation .primary-button,
.replay-navigation .secondary-button { width:100%; min-width:0; padding-inline:8px; }
.replay-jump-controls {
  display:grid;
  grid-template-columns:max-content minmax(120px,1fr) max-content 88px max-content;
  gap:9px;
  align-items:center;
  margin-top:12px;
  padding:12px;
  border:1px solid var(--line);
  border-radius:12px;
}
.replay-jump-controls label { margin:0; font-size:.8rem; }
.replay-jump-controls input { margin:0; }
.replay-keyboard-help { margin:9px 0 0; color:var(--muted); font-size:.8rem; }
.replay-move-panel {
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  overflow:hidden;
}
.replay-move-panel h3 { margin:0; padding:15px 16px; border-bottom:1px solid var(--line); }
.replay-move-list {
  display:grid;
  max-height:690px;
  overflow:auto;
  overscroll-behavior:contain;
}
.replay-move-row {
  width:100%;
  min-height:40px;
  border:0;
  border-bottom:1px solid #ece7de;
  border-radius:0;
  padding:9px 13px;
  background:#fff;
  color:var(--ink);
  text-align:left;
  cursor:pointer;
}
button.replay-move-row:hover { background:var(--soft); }
.replay-move-row.is-current {
  border-left:5px solid var(--deep);
  padding-left:8px;
  background:#e7f2ec;
  font-weight:900;
}
.replay-move-row.is-termination { color:var(--muted); background:#f7f5ef; cursor:default; }
button:disabled { cursor:not-allowed; opacity:.55; }

@media (max-width:1000px) {
  .replay-layout { grid-template-columns:1fr; }
  .replay-move-list { max-height:340px; }
}
@media (max-width:800px) {
  .shogi-replay-panel { padding:20px 14px; }
  .replay-heading { gap:14px; }
  .replay-board-shell { width:100%; }
  .shogi-board { padding:7px 7px 10px; }
  .replay-piece { width:78%; height:80%; font-size:clamp(.84rem,6.1vw,1.5rem); }
  .replay-file-label-row { padding-right:14px; }
  .replay-rank-label { right:-13px; font-size:.62rem; }
  .replay-navigation { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .replay-jump-controls { grid-template-columns:1fr; }
  .replay-jump-controls .secondary-button { width:100%; }
  .replay-status { display:grid; }
  .replay-build-status { margin-left:0; }
  .replay-hand { align-items:flex-start; flex-direction:column; }
  .replay-hand > div { justify-content:flex-start; }
}

/* Ver.1.3: 棋譜再現盤・重要局面登録接続 */
.key-position-connect-panel {
  display:grid;
  grid-template-columns:minmax(0,1fr) max-content;
  gap:12px 18px;
  align-items:center;
  margin-top:16px;
  padding:18px;
  border:2px solid #9ebfaf;
  border-radius:14px;
  background:#edf6f1;
}
.key-position-connect-panel h3,.key-position-connect-panel p { margin:3px 0; }
.add-current-position-reason { grid-column:1 / -1; padding-top:9px; border-top:1px solid #b9d4c7; color:var(--muted); }
.add-current-position-reason[data-kind="success"] { color:#24513d; font-weight:800; }
.add-current-position-reason[data-kind="warning"] { color:#795716; font-weight:800; }
.add-current-position-reason[data-kind="error"] { color:var(--danger); font-weight:800; }
.key-position-origin { margin:4px 0 0; font-size:.78rem; font-weight:800; color:var(--muted); }
.key-position-auto-fields { padding:12px; border:1px solid #a9c8ba; border-radius:12px; background:#f2f8f5; }
.key-position-card label small { display:block; margin:3px 0 5px; color:var(--muted); font-size:.72rem; }
.key-position-snapshot { margin:14px 0; border:1px solid var(--line); border-radius:12px; background:#faf8f3; overflow:hidden; }
.key-position-snapshot summary { cursor:pointer; padding:12px 14px; font-weight:900; }
.snapshot-preview { padding:0 14px 14px; }
.snapshot-meta { display:flex; flex-wrap:wrap; gap:7px 14px; padding:10px 0; }
.snapshot-warning { padding:9px 11px; border:1px solid #d8bd79; border-radius:8px; background:#fff8e8; }
.snapshot-board { display:grid; grid-template-columns:repeat(9,minmax(0,1fr)); width:min(100%,380px); aspect-ratio:1; margin:8px auto; border-top:1px solid #74522c; border-left:1px solid #74522c; background:#e1b96f; }
.snapshot-square { position:relative; display:grid; place-items:center; border-right:1px solid #74522c; border-bottom:1px solid #74522c; min-width:0; }
.snapshot-square.is-last-from::before { content:""; position:absolute; inset:3px; border:1px dashed #365f4b; }
.snapshot-square.is-last-to::after { content:""; position:absolute; inset:1px; border:2px solid #85382e; }
.snapshot-piece { z-index:2; font-family:"Yu Mincho","Hiragino Mincho ProN",serif; font-weight:900; font-size:clamp(.65rem,2.7vw,1.15rem); }
.snapshot-piece.is-rotated { transform:rotate(180deg); }
.snapshot-piece.is-promoted { color:#9a2f25; }
.snapshot-hand { padding:7px 10px; border-radius:8px; background:#f3ddb0; font-size:.82rem; }
@media (max-width:800px) {
  .key-position-connect-panel { grid-template-columns:1fr; }
  .key-position-connect-panel .primary-button { width:100%; }
  .add-current-position-reason { grid-column:auto; }
  .key-position-auto-fields { grid-template-columns:1fr; }
}

/* Ver.1.3.2: Replay UX / Page Scroll と Move List Scroll の分離 */
.replay-navigation .primary-button,
.replay-navigation .secondary-button {
  min-height:48px;
  touch-action:manipulation;
}
.replay-move-list {
  scrollbar-gutter:stable;
  scroll-behavior:auto;
}
.replay-move-row[aria-current="true"] {
  box-shadow:inset 0 0 0 1px rgba(49,89,72,.22);
}
@media (max-width:800px) {
  .shogi-replay-panel { padding:16px 10px; }
  .replay-layout { gap:16px; }
  .replay-board-shell { gap:7px; }
  .shogi-board { border-width:3px; padding:5px 5px 7px; }
  .replay-hand {
    min-height:46px;
    padding:7px 9px;
    align-items:center;
    flex-direction:row;
    font-size:.82rem;
  }
  .replay-hand > div { justify-content:flex-end; gap:5px; }
  .replay-hand-piece { min-width:30px; padding:3px 5px; }
  .replay-navigation {
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:6px;
    margin-top:12px;
  }
  .replay-navigation .primary-button,
  .replay-navigation .secondary-button {
    min-height:48px;
    padding:8px 4px;
    font-size:.82rem;
  }
  .replay-move-list { max-height:min(46vh,320px); }
}
@media (max-width:430px) {
  .replay-navigation { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .replay-navigation .replay-flip-button { grid-column:span 2; }
}
@media (max-width:350px) {
  .replay-navigation { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .replay-navigation .replay-flip-button { grid-column:auto; }
}
.shogi-replay-panel {
  overflow-anchor:none;
}

/* Ver.1.3.3: KIF入力やり直し・スマートフォン操作 */
.kif-paste-actions button { min-height:46px; }
@media (max-width:800px) {
  .kif-paste-actions button,
  .kif-apply-row .button-cluster button { min-height:48px; width:100%; }
  .kif-apply-row .button-cluster { display:grid; grid-template-columns:1fr; width:100%; }
}

/* Ver.1.4: Step Workflow / Saved Game Viewer / Help */
[hidden] { display:none !important; }
.header-side { display:grid; gap:12px; }
.global-nav { display:grid; grid-template-columns:1fr; gap:8px; }
.header-button { min-height:44px; border:1px solid rgba(255,255,255,.28); border-radius:10px; background:rgba(255,255,255,.1); color:#fff; font-weight:800; }
.header-button:hover { background:rgba(255,255,255,.18); }
.application-view { scroll-margin-top:12px; }
.step-navigation { position:sticky; top:8px; z-index:8; display:grid; gap:12px; padding:16px 18px; margin-bottom:20px; border:1px solid var(--line); border-radius:16px; background:rgba(255,253,248,.96); box-shadow:0 8px 24px rgba(52,45,33,.08); backdrop-filter:blur(8px); }
.step-status-row { display:flex; justify-content:space-between; gap:16px; align-items:center; }
.step-status-row label { display:flex; align-items:center; gap:8px; margin:0; font-size:.82rem; }
.step-status-row select { min-width:190px; padding:7px 10px; }
.step-navigation progress { width:100%; height:9px; accent-color:var(--deep); }
.step-nav-buttons { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.step-nav-buttons button { min-height:48px; }
.step-panel { scroll-margin-top:130px; }
.context-help { display:inline-flex; min-height:44px; align-items:center; padding:8px 12px; border-radius:10px; color:#2f5a49; background:#edf6f1; font-weight:800; text-decoration:none; }
.step-action-panel { display:flex; justify-content:space-between; align-items:center; gap:20px; margin-top:22px; padding:18px; border:1px solid #a9c8ba; border-radius:14px; background:#f2f8f5; }
.step-action-panel p { margin:4px 0 0; color:var(--muted); }
.completion-actions { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin:18px 0; }
.final-report-preview { display:grid; gap:12px; }
.final-report-summary,.final-report-block,.final-key-position,.final-kifu { padding:16px; border:1px solid var(--line); border-radius:12px; background:#fff; }
.final-report-summary { display:flex; flex-wrap:wrap; gap:10px 18px; }
.final-report-block h3 { margin-top:0; }
.final-key-position { margin-top:10px; background:#faf8f3; }
.help-view,.manual-content { display:grid; gap:18px; }
.help-view { padding:30px; border:1px solid var(--line); border-radius:18px; background:var(--paper); box-shadow:var(--shadow); }
.help-toc { display:flex; flex-wrap:wrap; gap:8px; }
.help-toc a { padding:8px 10px; border-radius:999px; background:var(--soft); color:var(--ink); text-decoration:none; font-weight:700; }
.manual-content section { scroll-margin-top:18px; padding:18px; border:1px solid var(--line); border-radius:12px; background:#fff; }
.manual-content h3 { margin-top:0; }
.workflow-badge { display:inline-flex; width:max-content; padding:5px 10px; border-radius:999px; font-size:.76rem; font-weight:900; }
.workflow-badge[data-status="GAME_ONLY"] { background:#e8eef5; color:#3d5871; }
.workflow-badge[data-status="REFLECTION_IN_PROGRESS"] { background:#fff2d7; color:#795716; }
.workflow-badge[data-status="REFLECTION_COMPLETE"] { background:#e7f3ec; color:#315f48; }
.review-card-time,.detail-timestamps { color:var(--muted); font-size:.76rem; }

/* Ver.1.4 original SVG shogi pieces. No external image asset. */
.replay-piece,.snapshot-piece { width:78%; height:84%; overflow:visible; transform-origin:center; filter:drop-shadow(0 1px 1px rgba(0,0,0,.18)); }
.replay-piece .piece-body,.snapshot-piece .piece-body { fill:#f2d699; stroke:#5c3c19; stroke-width:3; vector-effect:non-scaling-stroke; }
.replay-piece .piece-label,.snapshot-piece .piece-label { fill:#21180e; font-family:"Yu Mincho","Hiragino Mincho ProN",serif; font-size:43px; font-weight:900; writing-mode:horizontal-tb; }
.replay-piece.is-two-character .piece-label,.snapshot-piece.is-two-character .piece-label { font-size:31px; letter-spacing:-2px; }
.replay-piece.is-promoted .piece-label,.snapshot-piece.is-promoted .piece-label { fill:#8b2f28; }
.piece-promotion-mark { stroke:#8b2f28; stroke-width:5; stroke-linecap:round; }
.replay-piece.is-rotated,.snapshot-piece.is-rotated { transform:rotate(180deg); }
.shogi-board { background:linear-gradient(90deg,#dcb16a,#e4bd78 48%,#d8aa61); }
.replay-square { background:rgba(231,193,121,.84); }
.replay-square.is-last-from::before { border-color:#315f48; border-width:2px; }
.replay-square.is-last-to::after { border-color:#842f28; border-width:3px; }
.snapshot-board { background:#dcb16a; }
.snapshot-square { background:rgba(231,193,121,.84); }

@media (max-width:800px) {
  .app-header { padding:28px 18px; }
  .app-header h1 { font-size:2rem; }
  .header-side { grid-template-columns:90px 1fr; align-items:stretch; }
  .status-card { width:auto; padding:12px; }
  .status-card strong { font-size:2rem; }
  .global-nav { grid-template-columns:1fr; }
  .header-button { min-height:48px; }
  .page-shell { width:min(100% - 18px,1120px); margin-top:14px; }
  .step-navigation { top:4px; padding:12px; border-radius:12px; }
  .step-status-row { display:grid; grid-template-columns:1fr; gap:8px; }
  .step-status-row label { display:grid; grid-template-columns:auto 1fr; }
  .step-status-row select { min-width:0; font-size:16px; }
  .step-nav-buttons { grid-template-columns:1fr 1fr; }
  .step-panel.form-section,.help-view,.library-panel { padding:18px 14px; }
  .step-action-panel { flex-direction:column; align-items:stretch; }
  .step-action-panel button,.completion-actions button { min-height:48px; width:100%; }
  .completion-actions { grid-template-columns:1fr; }
  .context-help { min-height:48px; justify-content:center; }
  .shogi-board { max-width:100%; }
  .replay-piece { width:84%; height:88%; }
  .replay-piece .piece-label { font-size:45px; }
  .replay-piece.is-two-character .piece-label { font-size:29px; }
  .snapshot-piece { width:82%; height:86%; }
  .snapshot-piece .piece-label { font-size:40px; }
  .snapshot-piece.is-two-character .piece-label { font-size:27px; }
  .review-actions .primary-button,.review-actions .secondary-button,.review-actions .danger-button { min-height:44px; flex:1 1 130px; }
}

/* Ver.1.4.1: Fixed 9x9 Board Grid / Piece containment / Saved Game summary */
.replay-board-grid,
.snapshot-board {
  grid-template-columns:repeat(9,minmax(0,1fr));
  grid-template-rows:repeat(9,minmax(0,1fr));
  grid-auto-columns:minmax(0,1fr);
  grid-auto-rows:minmax(0,1fr);
  aspect-ratio:1 / 1;
  overflow:hidden;
  contain:layout paint;
}
.replay-square,
.snapshot-square {
  box-sizing:border-box;
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  overflow:hidden;
  contain:layout paint;
}
.replay-piece-container,
.snapshot-piece-container {
  position:relative;
  z-index:2;
  display:grid;
  place-items:center;
  width:82%;
  height:88%;
  min-width:0;
  min-height:0;
  overflow:hidden;
  pointer-events:none;
}
.replay-piece,
.snapshot-piece {
  display:block;
  width:100%;
  height:100%;
  max-width:100%;
  max-height:100%;
  overflow:hidden;
  transform-origin:50% 50%;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.18));
}
.replay-piece .piece-label,
.snapshot-piece .piece-label {
  font-size:42px;
  letter-spacing:0;
}
.replay-piece.is-two-character .piece-label,
.snapshot-piece.is-two-character .piece-label {
  font-size:29px;
  letter-spacing:-1.5px;
}
.replay-piece.is-成桂 .piece-label,
.snapshot-piece.is-成桂 .piece-label,
.replay-piece.is-成香 .piece-label,
.snapshot-piece.is-成香 .piece-label,
.replay-piece.is-成銀 .piece-label,
.snapshot-piece.is-成銀 .piece-label {
  font-size:28px;
  font-weight:900;
}
.review-card-summary {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:5px 12px;
  color:var(--ink);
  font-size:.86rem;
}
.review-card-date { font-weight:900; color:#4f5b52; }
@media (max-width:800px) {
  .replay-piece-container { width:86%; height:90%; }
  .snapshot-piece-container { width:84%; height:88%; }
  .replay-piece .piece-label { font-size:42px; }
  .replay-piece.is-two-character .piece-label { font-size:28px; }
  .snapshot-piece .piece-label { font-size:39px; }
  .snapshot-piece.is-two-character .piece-label { font-size:27px; }
  .review-card-summary { grid-template-columns:1fr 1fr; }
}

/* Ver.1.6 Engine Analysis: board geometry is intentionally untouched. */
.engine-analysis-panel {
  margin: 0 0 20px;
  padding: 18px;
  border: 1px solid var(--line-color, #d8d0bf);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.72);
}
.engine-analysis-heading,
.engine-candidate-heading {
  display: flex;
  justify-content: space-between;
  gap: 14px;
  align-items: flex-start;
}
.engine-analysis-heading h3,
.engine-candidate-heading h4 { margin: 2px 0 6px; }
.engine-analysis-state {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin: 12px 0 6px;
}
.engine-analysis-state progress { width: min(320px, 100%); min-height: 18px; }
.engine-analysis-metadata { font-size: 0.88rem; opacity: 0.82; overflow-wrap: anywhere; }
.engine-analysis-candidates { display: grid; gap: 12px; margin-top: 14px; }
.engine-candidate-card {
  border: 1px solid var(--line-color, #d8d0bf);
  border-radius: 12px;
  padding: 14px;
  background: var(--panel-background, #fffdf8);
}
.engine-candidate-badge {
  display: inline-flex;
  min-height: 32px;
  align-items: center;
  padding: 4px 9px;
  border: 1px solid currentColor;
  border-radius: 999px;
  font-size: 0.78rem;
  white-space: nowrap;
}
.engine-candidate-data { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px 14px; margin: 10px 0; }
.engine-candidate-data div { display: grid; grid-template-columns: 6.5em minmax(0, 1fr); gap: 6px; }
.engine-candidate-data dt { font-weight: 700; }
.engine-candidate-data dd { margin: 0; overflow-wrap: anywhere; }
.engine-candidate-caution { font-size: 0.84rem; opacity: 0.82; }
.engine-multipv, .engine-other-candidates { margin: 10px 0; }
.engine-multipv summary, .engine-other-candidates summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; }
@media (max-width: 520px) {
  .engine-analysis-heading, .engine-candidate-heading { flex-direction: column; }
  .engine-analysis-heading .button-cluster, .engine-candidate-card .button-cluster { width: 100%; }
  .engine-analysis-heading button, .engine-candidate-card button { min-height: 44px; flex: 1 1 auto; }
  .engine-candidate-data { grid-template-columns: 1fr; }
}

/* Ver.1.7: Engine-first review flow + polished original SVG pieces.
   Fixed Grid geometry above is intentionally unchanged. */
.engine-analysis-panel {
  margin: 0 0 20px;
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(250,247,239,.92));
  border-color: #cfc3ad;
  box-shadow: 0 8px 24px rgba(54, 42, 26, .06);
}
.engine-analysis-state-label {
  font-size: .78rem;
  font-weight: 900;
  color: var(--muted);
}
.engine-analysis-status[data-status="ANALYZING"] { color: #6f531b; }
#engine-analysis-status[data-status="ANALYZED"] { color: #315f48; }
#engine-analysis-status[data-status="FAILED"] { color: #8b2f28; }
.engine-candidate-section { margin-top: 14px; }
.engine-candidate-list-heading { display:flex; justify-content:space-between; align-items:baseline; gap:12px; }
.engine-candidate-list-heading h4 { margin:0; }
.engine-candidate-list-heading p { margin:0; color:var(--muted); font-size:.86rem; }
.analysis-status-badge {
  display:inline-flex;
  width:max-content;
  min-height:28px;
  align-items:center;
  padding:3px 9px;
  border-radius:999px;
  background:#f1eee7;
  color:#61584d;
  font-size:.76rem;
  font-weight:800;
}
.analysis-status-badge[data-analysis-status="ANALYZED"] { background:#e7f3ec; color:#315f48; }

.replay-piece .piece-body,
.snapshot-piece .piece-body {
  fill:#edcf8b;
  stroke:#6f5737;
  stroke-width:1.35;
  stroke-linejoin:round;
  vector-effect:non-scaling-stroke;
}
.replay-piece .piece-face-highlight,
.snapshot-piece .piece-face-highlight {
  fill:none;
  stroke:rgba(255,255,255,.48);
  stroke-width:1.15;
  stroke-linecap:round;
  vector-effect:non-scaling-stroke;
}
.replay-piece,
.snapshot-piece {
  filter:drop-shadow(0 1.2px 1.3px rgba(55,39,19,.22));
}
.replay-piece .piece-label,
.snapshot-piece .piece-label {
  fill:#241b12;
  font-family:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif CJK JP","Noto Serif JP",serif;
  font-size:44px;
  font-weight:800;
  letter-spacing:0;
}
.replay-piece .piece-label-stacked,
.snapshot-piece .piece-label-stacked,
.replay-piece.is-two-character .piece-label,
.snapshot-piece.is-two-character .piece-label {
  font-size:27px;
  letter-spacing:0;
}
.replay-piece.is-成桂 .piece-label,
.snapshot-piece.is-成桂 .piece-label,
.replay-piece.is-成香 .piece-label,
.snapshot-piece.is-成香 .piece-label,
.replay-piece.is-成銀 .piece-label,
.snapshot-piece.is-成銀 .piece-label {
  font-size:27px;
  font-weight:800;
}
.replay-piece.is-promoted .piece-label,
.snapshot-piece.is-promoted .piece-label { fill:#8b2f28; }

@media (max-width:520px) {
  .engine-analysis-panel { padding:14px 12px; }
  .engine-candidate-list-heading { display:grid; gap:4px; }
  .engine-analysis-state { display:grid; grid-template-columns:auto 1fr; align-items:center; }
  .engine-analysis-state progress,
  #engine-analysis-progress-text { grid-column:1 / -1; width:100%; }
  .engine-candidate-card { padding:12px; }
  .engine-candidate-card .button-cluster { display:grid; grid-template-columns:1fr; }
  .engine-candidate-card button,
  #analyze-game,
  #cancel-analysis { min-height:48px; }
  .replay-piece .piece-label { font-size:42px; }
  .replay-piece .piece-label-stacked,
  .replay-piece.is-two-character .piece-label { font-size:26px; }
  .snapshot-piece .piece-label { font-size:39px; }
  .snapshot-piece .piece-label-stacked,
  .snapshot-piece.is-two-character .piece-label { font-size:25px; }
}
/* Keep Replay feedback height stable so Engine Candidate actions do not trigger scroll anchoring. */
.add-current-position-reason { min-height:3.6em; box-sizing:border-box; }
@media (max-width:520px) { .add-current-position-reason { min-height:4.8em; } }
/* Ver.1.7 final scroll-anchor guard: keep Replay feedback footprint constant. */
.add-current-position-reason { height:5.6em; min-height:5.6em; overflow-y:auto; overflow-anchor:none; }
@media (max-width:520px) { .add-current-position-reason { height:6.2em; min-height:6.2em; } }

/* Ver.1.8 formal Candidate -> Replay scroll exception.
   Ordinary Replay navigation never scrolls the Browser page; only the explicit Candidate action
   calls BrowserShogiReplayView.scrollIntoView(). The sticky STEP navigation height is also
   measured in JavaScript so the board is not hidden behind it on narrow screens. */
.replay-board-shell { scroll-margin-top: 150px; }
.engine-candidate-group { display:grid; gap:10px; padding-top:4px; }
.engine-candidate-group + .engine-candidate-group { margin-top:18px; padding-top:18px; border-top:1px solid var(--line-color, #d8d0bf); }
.engine-candidate-group-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }
.engine-candidate-group-heading h4 { margin:0; }
.engine-candidate-group-heading span { font-size:.78rem; font-weight:800; opacity:.72; }
.engine-candidate-group-description { margin:0; color:var(--muted); font-size:.86rem; }
.engine-candidate-group-list { display:grid; gap:12px; }
.engine-candidate-reasons { margin:8px 0; padding-left:1.25rem; font-size:.86rem; }
.engine-candidate-pv { grid-column:1 / -1; }
@media (max-width:430px) {
  .replay-board-shell { scroll-margin-top: 170px; }
  .engine-candidate-group-heading { align-items:flex-start; }
}

/* Ver.1.8.2 Evaluation Graph: SVG keeps the graph dependency-free and responsive. */
.engine-graph-section{margin-top:1rem;padding-top:1rem;border-top:1px solid var(--border-color,#d8d2c4)}
.engine-evaluation-graph-shell{display:grid;gap:.65rem}
.engine-graph-heading-row{display:flex;align-items:flex-start;justify-content:space-between;gap:.75rem}
.engine-graph-heading-row h4,.engine-graph-heading-row p{margin:.1rem 0}
.engine-graph-perspective{white-space:nowrap;font-size:.78rem;border:1px solid currentColor;border-radius:999px;padding:.2rem .55rem}
.engine-graph-scroll{width:100%;overflow-x:auto;overscroll-behavior-inline:contain;border:1px solid var(--border-color,#d8d2c4);border-radius:.7rem;background:var(--surface,#fff)}
.engine-evaluation-graph{display:block;width:100%;min-width:620px;height:auto;touch-action:pan-x pan-y}
.engine-graph-axis,.engine-graph-grid{stroke:currentColor;stroke-opacity:.25;stroke-width:1}
.engine-graph-grid.zero{stroke-opacity:.42;stroke-dasharray:5 5}
.engine-graph-line{stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;opacity:.8}
.engine-graph-axis-label{font-size:12px;fill:currentColor;opacity:.65}
.engine-graph-point circle{fill:currentColor;stroke:var(--surface,#fff);stroke-width:1.5;opacity:.5}
.engine-graph-point[role="button"]{cursor:pointer}
.engine-graph-point[role="button"] circle{opacity:1;stroke-width:2}
.engine-graph-point.is-good circle{fill:#20734a}
.engine-graph-point.is-bad circle{fill:#a13d32}
.engine-graph-point.is-mate circle{fill:#66449b;stroke-width:2.5}
.engine-graph-point.is-key-position circle{fill:#1d5f8f}
.engine-graph-key-halo{fill:none;stroke:#1d5f8f;stroke-width:2.5;transform-box:fill-box;transform-origin:center;transform:rotate(45deg)}
.engine-graph-point:focus{outline:none}
.engine-graph-point:focus circle,.engine-graph-point:focus .engine-graph-key-halo{stroke:#000;stroke-width:3}
.engine-graph-legend{display:flex;flex-wrap:wrap;gap:.45rem .8rem;font-size:.8rem}
.engine-graph-legend span{display:inline-flex;align-items:center;gap:.3rem}
.legend-dot{display:inline-block;width:.65rem;height:.65rem;border-radius:50%;background:currentColor}
.legend-dot.good{background:#20734a}.legend-dot.bad{background:#a13d32}.legend-dot.key{background:#1d5f8f;border-radius:2px}.legend-dot.mate{background:#66449b}
.engine-graph-note{margin:0;font-size:.78rem;opacity:.75}
@media (max-width:430px){
  .engine-graph-heading-row{display:grid}
  .engine-graph-perspective{justify-self:start}
  .engine-evaluation-graph{min-width:560px}
  .engine-graph-scroll{max-width:100%;-webkit-overflow-scrolling:touch}
}

/* Ver.1.8.5 Phase 3: Engine PV Replay is visually distinct from the real game replay. */
.replay-mode-banner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin: 12px 0;
  padding: 12px 14px;
  border: 1px solid var(--line-color, #d8d0bf);
  border-radius: 12px;
  background: var(--panel-soft, rgba(255,255,255,.5));
}
.replay-mode-banner[hidden] { display: none; }
.replay-mode-banner strong { display: block; }
.replay-mode-banner p { margin: 4px 0 0; color: var(--muted); font-size: .86rem; }
@media (max-width: 430px) {
  .replay-mode-banner { align-items: stretch; flex-direction: column; }
  .replay-mode-banner button { width: 100%; min-height: 44px; }
}


/* Ver.1.8.5 Phase 4: clean piece exterior.
   The SVG canvas itself is fully transparent; only the actual pentagonal piece body is painted. */
.replay-piece,
.snapshot-piece {
  background: transparent !important;
  border: 0 !important;
  clip-path: none !important;
  filter: none !important;
  box-shadow: none !important;
}
.replay-piece .piece-face-highlight,
.snapshot-piece .piece-face-highlight { display:none !important; }

/* Ver.1.8.5 Phase 4: Candidate notation stays readable around 390px without leaking raw USI. */
.engine-candidate-data dd,
.engine-multipv li,
.engine-candidate-pv dd { overflow-wrap:anywhere; word-break:normal; }
.engine-candidate-pv dd { line-height:1.55; }
@media (max-width:430px) {
  .engine-candidate-data { grid-template-columns:1fr; }
  .engine-candidate-data > div { grid-template-columns:minmax(6.5rem,auto) 1fr; }
  .engine-candidate-pv { grid-column:auto; }
  .engine-candidate-card .button-cluster { gap:8px; }
}


/* Ver.1.8.5 RC2: explicit Candidate/PV return paths below the Replay board. */
.replay-origin-actions { display: grid; gap: 10px; }
.replay-origin-action-button { width: 100%; min-height: 48px; margin-top: 10px; }
@media (min-width: 700px) {
  .replay-origin-actions { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* Step16-N: Daily Entry UX Minimum. UI-only; no schema/storage/engine changes. */
.daily-entry-heading { margin-bottom:10px; }
.daily-help-details { margin:0 0 12px; border:1px solid #d9e8df; border-radius:12px; background:#f5faf7; }
.daily-help-details > summary { cursor:pointer; list-style:none; min-height:44px; display:flex; align-items:center; justify-content:center; padding:8px 12px; color:#2f5a49; font-weight:800; }
.daily-help-details > summary::-webkit-details-marker { display:none; }
.daily-help-body { padding:0 14px 12px; color:var(--muted); font-size:.92rem; }
.daily-help-body p { margin:6px 0 0; }
.daily-entry-flow { display:grid; gap:14px; padding:18px; border:1px solid var(--line); border-radius:16px; background:#fff; }
.daily-entry-step { display:flex; gap:12px; align-items:flex-start; }
.daily-entry-step p { margin:2px 0 0; color:var(--muted); font-size:.88rem; }
.daily-entry-number { display:grid; place-items:center; flex:0 0 32px; width:32px; height:32px; border-radius:999px; background:#e7f3ec; color:#315f48; font-weight:900; }
.daily-entry-textarea { min-height:220px; margin:0; font-size:16px; }
.daily-side-step > div { flex:1; }
.daily-side-buttons { display:grid; grid-template-columns:1fr 1fr; gap:10px; margin-top:8px; }
.daily-side-button { min-height:52px; border:1px solid #b9b0a1; border-radius:12px; background:#f7f5ef; color:var(--ink); font-weight:900; font-size:1.05rem; }
.daily-side-button[aria-pressed="true"] { border-color:#345e4e; background:#e7f3ec; color:#234a39; box-shadow:0 0 0 2px rgba(52,94,78,.12); }
.daily-register-button { min-height:56px; font-size:1.12rem; }
.daily-entry-status { margin-top:0; }
.kif-advanced-details,.game-info-details { margin-top:14px; border:1px solid var(--line); border-radius:14px; background:#faf8f3; overflow:hidden; }
.kif-advanced-details > summary,.game-info-details > summary { cursor:pointer; padding:14px 16px; font-weight:850; color:#4f4a42; }
.kif-advanced-details[open] > summary,.game-info-details[open] > summary { border-bottom:1px solid var(--line); background:#f0ede6; }
.kif-advanced-details > :not(summary),.game-info-details > :not(summary) { margin-left:16px; margin-right:16px; }
.kif-advanced-details .kif-import-controls { margin-top:16px; }
.kif-advanced-details .kif-paste-actions { margin-bottom:16px; }
.game-info-details .field-grid { margin-top:18px; }
.game-info-details .step-action-panel { margin-bottom:18px; }
.daily-next-action { display:flex; justify-content:space-between; align-items:center; gap:18px; padding:18px; margin-bottom:14px; border:1px solid #9ebfaf; border-radius:14px; background:#edf6f1; }
.daily-next-action p { margin:3px 0 0; color:var(--muted); }
.daily-next-action .primary-button { flex:0 0 auto; min-width:180px; min-height:52px; }
@media (max-width:800px) {
  .kif-import-panel { padding:18px; }
  .daily-entry-heading .context-help { width:max-content; min-height:40px; }
  .daily-entry-flow { padding:14px; gap:12px; }
  .daily-entry-textarea { min-height:260px; }
  .daily-register-button { width:100%; }
  .daily-next-action { align-items:stretch; flex-direction:column; }
  .daily-next-action .primary-button { width:100%; min-width:0; }
  .kif-advanced-details > :not(summary),.game-info-details > :not(summary) { margin-left:12px; margin-right:12px; }
}
/* Step16-P: Final Report UX Minimum */
.review-optional-details{margin-top:14px;border:1px solid var(--line);border-radius:14px;background:#faf8f3;overflow:hidden}
.review-optional-details>summary{cursor:pointer;padding:14px 16px;font-weight:850;color:#4f4a42}
.review-optional-details[open]>summary{border-bottom:1px solid var(--line);background:#f0ede6}
.review-optional-details>:not(summary){margin-left:16px;margin-right:16px}
.review-optional-details>.observation-grid,.review-optional-details>.field-grid{margin-top:16px}
.review-optional-details>label{display:block;margin-top:16px}
.review-optional-details>label:last-child,.review-optional-details>.field-grid:last-child{margin-bottom:16px}
.final-report-details{margin-bottom:14px}
@media(max-width:600px){.review-optional-details>:not(summary){margin-left:12px;margin-right:12px}}

/* R9 RC2: fit the full evaluation graph inside an iPhone viewport.
   Graph data, SVG viewBox and marker interaction remain unchanged. */
@media (max-width: 699px) {
  .engine-graph-scroll {
    width: 100%;
    overflow-x: hidden;
  }

  .engine-evaluation-graph {
    display: block;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    height: auto;
  }
}