:root { --paper:#fff4d6; --ink:#1d1b26; --teal:#22c3d6; --gold:#ffc62e; --red:#e8412c; --muted:#5d5667; }
* { box-sizing: border-box; }
body { margin: 0; background: radial-gradient(circle, rgba(29,27,38,.1) 1.4px, transparent 1.6px) 0 0/9px 9px, var(--paper); color: var(--ink);
  font: 18px/1.5 "Trebuchet MS", "Segoe UI", system-ui, sans-serif; }
main { max-width: 760px; margin: 0 auto; padding: 32px 18px 60px; }
h1, h2 { font-family: Impact, "Arial Black", sans-serif; letter-spacing: .02em; line-height: 1.05; margin: 1.4em 0 .4em; }
h1 { font-size: clamp(40px, 9vw, 72px); color: var(--teal); -webkit-text-stroke: 2px var(--ink); text-shadow: 4px 4px 0 var(--ink); margin-top: .2em; }
h2 { font-size: 26px; }
a { color: #0d7f8f; }
.head { display: flex; align-items: center; gap: 16px; }
.head img { width: 88px; height: 88px; border-radius: 20px; border: 3px solid var(--ink); box-shadow: 4px 4px 0 var(--ink); }
.card { background: #fff; border: 3px solid var(--ink); border-radius: 14px; box-shadow: 5px 5px 0 var(--ink); padding: 6px 22px 18px; margin: 22px 0; }
.shot { width: 100%; border: 3px solid var(--ink); border-radius: 14px; box-shadow: 5px 5px 0 var(--ink); }
nav { display: flex; flex-wrap: wrap; gap: 10px 18px; margin: 18px 0; font-weight: bold; }
.lang { color: var(--muted); font-size: 15px; }
footer { margin-top: 40px; font-size: 15px; color: var(--muted); }