:root{--sea:#071722;--deep:#0D2433;--line:#1D3A4B;--stone:#E6ECEA;--mist:#8FA6AE;--glass:#8EE3D2;--display:"Bricolage Grotesque",system-ui,sans-serif;--body:"Figtree",system-ui,sans-serif}
*{box-sizing:border-box;margin:0;padding:0}
html{background:var(--sea);color:var(--stone)}
body{font:400 17px/1.7 var(--body);padding:0 clamp(20px,5vw,72px)}
a{color:var(--glass)}
:focus-visible{outline:2px solid var(--glass);outline-offset:3px}
header{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:20px 0;border-bottom:1px solid var(--line);max-width:860px;margin:0 auto}
.logo{font:800 20px var(--display);font-stretch:80%;text-decoration:none;color:var(--stone)}
.logo span{color:var(--glass)}
select{appearance:none;-webkit-appearance:none;background:transparent;color:var(--stone);border:1px solid var(--line);border-radius:999px;font:600 14px var(--body);padding:8px 16px;cursor:pointer}
select option{color:#071722}
main{max-width:860px;margin:0 auto;padding:clamp(40px,7vw,96px) 0}
article{display:none}
article.on{display:block}
h1{font:700 clamp(40px,6vw,72px)/1 var(--display);font-stretch:80%;letter-spacing:-.025em;margin-bottom:12px}
.upd{color:var(--mist);font-size:15px;margin-bottom:40px}
h2{font:700 22px/1.3 var(--display);font-stretch:90%;margin:36px 0 10px}
p,li{max-width:72ch;color:#cdd8d8}
p+p{margin-top:10px}
ul,ol{padding-left:22px;margin-top:8px}
li{margin:4px 0}
.note{margin-top:48px;padding-top:20px;border-top:1px solid var(--line);color:var(--mist);font-size:15px}
footer{max-width:860px;margin:0 auto;padding:24px 0 40px;border-top:1px solid var(--line);color:var(--mist);font-size:14px;display:flex;gap:20px;flex-wrap:wrap}
footer a{color:var(--mist)}