html { background: #101632; }
body {
    isolation: isolate;
    background: radial-gradient(circle at 13% 2%, #2d1b6b 0, #161a40 34%, #123b61 100%);
}
:root {
    --ink: #f3f6ff;
    --muted: #b5c3de;
    --line: rgba(176,195,239,.27);
    --shadow: 0 12px 32px rgba(4,10,35,.24);
}
.profile, .link-card, .support-option {
    background: linear-gradient(125deg,rgba(49,43,86,.62),rgba(24,43,76,.66));
    border: 1px solid rgba(178,196,240,.29);
    box-shadow: 0 8px 24px rgba(4,10,35,.2), inset 0 1px 0 rgba(255,255,255,.05);
    -webkit-backdrop-filter: blur(10px) saturate(120%);
    backdrop-filter: blur(10px) saturate(120%);
}
.profile h1, .link-title, .support-option-title { color: #f3f6ff; }
.link-description, .support-option-description { color: #b5c3de; font-weight: 500; }
.link-arrow, .support-option-arrow { color: #b9cbea; }
.link-card:hover, .link-card:focus-visible, .support-option:hover, .support-option:focus-visible {
    background: linear-gradient(125deg,rgba(65,57,108,.72),rgba(32,57,97,.76));
    border-color: rgba(158,191,255,.56);
    box-shadow: 0 10px 26px rgba(4,10,35,.28);
}
.link-card:focus-visible, .support-option:focus-visible { outline: 2px solid #93c5fd; outline-offset: 3px; }
.profile > .intro, .profile .announcement-line {
    color: #bcdcff; border-color: rgba(120,175,255,.35); background: rgba(42,95,163,.22);
}
.profile > .notice, .profile .announcement-line.notice {
    color: #ffd3b4; border-color: rgba(255,176,120,.32); background: rgba(143,74,45,.2);
}
.profile > .notice-extra {
    color: #a6f4d9; border-color: rgba(102,226,188,.35); background: rgba(20,111,94,.25);
}
.support-back { color: #c7dfff; border-color: rgba(134,180,255,.35); background: rgba(51,99,166,.25); }
.empty { color: #c5d3eb; background: rgba(25,42,74,.6); border-color: rgba(178,196,240,.32); }
.mx-home-ambient {
    position: fixed;
    inset: 0;
    z-index: -2;
    overflow: hidden;
    pointer-events: none;
    filter: blur(70px);
    opacity: .48;
}
.mx-home-orb { position: absolute; border-radius: 50%; }
.mx-home-orb.purple {
    width: clamp(260px,44vw,560px); height: clamp(260px,44vw,560px);
    top: -14%; left: -11%; background: #7957ff;
    animation: mx-home-purple 26s ease-in-out infinite alternate;
}
.mx-home-orb.blue {
    width: clamp(240px,38vw,490px); height: clamp(240px,38vw,490px);
    right: -10%; bottom: -17%; background: #27a9f0;
    animation: mx-home-blue 32s ease-in-out infinite alternate;
}
.mx-home-orb.violet {
    width: clamp(180px,25vw,330px); height: clamp(180px,25vw,330px);
    left: 58%; top: 38%; background: #b15dff; opacity: .58;
    animation: mx-home-violet 22s ease-in-out infinite alternate;
}
.mx-home-particles { position: fixed; inset: 0; z-index: -1; width: 100%; height: 100%; pointer-events: none; }
.mx-visit-stats { border-color: #7687b366; color: #c9d8f3; }
.mx-visit-stat strong { color: #f4f7ff; }
.mx-visit-stat::before { background: #90aaff; box-shadow: 0 0 7px #90aaff66; }
.mx-visit-stats[data-unavailable] strong, .footer { color: #aebdda; }
@keyframes mx-home-purple { to { transform: translate(12vw,12vh) scale(1.18); } }
@keyframes mx-home-blue { to { transform: translate(-10vw,-14vh) scale(1.12); } }
@keyframes mx-home-violet { to { transform: translate(-14vw,10vh) scale(1.25); } }
@media (max-width: 699px), (pointer: coarse) {
    .mx-home-ambient { filter: none; opacity: 1; }
    .mx-home-orb { animation: none !important; }
    .mx-home-orb.purple { background: radial-gradient(circle,rgba(121,87,255,.36) 0%,rgba(121,87,255,0) 72%); }
    .mx-home-orb.blue { background: radial-gradient(circle,rgba(39,169,240,.32) 0%,rgba(39,169,240,0) 72%); }
    .mx-home-orb.violet { background: radial-gradient(circle,rgba(177,93,255,.26) 0%,rgba(177,93,255,0) 72%); }
    .mx-home-particles { display: none; }
    .profile, .link-card, .support-option {
        -webkit-backdrop-filter: none;
        backdrop-filter: none;
        background: linear-gradient(125deg,rgba(49,43,86,.88),rgba(24,43,76,.9));
    }
    .link-card:hover, .link-card:focus-visible,
    .support-option:hover, .support-option:focus-visible {
        transform: none;
        box-shadow: 0 8px 24px rgba(4,10,35,.2), inset 0 1px 0 rgba(255,255,255,.05);
    }
    .profile, .link-card, .support-option, .link-arrow {
        animation: none !important;
        transition: none !important;
    }
}
@media (prefers-reduced-motion: reduce) { .mx-home-orb { animation: none; } }