:root {
  --black:#090a09;
  --panel:#111310;
  --panel2:#171914;
  --gold:#c6984a;
  --pale:#e4dac2;
  --muted:#a99f8b;
  --blood:#6f1714;
  --line:rgba(198,152,74,.42);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:#080908;color:var(--pale);font-family:Inter,Arial,sans-serif;line-height:1.5;background-image:linear-gradient(rgba(0,0,0,.74),rgba(0,0,0,.9)),url("assets/wood2.jpg");background-size:auto,cover;background-attachment:fixed}
button,select{font:inherit}
a{color:inherit}
.topbar{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;min-height:72px;padding:0 3vw;border-bottom:1px solid var(--line);background:rgba(7,8,7,.94);backdrop-filter:blur(12px)}
.brand{display:flex;align-items:center;gap:.8rem;text-decoration:none;font-family:Cinzel,serif}
.brand-axe{font-size:2rem;color:var(--gold)}
.brand small,.brand strong{display:block}
.brand small{font-size:.67rem;color:#b4a68a;letter-spacing:.12em;text-transform:uppercase}
.brand strong{font-size:1.4rem;letter-spacing:.04em}
nav{display:flex;gap:1.25rem}
nav a{text-decoration:none;text-transform:uppercase;font-family:Cinzel,serif;font-size:.8rem;color:#c9bfa8}
nav a:hover{color:var(--gold)}
.menu-toggle{display:none;background:none;border:1px solid var(--line);color:var(--pale);padding:.5rem .7rem}
.hero{position:relative;min-height:500px;display:grid;place-items:center;text-align:center;background:url("assets/hero-clean.jpg") center/cover no-repeat;border-bottom:2px solid #3a2c18}
.hero-shade{position:absolute;inset:0;background:linear-gradient(90deg,rgba(0,0,0,.72),rgba(0,0,0,.28),rgba(0,0,0,.76)),linear-gradient(0deg,rgba(0,0,0,.86),transparent 55%,rgba(0,0,0,.38))}
.hero-content{position:relative;z-index:2;padding:4rem 1rem}
.rune-line{margin:0;color:#9a1d18;letter-spacing:.65em;font-size:1.2rem}
.hero h1{margin:.15rem 0 0;font-family:Cinzel,serif;font-size:clamp(3.4rem,8vw,7.4rem);line-height:.95;text-shadow:0 5px 18px #000;letter-spacing:.03em}
.hero h2{margin:.8rem 0;color:var(--gold);font-family:Cinzel,serif;text-transform:uppercase;letter-spacing:.12em;font-size:clamp(1rem,2vw,1.45rem)}
.hero p:not(.rune-line){font-family:Georgia,serif;font-size:1.18rem;text-shadow:0 2px 10px #000}
.btn{display:inline-block;border:1px solid #8e6932;color:#eadfc8;background:linear-gradient(#35110f,#641915);padding:.74rem 1.3rem;font-family:Cinzel,serif;text-transform:uppercase;letter-spacing:.04em;cursor:pointer;box-shadow:inset 0 0 0 2px rgba(0,0,0,.4)}
.btn:hover{filter:brightness(1.25)}
.btn.small{font-size:.72rem;padding:.55rem .9rem}
.dashboard{display:grid;grid-template-columns:1fr 1.12fr 1fr;gap:14px;padding:14px;max-width:1540px;margin:0 auto}
.panel{border:1px solid #5c4425;background:linear-gradient(rgba(20,22,18,.97),rgba(7,8,7,.98));box-shadow:0 8px 24px rgba(0,0,0,.45),inset 0 0 0 3px rgba(132,94,46,.08)}
.panel-title{padding:.65rem 1rem;text-align:center;border-bottom:1px solid #5c4425;font-family:Cinzel,serif;font-size:1.18rem;color:#d9b66f;background:linear-gradient(#1c1e19,#0d0e0c)}
.latest,.treasure-panel{min-height:310px}
.raid-art{height:270px;display:flex;align-items:end;padding:1.2rem;background:linear-gradient(0deg,rgba(0,0,0,.95),rgba(0,0,0,.18)),url("assets/wood2.jpg") left center/cover}
.raid-copy h3{margin:0;font-family:Cinzel,serif;font-size:1.55rem}
.raid-copy p{max-width:410px;color:#d2c8b4}
.crew-panel{grid-column:2;grid-row:1 / span 2}
.crew-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.9rem;padding:1.2rem}
.crew-member{border:0;background:none;color:var(--pale);cursor:pointer;text-align:center}
.crew-member img{width:100%;aspect-ratio:1;border-radius:50%;object-fit:cover;border:2px solid #8f6d38;box-shadow:0 6px 14px #000;transition:.2s}
.crew-member:hover img{transform:translateY(-3px);border-color:#e2ba72}
.crew-member strong,.crew-member span{display:block}
.crew-member strong{font-family:Cinzel,serif;margin-top:.5rem}
.crew-member span{font-size:.7rem;color:#b9aa8b}
.treasure-art{height:270px;display:grid;place-items:center;align-content:center;text-align:center;background:radial-gradient(circle,#3d250f 0,#111 63%)}
.coin-pile{font-size:4rem;color:#d3a846;text-shadow:0 0 24px #ad6d1a}
.treasure-art p{margin:.4rem 0 0;text-transform:uppercase;color:#b49e75}
.treasure-art strong{font-family:Cinzel,serif;font-size:2rem;color:#d7ad60;margin-bottom:.8rem}
.locations-panel{grid-column:1}
.location-strip{display:grid;grid-template-columns:repeat(4,1fr)}
.location-strip button{min-height:150px;padding:.8rem;border:0;border-right:1px solid #49361e;background:radial-gradient(circle at top,#2b2e26,#0e100e);color:#d8ccb5;cursor:pointer}
.location-strip button:last-child{border-right:0}
.location-strip button span{display:block;font-size:2.2rem;color:#bd934c}
.location-strip strong{display:block;font-family:Cinzel,serif;font-size:.72rem}
.shield-panel{grid-column:2}
.shield-content{display:grid;grid-template-columns:160px 1fr;gap:1rem;padding:1.2rem;align-items:center}
.shield{width:140px;height:170px;display:grid;place-items:center;font-size:4rem;color:#c89b4f;border:5px double #76562f;border-radius:25% 25% 50% 50%;background:linear-gradient(135deg,#31312c,#0d0e0c);box-shadow:0 8px 16px #000}
.shield-content p,.shield-content li{color:#c6bda9;font-family:Georgia,serif}
.next-panel{grid-column:3}
.next-content{padding:1.4rem;min-height:230px;background:linear-gradient(90deg,rgba(3,5,5,.95),rgba(9,17,20,.77)),url("assets/hero.jpg") right center/cover}
.next-content select{width:100%;margin:.7rem 0;padding:.7rem;background:#0b0d0c;color:#ddcfb4;border:1px solid #76562f}
.voyage-result{color:#d6ad62;font-weight:700}
.journal{padding:6rem 5vw;background:#0b0d0b;border-top:1px solid #4d3920}
.section-heading{text-align:center;margin-bottom:2.2rem}
.section-heading p{color:var(--gold);text-transform:uppercase;letter-spacing:.18em;font-size:.75rem}
.section-heading h2{font-family:Cinzel,serif;font-size:clamp(2.2rem,5vw,4.6rem);margin:.2rem 0}
.journal-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;max-width:1250px;margin:auto}
.journal-grid article{padding:1.5rem;border:1px solid #4c3820;background:#121410}
.journal-grid span{color:var(--gold);font-size:.72rem;text-transform:uppercase;letter-spacing:.12em}
.journal-grid h3{font-family:Cinzel,serif}
.journal-grid p{color:#bdb29e}
.text-button{padding:0;border:0;background:none;color:#d5a557;text-decoration:underline;cursor:pointer}
footer{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:2rem;align-items:center;padding:2.3rem 4vw;border-top:1px solid #5a4225;background:#070807;color:#a99e89}
footer blockquote{margin:0;font-family:Georgia,serif;font-style:italic}
.footer-links{display:flex;gap:1rem}
.footer-links a{text-decoration:none;color:#c7a15d}
footer p{text-align:right;text-transform:uppercase;font-family:Cinzel,serif;font-size:.72rem}
dialog{width:min(650px,calc(100% - 2rem));color:#e5dac3;background:#11130f;border:1px solid #8a6535;box-shadow:0 20px 80px #000;padding:2rem}
dialog::backdrop{background:rgba(0,0,0,.78);backdrop-filter:blur(3px)}
.modal-close{position:absolute;right:.6rem;top:.35rem;border:0;background:none;color:#d7b16b;font-size:2rem;cursor:pointer}
#modal-content h2{font-family:Cinzel,serif;color:#d9b66f}
#modal-content p,#modal-content li{color:#c6bba5}
.ledger-table{width:100%;border-collapse:collapse}
.ledger-table td{padding:.7rem;border-bottom:1px solid #342817}
.ledger-table td:last-child{text-align:right;color:#d6ad62}
@media(max-width:1000px){
  .dashboard{grid-template-columns:1fr 1fr}
  .crew-panel,.locations-panel,.shield-panel,.next-panel{grid-column:auto;grid-row:auto}
  .crew-panel{grid-column:1 / -1}
  .locations-panel{grid-column:1 / -1}
  .journal-grid{grid-template-columns:1fr}
}
@media(max-width:720px){
  .menu-toggle{display:block}
  nav{display:none;position:absolute;top:72px;right:1rem;flex-direction:column;background:#090a09;border:1px solid var(--line);padding:1rem;min-width:220px}
  nav.open{display:flex}
  .dashboard{grid-template-columns:1fr}
  .crew-panel,.locations-panel,.shield-panel,.next-panel{grid-column:1}
  .crew-grid{grid-template-columns:repeat(2,1fr)}
  .location-strip{grid-template-columns:repeat(2,1fr)}
  .shield-content{grid-template-columns:1fr;text-align:center}
  .shield{margin:auto}
  footer{grid-template-columns:1fr}
  footer p{text-align:left}
}

.hero-content{max-width:1050px}
.hero h1{font-size:clamp(3.2rem,7vw,6.8rem);letter-spacing:.015em}
.hero h2{margin-top:1rem}