@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@600;700&family=Work+Sans:wght@400;500;600&display=swap');
:root{
  --bg:#0C1A35; --bg-panel:#14294F; --surface:#1C3764;
  --fg:#F4EFE0; --fg-muted:#AEC1E0; --fg-dim:#7E93BE;
  --gold:#E8D08A; --gold-deep:#C7A862;
  --border:rgba(232,208,138,0.18); --border-soft:rgba(255,255,255,0.08);
  color-scheme:dark;
}
*{box-sizing:border-box;}
html,body{margin:0;padding:0;}
body{
  background:var(--bg); color:var(--fg);
  font-family:'Work Sans',system-ui,sans-serif; line-height:1.7; font-size:16px;
  padding-top:env(safe-area-inset-top,0px); padding-bottom:env(safe-area-inset-bottom,0px);
}
h1,h2{font-family:'Baloo 2',system-ui,sans-serif; font-weight:700; margin:0;}
a{color:var(--gold-deep);}
.wrap{
  max-width:760px; margin:0 auto;
  padding:48px max(20px, env(safe-area-inset-right,0px)) 80px max(20px, env(safe-area-inset-left,0px));
}
.back{display:inline-flex; align-items:center; gap:6px; font-size:14px; color:var(--fg-dim); text-decoration:none; margin-bottom:28px;}
.back:hover{color:var(--gold);}
h1{font-size:clamp(26px,3.6vw,34px); margin-bottom:8px;}
.updated{font-size:13px; color:var(--fg-dim); margin-bottom:36px;}
h2{font-size:19px; margin-top:36px; margin-bottom:10px; color:var(--gold);}
p{margin:0 0 12px; color:var(--fg-muted);}
.fact-box{
  background:var(--surface); border:1px solid var(--border-soft); border-radius:14px;
  padding:20px 22px; margin:18px 0; font-size:15px; color:var(--fg);
}
.fact-box div{margin-bottom:4px;}
.note{
  margin-top:40px; padding:16px 18px; border:1px dashed var(--border);
  border-radius:12px; font-size:13px; color:var(--fg-dim);
}
ul{padding-left:20px; color:var(--fg-muted);}
li{margin-bottom:6px;}
