:root { --ink:#17201d; --muted:#5c6863; --line:#cbd3cf; --paper:#f6f7f5; --panel:#fff; --accent:#175f51; --danger:#8b2e2e; --soft:#e8efec; font-family:Arial,Helvetica,sans-serif; color:var(--ink); background:var(--paper); }
* { box-sizing:border-box; }
body { margin:0; min-width:0; }
button,input,select,textarea { font:inherit; }
button { border:1px solid var(--accent); background:var(--accent); color:white; border-radius:4px; padding:.58rem .8rem; cursor:pointer; }
button:hover { filter:brightness(.92); }
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible { outline:3px solid #7eb9ad; outline-offset:2px; }
button:disabled { opacity:.5; cursor:not-allowed; }
button.danger { background:white; color:var(--danger); border-color:var(--danger); }
.topbar { display:flex; gap:1rem; align-items:flex-start; justify-content:space-between; padding:1.5rem clamp(1rem,4vw,3rem); background:#102b25; color:white; }
h1,h2,h3,p { margin-top:0; }
h1 { margin-bottom:.25rem; font-size:clamp(1.55rem,4vw,2.25rem); }
h2 { font-size:1.2rem; margin-bottom:.75rem; }
h3 { font-size:1rem; margin-bottom:.35rem; }
.lede { max-width:60rem; margin-bottom:0; color:#d9e7e2; }
.eyebrow { margin:0 0 .28rem; font-size:.72rem; font-weight:bold; letter-spacing:.11em; text-transform:uppercase; color:#4e756c; }
.topbar .eyebrow { color:#9dc9bf; }
.top-actions,.button-row { display:flex; flex-wrap:wrap; gap:.5rem; }
main { width:min(1440px,100%); margin:0 auto; padding:1rem; }
.notice { padding:.8rem 1rem; border-left:4px solid #9a6b14; background:#fff8e8; margin-bottom:1rem; line-height:1.45; }
.panel { min-width:0; background:var(--panel); border:1px solid var(--line); border-radius:6px; padding:1rem; margin-bottom:1rem; }
.project-bar { display:grid; grid-template-columns:auto minmax(12rem,1fr) auto; align-items:center; gap:.6rem; }
#operation-status { color:var(--muted); }
.summary { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); gap:.55rem; margin-bottom:1rem; }
.summary article { padding:.75rem; background:var(--panel); border:1px solid var(--line); border-radius:5px; min-width:0; }
.summary span { display:block; font-size:1.45rem; font-weight:bold; }
.summary small { color:var(--muted); }
.workspace { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; }
.section-head { display:flex; gap:1rem; align-items:flex-start; justify-content:space-between; }
.grid { display:grid; gap:.7rem; margin:.7rem 0; }
.grid.two { grid-template-columns:repeat(2,minmax(0,1fr)); }
.grid.three { grid-template-columns:repeat(3,minmax(0,1fr)); }
.grid .wide { grid-column:1/-1; }
label { display:grid; gap:.25rem; font-size:.88rem; font-weight:bold; }
input,select,textarea { width:100%; min-width:0; border:1px solid #9eaaa5; border-radius:3px; background:white; color:var(--ink); padding:.5rem; }
textarea { resize:vertical; line-height:1.35; }
input[readonly] { background:#edf0ee; color:#48534f; }
.inline-check { display:flex; gap:.35rem; align-items:center; font-weight:normal; color:var(--muted); }
.inline-check input { width:auto; }
hr { border:0; border-top:1px solid var(--line); margin:1.2rem 0; }
.checks { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:.6rem; }
.checks button { text-align:left; color:var(--ink); background:var(--soft); border-color:#9bb7af; }
.checks strong,.checks span { display:block; }
.checks span { color:var(--muted); font-size:.8rem; margin-top:.25rem; }
fieldset { border:1px solid var(--line); margin:.8rem 0; padding:.75rem; min-width:0; }
.ref-picker { display:grid; grid-template-columns:1fr 1fr auto; gap:.45rem; }
[data-ref-list] { margin:.6rem 0 0; padding-left:1.2rem; }
[data-ref-list] li { margin:.3rem 0; overflow-wrap:anywhere; }
[data-ref-list] button { margin-left:.4rem; padding:.15rem .4rem; background:white; color:var(--danger); border-color:var(--danger); }
.errors { color:#792323; margin-bottom:.8rem; }
.errors ul { margin:.4rem 0; padding-left:1.25rem; }
.muted { color:var(--muted); font-size:.87rem; }
.table-wrap { overflow-x:auto; }
table { width:100%; border-collapse:collapse; font-size:.86rem; }
th,td { border-bottom:1px solid var(--line); padding:.55rem; text-align:left; vertical-align:top; overflow-wrap:anywhere; }
th { background:#edf2f0; }
pre { white-space:pre-wrap; overflow-wrap:anywhere; background:#eef1ef; border:1px solid var(--line); min-height:6rem; padding:.7rem; }
.export-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.6rem; }
footer { padding:1rem; text-align:center; color:var(--muted); font-size:.8rem; }
@media (max-width:900px) { .summary { grid-template-columns:repeat(4,minmax(0,1fr)); } .workspace { grid-template-columns:1fr; } .checks { grid-template-columns:repeat(2,minmax(0,1fr)); } .grid.three { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width:520px) { main { padding:.65rem; } .topbar { flex-direction:column; padding:1rem; } .top-actions { width:100%; } .top-actions button { flex:1; } .project-bar { grid-template-columns:1fr; } .summary { grid-template-columns:repeat(2,minmax(0,1fr)); } .grid.two,.grid.three { grid-template-columns:1fr; } .checks,.export-grid { grid-template-columns:1fr; } .ref-picker { grid-template-columns:1fr; } .button-row button { flex:1 1 9rem; } .section-head { flex-wrap:wrap; } }