/* SMPHosting glass surfaces. Shared by the website and server panel. */
:root { --glass-surface: rgba(27, 34, 43, .68); --glass-border: rgba(225, 244, 255, .14); --muted: #becbc8; }
body { background: radial-gradient(ellipse at 80% 8%, rgba(64, 119, 140, .25), transparent 48%), radial-gradient(ellipse at 8% 45%, rgba(80, 118, 77, .18), transparent 45%), radial-gradient(ellipse at 80% 85%, rgba(62, 91, 112, .2), transparent 45%), #10171c; background-attachment: fixed; }
.site-header, .site-header[data-scrolled="true"] { background: rgba(17, 24, 30, .74); backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); border-bottom: 1px solid var(--glass-border); box-shadow: 0 8px 30px rgba(0,0,0,.12); }
.hero-overlay { background: radial-gradient(ellipse at 78% 18%, rgba(75, 129, 157, .26), transparent 55%), radial-gradient(ellipse at 75% 60%, rgba(111, 158, 78, .18), transparent 50%), linear-gradient(90deg, rgba(16,23,28,.94), rgba(16,23,28,.68) 45%, rgba(16,23,28,.28)), linear-gradient(0deg, #10171c, transparent 30%); }
.hero-stats div, .pricing-section .basic-plan-card, .plan-card, .feature-grid article, .review-grid article, .portal-card, .launch-offer, .hardware-strip, .game-hardware-strip, .support-chat-button, .support-chat-panel, .social-rail, .billing-toggle, .faq-item, .order-modal, .auth-modal, .maintenance-screen, .storage-notice, .mobile-nav { background: linear-gradient(145deg, rgba(210,235,255,.055), rgba(210,235,255,0) 65%), var(--glass-surface); border: 1px solid var(--glass-border); backdrop-filter: blur(20px) saturate(115%); -webkit-backdrop-filter: blur(20px) saturate(115%); box-shadow: inset 0 1px 0 rgba(255,255,255,.045), 0 14px 38px rgba(0,0,0,.16); }
.pricing-section .basic-plan-card { border-radius: 22px; transition: border-color .2s, transform .2s, box-shadow .2s; }
.pricing-section .basic-plan-card:hover { border-color: rgba(163,239,99,.55); box-shadow: inset 0 1px 0 rgba(255,255,255,.08), 0 16px 42px rgba(0,0,0,.25); }
.basic-plan-card .plan-label, .badge, .promo-pill { background: rgba(163,239,99,.1); border-color: rgba(163,239,99,.32); }
.hardware-strip div { border-color: var(--glass-border); }
.hero-stats div { border-radius: 16px; }
.launch-offer { background: linear-gradient(145deg, rgba(163,239,99,.08), rgba(81,129,150,.06)), rgba(20,30,35,.8); border-color: rgba(163,239,99,.34); }
.launch-countdown > div { background: rgba(8,15,20,.52); border-color: var(--glass-border); }
.site-footer { background: rgba(17,24,30,.75); border-top: 1px solid var(--glass-border); backdrop-filter: blur(22px); -webkit-backdrop-filter: blur(22px); }
.panel-section, .pricing-section, .game-plan-section { background-color: transparent; }
.interactive-panel { border: 1px solid var(--glass-border); border-radius: 22px; overflow: hidden; box-shadow: 0 22px 65px rgba(0,0,0,.24); }
.support-chat-button { border-color: rgba(163,239,99,.3); }
.support-chat-button:hover { border-color: rgba(163,239,99,.65); }
body > .app .sidebar { background: rgba(20,27,35,.65); border-color: var(--glass-border); backdrop-filter: blur(22px); }
body > .app main { background: transparent; }
.metrics > div, .tile, .catalog-card, .terminal { background: linear-gradient(145deg, rgba(210,235,255,.04), transparent), rgba(23,31,39,.69); border-color: var(--glass-border); backdrop-filter: blur(18px); box-shadow: inset 0 1px 0 rgba(255,255,255,.04), 0 10px 28px rgba(0,0,0,.12); }
.terminal { background-color: rgba(9,16,22,.75); }
.sidebar nav button { background: rgba(210,235,255,.04); }
.sidebar nav button.active { background: var(--lime); color: #10171c; }
.table td, .table th, .terminal form { border-color: var(--glass-border); }
input, textarea, select { background-color: rgba(10,17,23,.75); }
@media (prefers-reduced-motion: reduce) { .pricing-section .basic-plan-card { transition: none; } }

/* Creeper video behind the existing glass website. */
body { isolation: isolate; background: #10171c; }
.site-video-backdrop { position: fixed; inset: 0; z-index: -1; pointer-events: none; overflow: hidden; background: url("assets/creeper-background.jpg") center / cover no-repeat; }
.site-video-backdrop video { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.site-video-backdrop::after { content: ""; position: absolute; inset: 0; background: linear-gradient(110deg, rgba(8,16,20,.48), rgba(8,16,20,.24)), rgba(10,20,24,.12); backdrop-filter: blur(2px); -webkit-backdrop-filter: blur(2px); }
.hero > .hero-image { display: block; }
.hero-overlay { background: linear-gradient(90deg, rgba(10,18,23,.38), rgba(10,18,23,.08)); }
.partner-banner { background: rgba(17,24,30,.55); backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px); }
.cta-section { background: linear-gradient(135deg, rgba(163,239,99,.12), rgba(210,235,255,.04)), rgba(17,24,30,.64); backdrop-filter: blur(20px); -webkit-backdrop-filter: blur(20px); }
body.embedded { background: transparent; }
body.embedded .site-video-backdrop { display: none; }
@media (prefers-reduced-motion: reduce) { .site-video-backdrop video { display: none; } }
@media (max-width: 650px) { .site-video-backdrop video { object-position: 72% center; } .site-video-backdrop { background-position: 72% center; } }