/* YYSI AI toolbox batches 5-7: structured-result UIs (tables, cards, quizzes,
 * mind maps, plans). Scoped under .b57 to stay independent of tools.css. */
.b57{margin-top:4px}
.b57 .b57-head{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:14px 0 10px}
.b57 .b57-head .spacer{flex:1}
.b57-chip{display:inline-block;font-size:11px;font-weight:700;padding:3px 9px;border-radius:20px;background:var(--mint);border:1px solid #cfe0bd;color:#3c5a2a;vertical-align:middle}
.b57-chip.warn{background:#f7ece9;border-color:#e5cfc8;color:var(--warn)}
.b57-chip.muted{background:var(--paper);border-color:var(--line);color:var(--muted);font-weight:600}
.b57-note{font-size:12.5px;color:var(--muted);margin:8px 0;line-height:1.6}
.b57-grid-wrap{overflow:auto;border:1px solid var(--line);border-radius:9px;background:#fff;max-height:480px}
.b57-grid{border-collapse:collapse;font-size:13px;min-width:100%}
.b57-grid th,.b57-grid td{border:1px solid #e4e9de;padding:7px 9px;text-align:left;vertical-align:top;min-width:90px}
.b57-grid th{background:var(--paper);position:sticky;top:0;z-index:1;font-size:12px}
.b57-grid td[contenteditable=true]:focus{outline:2px solid #678b3e;outline-offset:-2px;background:#fbfdf7}
.b57-grid .cell-uncertain{background:#fdf6e3}
.b57-grid .cell-uncertain::after{content:" ?";color:#b8860b;font-weight:700}
.b57-rowlabel{background:var(--paper);color:var(--muted);font-size:11px;text-align:center;min-width:34px}
.b57-img-compare{display:flex;gap:14px;align-items:flex-start;margin-bottom:12px}
@media (max-width:760px){.b57-img-compare{flex-direction:column}}
.b57-img-compare img{max-width:280px;max-height:300px;border:1px solid var(--line);border-radius:8px;background:repeating-conic-gradient(#eef1e9 0 25%,#fff 0 50%) 0 0/14px 14px;object-fit:contain}
.b57-img-compare figcaption{font-size:11.5px;color:var(--muted);margin-top:4px}
.b57-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:12px}
.b57-card{border:1px solid var(--line);border-radius:9px;background:#fff;padding:12px}
.b57-card .fc-front{font-weight:700;font-size:14px}
.b57-card .fc-back{margin-top:8px;font-size:13px;color:#4a5850;border-top:1px dashed var(--line);padding-top:8px}
.b57-card textarea{width:100%;border:1px solid #d7dfd0;border-radius:6px;font:13px/1.5 inherit;padding:6px;resize:vertical}
.b57-card .fc-ref{margin-top:6px;font-size:11px;color:var(--muted)}
.b57-card .fc-del{margin-top:8px}
.b57-answer{border:1px solid #cfe0bd;background:var(--mint);border-radius:9px;padding:14px;font-size:14.5px;line-height:1.7;white-space:pre-wrap}
.b57-cite{border-left:3px solid #678b3e;background:var(--paper);border-radius:0 8px 8px 0;padding:9px 12px;margin-top:9px;font-size:12.5px}
.b57-cite .c-page{font-weight:700;color:#3c5a2a;margin-right:8px;cursor:pointer;text-decoration:underline dotted}
.b57-cite .c-quote{color:#4a5850;font-style:italic}
.b57-points{margin:8px 0 0;padding-left:20px;font-size:13.5px}
.b57-points li{margin-bottom:5px}
.b57-page-ref{font-size:11px;color:#3c5a2a;background:var(--mint);border-radius:10px;padding:1px 8px;margin-left:6px;white-space:nowrap}
.b57-seg{border:1px solid var(--line);border-radius:9px;background:#fff;margin-bottom:10px;padding:12px}
.b57-seg .seg-src,.b57-seg .seg-dst{font-size:13.5px;line-height:1.7;white-space:pre-wrap}
.b57-seg .seg-src{color:var(--muted)}
.b57-seg .seg-dst{margin-top:8px}
.b57-kv{display:flex;gap:10px;font-size:13.5px;padding:5px 0;border-bottom:1px dashed var(--line)}
.b57-kv .b57-kv-k{flex:0 0 130px;color:var(--muted);font-size:12px;text-transform:uppercase;letter-spacing:.04em;padding-top:2px}
.b57-kv .b57-kv-v{font-weight:650;overflow-wrap:anywhere}
.b57-quiz-q{border:1px solid var(--line);border-radius:9px;background:#fff;padding:14px;margin-bottom:12px}
.b57-quiz-q .q-text{font-weight:650;font-size:14px}
.b57-quiz-q .q-opts{margin-top:10px;display:flex;flex-direction:column;gap:7px}
.b57-quiz-q .q-opt{display:flex;gap:9px;align-items:flex-start;border:1px solid var(--line);border-radius:7px;padding:8px 10px;font-size:13.5px;cursor:pointer;background:var(--paper)}
.b57-quiz-q .q-opt:hover{border-color:#678b3e}
.b57-quiz-q .q-opt.sel{border-color:#56863e;background:var(--lime)}
.b57-quiz-q .q-opt.correct{border-color:#3c5a2a;background:#e2f0d2}
.b57-quiz-q .q-opt.wrong{border-color:var(--warn);background:#f7ece9}
.b57-quiz-q .q-input{margin-top:10px;width:100%;padding:9px 10px;border:1px solid #b9c8ac;border-radius:7px}
.b57-quiz-q .q-exp{margin-top:9px;font-size:12.5px;color:#4a5850;border-top:1px dashed var(--line);padding-top:8px}
.b57-quiz-q .q-ref{font-size:11px;color:var(--muted)}
.b57-score{font-size:16px;font-weight:800;margin:6px 0}
.b57-diff-hunk{border:1px solid var(--line);border-radius:9px;background:#fff;padding:12px;margin-bottom:10px}
.b57-diff-hunk .h-id{font-weight:800;color:#3c5a2a;font-size:12px;margin-right:8px}
.b57-diff-hunk .h-old,.b57-diff-hunk .h-new{font-size:12.5px;padding:6px 9px;border-radius:6px;margin-top:6px;white-space:pre-wrap;overflow-wrap:anywhere}
.b57-diff-hunk .h-old{background:#f9efec;color:#7a4a3d}
.b57-diff-hunk .h-new{background:#eef6e3;color:#3c5a2a}
.b57-map{border:1px solid var(--line);border-radius:9px;background:#fff;padding:12px;overflow:auto}
.b57-map svg{display:block;margin:0 auto}
.b57-plan-day{margin-bottom:10px}
.b57-plan-day .pd-date{font-weight:750;font-size:13px;color:#3c5a2a}
.b57-plan-task{display:flex;gap:10px;align-items:baseline;border-bottom:1px dashed var(--line);padding:6px 0;font-size:13.5px}
.b57-plan-task .pt-h{flex:0 0 auto;font-size:11.5px;color:var(--muted);font-weight:700}
.b57-statusbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:10px 0}
.b57-preview{border:1px solid var(--line);border-radius:9px;background:var(--paper);padding:12px;font-size:12.5px;max-height:200px;overflow:auto;white-space:pre-wrap;margin-top:8px}
.b57-warnline{padding:9px 12px;background:#fdf6e3;border:1px solid #e8d9a8;border-radius:8px;color:#7a5c10;font-size:12.5px;margin:8px 0}
.b57-lens{font-size:11.5px;color:var(--muted)}
.b57 textarea.b57-ta{width:100%;padding:11px;border:1px solid #b9c8ac;border-radius:8px;background:#fff;color:var(--ink);font:14px/1.6 inherit;resize:vertical}
.b57 textarea.b57-ta:focus{outline:2px solid #678b3e;outline-offset:1px}