:root{
  color-scheme:dark;
  --ink:#eef0dc;
  --muted:#a7b6a9;
  --forest:#10241d;
  --forest-deep:#071712;
  --forest-soft:#17352b;
  --gold:#d6b46f;
  --gold-soft:#f0d69b;
  --cream:#eee8d7;
  --line:rgba(222,198,139,.2);
  --max:1080px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:linear-gradient(180deg,#0e281f,#071712 56%);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100svh}
a{color:inherit}
.page-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;gap:26px;min-height:64px;padding:10px max(4vw,22px);background:rgba(7,23,18,.93);border-bottom:1px solid var(--line);backdrop-filter:blur(12px)}
.brand{display:flex;align-items:center;gap:10px;text-decoration:none;font:600 14px/1 Georgia,serif;letter-spacing:.12em}
.brand-mark{display:grid;place-items:center;width:28px;height:36px;border:1px solid rgba(214,180,111,.55);color:var(--gold-soft);font:24px/1 Georgia,serif}
.page-header nav{display:flex;gap:22px;margin-left:auto}
.page-header nav a{text-decoration:none;color:#a8b7aa;font-size:12px}
.page-header nav a[aria-current="page"],.page-header nav a:hover{color:var(--gold-soft)}
.play-link{padding:9px 13px;border:1px solid rgba(214,180,111,.6);color:var(--gold-soft)!important}
.page-main{width:min(var(--max),90vw);margin:auto;padding:70px 0 90px}
.eyebrow{margin:0 0 12px;color:#ceb477;font-size:10px;font-weight:700;letter-spacing:.18em}
h1{margin:0;font:400 clamp(44px,7vw,76px)/1 Georgia,serif}
.lead{max-width:760px;margin:18px 0 40px;color:#aab9ae;font-size:15px;line-height:1.85}
.panel{border:1px solid var(--line);background:rgba(5,20,15,.45)}
.page-footer{display:flex;justify-content:space-between;gap:18px;padding:24px max(5vw,24px);border-top:1px solid var(--line);color:#80948a;font-size:11px;background:#05130f}
.back{color:var(--gold-soft);text-decoration:none;border-bottom:1px solid rgba(214,180,111,.3);padding-bottom:4px}
.roadmap-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.roadmap-column{padding:26px}
.roadmap-column header{padding-bottom:18px;border-bottom:1px solid var(--line)}
.roadmap-column h2{margin:7px 0 0;font:400 28px Georgia,serif}
.roadmap-column ul{list-style:none;padding:0;margin:20px 0 0;display:grid;gap:16px}
.roadmap-column li{position:relative;padding-left:20px;color:#b7c4ba;font-size:13px;line-height:1.65}
.roadmap-column li::before{content:"";position:absolute;left:0;top:.55em;width:7px;height:7px;border-radius:50%;background:#8ba579;box-shadow:0 0 12px rgba(139,165,121,.3)}
.roadmap-column.progress li::before{background:#d6b46f}
.roadmap-column.future li::before{background:#667b70}
.roadmap-note{margin:24px 0 0;color:#80958a;font-size:12px;line-height:1.7}
.status-card{padding:30px;display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center}
.status-orb{width:72px;height:72px;border-radius:50%;display:grid;place-items:center;background:#3d5348;box-shadow:0 0 30px rgba(130,170,140,.12);transition:.3s ease}
.status-orb::after{content:"";width:24px;height:24px;border-radius:50%;background:#8ea096}
.status-orb.online{background:#284934;box-shadow:0 0 34px rgba(121,190,127,.2)}
.status-orb.online::after{background:#91d39a}
.status-orb.waking{background:#544b2c;box-shadow:0 0 34px rgba(214,180,111,.18)}
.status-orb.waking::after{background:#d6b46f;animation:pulse 1.2s ease-in-out infinite}
.status-orb.error{background:#512f2b}.status-orb.error::after{background:#d87965}
.status-copy h2{margin:0 0 7px;font:400 30px Georgia,serif}
.status-copy p{margin:0;color:#9fb0a4;font-size:13px;line-height:1.7}
.status-meta{margin-top:18px;padding-top:18px;border-top:1px solid var(--line);display:flex;flex-wrap:wrap;gap:12px 26px;color:#8fa197;font-size:11px}
.status-actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:22px}
.status-actions button,.status-actions a{min-height:42px;padding:11px 16px;border:1px solid rgba(214,180,111,.48);background:transparent;color:var(--gold-soft);text-decoration:none;font-weight:700;font-size:11px;cursor:pointer}
.status-actions button:hover,.status-actions a:hover{background:rgba(214,180,111,.08)}
.status-explain{margin-top:30px;padding:24px}
.status-explain h3{margin:0 0 12px;font:400 23px Georgia,serif}
.status-explain p{margin:0;color:#9fb0a4;font-size:13px;line-height:1.8}
@keyframes pulse{50%{transform:scale(.75);opacity:.55}}
@media(max-width:820px){
  .page-header nav a:not(.play-link){display:none}
  .roadmap-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .page-main{width:88vw;padding-top:48px}
  .status-card{grid-template-columns:1fr;text-align:center}
  .status-orb{margin:auto}
  .status-meta,.status-actions{justify-content:center}
  .page-footer{flex-direction:column;text-align:center}
}
.devlog-list{display:grid;gap:18px}
.devlog-entry{display:grid;grid-template-columns:190px minmax(0,1fr);gap:30px;padding:28px}
.devlog-date{display:grid;align-content:start;gap:8px;border-right:1px solid var(--line);padding-right:22px}
.devlog-date time{color:#f0d69b;font:400 18px Georgia,serif}
.devlog-date span{color:#81958a;font-size:9px;font-weight:800;letter-spacing:.14em}
.devlog-entry h2{margin:0 0 12px;font:400 29px/1.15 Georgia,serif;color:#f1e3c1}
.devlog-entry p,.devlog-entry li{color:#9fb0a4;font-size:13px;line-height:1.8}
.devlog-entry p{margin:0}
.devlog-entry ul{margin:14px 0 0;padding-left:20px}
.devlog-entry strong{color:#e5cd96}
@media(max-width:700px){
  .devlog-entry{grid-template-columns:1fr;gap:16px}
  .devlog-date{border-right:0;border-bottom:1px solid var(--line);padding:0 0 14px}
}
