:root{
  --ink:#1f2d3d; --muted:#6b7a8d; --line:#e4e9f0; --bg:#f6f8fb; --panel:#ffffff;
  --accent:#128ab0; --accent-dark:#0e6f8e; --good:#1f9d57; --warn:#c47f15; --bad:#c0392b;
  --radius:10px; --shadow:0 1px 3px rgba(20,40,60,.08),0 6px 18px rgba(20,40,60,.06);
}
*{box-sizing:border-box}
body{margin:0;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  color:var(--ink);background:var(--bg);font-size:14px;line-height:1.5}
a{color:var(--accent);text-decoration:none}
button{font:inherit;cursor:pointer;border:none;border-radius:8px;padding:8px 14px;background:var(--accent);
  color:#fff;font-weight:600;transition:background .15s}
button:hover{background:var(--accent-dark)}
button.ghost{background:#eef3f8;color:var(--ink)}
button.ghost:hover{background:#e2eaf2}
button.sm{padding:5px 10px;font-size:12px}
button:disabled{opacity:.5;cursor:not-allowed}
input,textarea,select{font:inherit;border:1px solid var(--line);border-radius:8px;padding:8px 10px;width:100%;
  background:#fff;color:var(--ink)}
textarea{resize:vertical}
.row{display:flex;gap:10px;align-items:center}
.spacer{flex:1}
.muted{color:var(--muted)}
.pill{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11px;font-weight:700}
.pill.High{background:#e3f6ec;color:var(--good)}
.pill.Medium{background:#fdf2dd;color:var(--warn)}
.pill.Low{background:#fbe6e3;color:var(--bad)}
.pill.tag{background:#e9f3f8;color:var(--accent-dark)}
.pill.ok{background:#e3f6ec;color:var(--good)}
.pill.pending{background:#eef3f8;color:var(--muted)}

header.app{display:flex;align-items:center;gap:14px;padding:12px 20px;background:var(--ink);color:#fff}
header.app .logo{font-weight:800;letter-spacing:.5px;font-size:18px}
header.app .logo b{color:#3fc1e6}
header.app .tag{color:#9fb4c7;font-size:12px}
header.app .status{margin-left:auto;display:flex;gap:8px;align-items:center;font-size:12px;color:#cdd9e4}
header.app .dot{width:9px;height:9px;border-radius:50%;background:#888}
header.app .dot.ok{background:#36d17a}
header.app .dot.bad{background:#e05a4d}

.layout{display:grid;grid-template-columns:280px 1fr;min-height:calc(100vh - 53px)}
aside{background:var(--panel);border-right:1px solid var(--line);padding:14px;overflow:auto}
aside h3{margin:6px 4px;font-size:12px;text-transform:uppercase;letter-spacing:.6px;color:var(--muted)}
.claim-item{padding:10px;border-radius:8px;cursor:pointer;border:1px solid transparent}
.claim-item:hover{background:#f1f6fa}
.claim-item.active{background:#e9f3f8;border-color:#cfe6f0}
.claim-item .name{font-weight:600}
.claim-item .meta{font-size:11px;color:var(--muted)}

main{padding:22px 26px;overflow:auto}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);
  padding:18px;margin-bottom:18px}
.card h2{margin:0 0 12px;font-size:16px}
.card h2 .sub{font-weight:400;color:var(--muted);font-size:13px;margin-left:8px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:18px}
table{width:100%;border-collapse:collapse}
th,td{text-align:left;padding:7px 8px;border-bottom:1px solid var(--line);vertical-align:top}
th{font-size:11px;text-transform:uppercase;letter-spacing:.5px;color:var(--muted)}
.kv{display:grid;grid-template-columns:200px 1fr;gap:6px 12px}
.kv .k{color:var(--muted)}
.tabs{display:flex;gap:6px;margin-bottom:14px}
.tabs button{background:#eef3f8;color:var(--ink)}
.tabs button.active{background:var(--accent);color:#fff}

.timeline{border-left:2px solid var(--line);margin-left:8px;padding-left:14px}
.timeline .step{margin-bottom:10px;position:relative}
.timeline .step:before{content:"";position:absolute;left:-21px;top:4px;width:10px;height:10px;border-radius:50%;
  background:var(--accent)}
.timeline .step .t{font-weight:600}
.timeline .step .d{color:var(--muted);font-size:12px}

.review{display:grid;grid-template-columns:1fr 1fr;gap:16px;height:70vh}
.review .pane{display:flex;flex-direction:column;border:1px solid var(--line);border-radius:var(--radius);overflow:hidden}
.review .pane h4{margin:0;padding:10px 12px;background:#f1f6fa;border-bottom:1px solid var(--line);font-size:13px}
.review .pane .body{flex:1;overflow:auto;padding:12px}
.review textarea{height:100%;border:none;border-radius:0}
.doc-src{white-space:pre-wrap;font-family:ui-monospace,Menlo,Consolas,monospace;font-size:12px;color:#33414f}
.src-select{margin:8px 12px}
.issues{margin-top:8px}
.issue{padding:6px 10px;border-radius:6px;margin-bottom:6px;font-size:12px}
.issue.error{background:#fbe6e3;color:var(--bad)}
.issue.warning{background:#fdf2dd;color:var(--warn)}

.modal-bg{position:fixed;inset:0;background:rgba(20,30,45,.45);display:flex;align-items:center;justify-content:center;z-index:50}
.modal{background:#fff;border-radius:12px;padding:22px;width:min(680px,92vw);max-height:88vh;overflow:auto;box-shadow:var(--shadow)}
.modal h2{margin-top:0}
.attr-row{display:grid;grid-template-columns:1fr 1.4fr 1fr auto;gap:8px;margin-bottom:6px}
.exp-row{display:grid;grid-template-columns:1fr 1fr 2fr auto;gap:8px;margin-bottom:6px}
.empty{color:var(--muted);padding:30px;text-align:center}
.banner{padding:10px 14px;border-radius:8px;background:#fdf2dd;color:#8a5d12;font-size:13px;margin-bottom:14px}
.toast{position:fixed;bottom:20px;right:20px;background:var(--ink);color:#fff;padding:12px 16px;border-radius:8px;
  box-shadow:var(--shadow);z-index:60;opacity:0;transform:translateY(10px);transition:.2s}
.toast.show{opacity:1;transform:translateY(0)}
code.mono{font-family:ui-monospace,Consolas,monospace;background:#eef3f8;padding:1px 5px;border-radius:4px;font-size:12px}
