/* Trenches lane filters (filters.js): section index on the left, the sections on the right; hairlines and
   hover instead of frames; every number a Min – Max pair with its unit inside the field. Variables come from
   theme.css / m2.css, so the pane follows the Appearance sheet (accent, background, corners). */
#filter .fm:has(#cz-filters:not([hidden])){width:min(980px,calc(100vw - 32px))}
#cz-filters.fx-pane{padding:0;gap:0;overflow:hidden;max-height:none}
.fx{display:flex;flex-direction:column;height:min(64vh,660px);min-height:300px;font-family:inherit}
.fx button{font-family:inherit;cursor:pointer}
.fx-top{display:flex;align-items:center;gap:10px 14px;padding:10px 16px;border-bottom:1px solid var(--line);flex-wrap:wrap;flex:none}
.fx-lanes{border:0!important;padding:0!important;gap:4px!important}
.fx-lanes button{border:0!important;background:transparent;color:var(--sub);height:28px;padding:0 11px;border-radius:999px;font-size:12.5px;font-weight:500;transition:background-color var(--m-fast,.14s) ease,color var(--m-fast,.14s) ease}
.fx-lanes button:hover{color:var(--text);background:var(--chip)}
.fx-lanes button.on{background:var(--chip);color:var(--text)}
.fx-lanes .n{min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:var(--accent-bg,rgba(198,241,53,.14));color:var(--accent,var(--green));font-size:10px;line-height:16px;text-align:center}
.fx-count{font-size:12px;color:var(--sub);font-variant-numeric:tabular-nums;white-space:nowrap}
.fx-count.zero{color:var(--red-2,#e8616a)}
.fx-sp{flex:1}
.fx-unk{display:inline-flex;align-items:center;gap:8px;font-size:12px;color:var(--sub);white-space:nowrap}
.fx-unk .segx{border-radius:999px;border:1px solid var(--line);overflow:hidden}
.fx-unk .segx button{height:24px;padding:0 10px;font-size:11.5px;border:0;background:transparent;color:var(--sub)}
.fx-unk .segx button.on{background:var(--chip);color:var(--text)}
.fx-prof{display:inline-flex;align-items:center;gap:2px}
.fx-prof select{height:28px;border:1px solid var(--line);background:transparent;color:var(--text);border-radius:999px;padding:0 10px;font-family:inherit;font-size:12px;max-width:160px;outline:0}
.fx-prof select:focus-visible{border-color:var(--accent-line,var(--green-line))}
.fx .ib{width:28px;height:28px;display:inline-grid;place-items:center;border:0;background:transparent;color:var(--sub);border-radius:999px;padding:0;transition:background-color var(--m-fast,.14s) ease,color var(--m-fast,.14s) ease}
.fx .ib:hover{background:var(--chip);color:var(--text)}
.fx .ib svg{width:15px;height:15px}
.fx-body{display:grid;grid-template-columns:172px minmax(0,1fr);min-height:0;flex:1}
.fx-nav{display:flex;flex-direction:column;gap:1px;padding:10px 8px;border-right:1px solid var(--line);overflow-y:auto}
.fx-nav button{display:flex;align-items:center;justify-content:space-between;gap:8px;border:0;background:transparent;color:var(--sub);font-size:12.5px;font-weight:500;line-height:1.2;padding:8px 10px;border-radius:var(--r-sm,6px);text-align:left;transition:background-color var(--m-fast,.14s) ease,color var(--m-fast,.14s) ease}
.fx-nav button:hover{background:var(--chip);color:var(--text)}
.fx-nav button.on{color:var(--text);background:color-mix(in srgb,var(--chip) 70%,transparent)}
.fx-n{display:inline-block;min-width:18px;height:18px;padding:0 5px;border-radius:999px;background:var(--accent-bg,rgba(198,241,53,.14));color:var(--accent,var(--green));font-size:10.5px;font-weight:600;line-height:18px;text-align:center;margin-left:8px;font-variant-numeric:tabular-nums;text-transform:none;letter-spacing:0}
.fx-main{overflow-y:auto;padding:2px 20px 28px;overscroll-behavior:contain}
.fx-sec{padding:16px 0 10px;border-bottom:1px solid var(--line)}
.fx-sec:last-child{border-bottom:0}
.fx-sh{display:flex;align-items:center;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--sub);margin:0 0 12px}
.fx-kws{display:grid;grid-template-columns:1fr 1fr;gap:12px 16px}
.fx-kw{display:flex;flex-direction:column;gap:6px;font-size:11.5px;color:var(--sub);font-weight:500}
.fx input[type=text]{height:32px;width:100%;background:var(--panel-2);border:1px solid var(--line);border-radius:var(--r-sm,6px);padding:0 10px;color:var(--text);font-family:inherit;font-size:12.5px;outline:0;transition:border-color var(--m-fast,.14s) ease,box-shadow var(--m-fast,.14s) ease}
.fx input[type=text]:hover:not(:disabled){border-color:var(--line-2)}
.fx input[type=text]:focus{border-color:var(--accent-line,var(--green-line));box-shadow:0 0 0 3px var(--accent-bg,rgba(198,241,53,.12))}
.fx input[type=text]::placeholder{color:var(--dim)}
.fx input:disabled{cursor:not-allowed}
.fx-grps{display:flex;flex-direction:column;gap:2px}
.fx-grp{border-radius:var(--r-sm,8px);transition:background-color var(--m-fast,.14s) ease}
.fx-grp.open{background:color-mix(in srgb,var(--chip) 45%,transparent)}
.fx-gh{display:flex;align-items:center;gap:9px;width:100%;border:0;background:transparent;color:var(--text);padding:9px 10px;font-size:12.5px;font-weight:500;text-align:left;border-radius:var(--r-sm,8px)}
.fx-gh:hover{background:var(--chip)}
.fx-gh .c{display:inline-grid;place-items:center;width:18px;height:18px}
.fx-gh .c img{width:16px;height:16px;border-radius:50%;display:block}
.fx-gh b{font-weight:600}
.fx-here{font-style:normal;font-size:10.5px;color:var(--accent,var(--green));background:var(--accent-bg,rgba(198,241,53,.14));padding:1px 7px;border-radius:999px}
.fx-gn{margin-left:auto;color:var(--sub);font-size:11.5px;font-variant-numeric:tabular-nums}
.fx-gh svg{width:14px;height:14px;color:var(--dim);transition:transform var(--m-mid,.2s) var(--m-ease,ease)}
.fx-grp.open .fx-gh svg{transform:rotate(180deg)}
.fx-gb{display:none;padding:2px 10px 10px 37px}
.fx-grp.open .fx-gb{display:block}
.fx-chips{display:flex;flex-wrap:wrap;gap:6px}
.fx-chip{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 11px;border:1px solid var(--line);background:transparent;color:var(--sub);border-radius:999px;font-size:12px;font-weight:500;transition:background-color var(--m-fast,.14s) ease,color var(--m-fast,.14s) ease,border-color var(--m-fast,.14s) ease}
.fx-chip img{width:14px;height:14px;border-radius:3px;object-fit:cover;display:block}
.fx-chip:hover{color:var(--text);border-color:var(--line-2)}
.fx-chip:active{transform:scale(.97)}
.fx-chip.on{color:var(--text);border-color:var(--lp,var(--accent,var(--green)));background:color-mix(in srgb,var(--lp,var(--accent,var(--green))) 14%,transparent)}
.fx-more{border:0;background:transparent;color:var(--accent,var(--green));font-size:12px;font-weight:500;height:28px;padding:0 6px}
.fx-ga{display:flex;gap:2px;margin:8px 0 0 -6px}
.fx-ga button{border:0;background:transparent;color:var(--sub);font-size:11.5px;padding:4px 7px;border-radius:999px}
.fx-ga button:hover{color:var(--text);background:var(--chip)}
.fx-flags{display:grid;grid-template-columns:1fr 1fr;gap:2px 16px}
.fx-flag{display:flex;align-items:center;gap:10px;font-size:12.5px;color:var(--text);padding:7px 6px;cursor:pointer;border-radius:var(--r-sm,6px);transition:background-color var(--m-fast,.14s) ease}
.fx-flag:hover{background:var(--chip)}
.fx-flag input{accent-color:var(--accent,var(--green));width:15px;height:15px;margin:0;flex:none}
.fx-flag small,.fx-l small{display:block;color:var(--dim);font-size:10.5px;font-weight:400;margin-top:1px}
.fx-flag.na{opacity:.5;cursor:default}
.fx-flag.na:hover{background:transparent}
.fx-rgs{display:grid;grid-template-columns:1fr 1fr;gap:8px 24px}
.fx-rg{display:grid;grid-template-columns:minmax(0,1fr) 96px 10px 96px;align-items:center;gap:6px;padding:1px 0}
.fx-l{font-size:12.5px;color:var(--text);font-weight:500;cursor:help;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fx-in{position:relative;display:block;min-width:0}
.fx-in input{padding-right:34px!important;font-variant-numeric:tabular-nums}
.fx-in em{position:absolute;right:9px;top:50%;transform:translateY(-50%);font-size:10.5px;font-weight:500;color:var(--dim);font-style:normal;pointer-events:none;white-space:nowrap}
.fx-dash{color:var(--dim);font-style:normal;text-align:center}
.fx-err{display:none;grid-column:2/-1;font-size:10.5px;color:var(--red-2,#e8616a);margin-top:-2px}
.fx-rg.bad input{border-color:var(--red,#d93a44)!important}
.fx-rg.bad .fx-err{display:block}
.fx-rg.na{opacity:.5}
.fx-rg.shake{animation:fx-shake .32s ease}
@keyframes fx-shake{20%{transform:translateX(-3px)}40%{transform:translateX(3px)}60%{transform:translateX(-2px)}80%{transform:translateX(2px)}}
.fx-na{margin-top:10px}
.fx-nah{display:flex;align-items:flex-start;gap:6px;border:0;background:transparent;color:var(--dim);font-size:11.5px;padding:4px 0;text-align:left;line-height:1.45}
.fx-nah:hover{color:var(--sub)}
.fx-nah svg{width:12px;height:12px;flex:none;margin-top:2px;transition:transform var(--m-mid,.2s) var(--m-ease,ease)}
.fx-na.open .fx-nah svg{transform:rotate(180deg)}
.fx-na .fx-rgs{margin-top:8px}
@media (max-width:900px){.fx-rgs{grid-template-columns:1fr}}
@media (max-width:720px){
  .fx-top{gap:6px 8px;padding:8px 12px}
  .fx-unk{order:8;width:100%;justify-content:space-between}   /* phones: the policy keeps its label, on a line of its own */
  .fx-count{order:9;width:100%}
  #filter:has(#cz-filters:not([hidden])) #filter-apply,#filter:has(#cz-filters:not([hidden])) #filter-export{display:none}   /* Done applies on this tab */
  #filter .fm-f{flex-wrap:nowrap}
  .fx{height:auto;max-height:calc(100dvh - 200px)}
  .fx-body{grid-template-columns:1fr;grid-template-rows:auto minmax(0,1fr)}
  .fx-nav{flex-direction:row;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);padding:6px 8px;scrollbar-width:none}
  .fx-nav button{white-space:nowrap;padding:6px 10px}
  .fx-kws,.fx-flags{grid-template-columns:1fr}
  .fx-rg{grid-template-columns:minmax(0,1fr) 84px 10px 84px}
  .fx-gb{padding-left:10px}
  .fx-main{padding:2px 14px 24px}
}
@media (prefers-reduced-motion:reduce){.fx *,.fx{transition:none!important;animation:none!important}}
.fx-u{font-style:normal;font-weight:400;font-size:10.5px;color:var(--dim);margin-left:4px}