
:root {
  --bg: #0F242B;
  --text: #FFFFFF;
  --muted: #C8D4D8;
  --accent: #21E0C0;
  --line: rgba(255,255,255,.08);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: Arial, Helvetica, sans-serif; line-height: 1.78; }
.container { width: min(860px, calc(100% - 36px)); margin: 0 auto; }
header { padding: 34px 0 18px; }
.brand { color: var(--accent); font-weight: 700; letter-spacing: .12em; text-transform: uppercase; font-size: 13px; }
h1 { font-size: clamp(2rem, 4vw, 3.08rem); line-height: 1.12; margin: 12px 0 12px; }
main { padding-bottom: 64px; }
p { margin: 0 0 18px; }
.lead { font-size: 1.08rem; }
h2 { font-size: 1.55rem; line-height: 1.22; margin: 34px 0 12px; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
.accent { color: var(--accent); font-weight: 700; }
img.blog-image { display:block; width:100%; margin: 28px 0 10px; border-radius: 12px; }
.notice { padding: 16px 18px; border-left: 3px solid var(--accent); background: rgba(255,255,255,.03); margin: 22px 0 24px; border-radius: 6px; }
ul { padding-left: 20px; }
li { margin-bottom: 8px; }
.faq details { border-top: 1px solid var(--line); padding: 14px 0; }
.faq details:last-child { border-bottom: 1px solid var(--line); }
.faq summary { cursor: pointer; font-weight: 700; list-style: none; }
.faq summary::-webkit-details-marker { display:none; }
.faq summary::after { content:'+'; float:right; color: var(--accent); font-weight:700; }
.faq details[open] summary::after { content:'–'; }
.download-box { margin-top: 28px; padding: 18px; border: 1px solid var(--line); border-radius: 10px; }
footer { padding: 28px 0 54px; color: var(--muted); font-size: .94rem; }
