:root {
  --bg: #f5f7fa; --panel: #ffffff; --ink: #1c2733;
  --brand: #14456e; --accent: #e8a13a; --error: #b23c3c;
  --border: #d4dbe3;
}
* { box-sizing: border-box; }
body { margin: 0; font-family: "Segoe UI", system-ui, sans-serif;
       background: var(--bg); color: var(--ink); }
header { background: var(--brand); color: #fff; padding: .6rem 1rem;
         display: flex; align-items: baseline; gap: .8rem; }
header h1 { margin: 0; font-size: 1.2rem; }
#upload-box { margin: 1rem; padding: 2rem; border: 2px dashed var(--border);
              border-radius: 8px; background: var(--panel); text-align: center; }
#upload-box.drag { border-color: var(--accent); }
.split { display: flex; gap: 1rem; margin: 0 1rem; }
.pane { flex: 1; background: var(--panel); border: 1px solid var(--border);
        border-radius: 8px; padding: .5rem 1rem; min-height: 420px; }
#viewer { width: 100%; height: 400px; }
#svg-holder svg { border: 1px solid var(--border); background: #fff; }
#plan-box { margin: 1rem; background: var(--panel);
            border: 1px solid var(--border); border-radius: 8px; padding: 1rem; }
.toolbar { display: flex; gap: .6rem; align-items: center; flex-wrap: wrap; }
button, .btn { background: var(--brand); color: #fff; border: 0;
  padding: .45rem .9rem; border-radius: 6px; cursor: pointer;
  text-decoration: none; font-size: .95rem; }
button:disabled, .btn.disabled { opacity: .45; pointer-events: none; }
#btn-convert { background: var(--accent); color: #1c2733; font-weight: 600; }
#btn-convert-ki { background: var(--brand); }
#dl-links { display: inline-flex; gap: .6rem; }
.error { color: var(--error); }
.hidden { display: none; }
table.plan { border-collapse: collapse; margin-top: 1rem; width: 100%; }
table.plan th, table.plan td { border: 1px solid var(--border);
  padding: .3rem .6rem; text-align: left; font-size: .9rem; }
table.plan input, table.plan select { width: 100%; border: 1px solid
  var(--border); border-radius: 4px; padding: .2rem .3rem; }
table.plan input[type="checkbox"] { width: 22px; height: 22px; }
#feature-results li.fail { color: var(--error); }