/* quality.fluidsealab.com — shared styles. Fluidseal yellow label header (as shipping.fluidsealab.com), IBM Plex body, Barlow Condensed display. */
[hidden]{display:none!important}
:root{
  --bg:#f5f5f2;--surface:#fff;--fg:#231f20;--muted:#5d5a55;--line:#dddad3;
  --label:#ffdd00;--label-fg:#231f20;--accent:#8a6d00;--bad:#b3261e;--bad-bg:#f9e3e3;--ok:#2e6b3a;--ok-bg:#e1f3e8;--warn:#9a6a12;--warn-bg:#fbf0d6;
  --display:"Barlow Condensed","Arial Narrow",Arial,sans-serif;
  --body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --mono:ui-monospace,Consolas,Menlo,monospace;
}
@media (prefers-color-scheme: dark){:root{--bg:#18171a;--surface:#222126;--fg:#ecebe6;--muted:#a9a59c;--line:#3a3840;--accent:#ffdd00;--bad:#ff8a80;--bad-bg:#3a1c1c;--ok:#8fd19e;--ok-bg:#163224;--warn:#e2b04f;--warn-bg:#33290f;color-scheme:dark}}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--fg);font:15px/1.55 var(--body)}
header{background:var(--label);color:var(--label-fg);border-bottom:2px solid var(--label-fg);padding:14px max(16px,env(safe-area-inset-left,0px));display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap}
header h1{margin:0;font:700 30px/1 var(--display);text-transform:uppercase;letter-spacing:.02em}
header p{margin:4px 0 0;font-size:13px}
header a{color:inherit}
main{max-width:900px;margin:0 auto;padding:24px max(16px,env(safe-area-inset-right,0px)) 64px max(16px,env(safe-area-inset-left,0px));display:flex;flex-direction:column;gap:16px}
main.narrow{max-width:560px;padding-top:32px}
.card{background:var(--surface);border:1px solid var(--line);padding:18px 20px;display:flex;flex-direction:column;gap:12px}
h2{margin:0;font:700 22px/1.1 var(--display);text-transform:uppercase}
.card h2.sec{font-size:15px;letter-spacing:.08em;color:var(--muted)}
label{font-weight:600;font-size:12px;text-transform:uppercase;letter-spacing:.05em;color:var(--muted)}
input{font:inherit;padding:10px 12px;border:1px solid var(--line);background:var(--bg);color:var(--fg);width:100%}
input.mono{font:15px var(--mono)}
button{font:600 15px var(--body);padding:10px 16px;border:2px solid var(--fg);background:var(--label);color:var(--label-fg);cursor:pointer}
button.ghost{background:transparent;color:var(--fg)}
button:disabled{opacity:.5;cursor:default}
button:focus-visible,input:focus-visible,a:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.msg{font-size:14px;margin:0}.bad{color:var(--bad)}.okm{color:var(--ok)}
.muted{color:var(--muted);font-size:13px}
.tools{display:grid;gap:8px}
.tool{display:flex;justify-content:space-between;align-items:center;border:1px solid var(--line);padding:12px 14px}
a.tool{color:inherit;text-decoration:none}
a.tool:hover{border-color:var(--fg)}
.chip{font:600 11px/1 var(--mono);text-transform:uppercase;padding:4px 7px;border:1px solid var(--line)}

/* Find-It */
.search{display:grid;grid-template-columns:1fr 1fr 110px auto;gap:10px;align-items:end}
.search > div{display:flex;flex-direction:column;gap:4px}
@media (max-width:640px){.search{grid-template-columns:1fr 1fr}}
.answer{border-left:6px solid var(--warn)}
.answer.bad{border-left-color:var(--bad)}.answer.ok{border-left-color:var(--ok)}
.verdict{font-size:18px;font-weight:600;line-height:1.35;margin:0;text-wrap:balance}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.fact{padding:10px 12px;border:1px solid var(--line)}
.fact b{display:block;font:600 24px/1.1 var(--display);font-variant-numeric:tabular-nums;word-break:break-word}
.fact span{font-size:12px;color:var(--muted)}
.fact.bad b{color:var(--bad)}.fact.ok b{color:var(--ok)}.fact.warn b{color:var(--warn)}
.ev{display:grid;gap:0}
.row{display:grid;grid-template-columns:minmax(28px,auto) 1fr;gap:10px;align-items:start;padding:9px 0;border-top:1px solid var(--line)}
.row:first-child{border-top:0}
.pill{display:inline-block;font-size:11px;font-weight:600;padding:2px 8px;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}
.pill.ok{color:var(--ok);background:var(--ok-bg)}.pill.warn{color:var(--warn);background:var(--warn-bg)}.pill.bad{color:var(--bad);background:var(--bad-bg)}.pill.none{color:var(--muted);background:var(--bg)}
.src{font-size:12px;color:var(--muted);margin:2px 0 0}
.src code{font:12px var(--mono)}
details.more{margin-top:4px}details.more summary{font-size:12px;color:var(--accent);cursor:pointer}
table{border-collapse:collapse;width:100%;font-size:13px;font-variant-numeric:tabular-nums}
th{text-align:left;font-size:11px;letter-spacing:.05em;text-transform:uppercase;color:var(--muted);font-weight:600;padding:6px 8px;border-bottom:1px solid var(--line)}
td{padding:6px 8px;border-bottom:1px solid var(--line);vertical-align:top}
td.n{text-align:right}
tr.hit td{background:var(--warn-bg)}
.tbl{overflow-x:auto}
.taps{display:grid;gap:10px}
.tap{display:grid;grid-template-columns:minmax(220px,1fr) auto;gap:10px;align-items:center;padding:10px 12px;border:1px solid var(--line)}
.tap.wide{grid-template-columns:1fr}.tap.wide .opts{justify-content:flex-start}
.tap .q{font-weight:500}.tap .q small{display:block;color:var(--muted);font-weight:400;font-size:12.5px}
.opts{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.opts button{padding:7px 12px;border:1px solid var(--line);background:var(--bg);color:var(--fg);font:600 13px var(--body);border-radius:999px}
.opts button[aria-pressed="true"]{background:var(--fg);color:var(--bg);border-color:var(--fg)}
.opts input{padding:7px 10px;border:1px solid var(--line);background:var(--bg);color:var(--fg);font:13px var(--mono);width:84px}
@media (max-width:640px){.tap{grid-template-columns:1fr}.opts{justify-content:flex-start}}
pre.note{margin:0;white-space:pre-wrap;font:13px/1.5 var(--mono);background:var(--bg);border:1px solid var(--line);padding:12px}
.actions{display:flex;gap:8px;flex-wrap:wrap}
.gap h2.sec{color:var(--bad)}
.toast{position:fixed;left:50%;bottom:calc(18px + env(safe-area-inset-bottom,0px));transform:translateX(-50%);background:var(--fg);color:var(--bg);padding:9px 14px;border-radius:999px;font-size:13px;font-weight:600;opacity:0;transition:opacity .2s;pointer-events:none}.toast.on{opacity:1}
.busy{opacity:.55;pointer-events:none}
@media (prefers-reduced-motion:reduce){.toast{transition:none}}
