/* Basic stylesheet for the personal site */
:root{
  --bg:#ffffff;
  --text:#0f172a;
  --muted:#6b7280;
  --accent:#2563eb;
  --radius:8px;
  --max-width:900px;
}

*{box-sizing:border-box}
html,body{height:100%}
body{
  margin:0;
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
  color:var(--text);
  background:var(--bg);
  line-height:1.5;
  padding:24px;
}

.container{max-width:var(--max-width);margin:0 auto}

header nav{display:flex;gap:12px;align-items:center}
header a{color:var(--accent);text-decoration:none}
header a[aria-current="page"]{font-weight:600}

main{max-width:var(--max-width);margin-top:20px}
img.responsive{max-width:100%;height:auto;border-radius:var(--radius);display:block}
.meta{color:var(--muted);font-size:0.95rem}

section{margin-top:18px}
h2{font-size:1.15rem;margin-bottom:8px}

form input,form textarea{width:100%;padding:10px;border:1px solid #e5e7eb;border-radius:6px}
button{background:var(--accent);color:#fff;padding:10px 14px;border-radius:6px;border:none;cursor:pointer}

footer{margin-top:32px;color:var(--muted);font-size:0.95rem}

@media(min-width:700px){
  body{padding:40px}
  header nav{gap:18px}
}

td,th {
  border: 1px solid #000000;
  padding: 8px;
}

table {
  border-collapse: collapse;
  width: 100%;
}