.credit-balance[data-v-5d1561e6] { display: flex; gap: 10px; align-items: center; font-size: 13px; line-height: 1; } .credit-balance__credits[data-v-5d1561e6] { font-weight: 600; } .credit-balance__storage[data-v-5d1561e6] { opacity: 0.6; } /* Placeholder — swap for your glass monochrome tokens. */ .gate-overlay[data-v-7e495eeb] { position: fixed; inset: 0; z-index: 10000; display: flex; align-items: center; justify-content: center; background: rgba(0, 0, 0, 0.4); } .gate-card[data-v-7e495eeb] { width: 320px; padding: 20px; border-radius: 12px; background: rgba(255, 255, 255, 0.85); backdrop-filter: blur(8px); box-shadow: 0 8px 30px rgba(0, 0, 0, 0.2); } .gate-card__title[data-v-7e495eeb] { margin: 0 0 8px; font-size: 16px; } .gate-card__msg[data-v-7e495eeb] { margin: 0 0 16px; font-size: 13px; opacity: 0.75; } .gate-card__hint[data-v-7e495eeb] { margin: 0 0 16px; font-size: 12px; opacity: 0.6; } .gate-card__buy[data-v-7e495eeb] { display: flex; flex-direction: column; gap: 8px; margin-bottom: 16px; } .gate-card__actions[data-v-7e495eeb] { display: flex; gap: 8px; justify-content: flex-end; } .gate-card__primary[data-v-7e495eeb], .gate-card__secondary[data-v-7e495eeb] { padding: 8px 14px; border-radius: 8px; font-size: 13px; cursor: pointer; } * { margin: 0; padding: 0; box-sizing: border-box; } html { font-size: 16px; overflow-x: hidden; } body { width: 100vw; min-height: 100vh; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; overflow-x: hidden; position: relative; } #app { width: 100vw; min-height: 100vh; position: relative; overflow-x: hidden; overflow-y: auto; display: flex; flex-direction: column; } @media screen and (max-width: 1920px) { html { font-size: 16px; } } @media screen and (min-width: 1921px) { html { font-size: 18px; } } @media screen and (max-width: 1366px) { html { font-size: 14px; } } @media screen and (max-width: 1024px) { html { font-size: 14px; } } @media screen and (max-width: 768px) { html { font-size: 12px; } } .container { width: 100%; max-width: 100%; height: 100%; display: flex; flex-direction: column; } .main-layout { flex: 1; display: flex; width: 100%; overflow: hidden; } .panel-container { display: flex; gap: 1rem; flex: 1; padding: 1rem; overflow: hidden; } .panel-container .panel { flex: 1; overflow: auto; background: white; border-radius: 8px; box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); } input, button, select, textarea { font-family: inherit; font-size: inherit; } * { min-width: 0; min-height: 0; }:root { --primary-color: #000; --secondary-color: #464646; --background-color: #fff; --text-color: #333; } body { margin: 0; padding: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen, Ubuntu, Cantarell, sans-serif; background-color: var(--background-color); color: var(--text-color); } /* ============================================================ TEMP: wallpaper kill switch Toggle by adding/removing class "wallpapers-off" on . Remove this block to restore wallpapers app-wide. ============================================================ */ html.wallpapers-off .component-bg, html.wallpapers-off .header-bg { display: none !important; } html.wallpapers-off .business-container { background-color: var(--bg-primary); } html.wallpapers-off .header-bar { background-color: var(--bg-secondary); }:root { /* Light Mode Colors */ --bg-primary: #ffffff; --bg-secondary: #f8f9fa; --bg-tertiary: rgba(245, 245, 245, 0.6); --text-primary: #000000; --text-secondary: #333333; --text-tertiary: #666666; --border-color: rgba(0, 0, 0, 0.1); --border-strong: #cccccc; --header-bg: rgba(245, 245, 245, 0.6); --nav-bg: rgba(255, 255, 255, 0.2); --navbar-bg: rgba(255, 255, 255, 0.95); --title-gradient: linear-gradient(180deg, #000000 0%, #666666 100%); --video-placeholder-bg: linear-gradient(135deg, rgba(255,255,255,0.95) 0%, rgba(245,245,245,0.95) 100%); --button-bg: #ffffff; --button-hover: #f8f8f8; --button-border: rgba(0, 0, 0, 0.15); --icon-color: #434343; --icon-secondary: #5f6368; --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.08); --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.12); --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.12); --features-container-bg: rgba(255, 255, 255, 0.3); --carousel-bg: rgba(240, 240, 240, 0.5); --segmented-bg: rgba(240, 240, 240, 0.35); } /* Dark Mode Override */ .dark-mode { --bg-primary: #1a1a1a; --bg-secondary: #2a2a2a; --bg-tertiary: rgba(30, 30, 30, 0.6); --text-primary: #ffffff; --text-secondary: #e5e5e5; --text-tertiary: #b0b0b0; --border-color: rgba(255, 255, 255, 0.1); --border-strong: #404040; --header-bg: rgba(30, 30, 30, 0.8); --nav-bg: rgba(30, 30, 30, 0.3); --navbar-bg: rgba(30, 30, 30, 0.95); --title-gradient: linear-gradient(180deg, #ffffff 0%, #cccccc 100%); --video-placeholder-bg: linear-gradient(135deg, rgba(40,40,40,0.95) 0%, rgba(30,30,30,0.95) 100%); --button-bg: rgba(60, 60, 60, 1); --button-hover: rgba(80, 80, 80, 1); --button-border: rgba(255, 255, 255, 0.15); --icon-color: #e5e5e5; --icon-secondary: #b0b0b0; --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.4); --shadow-md: 0 2px 8px rgba(0, 0, 0, 0.5); --shadow-lg: 0 8px 24px rgba(0, 0, 0, 0.6); --features-container-bg: rgba(30, 30, 30, 0.3); --carousel-bg: rgba(40, 40, 40, 0.5); --segmented-bg: rgba(60, 60, 60, 0.4); }