/* ============================================================
   974工具箱 · 单位换算器 v2（ucalc）
   计算器风格 · 双向即时换算 · AA/AAA 配色
   ============================================================ */
.ucalc{--uc-brand:#12554A;--uc-brand-d:#0B3B33;--uc-accent:#B4551F;--uc-ink:#1C1E1A;--uc-ink2:#5C5F57;--uc-line:#E3DCCF;--uc-bg:#FFFDF8;--uc-r:14px;font:15px/1.6 var(--sans);color:var(--uc-ink)}
.ucalc *{box-sizing:border-box}

/* 计算器主体卡片 */
.uc-spec{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:0 0 12px}
.uc-spec label{font-size:13px;color:var(--uc-mut)}
.uc-spec select,.uc-spec input{height:38px;border:1px solid var(--uc-line);border-radius:9px;padding:0 10px;font:inherit;font-size:14px;background:#fff;color:inherit;min-width:0}
.uc-spec select{max-width:240px}
.uc-spec input{width:110px}
.uc-spec .uc-mu{font-size:12px;color:var(--uc-mut)}
@media (max-width:520px){.uc-spec select{flex:1}.uc-spec input{flex:1;width:auto}}
.uc-body{background:var(--uc-bg);border:1px solid var(--uc-line);border-radius:var(--uc-r);padding:22px 22px 18px;box-shadow:0 1px 2px rgba(28,30,26,.04),0 10px 28px rgba(28,30,26,.06);transition:box-shadow .25s ease}
.uc-body:focus-within{box-shadow:0 2px 6px rgba(28,30,26,.06),0 16px 40px rgba(18,85,74,.10)}

.uc-row{display:grid;grid-template-columns:1fr auto 1fr;gap:14px;align-items:end}
.uc-cell{min-width:0}
.uc-cell label{display:block;font-size:12.5px;font-weight:700;color:var(--uc-ink2);margin-bottom:7px;letter-spacing:.02em}

/* 输入组合 */
.uc-in{display:flex;background:#fff;border:1.5px solid var(--uc-line);border-radius:11px;overflow:hidden;transition:border-color .18s ease,box-shadow .18s ease}
.uc-in:focus-within{border-color:var(--uc-brand);box-shadow:0 0 0 3px rgba(18,85,74,.14)}
.uc-in input{flex:1;min-width:0;border:0;outline:0;background:transparent;padding:12px 4px 12px 14px;font:600 22px/1.3 var(--mono);color:var(--uc-ink);letter-spacing:-.01em}
.uc-in input::placeholder{color:#9A9C93;font-weight:400}
.uc-in select{border:0;outline:0;border-left:1px solid var(--uc-line);background:#F4F1E9;padding:0 6px 0 10px;font:600 13.5px/1 var(--sans);color:var(--uc-brand-d);cursor:pointer;max-width:46%;transition:background .15s}
.uc-in select:hover{background:#ECE8DD}
.uc-in select:focus-visible{box-shadow:inset 0 0 0 2px var(--uc-brand)}
.uc-in.is-out{background:#F2F7F4}
.uc-in.is-out input{color:var(--uc-brand-d)}

/* 交换按钮 */
.uc-swap{width:44px;height:44px;border-radius:50%;border:1.5px solid var(--uc-line);background:#fff;color:var(--uc-brand);font-size:19px;cursor:pointer;display:grid;place-items:center;margin-bottom:5px;transition:transform .35s cubic-bezier(.34,1.56,.64,1),border-color .18s,background .18s}
.uc-swap:hover{border-color:var(--uc-brand);background:#F2F7F4}
.uc-swap:active{transform:rotate(180deg) scale(.92)}
.uc-swap.rot{transform:rotate(180deg)}

/* 精度 + 快捷值 */
.uc-sub{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin-top:16px;padding-top:14px;border-top:1px dashed var(--uc-line)}
.uc-seg{display:inline-flex;background:#F0EDE4;border-radius:9px;padding:3px;gap:2px}
.uc-seg button{border:0;background:transparent;padding:4px 11px;font:600 12.5px var(--sans);color:var(--uc-ink2);border-radius:7px;cursor:pointer;transition:all .15s}
.uc-seg button[aria-pressed="true"]{background:#fff;color:var(--uc-brand-d);box-shadow:0 1px 3px rgba(28,30,26,.12)}
.uc-seg button:hover:not([aria-pressed="true"]){color:var(--uc-ink)}
.uc-chips{display:inline-flex;gap:6px;flex-wrap:wrap}
.uc-chips button{border:1px solid var(--uc-line);background:#fff;border-radius:999px;padding:3px 11px;font:600 12.5px var(--mono);color:var(--uc-ink2);cursor:pointer;transition:all .15s}
.uc-chips button:hover{border-color:var(--uc-brand);color:var(--uc-brand-d);background:#F2F7F4}

/* 全部单位结果表 */
.uc-all{margin-top:16px;border:1px solid var(--uc-line);border-radius:11px;overflow:hidden;background:#fff}
.uc-all-h{width:100%;display:flex;justify-content:space-between;align-items:center;border:0;background:#F7F4EC;padding:10px 15px;font:700 13.5px var(--sans);color:var(--uc-brand-d);cursor:pointer}
.uc-all-h:hover{background:#F0EDE2}
.uc-all-h .arr{transition:transform .25s ease;font-size:11px}
.uc-all.open .uc-all-h .arr{transform:rotate(180deg)}
.uc-all-b{display:none;max-height:340px;overflow:auto}
.uc-all.open .uc-all-b{display:block}
.uc-kv{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:8px 15px;border-top:1px solid #F0EBE0;cursor:pointer;transition:background .12s}
.uc-kv:first-child{border-top:0}
.uc-kv:hover{background:#F7F9F6}
.uc-kv span{font-size:13.5px;color:var(--uc-ink2);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uc-kv b{font:600 14.5px var(--mono);color:var(--uc-ink);text-align:right;word-break:break-all}
.uc-kv.cur span,.uc-kv.cur b{color:var(--uc-accent)}
.uc-copied{font-size:11.5px;color:var(--uc-ok,#2E7D5B);font-weight:700;margin-left:8px}

/* 分类页签（旗舰页） */
.uc-cats{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:16px}
.uc-cats button{border:1px solid var(--uc-line);background:#fff;border-radius:999px;padding:6px 15px;font:600 13.5px var(--sans);color:var(--uc-ink2);cursor:pointer;transition:all .18s}
.uc-cats button:hover{border-color:var(--uc-brand);color:var(--uc-brand-d)}
.uc-cats button[aria-pressed="true"]{background:var(--uc-brand);border-color:var(--uc-brand);color:#fff;box-shadow:0 3px 10px rgba(18,85,74,.28)}

/* 旗舰页双列布局：左导航 + 右（换算卡粘性） */
.uc-layout{display:grid;grid-template-columns:225px 1fr;gap:18px;align-items:start}
.uc-left{position:sticky;top:76px;z-index:50;max-height:calc(100vh - 92px);display:flex;flex-direction:column;gap:10px;min-width:0}
.uc-right{min-width:0}
.uc-right .uc-body{position:sticky;top:76px;z-index:5}
.uc-search{position:relative}
.uc-search input{width:100%;height:40px;border:1.5px solid var(--uc-line);border-radius:11px;background:#fff;padding:0 14px;font:14px var(--sans);color:var(--uc-ink);outline:0;transition:border-color .18s,box-shadow .18s}
.uc-search input:focus{border-color:var(--uc-brand);box-shadow:0 0 0 3px rgba(18,85,74,.14)}
.uc-qres{position:absolute;top:44px;left:0;right:0;background:#fff;border:1px solid var(--uc-line);border-radius:11px;box-shadow:0 10px 30px rgba(28,30,26,.14);z-index:30;overflow:hidden;max-height:330px;overflow-y:auto}
.uc-qres button{display:flex;justify-content:space-between;align-items:center;gap:10px;width:100%;border:0;background:#fff;padding:9px 14px;font:14px var(--sans);color:var(--uc-ink);cursor:pointer;text-align:left}
.uc-qres button:hover{background:#F2F7F4}
.uc-qres button b{font-weight:700}
.uc-qres button span{font-size:12px;color:var(--uc-ink2);flex:none}
.uc-qempty{padding:12px 14px;font-size:13.5px;color:var(--uc-ink2)}
.uc-nav{display:flex;flex-direction:column;gap:2px;background:var(--uc-bg);border:1px solid var(--uc-line);border-radius:var(--uc-r);padding:8px;overflow-y:auto}
.uc-nav-g{display:flex;flex-direction:column}
.uc-nav-t{font-size:11px;color:var(--uc-ink3,#8E9086);font-weight:700;letter-spacing:.06em;padding:8px 10px 4px}
.uc-nav button{text-align:left;border:0;background:transparent;padding:6px 10px;border-radius:9px;font:600 13.5px var(--sans);color:var(--uc-ink2);cursor:pointer;transition:all .14s;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.uc-nav button:hover{background:#F0EDE2;color:var(--uc-ink)}
.uc-nav button[aria-pressed="true"]{background:var(--uc-brand);color:#fff}
/* 京东式侧栏：分组 + 飞出面板 */
.uc-side{display:flex;flex-direction:column;gap:4px;background:var(--uc-bg);border:1px solid var(--uc-line);border-radius:var(--uc-r);padding:8px}
.uc-side-item{position:relative}
.uc-side-g{width:100%;display:flex;justify-content:space-between;align-items:center;gap:8px;border:0;background:transparent;padding:11px 12px;border-radius:10px;font:700 14px var(--sans);color:var(--uc-ink);cursor:pointer;transition:background .15s;text-align:left;min-height:44px}
.uc-side-g span{font:600 11.5px var(--sans);color:var(--uc-ink2);flex:none}
.uc-side-g:hover,.uc-side-item.cur .uc-side-g{background:#F0EDE2}
.uc-side-item.cur .uc-side-g{color:var(--uc-brand-d);box-shadow:inset 3px 0 0 var(--uc-brand)}
.uc-side-g[aria-expanded="true"]{background:var(--uc-brand);color:#fff}
.uc-side-g[aria-expanded="true"] span{color:rgba(255,255,255,.75)}
.uc-fly{display:none;position:absolute;left:auto;right:auto;top:0;width:580px;max-width:none;background:#fff;border:1px solid var(--uc-line);border-radius:13px;box-shadow:0 14px 44px rgba(28,30,26,.16);padding:10px;z-index:40;grid-template-columns:1fr 1fr;gap:10px 14px;align-content:start;overflow-x:hidden}
.uc-fly::before{content:"";position:absolute;left:-14px;top:0;bottom:0;width:14px}
.uc-side-item.open .uc-fly{display:grid}
@media (hover:hover) and (min-width:761px){.uc-side-item:hover .uc-fly{display:grid}}
.uc-fly-cat{min-width:0}
.uc-fly-t{display:flex;justify-content:space-between;align-items:center;width:100%;border:0;background:#F5F1E7;border-radius:8px;padding:6px 10px;font:700 13px var(--sans);color:var(--uc-brand-d);cursor:pointer;transition:background .15s;margin-bottom:5px}
.uc-fly-t:hover{background:#EBE5D5}
.uc-fly-t i{font-style:normal;color:var(--uc-ink3,#8E9086)}
.uc-fly-t.on{background:var(--uc-brand);color:#fff}
.uc-fly-t.on i{color:rgba(255,255,255,.7)}
.uc-fly-chips{display:flex;flex-wrap:wrap;gap:4px}
.uc-chip{border:1px solid var(--uc-line);background:#fff;border-radius:999px;padding:3px 9px;font:600 12px var(--sans);color:var(--uc-ink2);cursor:pointer;transition:all .14s;min-height:25px}
.uc-chip:hover{border-color:var(--uc-brand);color:var(--uc-brand-d);background:#F2F7F4}
.uc-recent{display:flex;align-items:center;gap:7px;flex-wrap:wrap;background:var(--uc-bg);border:1px solid var(--uc-line);border-radius:11px;padding:8px 10px}
.uc-recent-t{font-size:11.5px;font-weight:700;color:var(--uc-ink3,#8E9086);flex:none}
.uc-recent-b{display:flex;gap:5px;flex-wrap:wrap}
.uc-chip-r{border-color:var(--uc-brand);color:var(--uc-brand-d)}

/* 本页目录在窄桌面遮挡主列的修复（仅本板块页面加载本 CSS） */
@media (min-width:1280px) and (max-width:1519px){.toc-side{display:none!important}}

@media (max-width:760px){
  .ucalc{font-size:14px}
  .uc-body{padding:16px 14px 14px}
  .uc-row{grid-template-columns:1fr;gap:8px}
  .uc-swap{justify-self:center;transform:rotate(90deg);margin:2px 0}
  .uc-swap.rot{transform:rotate(270deg)}
  .uc-in input{font-size:19px;padding:10px 4px 10px 12px}
  .uc-layout{grid-template-columns:1fr}
  .uc-left{position:static;max-height:none}
  .uc-right .uc-body{position:static}
  .uc-nav{flex-direction:row;flex-wrap:wrap}
  /* 移动/微信：飞出面板改手风琴内嵌，点击展开，触摸目标 ≥44px */
  .uc-side-g{min-height:48px;font-size:15px}
  .uc-fly{position:static;display:none;width:auto;max-width:none;grid-template-columns:1fr;gap:8px;box-shadow:none;border:0;border-top:1px dashed var(--uc-line);border-radius:0;padding:10px 2px 4px;margin-top:4px;background:#FBFAF5;overflow:visible}
  .uc-side-item.open .uc-fly{display:grid}
  .uc-chip{min-height:40px;padding:8px 14px;font-size:14px}
  .uc-fly-t{min-height:40px}
  .uc-nav-g{flex-direction:row;flex-wrap:wrap;align-items:center}
  .uc-nav-t{width:100%;padding:6px 4px 2px}
  .uc-nav button{padding:6px 11px}
}
@media (prefers-reduced-motion:reduce){
  .ucalc *{transition:none!important;animation:none!important}
}