:root {
  color-scheme: light;
  --ink: #1b2938;
  --muted: #6e7b88;
  --line: #e3e8ed;
  --accent: #2563eb;
  --background: #fff;
  --soft: #f8fafc;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Inter, sans-serif;
  font-synthesis: none;
}
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: var(--background); color: var(--ink); }
button, input, select { font: inherit; }
button { cursor: pointer; }
.hidden { display: none !important; }
.visually-hidden { position: absolute; height: 1px; width: 1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; }
.page { max-width: 1180px; margin: 0 auto; padding: min(20vh, 180px) 28px 70px; transition: padding-top .2s ease; }
body.has-results .page { padding-top: 46px; }
.search { max-width: 860px; margin: 0 auto; }
.brand { display: block; width: fit-content; margin: 0 auto 25px; text-decoration: none; }
.brand-logo { display: block; height: auto; width: min(100%, 620px); max-width: 620px; }
body.has-results .brand { margin-bottom: 20px; }
body.has-results .brand-logo { width: min(100%, 420px); }
.search-form { display: flex; gap: 10px; }
#hashInput { width: 100%; min-width: 0; height: 52px; border: 1px solid #cdd6df; border-radius: 9px; outline: none; padding: 0 16px; font: 14px ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; color: var(--ink); box-shadow: 0 1px 3px #142c4410; }
#hashInput::placeholder { color: #909ba8; }
#hashInput:focus { border-color: var(--accent); box-shadow: 0 0 0 3px #2563eb20; }
#submitBtn { display: flex; gap: 9px; align-items: center; justify-content: center; flex: 0 0 105px; background: var(--accent); color: #fff; border: 0; border-radius: 9px; font-size: 14px; font-weight: 650; }
#submitBtn:hover:not(:disabled) { background: #1d4ed8; }
#submitBtn:disabled { opacity: .7; cursor: wait; }
.spinner { height: 13px; width: 13px; border: 2px solid #ffffff66; border-top-color: #fff; border-radius: 50%; animation: spin .75s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.message { max-width: 760px; margin: 15px auto 0; padding: 11px 14px; color: #a32a29; background: #fff3f2; border: 1px solid #ffddda; border-radius: 8px; font-size: 13px; }
.results { margin-top: 52px; }
.results-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 14px; }
.results-heading { display: flex; flex-wrap: wrap; align-items: baseline; gap: 10px; min-width: 0; }
.results-heading h1 { font-size: 21px; letter-spacing: -.6px; font-weight: 650; margin: 0 7px 0 0; }
#summaryNote { color: var(--muted); font-size: 13px; }
.cache-tag { background: #f1f5f9; color: var(--muted); padding: 4px 8px; border-radius: 5px; font-size: 11px; white-space: nowrap; }
.cache-tag.hit { background: #eaf8ee; color: #237442; }
.filter select { padding: 9px 12px; background: var(--background); border: 1px solid #cdd6df; border-radius: 7px; color: var(--ink); font-size: 13px; }
.filter select:focus { outline: 2px solid #2563eb66; outline-offset: 1px; }
.table-wrap { border: 1px solid var(--line); border-radius: 9px; overflow-x: auto; }
table { width: 100%; min-width: 850px; border-collapse: collapse; text-align: left; }
th { background: var(--soft); color: #697785; font-size: 12px; font-weight: 650; padding: 13px 15px; white-space: nowrap; }
td { border-top: 1px solid var(--line); font-size: 13px; padding: 14px 15px; vertical-align: top; }
.server-name { font-weight: 650; }
.server-address { margin-top: 3px; font: 11px ui-monospace, SFMono-Regular, Menlo, monospace; color: var(--muted); }
.file-name-cell { max-width: 450px; min-width: 230px; overflow-wrap: anywhere; line-height: 1.5; }
.file-size-cell { white-space: nowrap; color: #475569; font-variant-numeric: tabular-nums; }
.numeric { font-variant-numeric: tabular-nums; font-weight: 650; }
.numeric.positive { color: #167347; }
.numeric.warning { color: #9a5a0b; }
.numeric.unverified { color: #96722b; }
.table-wrap tr.no-complete td { background: #fffbf1; }
.table-wrap tr.no-complete td:first-child { box-shadow: inset 3px 0 0 #d99a30; }
.table-wrap tr.complete-unknown td { background: #fffdf8; }
.table-wrap tr.complete-unknown td:first-child { box-shadow: inset 3px 0 0 #c0a165; }
.dim { color: var(--muted); }
.status { display: inline-block; font-size: 11px; font-weight: 600; padding: 4px 7px; border-radius: 5px; white-space: nowrap; }
.status.found { background: #eaf8ee; color: #167347; }
.status.no-complete { background: #fff0cd; color: #8c510a; }
.status.complete-unknown { background: #fff5df; color: #866428; }
.status.no_result { background: #fff7e6; color: #9a6808; }
.status.timeout { background: #eef1f5; color: #596879; }
.status.error { background: #fff0f0; color: #a83232; }
.table-footer { font-size: 12px; color: var(--muted); text-align: right; padding: 11px 3px; }
@media (max-width: 600px) {
  .page { padding: 18vh 14px 45px; }
  body.has-results .page { padding-top: 28px; }
  .brand-logo { width: min(100%, 520px); }
  .search-form { gap: 7px; }
  #hashInput { height: 48px; padding: 0 11px; font-size: 12px; }
  #submitBtn { flex-basis: 78px; font-size: 13px; }
  .results { margin-top: 35px; }
  .results-bar { align-items: flex-start; }
  .results-heading h1 { flex-basis: 100%; }
}
@media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important; } }
@media (max-width: 650px) {
  .table-wrap { border: 0; overflow: visible; }
  table { min-width: 0; }
  thead { display: none; }
  tbody { display: grid; gap: 12px; }
  tbody tr { display: block; border: 1px solid var(--line); border-radius: 8px; overflow: hidden; }
  tbody td { display: flex; justify-content: space-between; gap: 14px; border: 0; padding: 8px 12px; font-size: 12px; }
  tbody td::before { color: var(--muted); font-size: 11px; font-weight: 600; flex: 0 0 65px; }
  tbody td:first-child { display: block; padding: 13px 12px; background: var(--soft); }
  .table-wrap tbody tr.no-complete td:first-child { background: #fff4db; }
  .table-wrap tbody tr.complete-unknown td:first-child { background: #fff8e9; }
  tbody td:first-child::before { display: none; }
  tbody td:nth-child(2)::before { content: "Archivo"; }
  tbody td:nth-child(3)::before { content: "Tamaño"; }
  tbody td:nth-child(4)::before { content: "Fuentes"; }
  tbody td:nth-child(5)::before { content: "Completas"; }
  tbody td:nth-child(6)::before { content: "Estado"; }
  tbody td.file-name-cell { min-width: 0; max-width: none; overflow-wrap: anywhere; }
  tbody td:only-child { display: block; }
  tbody td:only-child::before { display: none; }
}


.directory-brand { display: inline-block; text-decoration: none; margin-bottom: 10px; }
.directory-brand-logo { display: block; width: min(100%, 360px); height: auto; }
/* Acceso directo a la lista de servidores */
.server-shortcut { display: block; width: fit-content; margin: 15px auto 0; font-size: 13px; color: var(--muted); text-decoration: none; }
.server-shortcut:hover { color: var(--accent); text-decoration: underline; }
.directory-wrap { max-width: 1600px; margin: 0 auto; padding: 38px 24px 60px; }
.directory-head { margin-bottom: 23px; }
.back-link { color: var(--accent); text-decoration: none; font-size: 13px; }
.back-link:hover { text-decoration: underline; }
.directory-head h1 { margin: 20px 0 10px; font-size: 27px; letter-spacing: -.7px; }
.directory-count { display: inline-flex; vertical-align: middle; background: #eff4ff; color: var(--accent); border-radius: 7px; font-size: 15px; padding: 4px 9px; margin-left: 6px; }
.directory-tools { display: flex; justify-content: space-between; align-items: center; gap: 10px; color: var(--muted); font-size: 13px; }
.directory-tools button { background: #fff; border: 1px solid #d0d9e3; border-radius: 7px; padding: 8px 14px; color: var(--ink); font-size: 13px; }
.directory-tools button:disabled { opacity: .6; }
.directory-table-wrap { overflow-x: auto; border: 1px solid var(--line); border-radius: 9px; }
.directory-table { min-width: 1480px; width: 100%; }
.directory-table th { padding: 0; }
.directory-table th button { display: block; text-align: left; width: 100%; padding: 14px 11px; border: 0; background: transparent; color: inherit; font-weight: 650; font-size: 12px; white-space: nowrap; }
.directory-table th button:hover { background: #edf2f9; }
.directory-table th button[aria-sort="descending"]::after { content: " ▼"; color: var(--accent); }
.directory-table th button[aria-sort="ascending"]::after { content: " ▲"; color: var(--accent); }
.directory-table td { padding: 12px 11px; line-height: 1.4; }
.directory-table .mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 11px; }
.directory-table .nowrap { white-space: nowrap; }
.directory-table .directory-server-name { font-weight: 650; min-width: 120px; }
.directory-description { max-width: 200px; overflow-wrap: anywhere; }
.directory-offline { color: #64748b; }
.directory-table tbody tr:hover { background: #f8fafc; }
@media (max-width: 650px) {
  .directory-wrap { padding: 22px 12px 45px; }
  .directory-head h1 { font-size: 24px; }
  .directory-brand-logo { width: min(100%, 260px); }
  .directory-table-wrap { overflow-x: auto; border: 1px solid var(--line); }
  .directory-table { min-width: 1480px; }
  .directory-table thead { display: table-header-group; }
  .directory-table tbody { display: table-row-group; }
  .directory-table tbody tr { display: table-row; border: 0; }
  .directory-table tbody td { display: table-cell; border-top: 1px solid var(--line); font-size: 12px; }
  .directory-table tbody td::before { display: none !important; }
  .directory-table tbody td:first-child { display: table-cell; padding: 12px 11px; background: transparent; }
}

.directory-geo-credit { margin-top: 1.1rem; text-align: right; font-size: .72rem; opacity: .65; }
.directory-geo-credit a { color: inherit; }
