:root{color-scheme:light;--ink:#152637;--muted:#52677a;--blue:#0077a6;--line:#d7e2ec}*{box-sizing:border-box}body{margin:0;background:#f1f5f9;color:var(--ink);font:16px/1.55 system-ui,sans-serif}header,main,footer{max-width:1100px;margin:auto;padding:24px}header{display:flex;align-items:center;justify-content:space-between;gap:24px;flex-wrap:wrap}.brand{display:flex;align-items:center;gap:12px;font-size:24px;font-weight:800;text-decoration:none}.brand img{border-radius:12px}a{color:var(--blue);overflow-wrap:anywhere}nav{display:flex;gap:18px;flex-wrap:wrap}h1{font-size:clamp(28px,5vw,42px);line-height:1.15}h2{font-size:24px;margin-top:0}p{color:var(--muted)}.eyebrow{font-weight:700;letter-spacing:.14em;color:var(--blue)}section{background:white;border:1px solid var(--line);border-radius:18px;padding:28px;margin:24px 0;min-width:0}label{display:block;font-weight:600;margin:12px 0 8px}.form-row{display:flex;gap:12px}input,button{font:inherit;min-height:44px;border:1px solid #8499ad;border-radius:8px;padding:10px 14px}input{min-width:0;max-width:100%;flex:1}button{background:var(--blue);color:white;border-color:var(--blue);cursor:pointer;font-weight:650}button:disabled{background:#edf1f4;color:#526373;border-color:var(--line);cursor:default}:focus-visible{outline:3px solid #008fca;outline-offset:3px}.table-wrap{max-width:100%;overflow:auto;margin-top:18px}table{border-collapse:collapse;width:100%;font-size:15px}th,td{text-align:left;border-bottom:1px solid var(--line);padding:12px;vertical-align:top}th{background:#eaf2f8}.hash{font:13px/1.5 ui-monospace,monospace;overflow-wrap:anywhere}.pager{align-items:center;justify-content:center;margin-top:20px}.error{color:#a6292a}footer{padding-top:0}@media(max-width:600px){header,main,footer{padding:16px}header{gap:14px}.brand{font-size:22px}.brand img{width:48px;height:48px}nav{gap:14px;font-size:14px}section{padding:18px;margin:18px 0}.form-row{flex-wrap:wrap}.form-row input{flex-basis:100%}h2{font-size:22px}th,td{padding:10px 8px}}
:root{--navy:#060b12;--cyan:#13bdfa}
header{max-width:none;padding:14px max(24px,calc((100vw - 1052px)/2));min-height:82px;background:var(--navy);border-bottom:1px solid #153044;color:#f5f9fc}
header a{color:#dbe8f3;text-decoration:none}
header nav a{display:inline-flex;align-items:center;min-height:44px}
header nav a:hover{color:#31c9fa;text-decoration:underline}
header :focus-visible{outline-color:#31c9fa}
.brand{color:#f5f9fc;letter-spacing:-.04em}
.brand img{width:52px;height:52px;background:var(--navy);border-radius:10px}
main{padding-top:32px}
section{box-shadow:0 5px 18px #122b4206}
input{background:#fbfdff;color:var(--ink)}
input:focus{border-color:var(--blue)}
input[type=file]{width:100%;font-size:14px}
button:hover:not(:disabled){background:#005b82}
button:disabled{cursor:not-allowed}
footer{padding-top:20px;border-top:1px solid var(--line)}
footer a{display:inline-flex;align-items:center;min-height:44px}
[hidden]{display:none!important}
#hash-section{scroll-margin-top:24px;border-color:#82b4ce}
.hash-drop-zone{padding:18px;border:2px dashed #7c9fb8;border-radius:12px;background:#f2f8fc;min-width:0}
.hash-drop-zone label{margin-top:0}
.hash-drop-zone p{font-size:13px;margin-bottom:0}
.hash-drop-zone:focus-within,.hash-drop-zone[data-drag-active=true]{border-color:#0077a6;background:#e5f4fb}
#hash-file{min-height:44px;width:100%;max-width:100%}
#hash-file::file-selector-button{min-height:44px;margin-right:10px;padding:8px 12px;border:1px solid #0077a6;border-radius:7px;background:#0077a6;color:#fff;font:inherit;cursor:pointer}
#hash-result{overflow-wrap:anywhere}
.hash-matches{padding-left:20px}
.hash-matches li{margin-bottom:8px}
.hash-matches a,.hash-search-link{display:inline-flex;align-items:center;min-height:44px}
.hash-matches li>span{display:block;font-size:14px;color:var(--muted)}
@media(max-width:600px){.hash-drop-zone{padding:12px}}
#compare-section{scroll-margin-top:24px}
.compare-return{display:inline-flex;align-items:center;min-height:44px;margin-top:8px}
#compare-ids[aria-invalid=true]{border-color:#a6292a}
#compare-result{overflow-wrap:anywhere}
#compare-result .table-wrap table{min-width:360px;overflow-wrap:normal}
#compare-result .table-wrap:first-child table{min-width:640px}
#compare-result th{white-space:nowrap}
@media(max-width:600px){header{padding:12px 16px}header nav{gap:8px 16px}.brand img{width:48px;height:48px}main{padding-top:24px}input{font-size:16px}.form-row button{flex-grow:1}}
