:root {
  --ink:#142542;
  --muted:#6b788c;
  --navy:#0f203a;
  --navy-light:#1b365f;
  --orange:#f59b32;
  --orange-dark:#da7b0d;
  --orange-soft:#fff3e3;
  --paper:#f3f6f9;
  --line:#dce3ec;
  --green:#16825c;
  --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:#fff;font-family:"MiSans","Microsoft YaHei","PingFang SC","Noto Sans SC",Arial,sans-serif; }
button,input,select,textarea { font:inherit; }
button,select { cursor:pointer; }
a { color:inherit; }

.unit-shell { width:100%;min-height:100vh;margin:0;background:#fff; }
.unit-header { position:relative;z-index:10;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:70px;padding:0 clamp(20px,5vw,70px);color:#fff;background:var(--navy);border-bottom:1px solid rgba(255,255,255,.08); }
.back-link { display:inline-flex;align-items:center;gap:8px;width:max-content;color:#becbdd;font-size:11px;font-weight:750;text-decoration:none;transition:color .2s,transform .2s; }
.back-link:hover { color:#fff;transform:translateX(-3px); }
.unit-brand { justify-self:center;display:flex;align-items:center;gap:10px;text-decoration:none; }
.brand-symbol { position:relative;isolation:isolate;display:block;width:36px;height:36px;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 7px 12px rgba(0,0,0,.24));transition:transform .3s var(--ease),filter .3s; }
.brand-symbol::before { content:"";position:absolute;z-index:2;left:8px;top:6px;width:20px;height:14px;background:linear-gradient(135deg,#ffd28c,#f6a33e);clip-path:polygon(50% 0,100% 38%,50% 76%,0 38%);transition:transform .3s var(--ease),filter .3s; }
.brand-symbol::after { content:"";position:absolute;z-index:2;left:8px;top:11px;width:10px;height:18px;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:8px;top:11px;width:10px;height:18px;background:linear-gradient(200deg,#ffbb5f,#e58b21);clip-path:polygon(0 30%,100% 0,100% 70%,0 100%); }
.unit-brand:hover .brand-symbol { transform:translateY(-2px) rotate(2deg);filter:drop-shadow(0 11px 16px rgba(245,155,50,.22)); }
.unit-brand:hover .brand-symbol::before { transform:translateY(-1px);filter:brightness(1.08); }
.unit-brand strong,.unit-brand small { display:block; }.unit-brand strong { color:#fff;font-family:inherit;font-size:15px;font-weight:900; }.unit-brand small { margin-top:2px;color:#7f91aa;font-size:7px;font-weight:850;letter-spacing:.18em; }
.online-chip { justify-self:end;display:inline-flex;align-items:center;gap:7px;padding:6px 9px;border-radius:999px;color:#6cdaac;background:rgba(66,196,143,.1);font-size:8px;font-weight:850; }
.online-chip i { width:6px;height:6px;border-radius:50%;background:#53d09d;box-shadow:0 0 0 4px rgba(83,208,157,.1); }

.unit-hero { position:relative;overflow:hidden;padding:58px clamp(24px,7vw,100px) 66px;color:#fff;background:linear-gradient(125deg,var(--navy),#1c385f 70%,#24466f); }
.unit-hero::before { content:"";position:absolute;inset:0;opacity:.32;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 86%); }
.unit-hero::after { content:"";position:absolute;right:-90px;top:-190px;width:410px;height:410px;border:1px solid rgba(255,255,255,.08);border-radius:50%;box-shadow:0 0 0 54px rgba(255,255,255,.015),0 0 0 105px rgba(255,255,255,.01); }
.unit-hero > * { position:relative;z-index:1; }
.unit-kicker { display:flex;align-items:center;gap:9px;margin:0 0 13px;color:#a9b9cf;font-size:9px;font-weight:900;letter-spacing:.19em; }
.unit-kicker::before { content:"";width:24px;height:2px;background:var(--orange); }
.unit-hero h1 { margin:0;font-size:clamp(34px,4.7vw,58px);line-height:1.16;letter-spacing:0; }
.unit-hero h1 span { display:inline-block;margin-left:.12em;color:var(--orange);font-family:inherit;font-style:normal;font-weight:900; }
.unit-hero > p:last-child { max-width:720px;margin:15px 0 0;color:#bcc9da;font-size:13px;line-height:1.8; }

.converter-main { padding:clamp(26px,5vw,64px) clamp(18px,6vw,86px) 74px;background:linear-gradient(180deg,#f7f9fc,#f1f4f8); }
.converter-grid { display:grid;grid-template-columns:minmax(0,1.45fr) minmax(320px,.75fr);gap:18px;max-width:1180px;margin:0 auto; }
.converter-card { border:1px solid var(--line);border-radius:18px;background:#fff;box-shadow:0 16px 44px rgba(18,35,60,.07); }
.converter-card-head { display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:22px 24px 18px;border-bottom:1px solid #e8edf3; }
.converter-card-head p { margin:0 0 4px;color:var(--orange-dark);font-size:8px;font-weight:900;letter-spacing:.16em; }
.converter-card-head h2 { margin:0;font-size:20px;line-height:1.35;letter-spacing:0; }
.converter-card-head span { padding:6px 9px;border-radius:999px;color:#718095;background:#f2f5f8;font-size:8px;font-weight:750; }
.converter-body { padding:24px; }

.single-converter { display:grid;grid-template-columns:minmax(0,1fr) 42px minmax(0,1fr);align-items:end;gap:12px; }
.field-group { display:grid;gap:8px; }
.field-group > span { color:#5e6c81;font-size:9px;font-weight:800; }
.value-box { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;min-height:72px;border:1px solid #d5dde7;border-radius:13px;background:#fafbfd;transition:border-color .2s,box-shadow .2s,transform .2s var(--ease); }
.value-box:focus-within { transform:translateY(-2px);border-color:#e9a451;box-shadow:0 0 0 4px rgba(245,155,50,.1); }
.value-box input { min-width:0;width:100%;height:70px;padding:0 8px 0 16px;border:0;outline:0;color:var(--navy);background:transparent;font-size:27px;font-weight:850;letter-spacing:-.03em; }
.value-box select { align-self:stretch;min-width:92px;padding:0 30px 0 12px;border:0;border-left:1px solid #e0e6ed;outline:0;color:#30415a;background-color:transparent;font-size:11px;font-weight:800; }
.result-box { min-height:72px;padding:12px 15px;border:1px solid rgba(245,155,50,.55);border-radius:13px;background:var(--orange-soft); }
.result-box strong { display:block;overflow:hidden;color:var(--navy);font-size:27px;line-height:1.15;letter-spacing:-.03em;text-overflow:ellipsis;white-space:nowrap; }
.result-box select { width:100%;margin-top:6px;padding:0;border:0;outline:0;color:var(--orange-dark);background:transparent;font-size:10px;font-weight:850; }
.custom-select { position:relative;min-width:0; }
.custom-select-native { position:absolute!important;width:1px!important;height:1px!important;margin:0!important;padding:0!important;overflow:hidden!important;border:0!important;clip:rect(0 0 0 0)!important;opacity:0!important;pointer-events:none!important; }
.custom-select-trigger { display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;min-height:38px;padding:0 11px;border:1px solid #d6dfe9;border-radius:9px;outline:0;color:#3d5069;background:linear-gradient(180deg,#fff,#f8fafc);font-size:9px;font-weight:850;text-align:left;box-shadow:0 3px 9px rgba(18,35,60,.035);transition:transform .22s var(--ease),border-color .2s,box-shadow .2s,background .2s; }
.custom-select-trigger::after { content:"";flex:0 0 auto;width:6px;height:6px;border-right:2px solid #6d7e92;border-bottom:2px solid #6d7e92;transform:translateY(-2px) rotate(45deg);transition:transform .25s var(--ease),border-color .2s; }
.custom-select-trigger:hover { transform:translateY(-1px);border-color:#e5a554;background:#fffaf4;box-shadow:0 7px 16px rgba(18,35,60,.06); }
.custom-select.open .custom-select-trigger { border-color:var(--orange);background:#fff;box-shadow:0 0 0 4px rgba(245,155,50,.1),0 10px 24px rgba(18,35,60,.1); }
.custom-select.open .custom-select-trigger::after { border-color:var(--orange-dark);transform:translateY(2px) rotate(225deg); }
.custom-select-trigger:disabled { cursor:not-allowed;opacity:.46;transform:none;background:#f0f3f6;box-shadow:none; }
.custom-select-menu { position:absolute;z-index:80;top:calc(100% + 7px);left:0;min-width:max(100%,180px);max-height:280px;padding:6px;overflow:auto;border:1px solid #d7dfe9;border-radius:12px;background:rgba(255,255,255,.98);box-shadow:0 18px 42px rgba(15,32,58,.18);opacity:0;visibility:hidden;transform:translateY(-7px) scale(.98);transform-origin:top;transition:opacity .2s,visibility .2s,transform .22s var(--ease);backdrop-filter:blur(12px); }
.custom-select.open .custom-select-menu { opacity:1;visibility:visible;transform:none; }
.custom-select-option { position:relative;display:flex;align-items:center;width:100%;min-height:34px;padding:0 30px 0 10px;border:0;border-radius:8px;color:#506078;background:transparent;font-size:9px;font-weight:750;text-align:left;transition:color .16s,background .16s,transform .16s; }
.custom-select-option:hover,.custom-select-option:focus-visible { outline:0;color:#263a55;background:#fff2df;transform:translateX(2px); }
.custom-select-option.active { color:#9e5507;background:#fff5e7;font-weight:900; }
.custom-select-option.active::after { content:"✓";position:absolute;right:10px;color:var(--orange-dark);font-size:10px; }
.custom-select-menu::-webkit-scrollbar { width:7px; }.custom-select-menu::-webkit-scrollbar-thumb { border:2px solid #fff;border-radius:999px;background:#c8d1dd; }
.value-box .custom-select { align-self:stretch;min-width:108px;border-left:1px solid #e0e6ed; }
.value-box .custom-select-trigger { height:100%;border:0;border-radius:0 12px 12px 0;background:transparent;box-shadow:none; }
.value-box .custom-select-trigger:hover,.value-box .custom-select.open .custom-select-trigger { transform:none;background:#fff8ee;box-shadow:none; }
.value-box .custom-select-menu { right:0;left:auto; }
.result-box .custom-select { width:100%;margin-top:4px; }
.result-box .custom-select-trigger { min-height:25px;padding:0;border:0;color:var(--orange-dark);background:transparent;box-shadow:none; }
.result-box .custom-select-trigger:hover,.result-box .custom-select.open .custom-select-trigger { transform:none;background:transparent;box-shadow:none; }
.result-box .custom-select-menu { right:0;left:auto;width:210px; }
.swap-button { display:grid;place-items:center;width:42px;height:42px;margin-bottom:15px;border:1px solid #d8e0e9;border-radius:12px;color:var(--orange-dark);background:#fff;font-size:18px;font-weight:900;box-shadow:0 7px 16px rgba(18,35,60,.06);transition:transform .28s var(--ease),border-color .2s,background .2s; }
.swap-button:hover { transform:rotate(180deg);border-color:#ebb36d;background:var(--orange-soft); }
.single-converter.is-swapping .value-box,.single-converter.is-swapping .result-box { animation:unitPulse .28s var(--ease); }
.input-message { min-height:17px;margin:9px 0 0;color:#c05645;font-size:9px; }

.dimension-triplet { margin-top:12px;padding:15px;border:1px solid #e1e7ee;border-radius:14px;background:linear-gradient(145deg,#fbfcfe,#f7f9fc);transition:border-color .24s,box-shadow .24s,transform .24s var(--ease); }
.dimension-triplet:focus-within { transform:translateY(-2px);border-color:#e8a653;box-shadow:0 12px 28px rgba(18,35,60,.07),0 0 0 4px rgba(245,155,50,.07); }
.dimension-triplet-head { display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:11px; }
.dimension-triplet-head p { margin:0 0 3px;color:var(--orange-dark);font-size:7px;font-weight:900;letter-spacing:.15em; }
.dimension-triplet-head h3 { margin:0;color:#243954;font-size:12px;line-height:1.35; }
.dimension-triplet-head > span { display:flex;align-items:center;gap:7px;padding:6px 9px;border:1px solid #f0d4b0;border-radius:999px;color:#a95d09;background:#fff7ec;font-size:8px;font-weight:900; }
.dimension-triplet-head > span i { color:#c08a4e;font-style:normal; }
.dimension-triplet-body { display:grid;grid-template-columns:minmax(0,1fr) 28px minmax(0,1fr);align-items:stretch;gap:9px; }
.triplet-values { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px; }
.triplet-inputs label,.triplet-output .triplet-values > span { display:flex;min-width:0;min-height:58px;padding:9px 10px;border:1px solid #dbe3ec;border-radius:10px;background:#fff;flex-direction:column;justify-content:center;transition:border-color .2s,background .2s,box-shadow .2s,transform .2s var(--ease); }
.triplet-inputs label:focus-within { transform:translateY(-2px);border-color:var(--orange);box-shadow:0 6px 14px rgba(245,155,50,.1); }
.triplet-values small { color:#7c899b;font-size:7px;font-weight:800; }
.triplet-inputs input { min-width:0;width:100%;margin-top:4px;padding:0;border:0;outline:0;color:var(--navy);background:transparent;font-size:17px;font-weight:900;line-height:1.2; }
.triplet-arrow { align-self:center;color:var(--orange-dark);font-size:17px;font-weight:900;text-align:center;transition:transform .24s var(--ease); }
.dimension-triplet:focus-within .triplet-arrow { transform:translateX(2px); }
.triplet-output { position:relative;min-width:0;padding:0 0 20px;overflow:hidden;border:0;border-radius:11px;outline:0;color:inherit;background:transparent;text-align:left; }
.triplet-output .triplet-values { height:100%; }
.triplet-output .triplet-values > span { border-color:#f0c185;background:#fff5e7; }
.triplet-output strong { display:block;margin-top:4px;overflow:hidden;color:#163052;font-size:15px;line-height:1.2;text-overflow:ellipsis;white-space:nowrap; }
.triplet-output em { position:absolute;right:2px;bottom:3px;color:#b46a15;font-size:7px;font-style:normal;font-weight:850; }
.triplet-output::after { content:"已复制";position:absolute;right:5px;top:5px;padding:4px 6px;border-radius:999px;color:#fff;background:#17865d;font-size:7px;font-weight:850;opacity:0;transform:translateY(-5px) scale(.92);transition:opacity .18s,transform .22s var(--ease);pointer-events:none; }
.triplet-output:hover:not(:disabled) .triplet-values > span { transform:translateY(-2px);border-color:#e6a24e;background:#fff0db;box-shadow:0 7px 15px rgba(245,155,50,.09); }
.triplet-output:focus-visible { box-shadow:0 0 0 4px rgba(245,155,50,.13); }
.triplet-output.is-copied .triplet-values > span { border-color:#59b793;background:#f2fbf7; }
.triplet-output.is-copied::after { opacity:1;transform:none; }
.triplet-output:disabled { cursor:not-allowed;opacity:.58; }
.triplet-message { min-height:12px;margin:7px 0 0;color:#77869a;font-size:8px;line-height:1.45; }

.precision-row { display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:17px;padding-top:16px;border-top:1px solid #e8edf3; }
.precision-row > span { color:#748196;font-size:9px;font-weight:750; }
.precision-buttons { display:flex;gap:5px;padding:4px;border-radius:9px;background:#f0f3f7; }
.precision-buttons button { padding:6px 9px;border:0;border-radius:7px;color:#7b8798;background:transparent;font-size:8px;font-weight:850;transition:background .2s,color .2s,transform .2s; }
.precision-buttons button:hover { transform:translateY(-1px); }.precision-buttons button.active { color:#291a05;background:var(--orange); }

.quick-section { margin-top:22px; }
.quick-title { display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:10px; }
.quick-section h3 { margin:0;font-size:11px; }
.quick-title span { color:#8a96a7;font-size:7px;font-weight:700; }
.quick-results { display:grid;grid-template-columns:repeat(3,1fr);gap:8px; }
.quick-result { position:relative;padding:11px;overflow:hidden;border:1px solid #e0e6ed;border-radius:10px;background:#fbfcfd;text-align:left;transition:transform .2s var(--ease),border-color .2s,background .2s,box-shadow .2s; }
.quick-result:hover { transform:translateY(-2px);border-color:#eab06a;background:#fffaf3; }
.quick-result small,.quick-result strong { display:block; }.quick-result small { color:#8190a3;font-size:7px; }.quick-result strong { margin-top:4px;overflow:hidden;color:#273b59;font-size:11px;text-overflow:ellipsis;white-space:nowrap; }
.quick-result::after { content:"已复制";position:absolute;right:8px;top:8px;padding:4px 6px;border-radius:999px;color:#fff;background:#17865d;font-size:7px;font-weight:850;opacity:0;transform:translateY(-6px) scale(.92);transition:opacity .18s,transform .22s var(--ease);pointer-events:none; }
.quick-result.is-copied { border-color:#59b793;background:#f2fbf7;box-shadow:0 8px 18px rgba(23,134,93,.1); }
.quick-result.is-copied::after { opacity:1;transform:none; }

.batch-card { align-self:start;overflow:hidden; }
.batch-card .converter-card-head { align-items:center; }
.batch-body { padding:20px; }
.batch-hint { margin:0 0 10px;color:#78869a;font-size:9px;line-height:1.6; }
.batch-body textarea { display:block;width:100%;min-height:132px;padding:13px;border:1px solid #d7dfe8;border-radius:11px;outline:0;resize:vertical;color:#263a58;background:#fafbfd;font-size:11px;line-height:1.7;transition:border-color .2s,box-shadow .2s; }
.batch-body textarea:focus { border-color:#e8a450;box-shadow:0 0 0 4px rgba(245,155,50,.1); }
.batch-actions { display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px; }
.batch-actions button { min-height:38px;border:1px solid #d6dee8;border-radius:9px;color:#4e5e74;background:#fff;font-size:9px;font-weight:850;transition:transform .2s var(--ease),border-color .2s,background .2s; }
.batch-actions button:hover { transform:translateY(-2px);border-color:#e5a34f;background:#fff9f1; }
.batch-actions .copy-button { border-color:var(--orange);color:#2b1b05;background:var(--orange); }
.batch-result { min-height:163px;margin-top:14px;padding:13px;overflow:auto;border:1px solid #d9e2eb;border-radius:11px;color:#38506f;background:#f4f7fa;font-family:inherit;font-size:9px;line-height:1.85;white-space:pre-wrap; }
.batch-result:empty::before { content:"换算结果会显示在这里";color:#9aa6b6;font-family:inherit; }
.privacy-note { display:flex;align-items:flex-start;gap:9px;margin-top:14px;padding:11px;border-radius:10px;color:#64758b;background:#eef7f3;font-size:8px;line-height:1.6; }
.privacy-note i { flex:0 0 auto;width:7px;height:7px;margin-top:3px;border-radius:50%;background:#4ec592;box-shadow:0 0 0 4px rgba(78,197,146,.12); }

.excel-batch-card,.excel-results-card { max-width:1180px;margin:18px auto 0;overflow:hidden; }
.excel-batch-body { padding:22px 24px 24px; }
.excel-flow { display:flex;align-items:center;justify-content:center;gap:18px;margin-bottom:18px;padding:13px 16px;border:1px solid #e5eaf0;border-radius:12px;background:#f8fafc; }
.excel-flow > span { display:grid;grid-template-columns:auto 1fr;column-gap:8px;align-items:center;min-width:150px; }
.excel-flow i { grid-row:1 / 3;display:grid;place-items:center;width:27px;height:27px;border-radius:8px;color:#2a1a04;background:var(--orange);font-size:9px;font-style:normal;font-weight:900; }
.excel-flow b { color:#33465f;font-size:9px; }.excel-flow small { margin-top:2px;color:#8995a6;font-size:7px; }
.excel-flow em { color:#a3adba;font-size:14px;font-style:normal; }
.excel-drop-zone { position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:190px;padding:26px;border:1.5px dashed #b9c6d6;border-radius:15px;outline:0;background:linear-gradient(145deg,#fbfcfe,#f6f9fc);text-align:center;transition:transform .28s var(--ease),border-color .24s,background .24s,box-shadow .24s; }
.excel-drop-zone:hover,.excel-drop-zone:focus-visible,.excel-drop-zone.dragover { transform:translateY(-3px);border-color:var(--orange);background:#fffaf3;box-shadow:0 15px 35px rgba(18,35,60,.08),0 0 0 4px rgba(245,155,50,.08); }
.excel-upload-icon { display:grid;place-items:center;width:48px;height:48px;margin-bottom:11px;border-radius:14px;color:var(--orange-dark);background:var(--orange-soft);font-size:24px;font-weight:850;transition:transform .35s var(--ease),background .25s; }
.excel-drop-zone:hover .excel-upload-icon { transform:translateY(-4px) scale(1.05); }
.excel-drop-zone strong { color:#273b57;font-size:13px; }.excel-drop-zone small { margin-top:5px;color:#8190a3;font-size:8px; }
.excel-drop-zone button { position:relative;z-index:2;min-height:36px;margin-top:15px;padding:0 16px;border:1px solid var(--orange);border-radius:9px;color:#2b1b05;background:var(--orange);font-size:9px;font-weight:900;transition:transform .22s var(--ease),background .22s; }
.excel-drop-zone button:hover { transform:translateY(-2px);background:#ffae50; }
.excel-drop-zone.processing .excel-upload-icon { animation:processingSpin .85s linear infinite; }
.excel-drop-zone.file-ready { border-style:solid;border-color:#91d2b7;background:#f4fbf8;animation:fileAccepted .55s var(--ease); }
.excel-drop-zone.file-ready .excel-upload-icon { color:var(--green);background:#e1f5ec;animation:successBounce .55s var(--ease); }
.excel-error { min-height:16px;margin:10px 0 0;color:#bd4c4c;font-size:9px; }

.conversion-progress { position:relative;display:flex;align-items:center;gap:13px;min-height:66px;margin-top:14px;padding:13px 15px;overflow:hidden;border:1px solid #efc58f;border-radius:12px;background:linear-gradient(110deg,#fffaf2,#fff 52%,#fff7eb);box-shadow:0 10px 24px rgba(216,121,12,.08); }
.conversion-progress[hidden] { display:none; }
.conversion-number-stream { position:absolute;inset:0;z-index:0;overflow:hidden;pointer-events:none; }
.conversion-number-particle { --particle-drift:0px;--particle-rise:-46px;position:absolute;bottom:-5px;color:rgba(216,121,12,.27);font-size:9px;font-weight:850;white-space:nowrap;text-shadow:0 0 12px rgba(245,155,50,.16);animation:numberFlight var(--particle-duration,1.65s) cubic-bezier(.2,.72,.24,1) forwards; }
.conversion-progress.is-active { animation:progressEnter .38s var(--ease) both; }
.conversion-progress.is-complete { border-color:#91d2b7;background:linear-gradient(110deg,#f3fbf7,#fff); }
.conversion-progress.is-error { border-color:#e8aaaa;background:linear-gradient(110deg,#fff5f5,#fff); }
.conversion-progress-icon { position:relative;z-index:2;display:grid;place-items:center;flex:0 0 auto;width:35px;height:35px;border:2px solid #f1d5af;border-top-color:var(--orange);border-radius:50%;animation:processingSpin .85s linear infinite; }
.conversion-progress-icon i { width:6px;height:6px;border-radius:50%;background:var(--orange);box-shadow:0 0 0 5px rgba(245,155,50,.12); }
.conversion-progress.is-complete .conversion-progress-icon { border-color:var(--green);animation:successBounce .5s var(--ease); }
.conversion-progress.is-complete .conversion-progress-icon::after { content:"✓";color:var(--green);font-size:15px;font-weight:900; }
.conversion-progress.is-complete .conversion-progress-icon i { display:none; }
.conversion-progress.is-error .conversion-progress-icon { border-color:#bd4c4c;animation:none; }.conversion-progress.is-error .conversion-progress-icon::after { content:"!";color:#bd4c4c;font-size:15px;font-weight:900; }.conversion-progress.is-error .conversion-progress-icon i { display:none; }
.conversion-progress-body { position:relative;z-index:2;flex:1;min-width:0; }
.conversion-progress-copy { display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:7px; }
.conversion-progress-copy strong { overflow:hidden;color:var(--navy);font-size:10px;text-overflow:ellipsis;white-space:nowrap; }.conversion-progress-copy span { color:var(--orange-dark);font-size:10px;font-weight:900;font-variant-numeric:tabular-nums; }
.conversion-progress-track { height:5px;overflow:hidden;border-radius:999px;background:#f2e6d6; }.conversion-progress-track span { display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--orange),#ffc978);box-shadow:0 0 10px rgba(245,155,50,.35);transition:width .14s linear; }
.conversion-progress.is-complete .conversion-progress-track span { background:linear-gradient(90deg,var(--green),#65cba3); }

body.dialog-open { overflow:hidden; }
.column-dialog { width:min(920px,calc(100% - 28px));max-height:calc(100vh - 30px);padding:0;overflow:hidden;border:0;border-radius:18px;background:#fff;box-shadow:0 30px 90px rgba(10,26,47,.28); }
.column-dialog::backdrop { background:rgba(9,22,40,.62);backdrop-filter:blur(7px); }
.column-dialog[open] { animation:dialogEnter .38s var(--ease) both; }
.column-dialog-shell { display:flex;flex-direction:column;max-height:calc(100vh - 30px); }
.column-dialog-head { flex:0 0 auto;display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:22px 24px;color:#fff;background:linear-gradient(125deg,var(--navy),var(--navy-light)); }
.column-dialog-head p { margin:0 0 5px;color:var(--orange);font-size:8px;font-weight:900;letter-spacing:.15em; }.column-dialog-head h2 { margin:0;font-size:20px; }.column-dialog-head span { display:block;margin-top:6px;color:#aebcd0;font-size:8px; }
.column-dialog-head button { display:grid;place-items:center;width:31px;height:31px;border:1px solid rgba(255,255,255,.15);border-radius:9px;color:#d9e3ef;background:rgba(255,255,255,.06);font-size:20px;transition:transform .2s,background .2s; }.column-dialog-head button:hover { transform:rotate(5deg);background:rgba(255,255,255,.12); }
.column-dialog-body { flex:1;min-height:0;padding:20px 24px;overflow:auto;background:#f7f9fc; }
.dialog-section-title { display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:9px; }.dialog-section-title span { color:#31445f;font-size:10px;font-weight:900; }.dialog-section-title small { color:#8995a6;font-size:8px; }
.import-preview-table { overflow:auto;border:1px solid #dce3ec;border-radius:10px;background:#fff; }.import-preview-table table { width:100%;border-collapse:collapse;font-size:8px;white-space:nowrap; }.import-preview-table th,.import-preview-table td { max-width:170px;padding:8px 10px;overflow:hidden;border-right:1px solid #e8edf3;border-bottom:1px solid #e8edf3;text-align:left;text-overflow:ellipsis; }.import-preview-table th { color:#fff;background:#243b5d;font-weight:850; }.import-preview-table tr:last-child td { border-bottom:0; }
.column-select-section { margin-top:18px; }.column-map-list { display:grid;gap:8px; }
.column-map-row { position:relative;display:grid;grid-template-columns:minmax(170px,1fr) minmax(135px,.72fr) auto minmax(135px,.72fr);align-items:center;gap:10px;padding:10px;border:1px solid #dce3eb;border-radius:11px;background:#fff;transition:border-color .22s,background .22s,transform .22s var(--ease); }
.column-map-row:focus-within { z-index:90; }
.column-map-row:hover { transform:translateY(-1px);border-color:#c5cfdb; }.column-map-row.selected { border-color:#e8ad65;background:#fffaf3;box-shadow:0 0 0 3px rgba(245,155,50,.07); }
.column-check { display:grid;grid-template-columns:auto 1fr;align-items:center;gap:9px;min-width:0;cursor:pointer; }.column-check input { width:17px;height:17px;accent-color:var(--orange); }.column-check span { min-width:0; }.column-check strong,.column-check small { display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap; }.column-check strong { color:#334760;font-size:9px; }.column-check small { margin-top:3px;color:#8a96a7;font-size:7px; }
.column-preview-line { display:flex!important;align-items:center;gap:6px;overflow:visible!important;white-space:nowrap!important; }.column-preview-line span { max-width:90px;overflow:hidden;color:#8995a6;text-overflow:ellipsis; }.column-preview-line em { color:var(--orange-dark);font-size:10px;font-style:normal;font-weight:900; }.column-preview-line b { overflow:hidden;color:#bd6608;font-size:7px;text-overflow:ellipsis; }.column-map-row:not(.selected) .column-preview-line { opacity:.4; }
.column-map-row select { min-width:0;width:100%;height:36px;padding:0 28px 0 9px;border:1px solid #d7dfe8;border-radius:8px;outline:0;color:#44556c;background:#fff;font-size:8px;font-weight:750; }.column-map-row select:disabled { cursor:not-allowed;opacity:.45;background:#f1f4f7; }.column-map-row > em { color:var(--orange-dark);font-size:15px;font-style:normal; }
.column-map-row > .custom-select { width:100%; }.column-map-row > .custom-select .custom-select-trigger { min-height:36px;font-size:8px; }.column-map-row > .custom-select .custom-select-menu { min-width:100%;max-height:230px; }
.excel-precision-setting { display:flex;align-items:center;justify-content:space-between;gap:18px;margin-top:16px;padding:13px;border:1px solid #d9e2eb;border-radius:11px;background:#fff; }.excel-precision-setting strong,.excel-precision-setting small { display:block; }.excel-precision-setting strong { color:#344860;font-size:9px; }.excel-precision-setting small { margin-top:4px;color:#7f8d9f;font-size:8px;line-height:1.5; }
.excel-precision-buttons { flex:0 0 auto;display:flex;gap:5px;padding:4px;border-radius:9px;background:#f0f3f7; }.excel-precision-buttons button { min-width:42px;padding:7px 8px;border:0;border-radius:7px;color:#7b8798;background:transparent;font-size:8px;font-weight:850;transition:transform .2s,color .2s,background .2s; }.excel-precision-buttons button:hover { transform:translateY(-1px);color:var(--navy); }.excel-precision-buttons button.active { color:#291a05;background:var(--orange);box-shadow:0 4px 10px rgba(245,155,50,.18); }
.output-mode { display:flex;align-items:flex-start;gap:10px;margin-top:16px;padding:12px;border:1px solid #d9e2eb;border-radius:10px;background:#fff;cursor:pointer; }.output-mode input { flex:0 0 auto;width:18px;height:18px;accent-color:var(--orange); }.output-mode strong,.output-mode small { display:block; }.output-mode strong { color:#344860;font-size:9px; }.output-mode small { margin-top:4px;color:#7f8d9f;font-size:8px;line-height:1.5; }
.column-dialog-error { min-height:15px;margin:9px 0 0;color:#bd4c4c;font-size:9px; }
.column-dialog-actions { flex:0 0 auto;display:flex;justify-content:flex-end;gap:9px;padding:15px 24px;border-top:1px solid #e3e8ef;background:#fff; }.column-dialog-actions button { min-height:40px;padding:0 17px;border:1px solid #d4dce6;border-radius:9px;color:#55657a;background:#fff;font-size:9px;font-weight:900;transition:transform .22s var(--ease),background .22s,border-color .22s; }.column-dialog-actions button:hover { transform:translateY(-2px); }.column-dialog-actions .confirm-column-conversion { border-color:var(--orange);color:#291a05;background:var(--orange); }.column-dialog-actions .confirm-column-conversion:hover { background:#ffae50; }

.excel-results-card { scroll-margin-top:18px; }.excel-results-card.result-enter { animation:resultCardIn .5s var(--ease) both; }
.excel-results-head { display:flex;align-items:center;justify-content:space-between;gap:18px;padding:20px 22px;border-bottom:1px solid #e5eaf0; }.excel-results-head p { margin:0 0 4px;color:var(--orange-dark);font-size:8px;font-weight:900;letter-spacing:.15em; }.excel-results-head h2 { display:inline;margin:0;font-size:20px; }.excel-results-head > div:first-child > span { margin-left:8px;color:#8390a2;font-size:8px; }
.excel-export-actions { display:flex;gap:8px; }.excel-export-actions button { min-height:38px;padding:0 14px;border:1px solid #d3dce6;border-radius:9px;color:#4d5e73;background:#fff;font-size:9px;font-weight:900;transition:transform .22s var(--ease),box-shadow .22s; }.excel-export-actions button:hover { transform:translateY(-2px);box-shadow:0 8px 18px rgba(18,35,60,.08); }.excel-export-actions .primary-export { border-color:var(--orange);color:#291a05;background:var(--orange); }
.excel-result-stats { display:grid;grid-template-columns:repeat(4,1fr);border-bottom:1px solid #e4e9ef;background:#f8fafc; }.excel-result-stats span { padding:14px 18px;border-right:1px solid #e4e9ef; }.excel-result-stats span:last-child { border-right:0; }.excel-result-stats small,.excel-result-stats strong { display:block; }.excel-result-stats small { color:#8793a4;font-size:7px; }.excel-result-stats strong { margin-top:4px;color:var(--navy);font-size:17px; }
.excel-table-wrap { max-height:440px;overflow:auto; }.excel-table-wrap table { width:100%;border-collapse:collapse;font-size:9px;white-space:nowrap; }.excel-table-wrap th { position:sticky;z-index:2;top:0;padding:10px 12px;color:#fff;background:#213858;text-align:left; }.excel-table-wrap td { max-width:220px;padding:10px 12px;overflow:hidden;border-bottom:1px solid #e8edf2;color:#58687c;text-overflow:ellipsis; }.excel-table-wrap tbody tr { animation:rowReveal .4s var(--ease) both;animation-delay:min(calc(140ms + var(--row-index,0) * 24ms),620ms); }.excel-table-wrap tbody tr:hover td { color:var(--navy);background:#fff9f1; }.excel-table-wrap th.converted-column { color:#382100;background:var(--orange); }.excel-table-wrap td.converted-column { color:#b76406;background:#fffaf3;font-weight:850; }
.excel-table-note { margin:0;padding:11px 20px;color:#8390a1;background:#f8fafc;font-size:8px; }

.unit-footer { display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:76px;padding:0 clamp(22px,6vw,86px);border-top:1px solid var(--line);color:#8591a2;background:#fff;font-size:9px; }
.unit-footer a { color:var(--navy);font-family:inherit;font-size:13px;font-weight:900;text-decoration:none; }

@keyframes unitPulse { 50% { transform:scale(.985);opacity:.7; } }
@keyframes processingSpin { to { transform:rotate(360deg); } }
@keyframes fileAccepted { 0% { transform:scale(.985);opacity:.72; } 65% { transform:scale(1.006); } }
@keyframes successBounce { 45% { transform:scale(1.12); } }
@keyframes progressEnter { from { opacity:0;transform:translateY(8px) scale(.99); } }
@keyframes numberFlight { 0% { opacity:0;transform:translate3d(0,10px,0) scale(.86); } 25% { opacity:.75; } 100% { opacity:0;transform:translate3d(var(--particle-drift),var(--particle-rise),0) scale(1.08); } }
@keyframes dialogEnter { from { opacity:0;transform:translateY(18px) scale(.965); } }
@keyframes resultCardIn { from { opacity:0;transform:translateY(16px) scale(.99); } }
@keyframes rowReveal { from { opacity:0;transform:translateY(7px); } }
@media (max-width:900px) {
  .converter-grid { grid-template-columns:1fr; }
  .unit-hero { padding-top:48px;padding-bottom:54px; }
  .excel-flow { gap:9px; }.excel-flow > span { min-width:0;flex:1; }.excel-flow em { display:none; }
  .column-map-row { grid-template-columns:minmax(150px,1fr) minmax(120px,.8fr) auto minmax(120px,.8fr); }
}
@media (max-width:620px) {
  .unit-header { grid-template-columns:1fr auto;padding-left:16px;padding-right:16px; }.unit-brand { display:none; }
  .single-converter { grid-template-columns:1fr;align-items:center; }
  .swap-button { margin:0 auto;transform:rotate(90deg); }.swap-button:hover { transform:rotate(270deg); }
  .dimension-triplet-body { grid-template-columns:1fr; }
  .triplet-arrow { transform:rotate(90deg); }.dimension-triplet:focus-within .triplet-arrow { transform:translateY(2px) rotate(90deg); }
  .triplet-output { padding-bottom:22px; }
  .quick-results { grid-template-columns:repeat(2,1fr); }
  .converter-card-head,.converter-body { padding-left:17px;padding-right:17px; }
  .excel-batch-body { padding:17px; }.excel-flow { align-items:stretch; }.excel-flow > span { display:flex;flex-direction:column;gap:3px;text-align:center; }.excel-flow i { align-self:center; }.excel-flow b { margin-top:3px; }
  .column-dialog-head,.column-dialog-body,.column-dialog-actions { padding-left:16px;padding-right:16px; }.column-map-row { grid-template-columns:1fr auto; }.column-map-row select { grid-column:auto; }.column-map-row .column-source { grid-column:1 / 2; }.column-map-row > em { grid-column:2 / 3;grid-row:2; }.column-map-row .column-target { grid-column:1 / -1; }.column-check { grid-column:1 / -1; }
  .column-map-row > .custom-select { grid-column:auto; }.column-map-row > .custom-select.column-source { grid-column:1 / 2; }.column-map-row > .custom-select.column-target { grid-column:1 / -1; }
  .excel-precision-setting { align-items:flex-start;flex-direction:column; }.excel-precision-buttons { width:100%; }.excel-precision-buttons button { flex:1; }
  .excel-results-head { align-items:flex-start;flex-direction:column; }.excel-export-actions { width:100%; }.excel-export-actions button { flex:1; }
  .excel-result-stats { grid-template-columns:repeat(2,1fr); }.excel-result-stats span:nth-child(2) { border-right:0; }.excel-result-stats span:nth-child(-n+2) { border-bottom:1px solid #e4e9ef; }
  .unit-footer { flex-direction:column;justify-content:center;padding-top:18px;padding-bottom:18px;text-align:center; }
}
@media (max-width:480px) {
  .unit-header { min-height:62px;padding-left:14px;padding-right:14px; }
  .back-link { gap:6px;font-size:10px; }
  .online-chip { padding:6px 8px;font-size:7px; }
  .unit-hero { padding:44px 16px 48px; }
  .unit-kicker { font-size:8px;letter-spacing:.14em; }
  .unit-hero h1 { font-size:clamp(31px,10vw,39px);line-height:1.13; }
  .unit-hero h1 span { display:block;margin:5px 0 0; }
  .unit-hero > p:last-child { font-size:11px;line-height:1.75; }
  .converter-main { padding:20px 8px 52px; }
  .converter-grid { gap:12px; }
  .converter-card { border-radius:14px; }
  .converter-card-head { gap:10px;padding:18px 14px 14px; }
  .converter-card-head h2 { font-size:18px; }
  .converter-card-head > span { display:none; }
  .converter-body,.batch-body { padding:16px 14px; }
  .value-box input,.result-box strong { font-size:23px; }
  .value-box .custom-select { min-width:102px; }
  .custom-select-menu { min-width:max(100%,160px);max-width:calc(100vw - 32px); }
  .dimension-triplet { padding:13px; }
  .dimension-triplet-head { align-items:flex-start; }
  .dimension-triplet-head h3 { font-size:11px; }
  .triplet-values { gap:5px; }
  .triplet-inputs label,.triplet-output .triplet-values > span { min-height:54px;padding:8px; }
  .triplet-inputs input { font-size:15px; }
  .triplet-output strong { font-size:13px; }
  .precision-row { align-items:flex-start;flex-direction:column; }
  .precision-buttons { width:100%; }
  .precision-buttons button { flex:1; }
  .quick-results { grid-template-columns:1fr; }
  .batch-actions { grid-template-columns:1fr; }
  .excel-batch-body { padding:14px; }
  .excel-flow { padding:11px 8px; }
  .excel-drop-zone { min-height:170px;padding:20px 12px; }
  .conversion-progress { gap:10px;padding:11px; }
  .conversion-progress-copy { gap:7px; }
  .column-dialog { width:calc(100% - 14px);max-height:calc(100vh - 14px);border-radius:14px; }
  .column-dialog-shell { max-height:calc(100vh - 14px); }
  .column-dialog-head,.column-dialog-body,.column-dialog-actions { padding-left:14px;padding-right:14px; }
  .column-dialog-actions { display:grid;grid-template-columns:1fr; }
  .column-dialog-actions button { width:100%; }
  .excel-export-actions { display:grid;grid-template-columns:1fr;width:100%; }
  .excel-result-stats { grid-template-columns:1fr 1fr; }
  .excel-table-note { padding:11px 14px; }
}
@media (prefers-reduced-motion:reduce) { *,*::before,*::after { scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important; } }
