:root{color:#f7f7ff;font-synthesis:none;text-rendering:optimizelegibility;background:#262b40;font-family:Arial,Helvetica,sans-serif}html{background:#262b40}body{background:#262b40;min-width:320px;min-height:100vh;margin:0;overflow-x:hidden}#root{width:100%;min-height:100vh;margin:0;padding:0}button,input,select{font:inherit}:root{--page:#262b40;--page-dark:#1c2033;--surface:#20263e;--surface-strong:#303957;--line:#505a83;--line-soft:#cbcfff2e;--text:#f7f7ff;--text-muted:#b9c0dd;--accent:#c9ccff;--accent-strong:#7f8ad0;--accent-glow:#9da4ff80;--ease-spring:cubic-bezier(.34, 1.56, .64, 1)}*{box-sizing:border-box}html{scroll-behavior:smooth}::-webkit-scrollbar{width:11px}::-webkit-scrollbar-track{background:var(--page-dark)}::-webkit-scrollbar-thumb{border:3px solid var(--page-dark);background:var(--surface-strong);border-radius:999px}::-webkit-scrollbar-thumb:hover{background:var(--accent-strong)}html{scrollbar-color:var(--surface-strong) var(--page-dark)}:focus-visible{outline:2px solid var(--accent);outline-offset:3px;border-radius:4px}.app{min-height:100vh;color:var(--text);background:radial-gradient(circle at 50% 4%, #9da4ff33, transparent 30%), radial-gradient(circle at 12% 72%, #533d9147, transparent 34%), linear-gradient(135deg, var(--page-dark), var(--page) 52%, #1d2136);overflow:hidden}.nav{border-bottom:1px solid var(--line-soft);justify-content:center;align-items:center;width:min(100% - 48px,1100px);height:76px;margin:0 auto;display:flex}.logo{color:var(--text);letter-spacing:-1.5px;font-size:24px;font-weight:800;text-decoration:none}.logo span{color:var(--accent)}.hero{text-align:center;width:min(100% - 48px,920px);margin:0 auto;padding:116px 0 70px}.eyebrow{color:var(--accent);letter-spacing:.18em;opacity:0;animation:hero-rise .7s var(--ease-spring) 50ms forwards;margin:0 0 18px;font-size:10px;font-weight:800}.hero h1{max-width:780px;color:var(--text);letter-spacing:-.075em;opacity:0;animation:hero-rise .8s var(--ease-spring) .15s forwards;margin:0 auto;font-size:clamp(52px,7vw,94px);font-weight:750;line-height:1.04}.hero h1 span{color:var(--accent);background:linear-gradient(100deg, var(--accent), #fff 45%, var(--accent));-webkit-text-fill-color:transparent;background-size:220%;-webkit-background-clip:text;background-clip:text;animation:5s ease-in-out 1.2s infinite shine-sweep}.heroText{max-width:480px;color:var(--text-muted);opacity:0;animation:hero-rise .8s var(--ease-spring) .28s forwards;margin:28px auto;font-size:16px;line-height:1.55}.heroButton{border:1px solid var(--accent);color:#252a43;background:var(--accent);opacity:0;min-width:220px;transition:transform .35s var(--ease-spring), background .2s ease, box-shadow .3s ease;animation:hero-rise .8s var(--ease-spring) .4s forwards;border-radius:10px;justify-content:space-between;align-items:center;padding:15px 18px;font-size:13px;font-weight:800;text-decoration:none;display:inline-flex}.heroButton span{transition:transform .3s var(--ease-spring);margin-left:10px;display:inline-block}.heroButton:hover{box-shadow:0 14px 32px var(--accent-glow);background:#fff;transform:translateY(-3px)}.heroButton:hover span{transform:translate(4px)}.heroButton:active{transform:translateY(-1px)scale(.98)}@keyframes hero-rise{0%{opacity:0;transform:translateY(16px)}to{opacity:1;transform:translateY(0)}}@keyframes shine-sweep{0%,20%{background-position:200%}60%,to{background-position:-20%}}.stats{border-top:1px solid var(--line-soft);border-bottom:1px solid var(--line-soft);grid-template-columns:repeat(3,1fr);width:min(100% - 48px,960px);margin:0 auto 68px;display:grid}.stats div{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:8px;min-height:128px;display:flex}.stats div+div{border-left:1px solid var(--line-soft)}.stats strong{color:var(--text);letter-spacing:-.06em;font-size:28px}.stats span{color:var(--text-muted);font-size:12px}.workspace{width:min(100% - 48px,1100px);margin:0 auto;padding:0 0 76px}.converter-panel{border:1px solid var(--line-soft);-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:linear-gradient(135deg,#646ea538,#0000 48%),#181d35b8;border-radius:28px;max-width:1000px;margin:0 auto;padding:32px;transition:box-shadow .4s;position:relative;overflow:hidden;box-shadow:0 30px 80px #070a1961,inset 0 1px #ffffff12}.converter-panel:before{content:"";z-index:0;opacity:0;background:radial-gradient(380px circle at var(--mx,50%) var(--my,0%), var(--accent-glow), transparent 70%);pointer-events:none;transition:opacity .4s;position:absolute;inset:0}.converter-panel:hover:before{opacity:.16}.converter-panel>*{z-index:1;position:relative}.converter-header{justify-content:space-between;align-items:center;gap:22px;margin-bottom:28px;display:flex}.converter-kicker{color:var(--accent);letter-spacing:.17em;margin:0 0 7px;font-size:10px;font-weight:800}.converter-header h2{color:var(--text);letter-spacing:-.04em;margin:0;font-size:26px}.markets-badge{border:1px solid var(--line);color:#dfe1ff;white-space:nowrap;background:#343d60;border-radius:999px;padding:8px 12px;font-size:11px;font-weight:750}.exchange-stage{grid-template-columns:1fr 58px 1fr;align-items:center;display:grid}.currency-side{border:1px solid var(--line-soft);min-height:260px;transition:transform .3s var(--ease-spring), border-color .22s ease, box-shadow .3s ease;background:#0c10237a;border-radius:20px;padding:22px}.currency-side:hover{z-index:1;border-color:#8994cf;transform:translateY(-4px);box-shadow:0 18px 40px #06091659}.currency-side-top{color:var(--text-muted);justify-content:space-between;align-items:center;margin-bottom:20px;font-size:13px;display:flex}.currency-side-top strong{color:#e7e8ff;letter-spacing:.09em;font-size:12px}.select-wrap{border:1px solid var(--line-soft);cursor:pointer;background:#2c3452;border-radius:12px;align-items:center;gap:10px;height:52px;padding:0 14px;transition:border-color .2s,background .2s;display:flex;position:relative}.select-wrap:hover,.select-wrap:focus-within{background:#343e61;border-color:#aab2ed}.select-wrap:after{content:"⌄";color:var(--accent);transition:transform .25s var(--ease-spring);pointer-events:none;margin-left:auto}.select-wrap:focus-within:after{transform:rotate(180deg)}.select-wrap img{object-fit:contain;width:29px;height:20px;transition:transform .3s var(--ease-spring);border-radius:2px;flex:0 0 29px}.select-wrap:hover img{transform:scale(1.12)}.select-wrap select{appearance:none;width:100%;color:var(--text);cursor:pointer;background:0 0;border:0;outline:0;font-size:13px;font-weight:700}.select-wrap option{color:var(--text);background:var(--page)}.currency-value{align-items:center;gap:10px;margin-top:18px;display:flex}.currency-value input{width:100%;min-width:0;color:var(--text);letter-spacing:-.07em;background:0 0;border:0;outline:0;padding:0;font-size:clamp(38px,5vw,56px);font-weight:800;transition:color .2s}.currency-value input:focus{color:#fff}.currency-value span{color:var(--accent);font-size:18px;font-weight:800}.currency-side p{color:var(--text-muted);margin:10px 0 0;font-size:12px}.rate-chart{border-top:1px solid var(--line-soft);margin-top:28px;padding-top:28px}.rate-chart-header{justify-content:space-between;align-items:flex-start;gap:20px;margin-bottom:18px;display:flex}.rate-chart-header p{color:var(--text-muted);letter-spacing:.08em;text-transform:uppercase;margin:0 0 6px;font-size:11px;font-weight:700}.rate-chart-header h3{color:var(--text);letter-spacing:-.02em;margin:0;font-size:18px;font-weight:750}.chart-tabs{border:1px solid var(--line-soft);background:#0c102366;border-radius:999px;flex:none;gap:4px;padding:4px;display:flex}.chart-tabs button{color:var(--text-muted);cursor:pointer;transition:color .2s ease, background .25s var(--ease-spring), transform .2s ease;background:0 0;border:0;border-radius:999px;padding:6px 13px;font-size:12px;font-weight:700}.chart-tabs button:hover{color:var(--text)}.chart-tabs button.active{color:#252a43;background:var(--accent);transform:scale(1.04)}.chart-canvas{background:#0c102359;border-radius:16px;justify-content:center;align-items:center;height:220px;display:flex;position:relative}.chart-canvas svg{cursor:crosshair;width:100%;height:100%}.chart-canvas path[stroke]{stroke-dasharray:1400;stroke-dashoffset:1400px;animation:chart-draw 1.1s var(--ease-spring) forwards}.chart-canvas path[fill^=url]{opacity:0;animation:.8s .5s forwards chart-fade-in}.chart-gridline{stroke:var(--line-soft);stroke-width:1px;stroke-dasharray:3 4}.chart-axis-label{fill:var(--text-muted);font-size:11px;font-weight:600}.chart-hover-line{stroke:var(--line);stroke-width:1px;stroke-dasharray:3 4}.chart-tooltip{z-index:2;border:1px solid var(--line-soft);white-space:nowrap;pointer-events:none;background:#14182cf0;border-radius:10px;gap:2px;padding:8px 11px;display:grid;position:absolute;transform:translate(-50%,calc(-100% - 14px));box-shadow:0 10px 24px #05081466}.chart-tooltip strong{color:var(--text);font-size:11px;font-weight:700}.chart-tooltip span{color:var(--text-muted);font-size:11px}.chart-message{color:var(--text-muted);margin:0;font-size:13px}@keyframes chart-draw{to{stroke-dashoffset:0}}@keyframes chart-fade-in{to{opacity:1}}.received-value{color:#e4e6ff;letter-spacing:-.05em;align-items:center;min-height:67px;margin-top:18px;font-size:clamp(27px,3.2vw,40px);font-weight:800;display:flex}.received-value span{animation:value-pop .35s var(--ease-spring);display:inline-block}@keyframes value-pop{0%{opacity:0;transform:translateY(6px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}.swap-button{z-index:2;border:1px solid var(--accent);color:#282d49;background:var(--accent);cursor:pointer;border-radius:50%;width:58px;height:58px;margin:0 -1px;font-size:20px;transition:transform .25s,color .2s,background .2s;box-shadow:0 12px 30px #0508186b}.swap-button:hover{color:#fff;background:var(--accent-strong);transform:rotate(180deg)scale(1.07)}.quote-footer{border-top:1px solid var(--line-soft);justify-content:space-between;align-items:center;gap:20px;margin-top:24px;padding-top:23px;display:flex}.quote-footer div{gap:5px;display:grid}.quote-footer span{color:var(--text-muted);font-size:11px}.quote-footer strong{color:var(--text);font-size:13px}.continue-button{border:1px solid var(--accent);color:#252a43;background:var(--accent);cursor:pointer;border-radius:10px;min-width:175px;padding:14px 16px;font-size:13px;font-weight:800;transition:transform .2s,background .2s}.continue-button:hover{background:#fff;transform:translateY(-2px)}.flagsSection{border-top:1px solid var(--line-soft);text-align:center;flex-direction:column;align-items:center;gap:38px;width:min(100% - 48px,1100px);margin:0 auto;padding:72px 0;display:flex}.flagsAnimationSingle{width:100%;max-width:1080px}.marquee{width:100%;padding:8px 0;overflow:hidden;-webkit-mask-image:linear-gradient(90deg,#0000,#000 7% 93%,#0000);mask-image:linear-gradient(90deg,#0000,#000 7% 93%,#0000)}.marqueeTrack{width:max-content;animation:58s linear infinite slide-left;display:flex}.marquee:hover .marqueeTrack{animation-play-state:paused}.flagCard{transition:transform .25s}.flagCard:hover{z-index:1;transform:scale(1.15)}.marqueeGroup{gap:13px;padding-right:13px;display:flex}.flagCard{background:0 0;flex:0 0 52px;width:52px;height:30px;overflow:hidden}.flagCard img{object-fit:cover;border-radius:0;width:100%;height:100%;display:block}.flagsHeading{max-width:590px}.flagsHeading p{color:var(--accent);letter-spacing:.16em;margin:0 0 12px;font-size:10px;font-weight:800}.flagsHeading h2{color:var(--text);letter-spacing:-.055em;margin:0;font-size:clamp(27px,3.2vw,40px);line-height:1.03}@keyframes slide-left{0%{transform:translate(0)}to{transform:translate(-50%)}}@media (prefers-reduced-motion:reduce){.marqueeTrack{animation:none}*,:before,:after{scroll-behavior:auto;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.eyebrow,.hero h1,.heroText,.heroButton{opacity:1;animation:none}.converter-panel:before{display:none}.chart-canvas path[stroke],.chart-canvas path[fill^=url]{stroke-dashoffset:0;opacity:1;animation:none}}@media (width<=680px){.nav,.hero,.stats,.workspace,.flagsSection{width:min(100% - 32px,560px)}.hero{padding:86px 0 54px}.stats{margin-bottom:46px}.converter-panel{border-radius:20px;padding:20px 14px}.converter-header{flex-direction:column;align-items:flex-start;margin-bottom:20px}.exchange-stage{grid-template-columns:1fr;gap:12px}.rate-chart-header{flex-direction:column}.chart-tabs{justify-content:space-between;width:100%}.chart-tabs button{flex:1}.currency-side{min-height:auto;padding:18px}.swap-button{justify-self:center;width:48px;height:48px;margin:-5px 0;transform:rotate(90deg)}.swap-button:hover{transform:rotate(270deg)scale(1.06)}.quote-footer{flex-direction:column;align-items:stretch}.continue-button{width:100%}.flagsSection{gap:28px;padding:54px 0}.marqueeTrack{animation-duration:42s}.flagCard{flex-basis:44px;width:44px;height:26px}}@media (width<=460px){.hero h1{font-size:52px}.stats{grid-template-columns:1fr}.stats div{min-height:100px}.stats div+div{border-top:1px solid var(--line-soft);border-left:0}.currency-value input{font-size:42px}}.rate-chart svg{touch-action:pan-y}.exchange-stage,.currency-side{overflow:visible}.currency-dropdown{z-index:4;width:100%;position:relative}.currency-dropdown-trigger{color:#f7f6ff;-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);cursor:pointer;text-align:left;background:linear-gradient(135deg,#ffffff12,#ffffff04),#0f14288c;border:1px solid #c9ccff33;border-radius:16px;align-items:center;gap:12px;width:100%;min-height:58px;padding:10px 15px;transition:border-color .18s,background .18s,box-shadow .18s,transform .18s;display:flex;box-shadow:inset 0 1px #ffffff12,0 10px 30px #07091629}.currency-dropdown-trigger:hover{background:#293152b8;border-color:#c9ccff75;transform:translateY(-1px)}.currency-dropdown-trigger:active{transform:translateY(0)scale(.99)}.currency-dropdown.is-open .currency-dropdown-trigger{border-color:#c9ccff;box-shadow:0 0 0 4px #c9ccff1f,0 16px 35px #07091640}.currency-dropdown-trigger>img{object-fit:cover;border-radius:4px;flex:none;width:32px;height:22px;box-shadow:0 3px 9px #00000038}.currency-dropdown-value{gap:2px;min-width:0;display:grid}.currency-dropdown-value strong{color:#f7f6ff;font-size:.9rem;line-height:1}.currency-dropdown-value small{color:#bfc4e4;text-overflow:ellipsis;white-space:nowrap;font-size:.76rem;line-height:1.2;overflow:hidden}.currency-dropdown-arrow{color:#c9ccff;margin-left:auto;font-size:1.25rem;line-height:1;transition:transform .18s}.currency-dropdown.is-open .currency-dropdown-arrow{transform:rotate(180deg)}.currency-dropdown-menu{-webkit-backdrop-filter:blur(22px);backdrop-filter:blur(22px);background:linear-gradient(150deg,#38416ae0,#151b34eb);border:1px solid #c9ccff42;border-radius:18px;animation:.18s both dropdown-enter;position:absolute;top:calc(100% + 10px);left:0;right:0;overflow:hidden;box-shadow:0 24px 60px #0407126b,inset 0 1px #ffffff17}.currency-dropdown-search{border-bottom:1px solid #c9ccff21;padding:12px}.currency-dropdown-search input{color:#f7f6ff;width:100%;font:inherit;background:#080c1d73;border:1px solid #c9ccff2e;border-radius:11px;outline:none;padding:12px 14px;font-size:.84rem}.currency-dropdown-search input::placeholder{color:#a3a9cc}.currency-dropdown-search input:focus{border-color:#c9ccff;box-shadow:0 0 0 3px #c9ccff1a}.currency-dropdown-list{max-height:270px;padding:7px;overflow-y:auto}.currency-dropdown-option{color:#f7f6ff;cursor:pointer;text-align:left;background:0 0;border:0;border-radius:11px;align-items:center;gap:11px;width:100%;padding:10px;transition:background .15s,transform .15s;display:flex}.currency-dropdown-option:hover,.currency-dropdown-option:focus-visible{background:#c9ccff21;outline:none}.currency-dropdown-option:active{transform:scale(.985)}.currency-dropdown-option.is-selected{background:#bec2ff30}.currency-dropdown-option img{object-fit:cover;border-radius:3px;flex:none;width:29px;height:20px}.currency-dropdown-option span{gap:2px;display:grid}.currency-dropdown-option strong{font-size:.82rem}.currency-dropdown-option small{color:#bfc4e4;font-size:.74rem}.currency-dropdown-option b{color:#c9ccff;margin-left:auto;font-size:.95rem}.currency-dropdown-empty{color:#bfc4e4;text-align:center;margin:0;padding:22px 12px;font-size:.84rem}@keyframes dropdown-enter{0%{opacity:0;transform:translateY(-7px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@media (width<=680px){.currency-dropdown-menu{max-height:min(520px,72dvh);position:fixed;top:50%;left:16px;right:16px;transform:translateY(-50%)}.currency-dropdown-list{max-height:min(380px,52dvh)}}@media (prefers-reduced-motion:reduce){.currency-dropdown-menu,.currency-dropdown-trigger,.currency-dropdown-arrow,.currency-dropdown-option{transition:none;animation:none}}.currency-dropdown-menu{-webkit-backdrop-filter:none;backdrop-filter:none;background:#20263e;box-shadow:0 24px 60px #04071280,inset 0 1px #ffffff14}.exchange-stage{z-index:20;position:relative}.rate-chart,.quote-footer{z-index:1;position:relative}.currency-dropdown.is-open{z-index:100}.currency-dropdown-menu{z-index:101;margin-top:0;position:absolute;top:calc(100% + 10px);left:0;right:0}@media (width<=680px){.currency-dropdown-menu{max-height:none;margin-top:10px;position:relative;top:auto;left:auto;right:auto;transform:none}.currency-dropdown-list{max-height:270px}}
