:root {
    --brand-orange: #f97316;
    --brand-amber: #f59e0b;
    --surface: #fffaf4;
    --surface-strong: #fff5ea;
    --ink: #111827;
}

html {
    scroll-behavior: smooth;
}

body {
    margin: 0;
    min-height: 100vh;
    background:
        radial-gradient(circle at top left, rgba(249, 115, 22, 0.12), transparent 30%),
        radial-gradient(circle at top right, rgba(245, 158, 11, 0.12), transparent 25%),
        linear-gradient(135deg, #fff7ed 0%, #ffffff 55%, #fffbeb 100%);
    color: var(--ink);
}

.glass-panel {
    backdrop-filter: blur(18px);
    -webkit-backdrop-filter: blur(18px);
}

.text-brand-gradient {
    background: linear-gradient(90deg, #ea580c, #d97706);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
}

.shadow-brand {
    box-shadow: 0 24px 60px rgba(249, 115, 22, 0.18);
}

.float-slow {
    animation: float 5s ease-in-out infinite;
}

@keyframes float {
    0%, 100% {
        transform: translateY(0) rotate(0deg);
    }

    50% {
        transform: translateY(-15px) rotate(-5deg);
    }
}

.soft-ring {
    box-shadow: 0 0 0 1px rgba(249, 115, 22, 0.12), 0 20px 40px rgba(249, 115, 22, 0.08);
}

.card-shell {
    background: rgba(255, 255, 255, 0.82);
    border: 1px solid rgba(251, 146, 60, 0.18);
}

.table-shell {
    background: rgba(255, 255, 255, 0.8);
}