:root {
    --glass-bg: rgba(255, 255, 255, 0.03);
    --glass-bg-strong: rgba(255, 255, 255, 0.08);
    --glass-border: rgba(255, 255, 255, 0.12);
    --glass-border-strong: rgba(255, 255, 255, 0.22);
    --glass-radius: 16px;
    --glass-shadow: 0 8px 26px rgba(4, 14, 24, 0.24);
    --glass-inset: inset 0 1px 0 rgba(255, 255, 255, 0.12);
    --glass-blur: 8px;
}

*,
*::before,
*::after {
    box-sizing: border-box;
}

.theme-glass {
    min-height: 100vh;
    color: #eef7ff;
}

.bg-bumi {
    background-image: url('../img/bg_bumi.png');
    background-size: 100% 100%;
    background-position: center center;
    background-repeat: no-repeat;
    background-attachment: fixed;
}

.glass-panel {
    background: var(--glass-bg);
    border: 1px solid var(--glass-border);
    border-radius: var(--glass-radius);
    box-shadow: var(--glass-shadow), var(--glass-inset);
    backdrop-filter: blur(var(--glass-blur));
    -webkit-backdrop-filter: blur(var(--glass-blur));
}

.glass-card {
    background: linear-gradient(165deg, rgba(12, 39, 58, 0.56), rgba(16, 50, 72, 0.38));
    border: 1px solid var(--glass-border);
    border-radius: 16px;
    box-shadow: var(--glass-shadow), var(--glass-inset);
    backdrop-filter: blur(var(--glass-blur));
    -webkit-backdrop-filter: blur(var(--glass-blur));
}