:root {
  --ink:#16243d;
  --navy:#172b4d;
  --navy-deep:#0e1c34;
  --orange:#f59b32;
  --orange-dark:#d8780e;
  --orange-soft:#fff4e5;
  --paper:#f5f7fa;
  --card:#fff;
  --muted:#69768a;
  --line:#dce3ec;
  --green:#15845b;
  --red:#c94747;
  --ease:cubic-bezier(.2,.82,.2,1);
}

* { box-sizing:border-box; }
html { width:100%;overflow-x:hidden;scroll-behavior:smooth; }
body { width:100%;margin:0;overflow-x:hidden;color:var(--ink);background:var(--paper);font-family:"MiSans","Microsoft YaHei","PingFang SC","Noto Sans SC",Arial,sans-serif; }
button,input,select,textarea { font:inherit; }
button { cursor:pointer; }
button:disabled { cursor:not-allowed; }
a { color:inherit; }
[hidden] { display:none!important; }

.ocr-shell { min-height:100vh;overflow:hidden;background:linear-gradient(#fff 0 395px,var(--paper) 395px); }
.ocr-header { position:relative;z-index:20;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:76px;padding:0 clamp(24px,5vw,74px);color:#fff;background:var(--navy-deep);border-bottom:1px solid rgba(255,255,255,.08); }
.back-link { width:max-content;color:#aab8cb;font-size:10px;font-weight:750;text-decoration:none;transition:color .2s,transform .2s; }
.back-link:hover { color:#fff;transform:translateX(-3px); }
.ocr-brand { display:inline-flex;align-items:center;gap:11px;text-decoration:none; }
.brand-symbol { position:relative;isolation:isolate;display:block;width:40px;height:40px;clip-path:polygon(22% 0,78% 0,100% 22%,100% 78%,78% 100%,22% 100%,0 78%,0 22%);background:linear-gradient(145deg,#29466f,#0b1a2f 78%);filter:drop-shadow(0 8px 13px rgba(0,0,0,.24));transition:transform .3s var(--ease); }
.brand-symbol::before { content:"";position:absolute;z-index:2;left:9px;top:7px;width:22px;height:16px;background:linear-gradient(135deg,#ffd28c,#f6a33e);clip-path:polygon(50% 0,100% 38%,50% 76%,0 38%); }
.brand-symbol::after { content:"";position:absolute;z-index:2;left:9px;top:13px;width:11px;height:20px;background:linear-gradient(160deg,#e58b21,#bd6506);clip-path:polygon(0 0,100% 30%,100% 100%,0 70%); }
.brand-symbol i { position:absolute;z-index:2;right:9px;top:13px;width:11px;height:20px;background:linear-gradient(200deg,#ffbb5f,#e58b21);clip-path:polygon(0 30%,100% 0,100% 70%,0 100%); }
.ocr-brand:hover .brand-symbol { transform:translateY(-2px) rotate(2deg); }
.ocr-brand strong,.ocr-brand small { display:block; }
.ocr-brand strong { color:#fff;font-size:17px;font-weight:900;letter-spacing:.02em; }
.ocr-brand small { margin-top:2px;color:#8798b2;font-size:8px;font-weight:800;letter-spacing:.2em; }
.online-chip { justify-self:end;display:inline-flex;align-items:center;gap:7px;padding:7px 10px;border:1px solid rgba(82,207,155,.2);border-radius:999px;color:#72dfb3;background:rgba(60,195,140,.09);font-size:9px;font-weight:850; }
.online-chip i { width:6px;height:6px;border-radius:50%;background:#52cf9b;box-shadow:0 0 0 4px rgba(82,207,155,.1); }

.ocr-hero { position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(340px,.7fr);align-items:center;gap:60px;min-height:360px;padding:58px clamp(28px,7vw,104px) 68px;overflow:hidden;color:#fff;background:linear-gradient(125deg,var(--navy-deep),#1c365f 68%,#24436f); }
.ocr-hero::before { content:"";position:absolute;inset:0;opacity:.28;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to right,#000,transparent 88%); }
.ocr-hero::after { content:"";position:absolute;right:-90px;top:-230px;width:500px;height:500px;border:1px solid rgba(255,255,255,.07);border-radius:50%;box-shadow:0 0 0 65px rgba(255,255,255,.016),0 0 0 125px rgba(255,255,255,.01); }
.hero-copy,.hero-visual { position:relative;z-index:1; }
.hero-copy { animation:riseIn .7s var(--ease) both; }
.ocr-kicker { margin:0 0 14px;color:#9eb0c8;font-size:10px;font-weight:900;letter-spacing:.19em; }
.ocr-hero h1 { margin:0;font-size:clamp(40px,5.1vw,66px);line-height:1.13;letter-spacing:0; }
.ocr-hero h1 span { display:block;margin-top:4px;color:var(--orange); }
.ocr-hero .hero-copy > p:not(.ocr-kicker) { max-width:680px;margin:20px 0 0;color:#bdcadb;font-size:13px;line-height:1.8; }
.hero-tags { display:flex;flex-wrap:wrap;gap:7px;margin-top:23px; }
.hero-tags span { padding:6px 9px;border:1px solid rgba(255,255,255,.12);border-radius:7px;color:#afbed1;background:rgba(255,255,255,.045);font-size:8px;font-weight:750; }
.hero-visual { justify-self:end;width:min(100%,390px);height:230px;perspective:900px;animation:visualIn .8s .1s var(--ease) both; }
.scan-card { position:absolute;inset:20px 35px 15px 10px;padding:36px 28px;border:1px solid rgba(255,255,255,.18);border-radius:16px;background:rgba(8,25,49,.45);box-shadow:0 24px 56px rgba(0,0,0,.22);transform:rotateY(-6deg) rotateX(3deg);overflow:hidden; }
.scan-corners i { position:absolute;width:22px;height:22px;border-color:var(--orange);border-style:solid; }
.scan-corners i:nth-child(1) { left:17px;top:17px;border-width:2px 0 0 2px; }
.scan-corners i:nth-child(2) { right:17px;top:17px;border-width:2px 2px 0 0; }
.scan-corners i:nth-child(3) { left:17px;bottom:17px;border-width:0 0 2px 2px; }
.scan-corners i:nth-child(4) { right:17px;bottom:17px;border-width:0 2px 2px 0; }
.scan-line { position:absolute;z-index:2;left:18px;right:18px;top:26%;height:2px;background:linear-gradient(90deg,transparent,var(--orange) 18% 82%,transparent);box-shadow:0 0 16px rgba(245,155,50,.7);animation:scanMove 3s ease-in-out infinite; }
.scan-copy { display:grid;gap:10px;width:54%;margin-top:4px; }
.scan-copy i { height:7px;border-radius:99px;background:#7588a3; }
.scan-copy i:nth-child(2) { width:83%; }.scan-copy i:nth-child(3) { width:92%; }.scan-copy i:nth-child(4) { width:70%; }.scan-copy i:nth-child(5) { width:88%; }
.scan-table { position:absolute;right:28px;top:38px;display:grid;grid-template-columns:repeat(2,32px);grid-template-rows:repeat(3,27px);border:1px solid rgba(245,155,50,.6); }
.scan-table i { border-right:1px solid rgba(245,155,50,.35);border-bottom:1px solid rgba(245,155,50,.35);background:rgba(245,155,50,.04); }
.format-chip { position:absolute;z-index:3;display:grid;place-items:center;width:44px;height:44px;border:1px solid rgba(255,255,255,.2);border-radius:12px;color:#fff;font-size:18px;font-weight:900;box-shadow:0 13px 28px rgba(0,0,0,.2);animation:floatChip 4s ease-in-out infinite; }
.word-chip { right:0;top:30px;background:linear-gradient(145deg,#3977c7,#1d4d90); }
.excel-chip { right:18px;bottom:0;background:linear-gradient(145deg,#28a06f,#117448);animation-delay:-1.8s; }

.ocr-workspace { padding:32px clamp(24px,5vw,74px) 80px; }
.workspace-grid { display:grid;grid-template-columns:minmax(0,1.25fr) minmax(300px,.75fr);gap:18px;max-width:1500px;margin:0 auto; }
.workspace-card { border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 12px 32px rgba(22,36,61,.055); }
.upload-card,.settings-card { padding:24px; }
.card-heading,.queue-heading,.results-heading { display:flex;align-items:flex-start;justify-content:space-between;gap:20px; }
.card-heading p,.queue-heading p,.results-heading p,.how-to-heading p { margin:0 0 4px;color:var(--orange-dark);font-size:8px;font-weight:900;letter-spacing:.17em; }
.card-heading h2,.queue-heading h2,.results-heading h2,.how-to-heading h2 { margin:0;color:var(--navy);font-size:18px;line-height:1.35; }
.card-heading > span { padding:5px 8px;border-radius:999px;color:#7c899b;background:#f2f4f7;font-size:8px;font-weight:750; }
.ocr-drop-zone { display:grid;place-items:center;min-height:260px;margin-top:18px;padding:26px;border:1px dashed #b7c3d2;border-radius:15px;background:linear-gradient(145deg,#fafbfc,#f5f7fa);text-align:center;transition:transform .25s var(--ease),border-color .25s,background .25s,box-shadow .25s;outline:none; }
.ocr-drop-zone:hover,.ocr-drop-zone:focus-visible,.ocr-drop-zone.is-dragging { transform:translateY(-3px);border-color:var(--orange);background:#fffaf3;box-shadow:0 15px 32px rgba(216,120,14,.09); }
.upload-symbol { position:relative;display:block;width:58px;height:58px;border-radius:18px;background:var(--orange-soft); }
.upload-symbol::before { content:"";position:absolute;left:28px;top:14px;width:2px;height:27px;background:var(--orange-dark); }
.upload-symbol::after { content:"";position:absolute;left:21px;top:15px;width:14px;height:14px;border-left:2px solid var(--orange-dark);border-top:2px solid var(--orange-dark);transform:rotate(45deg); }
.upload-symbol i { position:absolute;left:16px;right:16px;bottom:11px;height:2px;background:var(--orange-dark); }
.ocr-drop-zone strong { margin-top:15px;color:var(--navy);font-size:14px; }
.ocr-drop-zone p { margin:6px 0 15px;color:#8290a4;font-size:9px; }
.ocr-drop-zone button { padding:9px 14px;border:0;border-radius:9px;color:#2a1a04;background:var(--orange);font-size:9px;font-weight:900;box-shadow:0 9px 18px rgba(245,155,50,.2);transition:transform .2s,background .2s; }
.ocr-drop-zone button:hover { transform:translateY(-2px);background:#ffad51; }
.local-note { display:flex;align-items:flex-start;gap:10px;margin-top:15px;padding:11px 13px;border-radius:10px;color:#627186;background:#f5f8f7;font-size:8px;line-height:1.6; }
.local-note > i { flex:0 0 auto;width:8px;height:8px;margin-top:3px;border-radius:50%;background:#39b87e;box-shadow:0 0 0 4px rgba(57,184,126,.1); }
.local-note strong { color:#2a5d48; }

.settings-card { display:flex;flex-direction:column; }
.setting-field,.toggle-field { display:flex;align-items:center;justify-content:space-between;gap:16px;margin-top:16px;padding:14px;border:1px solid #e1e6ed;border-radius:12px;background:#fbfcfd; }
.setting-field > span:first-child strong,.setting-field > span:first-child small,.toggle-field > span strong,.toggle-field > span small { display:block; }
.setting-field strong,.toggle-field strong { color:var(--navy);font-size:10px; }
.setting-field small,.toggle-field small { margin-top:4px;color:#8a96a7;font-size:7px;line-height:1.45; }
.select-shell { position:relative;flex:0 0 178px; }
.select-shell select { width:100%;height:40px;padding:0 34px 0 12px;border:1px solid #ced7e3;border-radius:9px;color:var(--navy);background:#fff;appearance:none;outline:none;font-size:9px;font-weight:750;transition:border-color .2s,box-shadow .2s; }
.select-shell select:focus { border-color:var(--orange);box-shadow:0 0 0 3px rgba(245,155,50,.12); }
.select-shell > i { position:absolute;right:13px;top:15px;width:8px;height:8px;border-right:2px solid #607089;border-bottom:2px solid #607089;transform:rotate(45deg);pointer-events:none; }
.toggle-field { cursor:pointer; }
.toggle-field input { position:absolute;opacity:0;pointer-events:none; }
.toggle-field > i { position:relative;flex:0 0 auto;width:44px;height:25px;border-radius:99px;background:#c8d0db;transition:background .22s; }
.toggle-field > i::after { content:"";position:absolute;left:3px;top:3px;width:19px;height:19px;border-radius:50%;background:#fff;box-shadow:0 3px 8px rgba(0,0,0,.18);transition:transform .24s var(--ease); }
.toggle-field input:checked + i { background:var(--orange); }
.toggle-field input:checked + i::after { transform:translateX(19px); }
.start-button { display:flex;align-items:center;justify-content:space-between;width:100%;min-height:50px;margin-top:auto;padding:0 15px 0 19px;border:0;border-radius:11px;color:#291a05;background:var(--orange);font-size:11px;font-weight:900;box-shadow:0 12px 24px rgba(245,155,50,.22);transition:transform .25s var(--ease),background .25s,opacity .25s; }
.start-button b { display:grid;place-items:center;width:28px;height:28px;border-radius:8px;background:rgba(255,255,255,.5);font-size:15px; }
.start-button:not(:disabled):hover { transform:translateY(-3px);background:#ffad51; }
.start-button:disabled { opacity:.42;box-shadow:none; }
.engine-note { margin:10px 0 0;color:#8c97a8;font-size:7px;line-height:1.55;text-align:center; }

.queue-card,.results-card { max-width:1500px;margin:18px auto 0;padding:24px;animation:sectionIn .45s var(--ease) both; }
.queue-heading > div > span,.results-heading > div > span { display:block;margin-top:5px;color:#8290a4;font-size:8px; }
.queue-heading button { padding:8px 11px;border:1px solid #d5dde7;border-radius:8px;color:#66758a;background:#fff;font-size:8px;font-weight:800;transition:border-color .2s,color .2s; }
.queue-heading button:hover { border-color:#e6a85d;color:var(--orange-dark); }
.image-queue { display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:11px;margin-top:18px; }
.queue-item { position:relative;display:grid;grid-template-columns:64px minmax(0,1fr) auto;align-items:center;gap:10px;min-width:0;padding:9px;border:1px solid #e0e5ec;border-radius:11px;background:#fafbfc;transition:transform .2s,border-color .2s,box-shadow .2s; }
.queue-item:hover { transform:translateY(-2px);border-color:#efbf82;box-shadow:0 9px 20px rgba(22,36,61,.06); }
.queue-thumb { width:64px;height:50px;border-radius:7px;object-fit:cover;background:#e9edf2; }
.queue-meta { min-width:0; }
.queue-meta strong,.queue-meta small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }
.queue-meta strong { color:var(--navy);font-size:8px; }
.queue-meta small { margin-top:4px;color:#8b96a5;font-size:7px; }
.remove-image { display:grid;place-items:center;width:25px;height:25px;border:0;border-radius:7px;color:#7e8b9d;background:#edf0f4;font-size:13px;transition:color .2s,background .2s; }
.remove-image:hover { color:#b63838;background:#feecec; }

.processing-card { position:relative;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:18px;max-width:1500px;margin:18px auto 0;padding:20px 22px;overflow:hidden;border:1px solid #efbc7c;border-radius:16px;background:linear-gradient(110deg,#fffaf2,#fff 70%);box-shadow:0 14px 32px rgba(216,120,14,.08);animation:sectionIn .4s var(--ease) both; }
.processing-icon { position:relative;display:grid;place-items:center;width:52px;height:52px;border-radius:15px;background:var(--orange-soft); }
.processing-icon > span { width:24px;height:30px;border:2px solid var(--orange-dark);border-radius:4px; }
.processing-icon > i { position:absolute;left:13px;right:13px;top:17px;height:2px;background:var(--orange);box-shadow:0 0 10px rgba(245,155,50,.8);animation:miniScan 1.8s ease-in-out infinite; }
.processing-main { position:relative;z-index:1; }
.processing-title { display:flex;align-items:flex-end;justify-content:space-between;gap:18px; }
.processing-title small,.processing-title strong { display:block; }
.processing-title small { color:var(--orange-dark);font-size:8px;font-weight:850; }
.processing-title strong { max-width:650px;margin-top:3px;overflow:hidden;color:var(--navy);font-size:11px;text-overflow:ellipsis;white-space:nowrap; }
.processing-title b { color:var(--orange-dark);font-size:17px; }
.progress-track { height:6px;margin-top:10px;overflow:hidden;border-radius:99px;background:#eee8df; }
.progress-track span { display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--orange),#ffbd6c);box-shadow:0 0 12px rgba(245,155,50,.35);transition:width .35s var(--ease); }
.processing-main > p { margin:7px 0 0;color:#8390a2;font-size:7px; }
#cancel-ocr { position:relative;z-index:1;padding:8px 10px;border:1px solid #d8dfe8;border-radius:8px;color:#67768a;background:#fff;font-size:8px;font-weight:800; }
.number-stream { position:absolute;inset:0;overflow:hidden;pointer-events:none; }
.number-stream span { position:absolute;bottom:-12px;color:rgba(216,120,14,.18);font-size:10px;font-weight:900;animation:numberRise 2.8s ease-out forwards; }

.ocr-error { max-width:1500px;min-height:0;margin:10px auto 0;color:var(--red);font-size:9px;font-weight:750; }
.ocr-error:not(:empty) { padding:11px 13px;border:1px solid #f0c8c8;border-radius:10px;background:#fff4f4; }

.results-heading { align-items:center; }
.results-actions { display:flex;flex-wrap:wrap;justify-content:flex-end;gap:8px; }
.results-actions button { min-height:38px;padding:0 13px;border:1px solid #d4dce6;border-radius:9px;color:#54657d;background:#fff;font-size:9px;font-weight:850;transition:transform .2s,border-color .2s,background .2s; }
.results-actions button:hover { transform:translateY(-2px);border-color:#ebb36f; }
.results-actions .primary-action { border-color:var(--orange);color:#2a1a04;background:var(--orange); }
.result-stats { display:grid;grid-template-columns:repeat(4,1fr);margin-top:19px;border:1px solid #e0e5ec;border-radius:12px;background:#fafbfc; }
.result-stats span { min-height:72px;padding:14px 16px;border-right:1px solid #e0e5ec; }
.result-stats span:last-child { border-right:0; }
.result-stats small,.result-stats strong { display:block; }
.result-stats small { color:#8491a3;font-size:7px; }
.result-stats strong { margin-top:5px;color:var(--navy);font-size:18px; }
.result-tabs { display:flex;gap:6px;margin-top:18px;padding:5px;border-radius:10px;background:#f0f3f6; }
.result-tabs button { flex:0 0 auto;padding:8px 13px;border:0;border-radius:7px;color:#748196;background:transparent;font-size:9px;font-weight:850; }
.result-tabs button.active { color:#2a1a04;background:var(--orange);box-shadow:0 5px 12px rgba(245,155,50,.18); }
.result-panel { margin-top:14px; }
.text-panel label { display:block;margin-bottom:7px;color:#7a8799;font-size:8px; }
.text-panel textarea { width:100%;min-height:350px;resize:vertical;padding:18px;border:1px solid #d8e0e9;border-radius:12px;color:#24334c;background:#fbfcfd;font-size:11px;line-height:1.8;outline:none;transition:border-color .2s,box-shadow .2s; }
.text-panel textarea:focus { border-color:var(--orange);box-shadow:0 0 0 3px rgba(245,155,50,.1);background:#fff; }
.table-wrap { max-height:430px;overflow:auto;border:1px solid #dce3eb;border-radius:12px;background:#fff; }
.table-wrap table { width:100%;border-collapse:collapse;font-size:9px; }
.table-wrap th { position:sticky;top:0;z-index:1;padding:10px 12px;color:#fff;background:var(--navy);text-align:left;white-space:nowrap; }
.table-wrap td { min-width:130px;padding:9px 12px;border-right:1px solid #e4e8ee;border-bottom:1px solid #e4e8ee;color:#4a5b72;white-space:pre-wrap; }
.table-wrap tr:nth-child(even) td { background:#fafbfc; }
.table-panel > p { margin:9px 0 0;color:#8793a4;font-size:8px;line-height:1.55; }

.how-to-card { display:grid;grid-template-columns:230px 1fr;gap:34px;max-width:1500px;margin:18px auto 0;padding:28px;border:1px solid #dae1ea;border-radius:18px;background:linear-gradient(135deg,var(--navy-deep),#203b62);box-shadow:0 16px 36px rgba(16,35,65,.11); }
.how-to-heading p { color:#f0a849; }.how-to-heading h2 { color:#fff;font-size:26px; }
.how-to-card ol { display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:0;padding:0;list-style:none; }
.how-to-card li { display:grid;grid-template-columns:31px 1fr;gap:9px;padding:12px;border:1px solid rgba(255,255,255,.09);border-radius:11px;background:rgba(255,255,255,.04);transition:transform .22s,border-color .22s; }
.how-to-card li:hover { transform:translateY(-3px);border-color:rgba(245,155,50,.35); }
.how-to-card li > span { display:grid;place-items:center;width:29px;height:29px;border-radius:8px;color:#2a1904;background:var(--orange);font-size:10px;font-weight:900; }
.how-to-card li strong { color:#fff;font-size:9px; }
.how-to-card li p { margin:4px 0 0;color:#aab8cb;font-size:7px;line-height:1.55; }

.ocr-footer { display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px;min-height:100px;padding:0 clamp(24px,5vw,74px);color:#8290a4;background:#0a172b;font-size:8px; }
.ocr-footer a { color:#fff;font-size:11px;font-weight:900;text-decoration:none; }
.ocr-footer > span:nth-child(2) { text-align:center; }
.ocr-footer > span:last-child { justify-self:end; }
.ocr-footer b { color:#aab6c8; }

@keyframes riseIn { from{opacity:0;transform:translateY(18px)} to{opacity:1;transform:none} }
@keyframes visualIn { from{opacity:0;transform:translateY(22px) rotate(-2deg)} to{opacity:1;transform:none} }
@keyframes sectionIn { from{opacity:0;transform:translateY(12px)} to{opacity:1;transform:none} }
@keyframes scanMove { 0%,100%{top:24%;opacity:.55} 50%{top:76%;opacity:1} }
@keyframes miniScan { 0%,100%{transform:translateY(-6px)} 50%{transform:translateY(13px)} }
@keyframes floatChip { 0%,100%{transform:translateY(0) rotate(2deg)} 50%{transform:translateY(-8px) rotate(-2deg)} }
@keyframes numberRise { 0%{opacity:0;transform:translateY(0) scale(.9)} 18%{opacity:1} 100%{opacity:0;transform:translateY(-105px) scale(1.16)} }

@media (max-width:1050px) {
  .ocr-hero { grid-template-columns:1fr 330px;gap:25px; }
  .workspace-grid { grid-template-columns:1fr; }
  .settings-card { min-height:0; }
  .start-button { margin-top:20px; }
  .image-queue { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .how-to-card { grid-template-columns:1fr; }
}

@media (max-width:760px) {
  .ocr-header { grid-template-columns:1fr auto;min-height:68px;padding:0 22px; }
  .back-link { display:none; }
  .ocr-brand { justify-self:start; }
  .ocr-hero { grid-template-columns:1fr;min-height:0;padding:52px 24px 62px; }
  .hero-visual { justify-self:start;width:min(100%,430px); }
  .ocr-workspace { padding:24px 18px 58px; }
  .image-queue { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .processing-card { grid-template-columns:auto 1fr; }
  #cancel-ocr { grid-column:1 / -1;width:100%; }
  .results-heading { align-items:flex-start;flex-direction:column; }
  .results-actions { width:100%;justify-content:flex-start; }
  .result-stats { grid-template-columns:repeat(2,1fr); }
  .result-stats span:nth-child(2) { border-right:0; }
  .result-stats span:nth-child(-n+2) { border-bottom:1px solid #e0e5ec; }
  .how-to-card ol { grid-template-columns:repeat(2,1fr); }
  .ocr-footer { grid-template-columns:1fr;gap:12px;padding:24px;text-align:center; }
  .ocr-footer > span:last-child { justify-self:center; }
}

@media (max-width:520px) {
  .ocr-header { min-height:62px;padding:0 16px; }
  .brand-symbol { width:34px;height:34px; }
  .brand-symbol::before { left:8px;top:6px;width:19px;height:14px; }
  .brand-symbol::after { left:8px;top:11px;width:9px;height:17px; }
  .brand-symbol i { right:8px;top:11px;width:9px;height:17px; }
  .ocr-brand strong { font-size:15px; }.ocr-brand small { display:none; }
  .online-chip { padding:7px 8px; }
  .ocr-hero { padding:43px 16px 50px; }
  .ocr-hero h1 { font-size:clamp(32px,10.5vw,39px); }
  .ocr-hero .hero-copy > p:not(.ocr-kicker) { font-size:11px; }
  .hero-visual { height:186px; }
  .scan-card { inset:14px 25px 12px 0;padding:29px 21px; }
  .scan-table { right:21px;top:32px;grid-template-columns:repeat(2,27px);grid-template-rows:repeat(3,22px); }
  .format-chip { width:37px;height:37px;border-radius:10px;font-size:15px; }
  .ocr-workspace { padding:18px 12px 48px; }
  .upload-card,.settings-card,.queue-card,.results-card { padding:17px;border-radius:14px; }
  .card-heading h2,.queue-heading h2,.results-heading h2 { font-size:16px; }
  .ocr-drop-zone { min-height:235px;padding:20px; }
  .setting-field,.toggle-field { align-items:flex-start;flex-direction:column; }
  .select-shell { width:100%;flex-basis:auto; }
  .toggle-field { position:relative;padding-right:70px; }
  .toggle-field > i { position:absolute;right:14px;top:17px; }
  .image-queue { grid-template-columns:1fr; }
  .queue-item { grid-template-columns:70px minmax(0,1fr) auto; }
  .queue-thumb { width:70px;height:54px; }
  .processing-card { gap:12px;padding:16px; }
  .processing-icon { width:44px;height:44px; }
  .processing-title b { font-size:14px; }
  .processing-title strong { max-width:180px; }
  .results-actions { display:grid;grid-template-columns:1fr 1fr;width:100%; }
  .results-actions button { padding:0 9px; }
  .results-actions .primary-action { grid-column:1 / -1; }
  .result-stats strong { font-size:15px; }
  .result-tabs button { flex:1; }
  .text-panel textarea { min-height:310px;padding:13px;font-size:10px; }
  .how-to-card { padding:20px;border-radius:14px; }
  .how-to-heading h2 { font-size:23px; }
  .how-to-card ol { grid-template-columns:1fr; }
}

@media (prefers-reduced-motion:reduce) {
  html { scroll-behavior:auto; }
  *,*::before,*::after { animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important; }
}