:root{ --blue:#1b5faa; --blue-d:#164e8c; --bg:#eef1f5; --line:#c9d2dd; --ok:#1f8a4c; --warn:#b8860b; }
  *{ box-sizing:border-box; }
  .skip-link{ position:fixed; left:12px; top:10px; z-index:999; transform:translateY(-160%); background:#fff; color:#123f7d; padding:9px 13px; border-radius:8px; font-weight:700; box-shadow:0 4px 14px rgba(0,0,0,.2); }
  .skip-link:focus{ transform:translateY(0); }
  body{ margin:0; font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif; background:var(--bg); color:#1c2530; font-size:14px; }
  header.app{ background:linear-gradient(135deg,var(--blue),var(--blue-d)); color:#fff; padding:18px 22px; }
  header.app h1{ margin:0; font-size:19px; font-weight:700; }
  header.app p{ margin:4px 0 0; opacity:.85; font-size:13px; }
  .wrap{ max-width:1120px; margin:0 auto; padding:18px; }
  .card{ background:#fff; border:1px solid var(--line); border-radius:10px; padding:16px 18px; margin-bottom:16px; box-shadow:0 1px 3px rgba(20,40,70,.05); }
  .card h2{ margin:0 0 12px; font-size:15px; color:var(--blue-d); display:flex; align-items:center; gap:8px; }
  .step{ background:var(--blue); color:#fff; width:22px; height:22px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; font-size:12px; font-weight:700; }
  label.fl{ display:block; font-size:12px; color:#5b6673; margin:0 0 3px; }
  input,select{ width:100%; padding:7px 9px; border:1px solid var(--line); border-radius:6px; font-size:13px; background:#fff; }
  input:focus{ outline:2px solid #a9c7ec; border-color:var(--blue); }
  input.ocr{ background:#fffdf3; }
  .grid{ display:grid; gap:10px 14px; }
  .g2{ grid-template-columns:repeat(2,1fr); } .g3{ grid-template-columns:repeat(3,1fr); } .g4{ grid-template-columns:repeat(4,1fr); }
  @media(max-width:720px){ .g2,.g3,.g4{ grid-template-columns:1fr 1fr; } }
  .subhead{ font-size:12px; font-weight:700; color:var(--blue-d); text-transform:uppercase; letter-spacing:.4px; margin:14px 0 6px; border-bottom:1px solid var(--line); padding-bottom:4px; }
  table.form{ width:100%; border-collapse:collapse; }
  table.form th{ text-align:left; font-size:11px; color:#5b6673; font-weight:600; padding:4px 6px; }
  table.form td{ padding:2px 6px; border-bottom:1px solid #eef1f4; }
  table.form td.op{ font-size:12px; color:#333; }
  table.form input{ padding:5px 7px; font-size:12px; text-align:right; }
  .code{ font-family:ui-monospace,Menlo,monospace; background:#eef4fb; color:var(--blue-d); border-radius:4px; padding:1px 5px; font-size:11px; font-weight:700; }
  .btn{ background:var(--blue); color:#fff; border:0; border-radius:8px; padding:10px 18px; font-size:14px; font-weight:600; cursor:pointer; }
  .btn:hover{ background:var(--blue-d); }
  .btn.sec{ background:#fff; color:var(--blue-d); border:1px solid var(--blue); }
  .btn.gray{ background:#5b6673; }
  .btnrow{ display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
  .drop{ border:2px dashed #a9bdd6; border-radius:10px; padding:22px; text-align:center; color:#5b6673; background:#f7fafd; cursor:pointer; }
  .drop.drag{ background:#eaf2fc; border-color:var(--blue); }
  .drop:focus-visible{ outline:3px solid #a9c7ec; outline-offset:3px; }
  #ocrStatus,#ocrStatus2,#ocrStatus3{ font-size:12px; color:var(--warn); margin-top:8px; min-height:16px; }
  details.adv summary{ cursor:pointer; font-size:12px; font-weight:700; color:var(--blue-d); margin:10px 0; }
  .hint{ font-size:11px; color:#7a8593; margin-top:2px; }
  .tabs{ display:flex; gap:6px; flex-wrap:wrap; margin-bottom:12px; }
  .tab{ padding:8px 16px; border:1px solid var(--line); background:#fff; border-radius:8px 8px 0 0; cursor:pointer; font-weight:600; font-size:13px; color:#5b6673; }
  .tab.active{ background:var(--blue); color:#fff; border-color:var(--blue); }
  #result{ display:none; }