:root {
    color-scheme: light;
    font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
    color: #12182b;
    background: #fff;
    font-synthesis: none;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; background: #fff; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }

.brand { display: inline-flex; align-items: center; gap: 11px; font-size: 23px; font-weight: 800; letter-spacing: 0; white-space: nowrap; }
.brand-mark { position: relative; width: 27px; height: 27px; display: inline-block; transform: rotate(45deg); }
.brand-mark i { position: absolute; width: 12px; height: 12px; border-radius: 5px; }
.brand-mark i:nth-child(1) { left: 0; top: 0; background: #ff6b6b; }
.brand-mark i:nth-child(2) { right: 0; top: 0; background: #ffc94d; }
.brand-mark i:nth-child(3) { left: 0; bottom: 0; background: #6da8ff; }
.brand-mark i:nth-child(4) { right: 0; bottom: 0; background: #9a62ee; }