:root{color-scheme:dark;font-family:Arial,Helvetica,sans-serif;background:#161616;color:#fff;--red:#ef2634}
*{box-sizing:border-box}
body{margin:0;min-height:100vh;min-height:100svh;border-top:4px solid var(--red);display:grid;place-items:center;padding:40px 24px}
main{width:min(100%,380px);padding:24px 0 52px}
header{text-align:center;margin-bottom:64px}
.logo{display:block;width:min(100%,310px);height:auto;margin:auto}
.brand-line{font-size:12px;letter-spacing:.32em;margin:18px 0 0;padding-left:.32em;font-weight:700;color:#e0e0e0}
h1{font-size:26px;line-height:1.5;text-align:center;margin:0 0 4px;font-weight:700}
.subtitle{text-align:center;font-size:16px;color:#b3b3b3;margin:0 0 30px;line-height:1.5}
nav{display:grid;gap:14px}
a{display:flex;align-items:center;gap:20px;padding:21px 24px;border:1px solid #424242;border-radius:12px;background:#202020;color:#fff;text-decoration:none;min-height:94px;transition:border-color .15s,background .15s}
a:hover{border-color:var(--red);background:#282020}
a:focus-visible{outline:3px solid var(--red);outline-offset:5px}
a:active{background:#302020}
a img{flex:none;width:28px;height:28px}
.platform{display:flex;flex-direction:column;gap:7px;min-width:0}
.name{font-size:20px;line-height:1.2;font-weight:700}
.handle{font-size:14px;line-height:1.3;color:#bdbdbd;overflow-wrap:anywhere}
@media(max-height:650px){body{padding-top:26px;padding-bottom:26px}main{padding:12px 0}header{margin-bottom:34px}}
@media(prefers-reduced-motion:reduce){a{transition:none}}