@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&family=Space+Grotesk:wght@500;600;700&display=swap');

:root { --primary:#6366f1; --ink:#071827; --ink-2:#0e2637; --paper:#f4f8f7; --white:#fff; --muted:#70808b; --line:#dce7e4; --mint:#b9f2db; --mint-strong:#3fd69d; --orange:#ff946c; --danger:#e36c7d; --shadow:0 18px 50px rgba(7,24,39,.08); }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:'Inter', sans-serif; font-size:15px; line-height:1.8; }
body:before { content:''; position:fixed; inset:0; pointer-events:none; opacity:.35; background-image:linear-gradient(rgba(20,88,78,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(20,88,78,.035) 1px,transparent 1px); background-size:42px 42px; mask-image:linear-gradient(to bottom,black,transparent 78%); }
button,a { font:inherit; }
a { color:inherit; text-decoration:none; }
.hidden { display:none!important; }
.noise { position:fixed; pointer-events:none; z-index:5; inset:0; opacity:.018; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.7' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.5'/%3E%3C/svg%3E"); }
.site-header { height:82px; padding:0 6vw; display:flex; align-items:center; justify-content:space-between; border-bottom:1px solid rgba(220,231,228,.75); position:relative; z-index:10; background:rgba(244,248,247,.82); backdrop-filter:blur(16px); }
.brand { display:flex; gap:10px; align-items:center; font-weight:800; font-size:20px; letter-spacing:-.5px; }.brand>span:last-child>span { color:#38bf8e; }.brand-mark { width:34px; height:34px; display:grid; place-items:center; color:var(--ink); background:var(--mint); border-radius:10px; }.brand-mark svg { width:19px; stroke-width:2.5; }
.main-nav { display:flex; gap:34px; margin-right:70px; }.main-nav a { color:#61727b; font-size:14px; transition:.2s; }.main-nav a:hover,.main-nav a.active { color:var(--ink); font-weight:700; }.main-nav a.active:after { content:''; display:block; margin:5px auto 0; width:5px; height:5px; background:var(--mint-strong); border-radius:50%; }
.header-actions { display:flex; align-items:center; gap:18px; }.text-link { color:#60717a; font-weight:600; }.button { display:inline-flex; align-items:center; justify-content:center; gap:9px; background:var(--ink); color:white; border:0; border-radius:10px; min-height:50px; padding:0 23px; font-weight:700; cursor:pointer; transition:transform .2s,background .2s,box-shadow .2s; }.button:hover { transform:translateY(-2px); background:#15354a; box-shadow:0 10px 24px rgba(7,24,39,.18); }.button svg { width:17px; }.button-small { min-height:42px; padding:0 17px; font-size:13px; }.button-mint { color:var(--ink); background:var(--mint); }.button-mint:hover { background:#9ceac9; }.button-outline { background:transparent; color:var(--ink); border:1px solid var(--line); }.button-outline:hover { background:white; }.icon-button,.menu-toggle { background:transparent; border:0; cursor:pointer; color:var(--ink); display:grid; place-items:center; }.icon-button svg { width:18px; }.profile-chip { display:flex; align-items:center; gap:9px; font-size:13px; font-weight:700; }.avatar { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:var(--orange); color:white; }.menu-toggle { display:none; }.site-footer { max-width:1200px; margin:80px auto 0; padding:25px 0; border-top:1px solid var(--line); color:#809099; font-size:12px; display:block; }.footer-brand { display:flex; align-items:center; gap:9px; color:var(--ink); }.footer-brand .brand-mark { width:27px;height:27px;border-radius:8px; }.footer-brand .brand-mark svg { width:15px; }.footer-copy { margin-right:auto; }
.footer-main { max-width:1200px; margin:0 auto; padding:70px 5vw 30px; display:grid; grid-template-columns:2fr 1fr 1fr 1fr 1fr; gap:40px; }
.footer-col h4 { margin:0 0 16px; font-size:13px; font-weight:700; text-transform:uppercase; letter-spacing:.3px; }
.footer-col a { display:block; color:var(--muted); font-size:13px; margin-bottom:10px; transition:color .2s; }
.footer-col a:hover { color:var(--ink); }
.footer-brand-col p { color:var(--muted); font-size:13px; margin:16px 0 0; line-height:1.7; max-width:280px; }
.footer-social { display:flex; gap:12px; margin-top:20px; }
.footer-social a { display:grid; place-items:center; width:36px; height:36px; border-radius:8px; border:1px solid var(--line); color:var(--muted); transition:all .2s; }
.footer-social a:hover { color:var(--ink); border-color:var(--ink); background:white; }
.footer-bottom { max-width:1200px; margin:0 auto; padding:20px 5vw; border-top:1px solid var(--line); display:flex; justify-content:space-between; align-items:center; color:var(--muted); font-size:12px; }
@media(max-width:900px){.footer-main{grid-template-columns:1fr 1fr}.footer-brand-col{grid-column:span 2}}
@media(max-width:650px){.footer-main{grid-template-columns:1fr}.footer-brand-col{grid-column:span 1}.footer-bottom{flex-direction:column;gap:8px;text-align:center}}
.section { max-width:1200px; margin:auto; padding:92px 0; }.hero { display:grid; grid-template-columns:1fr .86fr; gap:80px; align-items:center; min-height:calc(100vh - 82px); padding-top:50px; }.eyebrow { display:inline-flex; align-items:center; gap:8px; color:#4ea27f; font-weight:700; font-size:12px; letter-spacing:.2px; }.eyebrow:before { content:''; width:23px;height:2px;background:var(--mint-strong); }.hero h1 { font-size:clamp(42px,5vw,74px); line-height:1.2; letter-spacing:-2.7px; max-width:640px; margin:17px 0 24px; }.hero h1 em { color:#43bf91; font-style:normal; }.hero p { color:#73828a; max-width:490px; font-size:16px; margin:0 0 34px; }.hero-actions { display:flex; gap:12px; align-items:center; }.proof { display:flex; align-items:center; gap:16px; margin-top:36px; color:#8b999e; font-size:12px; }.proof-avatars { display:flex; direction:ltr; }.proof-avatars span { display:grid; place-items:center; width:28px;height:28px;margin-left:-7px;border:2px solid var(--paper);border-radius:50%;background:#75968b;color:white;font-size:10px; }.proof-avatars span:nth-child(2){background:#df967c}.proof-avatars span:nth-child(3){background:#52768a}.proof strong { color:var(--ink); font-size:14px; display:block; }.hero-visual { position:relative; min-height:480px; }.orb { position:absolute; width:350px; height:350px; border-radius:50%; background:var(--mint); opacity:.72; top:58px; right:60px; }.chart-card { position:absolute; top:0; right:0; width:min(100%,390px); padding:25px; border:1px solid rgba(255,255,255,.7); border-radius:18px; background:rgba(255,255,255,.8); box-shadow:var(--shadow); backdrop-filter:blur(12px); transform:rotate(2deg); }.chart-card:after { content:''; position:absolute; left:-28px; bottom:25px; width:95px;height:95px;background:var(--orange);border-radius:22px; opacity:.9; z-index:-1; }.chart-head { display:flex;justify-content:space-between;align-items:start; }.chart-head small,.metric small { color:#839198;font-size:11px; }.chart-head strong { display:block;font-size:27px; font-family:'Space Grotesk'; direction:ltr; text-align:right; }.positive { color:#3bad83; font-size:12px; font-weight:700; }.chart { height:170px; margin:18px 0 8px; position:relative; overflow:hidden; border-bottom:1px solid #e6eeec; }.chart svg { width:100%; height:100%; overflow:visible; }.chart-grid { stroke:#e6eeec; stroke-dasharray:3 5; }.chart-line { fill:none;stroke:#38bd8d;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:0;stroke-dashoffset:0;transition:stroke-dashoffset 1.2s ease-out,stroke-dasharray .1s; }.chart-fill { fill:url(#fill); }.chart-labels { display:flex;justify-content:space-between;color:#a0adb0;font:10px 'Space Grotesk';direction:ltr; }.floating-stat { position:absolute; left:0; bottom:40px; padding:15px 19px; border-radius:13px; color:white; background:var(--ink); box-shadow:var(--shadow); }.floating-stat small{color:#90a6ac;display:block;font-size:10px}.floating-stat strong{font:600 20px 'Space Grotesk';direction:ltr;display:block;margin-top:2px}.ticker { max-width:1200px; margin:auto; padding:14px 18px; background:var(--ink); color:#a6b9bb; border-radius:14px; overflow:hidden; font-size:11px; direction:ltr; position:relative; }.ticker::before { content:''; position:absolute; left:0; top:0; bottom:0; width:32px; background:linear-gradient(90,rgba(7,24,39,.95),transparent); pointer-events:none; z-index:2; }.ticker::after { content:''; position:absolute; right:0; top:0; bottom:0; width:32px; background:linear-gradient(90,transparent,rgba(7,24,39,.95)); pointer-events:none; z-index:2; }.ticker-loop { display:flex; gap:26px; align-items:center; animation:tickerScroll 35s linear infinite; }.ticker-loop:hover { animation-play-state:paused; }.ticker-item { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; transition:color .3s; font-family:'Space Grotesk'; }.ticker-item strong { color:white; font-family:'Space Grotesk'; font-weight:700; }.ticker-item .ticker-change { font-family:'Space Grotesk'; font-weight:600; }.ticker-item.up .ticker-change { color:var(--mint-strong); }.ticker-item.down .ticker-change { color:var(--danger); }@keyframes tickerScroll { 0% { transform:translateX(0); } 100% { transform:translateX(-50%); } }
.center-heading { text-align:center; max-width:620px; margin:0 auto 46px; }.center-heading h2,.page-heading h1 { font-size:40px;line-height:1.3;letter-spacing:-1px;margin:14px 0; }.center-heading p,.page-heading p { color:var(--muted); margin:0; }.features { display:grid; grid-template-columns:repeat(3,1fr); gap:18px; }.feature { padding:30px; border:1px solid var(--line); background:rgba(255,255,255,.62); border-radius:14px; }.feature-icon { width:45px;height:45px; display:grid;place-items:center;background:var(--mint);border-radius:12px;margin-bottom:25px; }.feature-icon svg { width:20px; }.feature h3 { font-size:17px;margin:0 0 10px; }.feature p { color:var(--muted); font-size:13px;margin:0; }
.page-heading { padding:68px 0 34px; }.page-heading h1 { max-width:650px; font-size:52px; }.about-grid { display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:stretch; }.about-panel { background:var(--ink);color:white;border-radius:16px;padding:38px;min-height:290px; }.about-panel p { color:#9db3b4; }.about-panel .number { color:var(--mint); font:700 64px 'Space Grotesk'; line-height:1; }.values { display:grid;grid-template-columns:1fr 1fr;gap:14px; }.value { background:white;border:1px solid var(--line);border-radius:13px;padding:24px; }.value h3{font-size:15px;margin:0 0 8px}.value p{color:var(--muted);font-size:12px;margin:0}
.auth-shell { min-height:calc(100vh - 82px); display:grid;place-items:center;padding:60px 20px; }.auth-card { width:min(100%,450px); background:white;border:1px solid var(--line);border-radius:18px;padding:38px;box-shadow:var(--shadow); }.auth-card h1{font-size:29px;margin:0 0 8px}.auth-card>p{color:var(--muted);font-size:13px;margin:0 0 27px}.auth-card .auth-feedback{color:var(--danger);font-size:12px;margin:0 0 14px}.field{margin-bottom:17px}.field label{display:block;font-size:12px;font-weight:700;margin-bottom:7px}.field input,.field select{width:100%;height:48px;padding:0 14px;border:1px solid var(--line);border-radius:9px;background:#fbfdfc;color:var(--ink);font:inherit;outline:0}.field input:focus,.field select:focus{border-color:#75d6b2;box-shadow:0 0 0 3px rgba(63,214,157,.13)}.auth-card .button{width:100%;margin-top:7px}.auth-bottom{text-align:center;color:var(--muted);font-size:12px;margin:22px 0 0}.auth-bottom a{color:#26966d;font-weight:700}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.check-row{display:flex;justify-content:space-between;align-items:center;font-size:11px;color:var(--muted);margin:3px 0 14px}.check-row label{display:flex;gap:7px;align-items:center}.check-row input{accent-color:#38bd8d}.check-row a{color:#26966d}
.phone-input{display:flex;gap:10px}.phone-input .country-code{width:95px;min-width:85px;font-size:13px;background:#fbfdfc;border:1px solid var(--line);border-radius:9px;height:48px;padding:0 10px;color:var(--ink);outline:0}.phone-input .country-code:focus{border-color:#75d6b2;box-shadow:0 0 0 3px rgba(63,214,157,.13)}.phone-input input{flex:1}
@media(max-width:420px){.phone-input{flex-direction:column;gap:0}.phone-input .country-code{width:100%}}
.dashboard-layout { max-width:1320px; margin:auto; padding:34px 5vw 90px;display:grid;grid-template-columns:225px 1fr;gap:35px;direction:ltr; }.dashboard-main,.dashboard-sidebar{direction:ltr}.dashboard-sidebar{background:var(--ink);color:white;border-radius:16px;padding:23px 14px;height:max-content;position:sticky;top:105px}.side-brand{display:flex;align-items:center;gap:9px;padding:4px 11px 24px;border-bottom:1px solid rgba(255,255,255,.1);font-weight:700}.side-brand .brand-mark{width:29px;height:29px}.side-nav{padding-top:20px;display:grid;gap:5px}.side-nav a{padding:11px 13px;color:#849b9e;display:flex;align-items:center;gap:10px;border-radius:9px;font-size:12px}.side-nav a:hover,.side-nav a.active{background:#183849;color:white}.side-nav svg{width:17px}.side-separator{height:1px;background:rgba(255,255,255,.1);margin:14px 0}.dashboard-top{display:flex;justify-content:space-between;align-items:start;margin-bottom:28px}.dashboard-top h1{font-size:27px;margin:0 0 4px}.dashboard-top p{font-size:12px;color:var(--muted);margin:0}.date-chip{border:1px solid var(--line);background:white;border-radius:8px;padding:8px 13px;font-size:11px;color:var(--muted);display:flex;gap:7px;align-items:center}.date-chip svg{width:15px}.balance-grid{display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:13px}.balance-card{background:white;border:1px solid var(--line);border-radius:13px;padding:21px}.balance-card.primary{background:var(--ink);color:white;border-color:var(--ink)}.balance-card small{color:#88969b;font-size:11px}.balance-card.primary small{color:#8fa7a8}.balance-card strong{display:block;font:600 26px 'Space Grotesk';direction:ltr;text-align:right;margin:9px 0}.balance-card .unit{font:11px 'Inter';color:#9baeb0}.balance-card.primary .unit{color:#94a9ab}.balance-change{color:#40c995;font-size:11px}.dashboard-content-grid{display:grid;grid-template-columns:1.35fr 1fr;gap:15px;margin-top:15px}.panel{background:white;border:1px solid var(--line);border-radius:13px;padding:22px}.panel + .panel{margin-top:20px}.panel-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.panel-head h2{font-size:15px;margin:0}.panel-head a{font-size:11px;color:#2ca57b}.dash-chart{height:230px;position:relative}.dash-chart svg{width:100%;height:100%}.mini-list{display:grid;gap:5px}.mini-item{display:flex;align-items:center;justify-content:space-between;padding:11px 0;border-bottom:1px solid #edf2f1;font-size:11px}.mini-item:last-child{border:0}.coin{display:flex;align-items:center;gap:9px}.coin-icon{width:29px;height:29px;border-radius:50%;background:#fff0dc;color:#cf8536;display:grid;place-items:center;font:700 13px 'Space Grotesk'}.coin-icon.eth{background:#e9e7ff;color:#7770cc}.coin-icon.usdt{background:#dcf6ed;color:#25a375}.mini-item strong{font:600 12px 'Space Grotesk';direction:ltr}.profile-layout{max-width:760px;margin:auto;padding:55px 20px 100px}.profile-card{background:white;border:1px solid var(--line);border-radius:15px;padding:28px}.profile-header{display:flex;align-items:center;gap:16px;padding-bottom:24px;border-bottom:1px solid var(--line);margin-bottom:25px}.profile-header .avatar{width:55px;height:55px;font-size:20px}.profile-header h2{margin:0;font-size:18px}.profile-header p{margin:2px 0 0;color:var(--muted);font-size:12px}.profile-tabs{display:flex;gap:23px;border-bottom:1px solid var(--line);margin-bottom:24px}.profile-tabs button{border:0;background:transparent;padding:0 0 12px;color:var(--muted);cursor:pointer;font-size:12px}.profile-tabs button.active{color:var(--ink);font-weight:700;border-bottom:2px solid var(--mint-strong)}.transaction-shell{max-width:760px;margin:auto;padding:0 20px 100px}.transaction-shell .page-heading{padding-top:0}.transaction-card{background:white;border:1px solid var(--line);border-radius:15px;padding:32px;display:grid;grid-template-columns:1fr 1fr;gap:34px}.transaction-info h1{font-size:27px;margin:0 0 8px}.transaction-info p{font-size:13px;color:var(--muted);margin:0 0 25px}.transaction-info .help{padding:15px;border-radius:10px;background:#f1faf6;font-size:11px;color:#508471}.transaction-form .button{width:100%}.amount-wrap{position:relative}.amount-wrap input{direction:ltr;text-align:right;padding-left:52px}.currency{position:absolute;left:15px;top:11px;color:#9ca9aa;font-size:12px}
.transaction-layout{padding-top:16px}
.chart-card-pulse { animation:floatPulse 4s ease-in-out infinite; }.chart-card-secondary { position:absolute; top:200px; right:0; width:min(100%,390px); padding:25px; border:1px solid rgba(255,255,255,.7); border-radius:18px; background:rgba(255,255,255,.85); box-shadow:var(--shadow); backdrop-filter:blur(12px); transform:rotate(0deg) !important; }.chart-card-secondary .chart { height:140px; }.chart-card:after { background:var(--mint-strong); }.floating-stat { position:absolute; left:0; bottom:40px; padding:15px 19px; border-radius:13px; color:white; background:var(--ink); box-shadow:var(--shadow); }.floating-stat small { color:#90a6ac; display:block; font-size:10px; }.floating-stat strong { font:600 20px 'Space Grotesk'; direction:ltr; display:block; margin-top:2px; }.positive svg { width:13px; height:13px; }@keyframes floatPulse { 0%,100% { transform:rotate(2deg) translateY(0); } 50% { transform:rotate(2.5deg) translateY(-4px); } }
.market-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin-top:60px; }
.market-card { background:white; border:1px solid var(--line); border-radius:14px; padding:22px; box-shadow:var(--shadow); }
.market-card-head { display:flex; justify-content:space-between; align-items:center; margin-bottom:16px; padding-bottom:12px; border-bottom:1px solid var(--line); }
.market-badge { padding:4px 12px; border-radius:20px; font-size:10px; font-weight:700; font-family:'Space Grotesk'; }
.market-badge.forex { background:rgba(63,214,157,.1); color:var(--mint-strong); }
.market-badge.crypto { background:rgba(99,102,241,.1); color:var(--primary); }
.market-badge.indices { background:rgba(255,148,108,.1); color:var(--orange); }
.market-count { font-size:10px; color:#a0adb0; }
.market-list { display:grid; gap:8px; }
.market-row { display:flex; justify-content:space-between; align-items:center; padding:8px 0; border-bottom:1px solid #f1f5f7; font-size:12px; }
.market-row:last-child { border:0; }
.market-row .market-pair { font-weight:600; direction:ltr; }
.market-row .market-price { font-family:'Space Grotesk'; direction:ltr; }
.market-row .market-change { font-family:'Space Grotesk'; font-weight:700; }
.market-row.up .market-change { color:var(--mint-strong); }
.market-row.down .market-change { color:var(--danger); }
.toast{position:fixed;left:25px;bottom:25px;background:var(--ink);color:white;display:flex;gap:9px;align-items:center;padding:13px 17px;border-radius:9px;font-size:12px;box-shadow:var(--shadow);transform:translateY(90px);opacity:0;transition:.3s;z-index:30}.toast.show{transform:translateY(0);opacity:1}.toast svg{width:17px;color:var(--mint-strong)}
@media(max-width:900px){.section{padding-left:5vw;padding-right:5vw}.site-footer{margin-left:5vw;margin-right:5vw}.main-nav{margin-right:0;gap:18px}.hero{gap:30px}.hero h1{font-size:48px}.balance-grid{grid-template-columns:1fr 1fr}.balance-card.primary{grid-column:span 2}.dashboard-layout{grid-template-columns:1fr}.dashboard-sidebar{position:static}.side-nav{display:flex;overflow:auto}.side-nav a{white-space:nowrap}.side-separator{display:none}.side-brand{display:none}.market-grid{grid-template-columns:repeat(2,1fr)}.chart-card-secondary{top:140px}}
@media(max-width:650px){.site-header{height:70px;padding:0 5vw}.main-nav,.header-actions{display:none}.menu-toggle{display:grid}.main-nav.mobile-open{display:flex;flex-direction:column;position:absolute;top:82px;left:0;right:0;background:var(--paper);padding:20px;border-bottom:1px solid var(--line);box-shadow:var(--shadow)}.hero{grid-template-columns:1fr;min-height:auto;padding-top:70px}.hero h1{font-size:43px;letter-spacing:-1.7px}.hero-visual{min-height:410px;margin-top:20px}.orb{right:50%;transform:translateX(50%);width:290px;height:290px}.chart-card{right:4%;width:92%}.floating-stat{left:2%;bottom:5px}.features,.about-grid,.values,.transaction-card,.dashboard-content-grid{grid-template-columns:1fr}.page-heading{padding-top:50px}.page-heading h1{font-size:39px}.about-panel{min-height:auto}.transaction-info{padding-bottom:0}.transaction-card{gap:18px;padding:23px}.form-row{grid-template-columns:1fr}.ticker-loop{gap:12px;font-size:10px}.market-grid{grid-template-columns:1fr}.chart-card-pulse{transform:rotate(0)!important;animation:none}.chart-card-secondary{position:relative;top:0;transform:rotate(0)!important;width:100%;margin-top:20px;padding:20px}.chart-card-secondary .chart{height:140px}.dashboard-layout{padding:24px 5vw 70px}.dashboard-top{align-items:flex-start}.date-chip{display:none}.balance-grid{grid-template-columns:1fr}.balance-card.primary{grid-column:auto}.site-footer{flex-wrap:wrap}.footer-copy{width:100%;margin:0}.auth-card{padding:26px 20px}}
/* Markets & Academy */
.markets-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin-top:40px}
.market-card-large{background:white;border:1px solid var(--line);border-radius:14px;padding:26px}
.market-card-header{display:flex;align-items:center;gap:14px;margin-bottom:14px}
.market-icon{font-size:1.8rem;width:48px;height:48px;display:grid;place-items:center;background:var(--paper);border-radius:12px}
.market-card-large h3{margin:0;font-size:17px}
.market-card-large p{color:var(--muted);font-size:13px;margin:10px 0 0}
.market-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:18px;padding-top:16px;border-top:1px solid var(--line)}
.market-stats strong{display:block;font-family:'Space Grotesk';font-size:1.15rem}
.market-stats span{font-size:11px;color:var(--muted);display:block;margin-top:2px}
.trading-sessions{margin-top:60px}
.trading-sessions h3{text-align:center;font-size:22px;margin-bottom:24px}
.sessions-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px}
.session-card{background:white;border:1px solid var(--line);border-radius:12px;padding:20px;text-align:center}
.session-card h4{margin:0 0 6px;font-size:15px}
.session-card p{color:var(--muted);font-size:12px;margin:0}
.academy-tabs{display:flex;gap:8px;justify-content:center;margin-bottom:30px;flex-wrap:wrap}
.tab-btn{padding:10px 22px;border:1px solid var(--line);background:white;border-radius:10px;font-weight:600;font-size:14px;cursor:pointer;transition:all .2s}
.tab-btn.active{background:var(--ink);color:white;border-color:var(--ink)}
.tab-btn:hover{border-color:var(--ink)}
.tab-panel{display:none}
.tab-panel.active{display:block}
.topic-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:18px}
.topic-card{background:white;border:1px solid var(--line);border-radius:14px;padding:24px}
.topic-icon{font-size:1.8rem;margin-bottom:12px}
.topic-card h4{margin:0 0 8px;font-size:15px}
.topic-card p{color:var(--muted);font-size:13px;margin:0;line-height:1.7}
.muted{color:var(--muted)!important}
/* Advanced Dashboard */
.dashboard-advanced-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px;margin-top:15px}
.dashboard-advanced-grid.row-chart{grid-template-columns:1.5fr 1fr}
.chart-panel{grid-column:span 1}
.tf-group{display:flex;gap:6px}
.tf-btn{padding:4px 12px;border:1px solid var(--line);background:white;border-radius:6px;font-size:11px;font-weight:600;cursor:pointer;transition:all .2s;color:var(--muted)}
.tf-btn.active{background:var(--ink);color:white;border-color:var(--ink)}
.tf-btn:hover{border-color:var(--ink)}
.chart-wrap{position:relative;height:260px;margin-top:12px}
.advanced-chart{width:100%;height:100%}
.advanced-chart .chart-grid{stroke:var(--line);stroke-width:1;stroke-dasharray:4 4}
.advanced-chart .candles line,.advanced-chart .candles rect{opacity:.85}
.chart-labels{display:flex;justify-content:space-between;margin-top:8px;font-size:11px;color:var(--muted)}
.order-book-panel{display:flex;flex-direction:column}
.ob-spread{margin-right:auto;margin-left:12px;font-size:11px;color:var(--muted);background:var(--paper);padding:3px 10px;border-radius:6px}
.ob-list{flex:1;display:flex;flex-direction:column;justify-content:space-between;margin-top:12px}
.ob-row{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:5px 0;font-size:12px;position:relative;z-index:1}
.ob-bar{position:absolute;top:0;bottom:0;right:0;z-index:0;opacity:.15;border-radius:2px}
.ob-bar.bid{background:var(--mint-strong)}
.ob-bar.ask{background:var(--danger)}
.ob-price{font-weight:600;font-family:'Space Grotesk';direction:ltr}
.ob-price.bid{color:var(--mint-strong)}
.ob-price.ask{color:var(--danger)}
.ob-size{color:var(--muted);direction:ltr}
.dash-table{width:100%;border-collapse:collapse;margin-top:12px;font-size:12px}
.dash-table th{text-align:left;color:var(--muted);font-weight:600;padding:8px 0;border-bottom:1px solid var(--line);font-size:11px;text-transform:uppercase;letter-spacing:.3px}
.dash-table td{padding:10px 0;border-bottom:1px solid #f1f5f7;direction:ltr}
.dash-table tr:last-child td{border-bottom:none}
.dash-table tr.up td{color:var(--mint-strong)}
.dash-table tr.down td{color:var(--danger)}
.badge{display:inline-block;padding:2px 10px;border-radius:6px;font-size:10px;font-weight:700;text-transform:uppercase}
.badge.buy{background:rgba(63,214,157,.1);color:var(--mint-strong)}
.badge.sell{background:rgba(227,108,125,.1);color:var(--danger)}
.pnl{font-weight:700;font-family:'Space Grotesk'}
.positions-panel{grid-column:span 1}
.trades-panel{grid-column:span 1}
.portfolio-panel{grid-column:span 1}
.performance-panel{grid-column:span 1}
.portfolio-donut{display:flex;align-items:center;gap:24px;margin-top:16px}
.donut{width:140px;height:140px;border-radius:50%;position:relative;flex-shrink:0}
.donut-hole{position:absolute;inset:28px;background:white;border-radius:50%;display:grid;place-items:center;text-align:center;flex-direction:column}
.donut-hole strong{font-family:'Space Grotesk';font-size:1.4rem;display:block}
.donut-hole span{font-size:10px;color:var(--muted)}
.portfolio-legend{display:grid;gap:8px;flex:1}
.legend-item{display:flex;align-items:center;gap:8px;font-size:12px}
.legend-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}
.legend-item b{margin-right:auto;font-family:'Space Grotesk'}
.perf-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
.perf-item{background:var(--paper);border-radius:10px;padding:14px;text-align:center}
.perf-item span{display:block;font-size:11px;color:var(--muted);margin-bottom:4px}
.perf-item strong{display:block;font-size:1.1rem;font-family:'Space Grotesk'}
.perf-item .positive{color:var(--mint-strong)}
.perf-item .negative{color:var(--danger)}
.balance-change.positive{color:var(--mint-strong)}
.balance-change.negative{color:var(--danger)}
/* Homepage extra sections */
.stats-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin-top:40px}
.stat-item{background:white;border:1px solid var(--line);border-radius:14px;padding:24px;text-align:center}
.stat-item strong{display:block;font-family:'Space Grotesk';font-size:1.6rem;margin-bottom:6px}
.stat-item span{color:var(--muted);font-size:12px}
.steps-section{margin-top:100px}
.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.step-card{background:white;border:1px solid var(--line);border-radius:14px;padding:28px;position:relative;overflow:hidden}
.step-num{position:absolute;top:16px;right:20px;font-family:'Space Grotesk';font-size:2.5rem;font-weight:700;color:var(--paper);line-height:1}
.step-card h3{margin:0 0 10px;font-size:16px}
.step-card p{color:var(--muted);font-size:13px;margin:0;line-height:1.7}
.testimonials-section{margin-top:100px}
.testimonials-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:20px;margin-top:40px}
.testimonial-card{background:white;border:1px solid var(--line);border-radius:14px;padding:26px}
.testimonial-card p{color:var(--ink);font-size:14px;line-height:1.8;margin:0 0 20px;font-style:italic}
.testimonial-author{display:flex;align-items:center;gap:10px}
.testimonial-author strong{display:block;font-size:13px}
.testimonial-author span{color:var(--muted);font-size:12px}
.testimonial-author .avatar{width:32px;height:32px;border-radius:50%;background:var(--ink);color:white;display:grid;place-items:center;font-size:12px;font-weight:700}
.cta-section{margin:100px 0 0;background:var(--ink);color:white;border-radius:20px;padding:70px 40px;text-align:center}
.cta-section h2{font-size:clamp(28px,4vw,48px);margin:0 0 16px;letter-spacing:-1px}
.cta-section p{color:#9db3b4;font-size:16px;margin:0 0 30px;max-width:500px;margin-left:auto;margin-right:auto}
.button-large{min-height:56px;padding:0 32px;font-size:16px;border-radius:12px}
@media(max-width:900px){.stats-bar{grid-template-columns:1fr 1fr}.steps-grid{grid-template-columns:1fr}.testimonials-grid{grid-template-columns:1fr 1fr}.cta-section{padding:50px 24px}}
@media(max-width:650px){.stats-bar{grid-template-columns:1fr}.testimonials-grid{grid-template-columns:1fr}}
/* Markets live terminal */
.market-ticker-bar{background:var(--ink);color:white;border-radius:12px;padding:14px 18px;margin-bottom:24px;display:flex;align-items:center;gap:18px;overflow:hidden}
.ticker-label{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:700;letter-spacing:.3px;color:var(--mint-strong);flex-shrink:0}
.pulse-dot{width:8px;height:8px;border-radius:50%;background:var(--mint-strong);animation:pulse 1.2s infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(1.3)}}
.ticker-scroll{display:flex;gap:24px;overflow:hidden;flex:1;mask-image:linear-gradient(to right,transparent,black 10%,black 90%,transparent)}
.ticker-item{display:flex;align-items:center;gap:10px;font-size:12px;flex-shrink:0}
.ticker-pair{color:#9db3b4;font-weight:600}
.ticker-price{font-family:'Space Grotesk';direction:ltr}
.ticker-change{font-family:'Space Grotesk';font-weight:700}
.ticker-change.up{color:var(--mint-strong)}
.ticker-change.down{color:var(--danger)}
.markets-grid.advanced{grid-template-columns:repeat(2,1fr)}
.terminal-card{background:#0a1117;border:1px solid rgba(255,255,255,.08);color:#e6edf3;box-shadow:none}
.terminal-card .market-card-header{border-bottom:1px solid rgba(255,255,255,.08)}
.terminal-card h3{color:#e6edf3}
.terminal-card .market-badge{background:rgba(63,214,157,.15);color:var(--mint-strong)}
.terminal-card .market-badge.crypto{background:rgba(99,102,241,.15);color:#818cf8}
.terminal-card .market-badge.indices{background:rgba(255,148,108,.15);color:var(--orange)}
.terminal-list{gap:0}
.terminal-list .market-row{padding:10px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:12px}
.terminal-list .market-row:last-child{border-bottom:none}
.terminal-list .market-pair{color:#e6edf3;font-weight:600}
.terminal-list .market-pair small{color:#6e7681;margin-left:8px;font-size:10px}
.terminal-list .market-price{color:#e6edf3;font-family:'Space Grotesk'}
.terminal-list .market-change{font-family:'Space Grotesk';font-weight:700}
.terminal-list .market-change.up{color:var(--mint-strong)}
.terminal-list .market-change.down{color:var(--danger)}
.market-row{transition:background .2s,transform .2s}
.market-row:hover{background:rgba(255,255,255,.04);transform:translateX(2px)}
.market-row .change-arrow{display:inline-block;transition:transform .2s}
.top-movers-section{margin-top:60px}
.top-movers-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:12px}
.flash-up{animation:flashGreen .6s ease-out}
.flash-down{animation:flashRed .6s ease-out}
@keyframes flashGreen{0%{background:rgba(63,214,157,.18)}100%{background:transparent}}
@keyframes flashRed{0%{background:rgba(227,108,125,.18)}100%{background:transparent}}
@media(max-width:900px){.markets-grid.advanced{grid-template-columns:1fr}.ticker-scroll{gap:16px}}
@media(max-width:650px){.market-ticker-bar{flex-direction:column;align-items:flex-start;gap:10px}.ticker-scroll{flex-wrap:wrap;width:100%}.top-movers-grid{grid-template-columns:1fr}}
/* Transaction forms (USDT TRC20 only) */
.amount-wrap{position:relative}
.amount-wrap .currency{position:absolute;right:12px;top:50%;transform:translateY(-50%);font-family:'Space Grotesk';font-weight:700;font-size:13px;color:var(--muted)}
.address-box{display:flex;gap:8px;align-items:center}
.address-box input{flex:1}
.copy-btn{display:inline-flex;align-items:center;gap:6px;background:var(--paper);border:1px solid var(--line);color:var(--ink);border-radius:9px;min-height:42px;padding:0 14px;font-weight:700;cursor:pointer;transition:background .2s}
.copy-btn:hover{background:#eef1f0}
.copy-btn svg{width:15px;color:var(--mint-strong)}
.trc20-input{border-color:#75d6b2}
.trc20-input:invalid{border-color:var(--danger)}
/* Deposit center layout */
.deposit-form{display:flex;flex-direction:column;align-items:center;gap:22px;text-align:center}
.deposit-warning{display:flex;align-items:center;gap:12px;width:100%;background:rgba(255,148,108,.08);border:1px solid rgba(255,148,108,.25);color:var(--orange);padding:14px 18px;border-radius:12px;font-size:13px;font-weight:600;line-height:1.5}
.deposit-warning svg{width:20px;height:20px;flex-shrink:0}
.deposit-qr-wrap{display:grid;place-items:center;padding:18px;background:white;border:1px solid var(--line);border-radius:18px;box-shadow:0 12px 30px rgba(7,24,39,.08)}
.deposit-qr{width:220px;height:220px;display:block;border-radius:10px;image-rendering:pixelated}
.deposit-address-block{width:100%;max-width:520px;display:flex;flex-direction:column;gap:10px;align-items:center}
.deposit-address-block label{font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;color:var(--muted)}
.deposit-address-value{display:block;width:100%;font:600 14px 'Space Grotesk';direction:ltr;text-align:center;color:var(--ink);background:var(--paper);border:1px solid var(--line);border-radius:10px;padding:12px 14px;word-break:break-all}
.deposit-hint{font-size:12px;color:var(--muted);margin:0;line-height:1.5}
.deposit-hint strong{color:var(--ink)}
@media(max-width:650px){.deposit-qr{width:180px;height:180px}.deposit-qr-wrap{padding:14px}}
/* Withdrawal method toggle */
.method-toggle{display:flex;gap:8px;flex-wrap:wrap}
.method-option{flex:1;min-width:120px;max-width:100%}
.method-option input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.method-label{display:flex;align-items:center;justify-content:center;gap:8px;padding:12px 16px;border:1px solid var(--line);background:var(--paper);border-radius:10px;font-size:13px;font-weight:600;color:var(--muted);cursor:pointer;transition:all .2s;max-width:100%;text-align:center;white-space:normal}
.method-label svg{width:16px;height:16px}
.method-option input:checked + .method-label{background:var(--ink);color:white;border-color:var(--ink)}
.method-option:hover .method-label{border-color:var(--ink);color:var(--ink)}
.withdraw-field{display:block}
.transaction-form{display:flex;flex-direction:column;gap:18px;overflow-x:hidden;max-width:100%}
.bookmark-current{align-self:flex-start;margin-top:10px}
.withdrawal-bookmark-list{display:flex;flex-direction:column;gap:8px}
.withdrawal-bookmark{display:flex;align-items:center;gap:8px;min-width:0}
.withdrawal-bookmark-use{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:1;min-width:0;padding:10px 12px;border:1px solid var(--line);border-radius:8px;background:var(--paper);color:var(--ink);cursor:pointer}
.withdrawal-bookmark-use code{overflow-wrap:anywhere;text-align:left}
.withdrawal-bookmark-use span{font-size:12px;color:var(--muted)}
.withdrawal-bookmark-remove{display:grid;place-items:center;width:38px;height:38px;flex:none;border:1px solid var(--line);border-radius:8px;background:white;color:var(--muted);cursor:pointer}
.withdrawal-bookmark-remove svg{width:16px;height:16px}
.withdrawal-bookmark-remove:hover{border-color:#d74b4b;color:#d74b4b}
.method-hint{font-size:11px;color:var(--muted);margin:6px 0 0;line-height:1.5}
.field-hint{font-size:11px;color:var(--muted);margin:6px 0 0;line-height:1.5}
.email-input{border-color:#75d6b2}
.email-input:focus{border-color:var(--mint-strong);box-shadow:0 0 0 3px rgba(63,214,157,.12)}
@media (max-width: 380px) {
  .method-option { flex: 1 1 100%; min-width: 100%; }
}
/* Home account summary cards */
.summary-section{padding:24px 0 34px}
.summary-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.summary-card{background:white;border:1px solid var(--line);border-radius:14px;padding:28px;box-shadow:var(--shadow);text-align:center;transition:transform .2s,box-shadow .2s;border-color:rgba(63,214,157,.15)}
.summary-card:hover{transform:translateY(-3px);box-shadow:0 10px 24px rgba(7,24,39,.12)}
.summary-card small{display:block;font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.3px;color:var(--muted);margin-bottom:12px}
.summary-card strong{display:block;font:700 30px 'Space Grotesk';direction:ltr;margin-bottom:4px}
.summary-card-profit strong{color:var(--mint-strong)}
.summary-card-return strong{color:var(--mint-strong)}
.summary-card .summary-sub{font-size:11px;color:var(--muted)}
@media(max-width:900px){.summary-cards{grid-template-columns:1fr 1fr}}
@media(max-width:650px){.summary-cards{grid-template-columns:1fr}}

/* Responsive layout safeguards */
@media (max-width: 1100px) {
  .site-header { padding-left: 4vw; padding-right: 4vw; }
  .section { max-width: 100%; }
  .hero { gap: 40px; }
  .dashboard-advanced-grid { grid-template-columns: 1fr; }
  .dashboard-advanced-grid.row-chart { grid-template-columns: 1fr; }
}

@media (max-width: 900px) {
  .hero { grid-template-columns: 1fr; min-height: auto; padding-top: 64px; }
  .hero-copy { max-width: 720px; margin: 0 auto; text-align: center; }
  .hero-copy .eyebrow, .hero-actions, .proof { justify-content: center; }
  .hero-copy p { margin-left: auto; margin-right: auto; }
  .hero-visual { width: min(100%, 520px); margin: 18px auto 0; }
  .features { grid-template-columns: 1fr 1fr; }
  .market-grid { grid-template-columns: 1fr 1fr; }
  .dashboard-main { min-width: 0; }
  .dashboard-top { gap: 16px; }
  .dashboard-top h1 { font-size: 24px; }
  .transaction-card { grid-template-columns: 1fr; }
}

@media (max-width: 650px) {
  body { overflow-x: hidden; }
  .site-header { height: 70px; }
  .main-nav.mobile-open {
    top: 70px;
    z-index: 20;
  }
  .main-nav.mobile-open a { padding: 8px 0; }
  .section { padding-top: 64px; padding-bottom: 64px; }
  .hero { padding-top: 48px; }
  .hero-copy { text-align: left; }
  .hero-copy .eyebrow, .hero-actions, .proof { justify-content: flex-start; }
  .hero h1 { font-size: clamp(36px, 11vw, 48px); }
  .hero-actions { flex-wrap: wrap; }
  .hero-actions .button { flex: 1 1 150px; }
  .proof { align-items: flex-start; }
  .proof > span { max-width: 180px; }
  .hero-visual { min-height: 395px; }
  .chart-card { padding: 18px; }
  .chart-head strong { font-size: 22px; }
  .features, .market-grid, .markets-grid.advanced,
  .about-grid, .values, .dashboard-advanced-grid { grid-template-columns: 1fr; }
  .center-heading h2, .page-heading h1 { font-size: clamp(30px, 9vw, 40px); }
  .page-heading { padding-top: 42px; }
  .market-card, .market-card-large { padding: 18px; }
  .market-ticker-bar { padding: 12px 14px; }
  .ticker-scroll { overflow-x: auto; scrollbar-width: none; }
  .ticker-scroll::-webkit-scrollbar { display: none; }
  .dashboard-layout { padding: 20px 5vw 64px; gap: 22px; grid-template-columns: minmax(0, 1fr); min-width: 0; }
    .dashboard-layout.transaction-layout { padding-top: 16px; }
    .dashboard-sidebar, .dashboard-main, .dashboard-advanced-grid, .panel { min-width: 0; }
  .dashboard-sidebar {
    width: 100%;
    padding: 16px;
    border-radius: 18px;
    position: static;
  }
  .side-brand {
    display: flex;
    padding: 4px 8px 16px;
  }
  .sidebar-toggle {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    margin-left: auto;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 8px;
    padding: 7px 9px;
    background: rgba(255,255,255,.06);
    color: #c9d8d8;
    font: 600 11px 'Inter', sans-serif;
    cursor: pointer;
  }
  .sidebar-toggle svg {
    width: 15px;
    transition: transform .25s ease;
  }
  .dashboard-sidebar:not(.is-expanded) .side-nav {
    display: none;
  }
  .dashboard-sidebar.is-expanded .side-nav {
    animation: sidebarReveal .25s ease-out;
  }
  .dashboard-sidebar.is-expanded .sidebar-toggle svg {
    transform: rotate(180deg);
  }
  .side-nav {
    display: grid;
    grid-template-columns: 1fr;
    gap: 5px;
    padding-top: 14px;
    min-width: 0;
    overflow: visible;
  }
  .side-nav a {
    width: 100%;
    min-height: 44px;
    padding: 11px 12px;
  }
  .side-separator {
    display: block;
    margin: 8px 0;
  }
  .dashboard-top { flex-direction: column; margin-bottom: 20px; }
  .balance-grid { gap: 10px; }
  .balance-card { padding: 17px; }
  .balance-card strong { font-size: 23px; }
  .panel { padding: 17px; overflow: hidden; }
  .dash-table { display: block; overflow-x: auto; white-space: nowrap; }
  .portfolio-donut { gap: 16px; }
  .donut { width: 116px; height: 116px; }
/* Transaction center layout */
.dashboard-main{min-width:0;overflow-x:hidden}
.transaction-shell{padding-top:0;padding-bottom:60px;overflow-x:hidden}
.transaction-shell .page-heading{padding-top:0;padding-bottom:24px}
.transaction-shell .page-heading h1{font-size:32px;letter-spacing:-0.8px}
.transaction-shell .page-heading p{margin-top:8px}
.transaction-card{background:white;border:1px solid var(--line);border-radius:16px;padding:24px;box-shadow:var(--shadow);display:grid;grid-template-columns:1fr;gap:18px;overflow:hidden;max-width:100%}
.transaction-info{padding-bottom:0}
.transaction-form{display:flex;flex-direction:column;gap:18px;overflow-x:hidden;max-width:100%}
.deposit-form{overflow-x:hidden;max-width:100%}
.deposit-qr-wrap{overflow:hidden;max-width:100%}
.deposit-address-value{overflow-wrap:break-word;max-width:100%}
  .profile-tabs { gap: 16px; overflow-x: auto; white-space: nowrap; }
  .address-box { align-items: stretch; flex-direction: column; }
  .address-box .copy-btn { justify-content: center; }
  .footer-main { padding-top: 48px; }
}

@media (max-width: 420px) {
  .brand { font-size: 18px; }
  .brand-mark { width: 31px; height: 31px; }
  .auth-shell { padding-left: 12px; padding-right: 12px; }
  .auth-card { padding: 22px 16px; }
  .side-nav { margin-right: 0; padding-right: 0; }
  .summary-card { padding: 22px 16px; }
  .cta-section { padding: 42px 18px; }
}

.sidebar-toggle { display: none; }
@keyframes sidebarReveal {
  from { opacity: 0; transform: translateY(-6px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (max-width: 650px) {
  .sidebar-toggle { display: inline-flex; }
}

.plans-section { max-width: 1200px; margin: 0 auto; padding: 88px 0; }
.plans-section-profile { padding: 28px 0 88px; }
.plans-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 18px; margin-top: 34px; }
.plan-card { position: relative; display: flex; flex-direction: column; padding: 28px; background: var(--white); border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow); transition: transform .2s, box-shadow .2s, border-color .2s; }
.plan-card:hover { transform: translateY(-4px); border-color: #9edfc5; box-shadow: 0 22px 55px rgba(7,24,39,.12); }
.plan-card.featured { border: 2px solid var(--mint-strong); padding: 27px; }
.plan-badge { position: absolute; top: -13px; right: 22px; padding: 3px 12px; border-radius: 20px; background: var(--mint-strong); color: var(--ink); font-size: 11px; font-weight: 800; }
.plan-card-head { display: flex; align-items: center; gap: 12px; }
.plan-icon { display: grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; color: #18805c; background: rgba(63,214,157,.14); }
.plan-icon svg { width: 20px; }
.plan-label { display: block; color: var(--muted); font-size: 11px; font-weight: 700; letter-spacing: .3px; text-transform: uppercase; }
.plan-card h3 { margin: 0; font-size: 22px; letter-spacing: -.5px; }
.plan-price { margin: 24px 0 2px; font-family: 'Space Grotesk'; font-size: 30px; font-weight: 700; direction: ltr; }
.plan-range { min-height: 28px; font-size: 12px; color: var(--ink-2); }
.plan-description { min-height: 76px; margin: 14px 0; color: var(--muted); font-size: 13px; line-height: 1.65; }
.plan-target { display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 9px; background: #f0faf6; color: #23855f; font-size: 12px; font-weight: 700; }
.plan-target svg { width: 16px; flex-shrink: 0; }
.plan-features { display: grid; gap: 9px; padding: 0; margin: 20px 0 24px; list-style: none; color: #536770; font-size: 12px; }
.plan-features li { display: flex; align-items: flex-start; gap: 8px; }
.plan-features svg { width: 15px; margin-top: 4px; color: #2cae7e; flex-shrink: 0; }
.plan-cta { width: 100%; margin-top: auto; min-height: 44px; font-size: 13px; }
.plans-note { display: flex; align-items: flex-start; justify-content: center; gap: 8px; max-width: 820px; margin: 24px auto 0; color: var(--muted); font-size: 11px; text-align: center; line-height: 1.6; }
.plans-note svg { width: 15px; margin-top: 3px; color: var(--orange); flex-shrink: 0; }
@media (max-width: 900px) {
  .plans-section { padding-left: 5vw; padding-right: 5vw; }
  .plans-grid { grid-template-columns: 1fr 1fr; }
  .plan-card:last-child { grid-column: 1 / -1; max-width: calc(50% - 9px); width: 100%; justify-self: center; }
}
@media (max-width: 650px) {
  .plans-section { padding-top: 64px; padding-bottom: 64px; }
  .plans-grid { grid-template-columns: 1fr; }
  .plan-card:last-child { grid-column: auto; max-width: none; }
  .plan-description { min-height: auto; }
}

.profile-tab-panel { display: none; }
.profile-tab-panel.active { display: block; animation: profileFadeIn .3s ease-out; }
@keyframes profileFadeIn { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: translateY(0); } }

.profile-card { padding: 26px; }
.profile-header { display: flex; align-items: center; gap: 16px; padding-bottom: 22px; border-bottom: 1px solid var(--line); margin: 0 0 24px; }
.profile-header .avatar { width: 56px; height: 56px; font-size: 1.35rem; font-weight: 800; flex-shrink: 0; box-shadow: 0 0 0 3px rgba(255,148,108,.18); }
.profile-header h2 { font-size: 1.25rem; font-weight: 700; margin: 0 0 4px; display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.profile-header p { font-size: 0.85rem; color: var(--muted); margin: 0; }
.verified-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; color: #1d9e6b; background: rgba(63,214,157,.12); border: 1px solid rgba(63,214,157,.25); border-radius: 20px; padding: 3px 10px; }
.verified-badge svg { width: 13px; height: 13px; }

.profile-tabs { display: flex; gap: 6px; margin: 0 0 24px; padding: 0; border-bottom: 1px solid var(--line); }
.profile-tab-btn { display: inline-flex; align-items: center; gap: 8px; padding: 12px 14px; border: none; background: transparent; border-radius: 10px 10px 0 0; font-weight: 600; font-size: 13px; cursor: pointer; transition: color .2s, background .2s, border-color .2s, transform .2s; white-space: nowrap; color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.profile-tab-btn:hover { color: var(--ink); background: rgba(63,214,157,.07); transform: translateY(-1px); }
.profile-tab-btn.active { color: var(--ink); font-weight: 700; border-bottom-color: var(--mint-strong); background: rgba(63,214,157,.08); }
.profile-tab-btn svg { width: 16px; height: 16px; transition: transform .2s, color .2s; }
.profile-tab-btn:hover svg { transform: scale(1.12); }
.profile-tab-btn.active svg { color: var(--mint-strong); }

.profile-form { padding: 0; margin: 0; }
.profile-form .field { margin-bottom: 16px; }
.profile-form .field label { display: block; font-size: 12px; font-weight: 700; margin-bottom: 7px; color: var(--ink); }
.profile-form .field input, .profile-form .field select { width: 100%; height: 48px; padding: 0 14px; border: 1px solid var(--line); border-radius: 9px; background: #fbfdfc; color: var(--ink); font: inherit; outline: none; transition: border-color .2s, box-shadow .2s, background .2s; }.profile-form .field input:hover, .profile-form .field select:hover { border-color: #b9d9cd; }
.profile-form .field input:focus, .profile-form .field select:focus { border-color: #75d6b2; box-shadow: 0 0 0 3px rgba(63,214,157,.13); background: #fff; }
.profile-form .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; }
.profile-form .button { width: 100%; margin: 4px 0 0; transition: transform .2s, background .2s, box-shadow .2s; }.profile-form .button:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(7,24,39,.18); }

.settings-section { padding: 0; margin: 0 0 4px; }
.settings-section h3 { font-size: 13px; font-weight: 700; margin: 0 0 18px; color: var(--ink); }
.settings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; margin: 0; }
.setting-item { display: flex; flex-direction: column; gap: 7px; margin: 0; background: var(--paper); border: 1px solid var(--line); border-radius: 12px; padding: 16px; transition: border-color .2s, box-shadow .2s, transform .2s; }
.setting-item:hover { border-color: #b9d9cd; box-shadow: 0 8px 20px rgba(7,24,39,.06); transform: translateY(-1px); }
.setting-item label { font-size: 12px; font-weight: 700; color: var(--ink); margin: 0; }
.setting-item .field { margin: 0; }
.setting-item .field input, .setting-item .field select { width: 100%; height: 48px; padding: 0 14px; font-size: 13px; background: #fff; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); font: inherit; outline: none; transition: border-color .2s, box-shadow .2s; }
.setting-item .field input:hover, .setting-item .field select:hover { border-color: #b9d9cd; }
.setting-item .field input:focus, .setting-item .field select:focus { border-color: #75d6b2; box-shadow: 0 0 0 3px rgba(63,214,157,.13); }
.phone-input { display: flex; gap: 10px; margin: 0; }
.phone-input .country-code { width: 95px; min-width: 85px; flex-shrink: 0; font-size: 13px; background: #fbfdfc; border: 1px solid var(--line); border-radius: 9px; height: 48px; padding: 0 10px; color: var(--ink); outline: 0; cursor: pointer; transition: border-color .2s, box-shadow .2s; }
.phone-input .country-code:hover { border-color: #b9d9cd; }
.phone-input .country-code:focus { border-color: #75d6b2; box-shadow: 0 0 0 3px rgba(63,214,157,.13); background: #fff; }
.phone-input input { flex: 1; min-width: 0; }

.toggle { position: relative; display: inline-flex; align-items: center; cursor: pointer; margin: 0; }
.toggle input { position: absolute; opacity: 0; width: 0; height: 0; }
.toggle-slider { position: relative; width: 48px; height: 26px; background: #cfdcd9; border-radius: 13px; transition: background .3s, box-shadow .3s; flex-shrink: 0; }
.toggle-slider:before { content: ''; position: absolute; top: 2px; left: 2px; width: 22px; height: 22px; background: white; border-radius: 50%; box-shadow: 0 2px 4px rgba(0,0,0,.15); transition: transform .3s cubic-bezier(.34,1.56,.64,1); }
.toggle:hover .toggle-slider { box-shadow: 0 0 0 3px rgba(63,214,157,.15); }
.toggle input:checked + .toggle-slider { background: var(--mint-strong); box-shadow: 0 2px 10px rgba(63,214,157,.4); }
.toggle input:checked + .toggle-slider:before { transform: translateX(22px); }
.toggle input:focus-visible + .toggle-slider { outline: 2px solid var(--mint-strong); outline-offset: 2px; }

@media (max-width: 650px) {
  .profile-card { padding: 20px 16px; }
  .profile-header { gap: 12px; padding-bottom: 18px; margin-bottom: 18px; }
  .settings-grid { grid-template-columns: 1fr; }
  .profile-tabs { gap: 4px; overflow-x: auto; scrollbar-width: none; }
  .profile-tabs::-webkit-scrollbar { display: none; }
  .profile-tab-btn { padding: 10px 10px; font-size: 12px; }
  .profile-form .form-row { grid-template-columns: 1fr; }
  .phone-input { flex-direction: column; }
  .phone-input .country-code { width: 100%; min-width: 0; }
}

.security-card { margin-top: 22px; }
.security-settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; }
.security-setting { min-width: 0; padding: 20px; border: 1px solid var(--line); border-radius: 12px; background: var(--paper); }
.security-setting h3 { margin: 0 0 8px; font-size: 16px; }
.security-setting > p, .security-form > p { color: var(--muted); font-size: 13px; line-height: 1.6; }
.security-form .field { margin: 14px 0; }
.security-form .field label { display: block; margin-bottom: 7px; font-size: 12px; font-weight: 700; }
.security-form .field input { width: 100%; min-height: 44px; padding: 0 12px; border: 1px solid var(--line); border-radius: 8px; background: #fff; color: var(--ink); font: inherit; }
.security-form .field input:focus { outline: 2px solid rgba(63,214,157,.35); border-color: var(--mint-strong); }
.security-form .button { width: 100%; }
.security-status { display: flex; align-items: center; gap: 8px; }
.security-status.enabled { color: #1d9e6b; font-weight: 700; }
.security-status svg { width: 18px; height: 18px; }
.totp-secret { display: block; overflow-wrap: anywhere; margin: 12px 0; padding: 14px; border: 1px dashed var(--mint-strong); border-radius: 8px; background: #fff; color: var(--ink); font-size: 15px; font-weight: 700; letter-spacing: .08em; text-align: center; }
.totp-recovery { margin: 0 0 16px; padding: 14px; border: 1px solid #e8c66d; border-radius: 8px; background: #fff9e9; color: var(--ink); font-size: 13px; }
.totp-recovery p { margin: 6px 0 10px; color: var(--muted); }
.totp-recovery code { display: block; line-height: 1.8; letter-spacing: .04em; }
@media (max-width: 760px) {
  .security-settings-grid { grid-template-columns: 1fr; }
}

/* Redesigned Profile Page */
.profile-layout { padding: 34px 0 90px; }
.profile-header-bar { display: flex; justify-content: space-between; align-items: center; margin-bottom: 28px; gap: 24px; }
.profile-header-content { display: flex; align-items: center; gap: 20px; }
.profile-avatar-large { width: 72px; height: 72px; border-radius: 18px; background: var(--ink); color: white; display: grid; place-items: center; font: 700 26px 'Space Grotesk'; flex-shrink: 0; box-shadow: 0 8px 24px rgba(7,24,39,.18); }
.profile-identity h1 { font-size: 28px; margin: 0 0 8px; letter-spacing: -0.8px; }
.profile-meta { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.profile-meta .meta-divider { color: var(--line); font-size: 14px; }
.profile-meta .meta-item { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 13px; }
.profile-meta .meta-item svg { width: 15px; height: 15px; color: var(--muted); }
.profile-quick-stats { display: flex; gap: 12px; }
.quick-stat { background: white; border: 1px solid var(--line); border-radius: 12px; padding: 14px 20px; text-align: center; min-width: 110px; }
.quick-stat-label { display: block; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; color: var(--muted); margin-bottom: 6px; }
.quick-stat-value { display: block; font: 600 20px 'Space Grotesk'; direction: ltr; }
.quick-stat-value.positive { color: var(--mint-strong); }
.profile-card { background: white; border: 1px solid var(--line); border-radius: 16px; padding: 28px; box-shadow: var(--shadow); }
.profile-tabs { display: flex; gap: 6px; margin: 0 0 24px; padding: 0; border-bottom: 1px solid var(--line); overflow-x: auto; scrollbar-width: none; }
.profile-tabs::-webkit-scrollbar { display: none; }
.profile-tab-btn { display: inline-flex; align-items: center; gap: 10px; padding: 14px 18px; border: none; background: transparent; border-radius: 12px 12px 0 0; font-weight: 600; font-size: 13px; cursor: pointer; transition: all .2s; white-space: nowrap; color: var(--muted); border-bottom: 2px solid transparent; margin-bottom: -1px; position: relative; }
.profile-tab-btn:hover { color: var(--ink); background: rgba(63,214,157,.06); transform: translateY(-1px); }
.profile-tab-btn.active { color: var(--ink); font-weight: 700; border-bottom-color: var(--mint-strong); background: rgba(63,214,157,.08); }
.profile-tab-btn .tab-icon { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 8px; background: var(--paper); transition: all .2s; }
.profile-tab-btn .tab-icon svg { width: 16px; height: 16px; }
.profile-tab-btn:hover .tab-icon { background: var(--mint); }
.profile-tab-btn.active .tab-icon { background: var(--mint); color: var(--ink); }
.profile-tab-btn .tab-label { display: block; font-weight: 600; }
.profile-tab-btn .tab-desc { display: block; font-size: 11px; color: var(--muted); font-weight: 400; margin-top: 1px; }
.profile-tab-btn.active .tab-desc { color: #4ea27f; }
.profile-tab-panel { display: none; animation: profileFadeIn .35s ease-out; }
.profile-tab-panel.active { display: block; }
@keyframes profileFadeIn { from { opacity: 0; transform: translateY(10px); } to { opacity: 1; transform: translateY(0); } }
.profile-form-layout { padding: 4px 0; }
.form-section { margin-bottom: 28px; }
.form-section-title { font-size: 15px; font-weight: 700; margin: 0 0 18px; color: var(--ink); display: flex; align-items: center; gap: 10px; }
.form-section-title:before { content: ''; width: 4px; height: 18px; background: var(--mint-strong); border-radius: 2px; }
.profile-view-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.profile-view-item { display: flex; flex-direction: column; gap: 6px; padding: 16px; background: var(--paper); border: 1px solid var(--line); border-radius: 12px; transition: all .2s; }
.profile-view-item:hover { border-color: #b9d9cd; background: #fff; }
.profile-view-label { font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .3px; color: var(--muted); }
.profile-view-value { font: 600 15px 'Space Grotesk'; color: var(--ink); direction: ltr; word-break: break-word; }
.profile-form .field { margin-bottom: 18px; }
.profile-form .field label { display: block; font-size: 12px; font-weight: 700; margin-bottom: 8px; color: var(--ink); }
.profile-form .field input, .profile-form .field select { width: 100%; height: 50px; padding: 0 16px; border: 1px solid var(--line); border-radius: 10px; background: var(--paper); color: var(--ink); font: inherit; outline: none; transition: all .2s; }
.profile-form .field input:hover, .profile-form .field select:hover { border-color: #b9d9cd; background: #fff; }
.profile-form .field input:focus, .profile-form .field select:focus { border-color: var(--mint-strong); box-shadow: 0 0 0 4px rgba(63,214,157,.12); background: #fff; }
.profile-card .field input:disabled, .profile-card .field select:disabled { cursor: not-allowed; color: #63747a; background: #f1f4f3; border-color: #e1e8e5; opacity: 1; }
.identity-lock-notice { display: flex; align-items: center; gap: 9px; margin: 0 0 20px; padding: 13px 15px; border: 1px solid rgba(63,214,157,.24); border-radius: 10px; background: rgba(63,214,157,.08); color: #34775f; font-size: 12px; line-height: 1.5; }
.identity-lock-notice svg { width: 16px; height: 16px; flex-shrink: 0; }
.profile-account-status { margin: 20px 0 0; padding-top: 16px; border-top: 1px solid var(--line); color: var(--muted); font-size: 12px; }
.profile-account-status strong { color: var(--ink); }
.trade-page-header .profile-avatar-large { color: var(--mint-strong); background: var(--ink); }
.trade-page-header .profile-avatar-large svg { width: 30px; height: 30px; }
.trade-settings-form .profile-tabs { margin-bottom: 26px; }
.profile-form .form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.profile-form .button { width: auto; margin: 8px 0 0; padding: 0 28px; transition: transform .2s, background .2s, box-shadow .2s; }
.profile-form .button:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(7,24,39,.18); }
.form-actions { display: flex; justify-content: flex-end; padding-top: 8px; border-top: 1px solid var(--line); }
.settings-section { padding: 0; margin: 0; }
.settings-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 16px; margin: 0; }
.setting-card { display: flex; flex-direction: column; gap: 10px; margin: 0; background: var(--paper); border: 1px solid var(--line); border-radius: 14px; padding: 20px; transition: all .2s; }
.setting-card:hover { border-color: #b9d9cd; box-shadow: 0 8px 20px rgba(7,24,39,.06); transform: translateY(-2px); }
.setting-card-head { display: flex; justify-content: space-between; align-items: center; }
.setting-card-head label { font-size: 13px; font-weight: 700; color: var(--ink); margin: 0; }
.setting-badge { font: 600 12px 'Space Grotesk'; padding: 4px 10px; border-radius: 6px; background: rgba(63,214,157,.1); color: var(--mint-strong); border: 1px solid rgba(63,214,157,.2); }
.setting-hint { font-size: 11px; color: var(--muted); margin: 0; line-height: 1.5; }
.setting-card .field { margin: 0; }
.setting-card .field input, .setting-card .field select { width: 100%; height: 46px; padding: 0 14px; font-size: 13px; background: #fff; border: 1px solid var(--line); border-radius: 9px; color: var(--ink); font: inherit; outline: none; transition: border-color .2s, box-shadow .2s; }
.setting-card .field input:hover, .setting-card .field select:hover { border-color: #b9d9cd; }
.setting-card .field input:focus, .setting-card .field select:focus { border-color: var(--mint-strong); box-shadow: 0 0 0 3px rgba(63,214,157,.1); }
.verified-badge { display: inline-flex; align-items: center; gap: 5px; font-size: 11px; font-weight: 700; color: #1d9e6b; background: rgba(63,214,157,.12); border: 1px solid rgba(63,214,157,.25); border-radius: 20px; padding: 4px 12px; }
.verified-badge svg { width: 13px; height: 13px; }

@media (max-width: 900px) {
  .profile-layout { padding: 20px 5vw 70px; }
  .profile-header-bar { flex-direction: column; align-items: flex-start; gap: 20px; }
  .profile-quick-stats { width: 100%; overflow-x: auto; }
  .quick-stat { min-width: 100px; }
}
@media (max-width: 650px) {
  .profile-header-content { flex-direction: column; text-align: center; }
  .profile-meta { justify-content: center; }
  .profile-quick-stats { justify-content: center; }
  .profile-identity h1 { font-size: 22px; }
  .profile-tab-btn { padding: 12px 14px; }
  .profile-tab-btn .tab-desc { display: none; }
  .profile-tab-btn .tab-label { font-size: 12px; }
  .profile-tab-btn .tab-icon { width: 28px; height: 28px; }
  .settings-grid { grid-template-columns: 1fr; }
  .profile-view-grid { grid-template-columns: 1fr; }
  .form-actions { justify-content: stretch; }
  .form-actions .button { width: 100%; justify-content: center; }
}

/* Email Verification Page */
.verification-shell { position:relative; isolation:isolate; overflow:hidden; }
.verification-shell:before,.verification-shell:after { content:'';position:absolute;z-index:-1;border-radius:50%;pointer-events:none; }
.verification-shell:before { width:340px;height:340px;top:12%;left:calc(50% - 440px);background:rgba(63,214,157,.11);filter:blur(3px); }
.verification-shell:after { width:280px;height:280px;right:calc(50% - 430px);bottom:8%;background:rgba(255,183,120,.13);filter:blur(3px); }
.verify-email-card { width:min(100%,480px);text-align:center;padding:42px;background:rgba(255,255,255,.94);backdrop-filter:blur(14px); }
.verify-email-card .eyebrow { margin-bottom:8px; }
.verify-email-card h1 { margin:4px 0 10px; }
.verify-email-card .verify-intro { max-width:350px;margin:0 auto 26px;line-height:1.7; }
.verify-icon { width:72px;height:72px;border-radius:50%;background:var(--mint);display:grid;place-items:center;margin:0 auto 24px; }
.verify-icon svg { width:32px;height:32px;color:var(--ink); }
.verify-icon.success { background:var(--mint-strong); }
.verify-icon.success svg { color:var(--ink); }
.verify-icon.error { background:rgba(227,108,125,.1); }
.verify-icon.error svg { color:var(--danger);width:36px;height:36px; }
.verify-spinner { width:40px;height:40px;border:3px solid var(--line);border-top-color:var(--mint-strong);border-radius:50%;margin:24px auto;animation:spin 1s linear infinite; }
@keyframes spin { to { transform:rotate(360deg); } }
.verify-message { color:var(--muted);font-size:13px;min-height:20px;margin-top:16px; }
.verify-email-card .verify-email-field { text-align:left;margin-bottom:23px; }
.verify-input-wrap { position:relative; }
.verify-input-wrap>svg { position:absolute;left:15px;top:50%;width:18px;height:18px;transform:translateY(-50%);color:#8a9a99;pointer-events:none; }
.verify-email-card .verify-input-wrap input { height:54px;padding-left:45px;background:#f8fbfa;border-color:#dfe9e5;transition:border-color .2s,box-shadow .2s,background .2s; }
.verify-email-card .verify-input-wrap input:focus { background:#fff; }
.verify-delivery-note { min-height:34px;margin:9px 2px 0;color:#70817f;font-size:12px;line-height:1.55;overflow-wrap:anywhere; }
.verify-delivery-note strong { color:#278866;font-weight:700; }
.verify-code-field { min-width:0;margin:0 0 21px;padding:0;border:0; }
.verify-code-field legend { width:100%;margin:0 0 12px;text-align:left;color:var(--ink);font-size:12px;font-weight:700; }
.otp-inputs { display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;direction:ltr; }
.otp-inputs input { width:100%;height:58px;padding:0;text-align:center;border:1px solid #dfe9e5;border-radius:12px;background:#f8fbfa;color:var(--ink);font:700 25px 'Inter',sans-serif;outline:0;caret-color:var(--mint-strong);transition:border-color .18s,box-shadow .18s,background .18s,transform .18s; }
.otp-inputs input:focus { background:#fff;border-color:#55c69b;box-shadow:0 0 0 4px rgba(63,214,157,.15);transform:translateY(-1px); }
.otp-inputs input.is-filled { background:#f1fbf6;border-color:#a6ddc4; }
.verify-code-hint { margin:10px 0 0;text-align:left;color:#8a9997;font-size:11px; }
.verify-email-card .verify-feedback,.verify-email-card .auth-feedback { text-align:left; }
.verify-email-card .button-mint { box-shadow:0 9px 22px rgba(48,176,127,.19); }
.verify-email-card .verify-resend { margin-top:10px;border-color:#dfe9e5;background:transparent;color:#4e6862; }
.verify-email-card .verify-resend:hover { border-color:#75d6b2;background:#f4fbf7;color:#207a5a; }
@media(max-width:480px) {
  .verify-email-card { padding:30px 22px; }
  .otp-inputs { gap:7px; }
  .otp-inputs input { height:52px;border-radius:10px;font-size:22px; }
}