/* Layout concept: a paper-and-ink portfolio told as a game save file. Hero = character sheet,
   projects = a wish board where every wish gets stamped GRANTED, experience = a music player
   (each job is a track, the bullets are the lyrics), achievements = unlocked. One accent, tomato. */
:root{
  --bg:#f4f5f2; --paper:#ffffff; --bg2:#eaece6; --ink:#12141a; --mut:#555b66;
  --line:rgba(18,20,26,.15); --accent:#d23623; --accent-text:#bb2c1a; --on-accent:#ffffff; --shadow:rgba(18,20,26,.18);
  --display:"Bricolage Grotesque","Helvetica Neue",Arial,sans-serif;
  --serif:"Newsreader",Georgia,"Times New Roman",serif;
  --mono:"JetBrains Mono",ui-monospace,"SFMono-Regular",Menlo,monospace;
  --hand:"Caveat","Bradley Hand","Segoe Script",cursive;
  --gutter:clamp(1rem,4vw,2.5rem);
  color-scheme:light;
}
@media (prefers-color-scheme:dark){
  :root:not([data-theme="light"]){
    --bg:#111317; --paper:#1a1d23; --bg2:#171a1f; --ink:#f1f2ee; --mut:#a3a9b3;
    --line:rgba(241,242,238,.16); --accent:#ff6b55; --accent-text:#ff8f7c; --on-accent:#1a0805; --shadow:rgba(0,0,0,.55); color-scheme:dark;
  }
}
:root[data-theme="dark"]{
  --bg:#111317; --paper:#1a1d23; --bg2:#171a1f; --ink:#f1f2ee; --mut:#a3a9b3;
  --line:rgba(241,242,238,.16); --accent:#ff6b55; --accent-text:#ff8f7c; --on-accent:#1a0805; --shadow:rgba(0,0,0,.55); color-scheme:dark;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:4.5rem}
html.is-locked{overflow:hidden}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--display);font-size:1rem;line-height:1.55;
  font-variation-settings:"opsz" 14,"wdth" 100;-webkit-font-smoothing:antialiased;overflow-x:hidden}
img{display:block;max-width:100%}
a{color:inherit}
button{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:3px}
.container{width:100%;max-width:1180px;margin-inline:auto;padding-inline:var(--gutter)}
.mono-text{font-family:var(--mono);font-size:.75rem;letter-spacing:.08em;text-transform:uppercase}
.visually-hidden{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
