:root{
  --bg: #1B1512;
  --bg-soft: #241C17;
  --panel: #2B221C;
  --border: #3E3129;
  --text: #F5EBE3;
  --text-dim: #B4A392;
  --accent: #FF8A4C;
  --accent-dim: #C4652F;
  --accent-ink: #1B1512;
  --mono: 'JetBrains Mono', monospace;
  --sans: 'Noto Sans JP', -apple-system, BlinkMacSystemFont, sans-serif;
  --maxw: 1100px;
}
*{ box-sizing: border-box; margin:0; padding:0; }
html{ scroll-behavior: smooth; }
a{ color: inherit; text-decoration: none; }
body{
  background: var(--bg);
  color: var(--text);
  font-family: var(--sans);
  line-height: 1.85;
}
.wrap{ max-width: var(--maxw); margin: 0 auto; padding: 0 24px; }

header{
  position: sticky; top:0; z-index: 50;
  background: rgba(27,21,18,.85); backdrop-filter: blur(10px);
  border-bottom: 1px solid var(--border);
}
header .wrap{ max-width: 1100px; display:flex; align-items:center; justify-content:space-between; height: 68px; }
nav ul{ list-style:none; display:flex; gap: 30px; }
nav a{ font-size: 14px; color: var(--text-dim); transition: color .2s; }
nav a:hover{ color: var(--text); }
.nav-cta{
  font-family: var(--mono); font-size: 13px;
  border: 1px solid var(--accent-dim); border-radius: 6px;
  padding: 8px 16px; color: var(--accent) !important;
}
.nav-cta:hover{ background: rgba(255,138,76,.1); }

footer{ padding: 40px 0; }
footer .wrap{ display:flex; justify-content:space-between; align-items:center; flex-wrap: wrap; gap: 16px; }
footer p{ color: var(--text-dim); font-size: 13px; font-family: var(--mono); }

@media (max-width: 900px){
  nav ul{ display:none; }
}

@media (prefers-color-scheme: light){
  :root{
    --bg: #FBF6F0;
    --bg-soft: #F3E7D9;
    --panel: #FFFFFF;
    --border: #E3D4C2;
    --text: #1B1512;
    --text-dim: #6E5C4E;
    --accent: #FF8A4C;
    --accent-dim: #B85526;
    --accent-ink: #1B1512;
  }
  header{ background: rgba(251,246,240,.85); }
}