:root { color-scheme: dark; font-family: Inter, ui-sans-serif, system-ui, sans-serif; background: #080b10; color: #f5f2e8; }
* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; background: radial-gradient(circle at 15% 5%, #243b36 0, transparent 28%), #080b10; line-height: 1.75; }
header { position: sticky; top: 0; z-index: 2; display: flex; justify-content: space-between; align-items: center; padding: 18px max(24px, 6vw); background: #080b10e8; border-bottom: 1px solid #ffffff16; backdrop-filter: blur(16px); }
header > a { display: flex; align-items: center; gap: 10px; color: #fff; font-size: 0; font-weight: 900; text-decoration: none; }
header > a::before { content: "VP"; width: 44px; height: 44px; display: grid; place-items: center; border-radius: 8px; color: #120d06; background: linear-gradient(135deg, #ffd166, #ff8a2a); font-size: 13px; }
header > a span { margin-left: 0; color: #fff; font-size: 16px; }
nav { display: flex; gap: 18px; flex-wrap: wrap; }
nav a, footer a { color: #bdc4c8; text-decoration: none; font-size: 13px; }
main { width: min(920px, calc(100% - 40px)); margin: 70px auto; }
.intro p:first-child { color: #d7ff72; letter-spacing: .16em; font-size: 12px; }
.intro h1 { font-size: clamp(34px, 6vw, 64px); line-height: 1.05; margin: 12px 0; }
.intro > p:last-child { color: #9da5ab; }
.notice, .warning { padding: 20px 24px; border: 1px solid #d7ff7245; background: #d7ff720d; border-radius: 14px; margin: 32px 0; }
article { margin: 70px 0; padding-top: 30px; border-top: 1px solid #ffffff1b; }
h2 { font-size: 32px; }
h3 { margin-top: 30px; color: #e6e1d6; }
p, dd { color: #b9c0c5; }
strong { color: #fff; }
dl { display: grid; grid-template-columns: 190px 1fr; border-top: 1px solid #ffffff18; }
dt, dd { margin: 0; padding: 15px; border-bottom: 1px solid #ffffff18; }
dt { font-weight: 700; color: #fff; }
footer { display: flex; justify-content: space-between; padding: 30px max(24px, 6vw); border-top: 1px solid #ffffff16; color: #8e969c; }
.legal-language { position: relative; }
.legal-language summary { list-style: none; cursor: pointer; min-width: 105px; padding: 7px 11px; border: 1px solid #ffffff20; border-radius: 9px; color: #f5f2e8; }
.legal-language summary::-webkit-details-marker { display: none; }
.legal-language summary::after { content: " ▾"; }
.legal-language > div { position: absolute; right: 0; top: calc(100% + 6px); display: grid; min-width: 125px; padding: 5px; border: 1px solid #ffffff20; border-radius: 9px; background: #111714; }
.legal-language button { padding: 8px 10px; border: 0; background: transparent; color: #bdc4c8; text-align: left; cursor: pointer; }
.legal-language button:hover { background: #ffffff12; color: #fff; }
@media (max-width: 700px) { header { position: static; align-items: flex-start; gap: 15px; flex-direction: column; } nav { gap: 12px; } dl { grid-template-columns: 1fr; } dt { padding-bottom: 2px; border-bottom: 0; } dd { padding-top: 4px; } }