:root{
  --bg:#f4f7fb;--card:#fff;--ink:#172033;--muted:#64748b;--primary:#17365d;
  --border:#d9e2ec;--ok:#166534;--okbg:#dcfce7;--warn:#9a3412;--warnbg:#ffedd5;--danger:#b91c1c;
  font-family:system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif
}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink)}
header{position:sticky;top:0;z-index:10;background:var(--primary);color:white;padding:15px 16px;box-shadow:0 2px 10px rgba(0,0,0,.12)}
header h1{margin:0;font-size:clamp(1.08rem,5.1vw,1.38rem);line-height:1.18}
header p{margin:4px 0 0;font-size:.84rem;opacity:.9}
main{max-width:860px;margin:0 auto;padding:14px 14px 220px}
.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px;margin-bottom:14px;box-shadow:0 2px 7px rgba(30,55,80,.05)}
h2{font-size:1.08rem;margin:0 0 8px}
.muted{color:var(--muted)} .small{font-size:.82rem}
.actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
button,.btn{appearance:none;border:0;border-radius:12px;padding:12px 15px;font-weight:750;font-size:.95rem;cursor:pointer;text-align:center}
.primary{background:var(--primary);color:#fff}.secondary{background:#e8eef5;color:var(--primary)}
.danger{color:var(--danger);background:transparent;border:1px solid currentColor}
button:disabled{opacity:.45;cursor:not-allowed}
.status{margin-top:12px;padding:10px 12px;border-radius:10px;font-size:.88rem}
.status.info{background:#eaf2ff;color:#1d4ed8}.status.ok{background:var(--okbg);color:var(--ok)}.status.warn{background:var(--warnbg);color:var(--warn)}
.tip{background:#f8fafc;border-left:4px solid var(--primary);padding:10px 12px;border-radius:8px}
.progress{height:7px;background:#e5e7eb;border-radius:999px;overflow:hidden;margin-top:10px}
.progress>div{height:100%;width:0;background:var(--primary);transition:width .12s}
.results{display:grid;gap:12px;margin-top:12px}
.empty{border:2px dashed var(--border);border-radius:12px;padding:24px;text-align:center;color:var(--muted);margin-top:12px}
.hidden{display:none!important}
.result{border:1px solid var(--border);border-radius:14px;overflow:hidden;background:#fff}
.rh{display:flex;gap:12px;padding:12px;align-items:flex-start}
.thumb{width:115px;height:145px;object-fit:cover;border-radius:10px;background:#edf2f7;flex:none}
.rm{min-width:0;flex:1}
.photo-number{display:inline-block;background:#eaf2ff;color:#17365d;font-weight:900;border-radius:999px;padding:4px 9px;margin-bottom:6px;font-size:.8rem}
.rt{display:flex;justify-content:space-between;gap:8px;align-items:center}
.rt strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.badge{padding:4px 8px;border-radius:999px;font-size:.76rem;font-weight:800;white-space:nowrap}
.badge.ok{background:var(--okbg);color:var(--ok)}.badge.warn{background:var(--warnbg);color:var(--warn)}
.values{display:grid;gap:6px;margin-top:9px}
.value{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:.80rem;padding:8px 9px;border-radius:8px;background:#f8fafc;overflow-wrap:anywhere}
.ignored{font-size:.72rem;color:var(--muted);font-weight:750;margin-top:7px}.corrected-badge{display:inline-block;margin-top:7px;padding:4px 8px;border-radius:999px;background:#fff7ed;color:#9a3412;font-size:.72rem;font-weight:900}
.rf{display:flex;gap:8px;justify-content:flex-end;padding:10px 12px;border-top:1px solid var(--border)}
.rf button{padding:8px 11px;font-size:.82rem}
.summary{display:flex;gap:18px;justify-content:center;flex-wrap:wrap}
.missing{margin:7px 0 0;text-align:center;color:var(--warn);font-weight:800;font-size:.8rem}
.sticky{position:fixed;bottom:72px;left:0;right:0;z-index:9;max-width:860px;margin:auto;background:#fff;border:1px solid var(--border);border-radius:16px 16px 0 0;padding:10px 14px max(12px,env(safe-area-inset-bottom));box-shadow:0 -3px 15px rgba(0,0,0,.10)}
.sticky .actions{justify-content:center;margin-top:8px}
dialog{border:0;border-radius:16px;padding:0;max-width:520px;width:calc(100% - 28px)}
dialog::backdrop{background:rgba(0,0,0,.45)}
.dialog{padding:18px}.field{display:grid;gap:5px;margin:10px 0}
.field label{font-size:.8rem;font-weight:700;color:var(--muted)}
.field input{width:100%;padding:11px;border:1px solid var(--border);border-radius:10px;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;text-transform:uppercase}
@media(min-width:640px){.thumb{width:145px;height:180px}}
@media(min-width:900px){.sticky{bottom:12px}}

.install-card{
  border:1px solid var(--border);
}
.install-row{
  display:flex;justify-content:space-between;gap:12px;align-items:flex-start;flex-wrap:wrap
}
.pwa-pill{
  display:inline-block;border-radius:999px;padding:5px 9px;font-size:.75rem;font-weight:850;
  background:#eef2f7;color:var(--primary)
}
.pwa-pill.ok{background:var(--okbg);color:var(--ok)}
.pwa-pill.warn{background:var(--warnbg);color:var(--warn)}
.install-help{margin:10px 0 0;font-size:.82rem;color:var(--muted);line-height:1.45}
.privacy-note{
  margin-top:10px;padding:9px 11px;border-radius:10px;background:#f8fafc;
  color:var(--muted);font-size:.78rem
}

