/* Styles for the fingerprint tool (fingerprint.html). Class names are used by assets/js/fingerprint.js. */
.fp{padding-top:8px}
.dropzone{border:2px dashed var(--steel-300); border-radius:12px; padding:26px 20px; background:var(--surface); text-align:center}
.dropzone.drag-over{border-color:var(--accent); background:var(--accent-soft)}
.dz-title{font-size:1.15rem; font-weight:700; margin:0 0 12px}
.dz-buttons{display:flex; gap:12px; justify-content:center; flex-wrap:wrap; margin-bottom:10px}
.dz-buttons input[type=file]{position:absolute; width:1px; height:1px; overflow:hidden; opacity:0; pointer-events:none}
.dz-buttons input[type=file]:focus-visible + label{outline:3px solid var(--accent); outline-offset:2px}
.dz-buttons label.btn{cursor:pointer}
.dropzone .hint{font-size:14px; color:var(--muted); margin:6px auto 0; max-width:620px}
.fp-status{min-height:1.5em; margin:14px 0 6px; color:var(--muted); font-size:15px}
.fp-name{overflow-wrap:anywhere}
.fp-hash{font-family:var(--mono); font-size:12.5px; overflow-wrap:anywhere}
.fp-check{display:flex; gap:8px; align-items:center; margin:8px 0; font-size:15px}
.fp-out{width:100%; min-height:200px; padding:10px; border:1px solid var(--line); border-radius:8px; font-family:var(--mono); font-size:12.5px; line-height:1.45; background:var(--bg); color:var(--ink); resize:vertical}
.fp-actions{display:flex; gap:10px; flex-wrap:wrap; margin:12px 0 6px}
.fp-actions button{font:inherit; cursor:pointer}
.fp-actions button:disabled{opacity:.55; cursor:not-allowed}
@media (max-width:640px){.fp-hash{font-size:11.5px}}
@media (max-width:640px){
  #fp-table-wrap thead{display:none}
  #fp-table-wrap table, #fp-table-wrap tbody{display:block}
  #fp-rows tr{display:block; padding:10px 0; border-bottom:1px solid var(--line)}
  #fp-rows td{display:block; padding:2px 0; border:0}
  #fp-rows td:first-child{font-size:12px; color:var(--muted); font-weight:600; text-transform:uppercase; letter-spacing:.05em}
  #fp-rows td.fp-name{font-weight:600}
}
