:root { color-scheme: dark; --bg: #080b10; --panel: rgba(17, 24, 34, .58); --panel2: rgba(22, 32, 45, .7); --line: rgba(185, 211, 232, .14); --muted: #8b9aac; --text: #e8edf4; --cyan: #55d6c2; --green: #35d39a; --red: #f06d7a; --amber: #f2b866; --radius-control: 12px; --radius-panel: 18px; }
                * { box-sizing: border-box; } body { margin: 0; background: radial-gradient(circle at 15% 0%, rgba(85,214,194,.08), transparent 28%), var(--bg); color: var(--text); font-family: 'DM Sans', sans-serif; font-size: 12px; } button, input, select { font: inherit; } button { cursor: pointer; }
                button, .developer-links a { border-radius: var(--radius-control); background: rgba(92, 99, 108, .28) !important; border: 1px solid rgba(255,255,255,.09) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 8px 24px rgba(0,0,0,.18); backdrop-filter: blur(22px) saturate(115%); -webkit-backdrop-filter: blur(22px) saturate(115%); transition: background .2s ease, border-color .2s ease, transform .2s ease, box-shadow .2s ease; }
                button:hover, .developer-links a:hover { background: rgba(190, 198, 207, .2) !important; border-color: rgba(255,255,255,.3) !important; box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 10px 28px rgba(0,0,0,.24); transform: translateY(-1px); }
                button:active, .developer-links a:active { transform: translateY(0); background: rgba(220,225,231,.28) !important; }
                .flex { gap: 8px; } .flex > button { flex-shrink: 0; } .grid { gap: 12px; }
                .panel { border-radius: var(--radius-panel); overflow: hidden; background: var(--panel); border: 1px solid var(--line); box-shadow: inset 0 1px 0 rgba(255,255,255,.035), 0 18px 50px rgba(0,0,0,.12); backdrop-filter: blur(24px) saturate(125%); -webkit-backdrop-filter: blur(24px) saturate(125%); } .panel-header { border-bottom: 1px solid var(--line); }
                .scrollbar::-webkit-scrollbar { width: 5px; height: 5px; } .scrollbar::-webkit-scrollbar-thumb { background: #263344; border-radius: 6px; }
                .blink-up { animation: up .65s ease; } .blink-down { animation: down .65s ease; } @keyframes up { 0%,100% { background: transparent } 35% { background: rgba(53,211,154,.18) } } @keyframes down { 0%,100% { background: transparent } 35% { background: rgba(240,109,122,.18) } }
                .glow { box-shadow: 0 0 30px rgba(85,214,194,.07); } .tiny-grid { background-image: linear-gradient(rgba(255,255,255,.018) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.018) 1px, transparent 1px); background-size: 32px 32px; }
                .input { width: 100%; background: rgba(7, 12, 19, .38); border: 1px solid rgba(205,230,247,.16); color: var(--text); border-radius: var(--radius-control); padding: 9px 10px; outline: none; backdrop-filter: blur(16px); -webkit-backdrop-filter: blur(16px); } .input:focus { border-color: rgba(85,214,194,.7); box-shadow: 0 0 0 3px rgba(85,214,194,.08); }
                .tab { border-radius: 18px; color: var(--muted); border-bottom: 2px solid transparent; padding: 11px 13px; } .tab.active { color: var(--text); border-color: rgba(85,214,194,.7); box-shadow: inset 0 0 0 1px rgba(85,214,194,.3), 0 0 16px rgba(85,214,194,.12); }
                .num { font-variant-numeric: tabular-nums; } .fade { animation: fade .4s ease both; } @keyframes fade { from { opacity: 0; transform: translateY(4px) } to { opacity: 1; transform: none } }
                .developer-links { position: fixed; right: 16px; bottom: 16px; z-index: 20; display: flex; align-items: center; gap: 6px; padding: 6px; border: 1px solid rgba(255,255,255,.13); border-radius: 24px; background: rgba(63, 69, 77, .48); box-shadow: 0 14px 36px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.12); backdrop-filter: blur(28px) saturate(120%); -webkit-backdrop-filter: blur(28px) saturate(120%); }
                .developer-label { padding: 0 6px; color: var(--muted); font-size: 9px; letter-spacing: .13em; }
                .developer-links a { display: inline-flex; align-items: center; gap: 6px; padding: 7px 9px; color: var(--text); text-decoration: none; font-size: 10px; }
                .brand-logo { width: 14px; height: 14px; fill: currentColor; stroke: currentColor; stroke-width: 1.8; }
                .instagram-logo { fill: none; } .instagram-logo .instagram-dot { fill: currentColor; stroke: none; }
                .developer-links a:first-of-type { color: #7dd8ff; } .developer-links a:last-of-type { color: #ff9dcc; }
                .settings-backdrop { position: fixed; inset: 0; z-index: 50; display: grid; place-items: center; padding: 20px; background: rgba(0,0,0,.35); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); }
                .settings-modal { width: min(100%, 360px); padding: 22px; border: 1px solid rgba(205,230,247,.2); border-radius: 22px; background: rgba(22,31,43,.78); box-shadow: 0 24px 80px rgba(0,0,0,.4), inset 0 1px 0 rgba(255,255,255,.1); backdrop-filter: blur(30px) saturate(150%); -webkit-backdrop-filter: blur(30px) saturate(150%); }
                .icon-button { width: 36px; height: 36px; display: grid; place-items: center; padding: 0; }
                .language-options { display: grid; gap: 8px; } .language-option { width: 100%; display: flex; justify-content: space-between; align-items: center; padding: 13px 14px; color: var(--text); text-align: left; }
                .language-option.selected { color: var(--cyan); border-color: rgba(85,214,194,.55) !important; background: rgba(85,214,194,.1) !important; }
                .currency-panel { margin-left: 12px; margin-right: 12px; } .currency-content { display: grid; grid-template-columns: minmax(120px, .7fr) minmax(190px, 1fr) 42px minmax(190px, 1fr) minmax(190px, 1.15fr); align-items: end; gap: 12px; padding: 16px; }
                .currency-field { display: grid; gap: 6px; } .currency-field label { color: var(--muted); font-size: 10px; letter-spacing: .08em; }
                .currency-field select { appearance: none; } .swap-button { width: 42px; height: 42px; display: grid; place-items: center; padding: 0; border-radius: 50%; }
                .conversion-result { min-height: 42px; display: grid; gap: 2px; align-content: center; padding: 0 4px; } .conversion-result span, .conversion-result small { color: var(--muted); } .conversion-result b { color: var(--cyan); font: 700 18px 'Space Grotesk', sans-serif; }
                .conversion-result small { font-size: 10px; } .rate-status { border: 1px solid rgba(242,184,102,.35); border-radius: 999px; padding: 5px 9px; color: var(--amber); font-size: 9px; letter-spacing: .08em; } .rate-status.live { color: var(--green); border-color: rgba(53,211,154,.35); }
                @media (max-width: 520px) { .developer-links { right: 10px; bottom: 10px; } .developer-label, .developer-links a span { display: none; } .developer-links a { padding: 9px; } }
                @media (max-width: 760px) { .currency-content { grid-template-columns: 1fr 1fr; } .currency-field:first-child { grid-column: span 2; } .swap-button { grid-column: 1 / -1; justify-self: center; } .conversion-result { grid-column: span 2; padding-top: 8px; } }