@font-face { font-family: "Monocraft"; src: url("../assets/fonts/Monocraft.otf") format("opentype"); font-display: swap; }
:root { --mc: "Monocraft", ui-monospace, Menlo, Consolas, monospace; --orange: #ff8200; --navy: #0b1f3f; --blue: #1f4a8a; --ink: #1b1f24; --muted: #59606b; --line: #e3e6ea; }
* { box-sizing: border-box; }
body { margin: 0; font: 16px/1.6 system-ui, -apple-system, "Segoe UI", Roboto, Arial, sans-serif; color: var(--ink); background: #fbfbfc; }
.wrap { max-width: 860px; margin: 0 auto; padding: 0 20px; }
.skip { position: absolute; left: -9999px; } .skip:focus { left: 10px; top: 10px; background: #fff; padding: 8px; z-index: 9; }
a { color: var(--blue); } a:focus-visible, .btn:focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; }
.site { background: var(--navy); color: #fff; padding: 36px 0 0; border-bottom: 8px solid #5d9b2e; box-shadow: 0 8px 0 #6b4a2b; margin-bottom: 8px; image-rendering: pixelated; }
.site h1 { margin: 0; font: clamp(28px, 6vw, 42px)/1.15 var(--mc); text-shadow: 3px 3px 0 #000a; letter-spacing: 1px; }
.headline { font-size: 19px; margin: 8px 0 2px; color: #e9eef7; }
.tagline { margin: 0 0 10px; color: #c2cde0; }
.site .contact a { color: #ffd2a3; }
.actions { display: flex; flex-wrap: wrap; gap: 10px; margin: 18px 0; }
.btn { display: inline-block; padding: 9px 16px; color: #fff; text-decoration: none; font: 15px/1.3 var(--mc); text-shadow: 2px 2px 0 #3f3f3f;
  background: #7a7a7a url("../assets/tex/stone.png") 0 0 / 64px; image-rendering: pixelated; border: 2px solid #000;
  box-shadow: inset 2px 2px 0 #ffffff55, inset -2px -3px 0 #0000004d; }
.btn:hover { color: #ffffa0; filter: brightness(1.12); }
.btn.primary { background: #ff8200; color: #fff; text-shadow: 2px 2px 0 #6b3500; } .btn.primary:hover { background: #ff9a33; color: #fff; }
.site nav { display: flex; flex-wrap: wrap; gap: 4px 18px; padding: 12px 0 14px; border-top: 1px solid #ffffff33; }
.site nav a { color: #fff; text-decoration: none; font: 14px var(--mc); } .site nav a:hover { text-decoration: underline; }
main section { padding: 26px 0 8px; border-bottom: 2px dashed var(--line); }
h2 { font: 22px/1.3 var(--mc); margin: 0 0 12px; color: var(--navy); }
h2::before { content: ""; display: inline-block; width: 14px; height: 14px; background: url("../assets/tex/grass-icon.png") center / cover; image-rendering: pixelated; margin-right: 10px; vertical-align: 0; }
.item { margin: 0 0 22px; }
.item h3 { margin: 0; font-size: 19px; }
.meta { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 2px 12px; margin: 2px 0 6px; color: var(--muted); font-weight: 600; }
.item ul { margin: 6px 0; padding-left: 20px; } .item li { margin: 3px 0; }
.label { font-weight: 700; }
.stack, .status, .full { margin: 4px 0; color: #333a44; }
.skills { display: grid; grid-template-columns: max-content 1fr; gap: 6px 18px; margin: 0; }
.skills dt { font-weight: 700; } .skills dd { margin: 0; }
.contact-list { list-style: none; padding: 0; } .contact-list li { margin: 4px 0; }
.foot { color: var(--muted); font-size: 14px; padding: 20px; }
.foot .mc { font-family: var(--mc); font-size: 13px; }
@media (max-width: 600px) { .skills { grid-template-columns: 1fr; } .skills dd { margin-bottom: 8px; } }
@media print { .site { background: #fff; color: #000; border: 0; } .site a, .site .contact a { color: #000; } .actions, .site nav, .foot, .skip { display: none; } }