:root { color-scheme: dark; }
* { box-sizing: border-box; }
body {
    margin: 0;
    min-height: 100vh;
    display: grid;
    place-items: center;
    padding: 24px;
    background: #101719;
    color: #e6edeb;
    font: 17px/1.65 system-ui, sans-serif;
}
.link-card {
    max-width: 560px;
    width: 100%;
    padding: 40px;
    border: 1px solid #334340;
    border-radius: 20px;
    background: #192321;
}
.brand { font-size: 13px; letter-spacing: .15em; text-transform: uppercase; color: #8bc6aa; }
.symbol { font-size: 44px; color: #93d8b1; margin: 24px 0 8px; }
html[data-state="error"] .symbol { color: #e5b78e; }
h1 { font-size: 30px; line-height: 1.2; margin: 0 0 16px; }
.detail { color: #c3d0cb; margin: 0; }
footer { margin-top: 28px; color: #839a90; font-size: 13px; }
@media (max-width: 480px) {
    .link-card { padding: 28px; }
    h1 { font-size: 26px; }
}