/* Modern, minimal stylesheet for wu-scraping */
:root{
  --bg: #f7fafc;
  --card: #ffffff;
  --accent: #2563eb;
  --muted: #6b7280;
}
*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  background:var(--bg);
  color:#0f172a;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
}
.container{max-width:960px;margin:2rem auto;padding:1rem}
.card{background:var(--card);border-radius:12px;box-shadow:0 6px 18px rgba(12,20,40,0.06);padding:1.25rem;margin-bottom:1rem}
h1{font-size:1.6rem;margin:.25rem 0}
h2{margin-top:1rem}
a{color:var(--accent)}
button, .btn{background:var(--accent);color:#fff;border:none;padding:.55rem .9rem;border-radius:8px;cursor:pointer;font-weight:600}
button.secondary{background:#eef2ff;color:var(--accent);border:1px solid #c7d2fe}
form{margin-top:.5rem}
label{display:block;margin:.5rem 0 .25rem;font-weight:600}
input[type="file"]{display:block}
pre{background:#0f172a;color:#f8fafc;padding:1rem;border-radius:8px;overflow:auto}
code{font-family:ui-monospace, SFMono-Regular, Menlo, Monaco, 'Roboto Mono', monospace;font-size:.9rem}
.copy-row{display:flex;align-items:center;gap:.5rem;margin-bottom:.5rem}
.flashes{margin:0;padding:0;list-style:none}
.flashes li{color:#7f1d1d;background:#fff5f5;border:1px solid #fecaca;padding:.5rem .75rem;border-radius:8px;margin:.5rem 0;font-weight:600}
img{max-width:100%;height:auto;border:1px solid #e6e6e6;border-radius:8px;margin-bottom:1rem}
/* screenshot class constrains preview width on large screens */
.screenshot{max-width:360px;border:1px solid #e6e6e6;border-radius:8px;margin-bottom:1rem;}
.copy-status{color:green;font-weight:600}

/* Footer */
.site-footer{margin-top:2rem;padding:1rem 0;text-align:center;color:var(--muted);font-size:.9rem}
.site-footer .author{color:#0f172a}
.site-footer a{color:var(--accent);text-decoration:none}
.site-footer a:hover{text-decoration:underline}
@media (max-width:600px){.container{margin:1rem;padding:.75rem} h1{font-size:1.25rem}}
