:root {
    --bg-main: #07141f;
    --bg-surface: #102332;
    --bg-surface-soft: #173247;
    --line: #326684;
    --text-main: #eef9ff;
    --text-soft: #9dbfce;
    --accent: #5cf2d7;
    --accent-2: #6fa9ff;
    --danger: #ff7d7d;
}

* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

html,
body {
    min-height: 100%;
}

body {
    background:
        radial-gradient(circle at 8% -5%, #1a4159, transparent 40%),
        radial-gradient(circle at 90% 0%, #1f3752, transparent 34%),
        linear-gradient(180deg, #06121c, #091d2b 45%, #07141f);
    color: var(--text-main);
    font-family: "Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
    display: flex;
    flex-direction: column;
}

main {
    width: min(1200px, 92vw);
    margin: 0 auto;
    flex: 1;
    padding: 1.8rem 0 2.6rem;
}

img {
    max-width: 100%;
    display: block;
}

a {
    color: inherit;
}

.panel {
    border: 2px solid var(--line);
    background: linear-gradient(140deg, rgba(18, 41, 58, 0.96), rgba(9, 23, 34, 0.96));
    box-shadow: 0 12px 28px rgba(0, 0, 0, 0.35);
    border-radius: 14px;
}