@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');
:root{color-scheme:dark;--bg:#070908;--panel:#101411;--panel2:#0b0e0c;--line:#252d27;--text:#f2f5f1;--muted:#8e9a90;--lime:#c7ff38;--lime2:#a8e522;--lime-dark:#24310e;--green:#baff45;--red:#ff6575;--shadow:0 18px 50px #0007}
*{box-sizing:border-box}html{background:var(--bg)}body{margin:0;background:radial-gradient(ellipse at 12% -12%,#1b2910 0,transparent 34%),radial-gradient(ellipse at 100% 15%,#111b0d 0,transparent 25%),var(--bg);color:var(--text);font:14px 'DM Sans',system-ui,sans-serif;min-height:100vh}.notice{background:#11170b;color:#d9ff8a;text-align:center;padding:9px 14px;border-bottom:1px solid #35451b;font-size:10px;font-weight:800;letter-spacing:.08em}header{height:76px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 max(24px,calc((100vw - 1450px)/2));background:#080b08cc;backdrop-filter:blur(18px)}.brand{display:flex;align-items:center;gap:12px;letter-spacing:.12em}.brand b{font:700 15px 'Space Grotesk',sans-serif}.brand small{display:block;font-size:9px;color:var(--muted);margin-top:4px;letter-spacing:.17em}.logo{width:40px;height:40px;display:grid;place-items:center;border-radius:12px;background:var(--lime);color:#11160a;font:700 23px 'Space Grotesk',sans-serif;box-shadow:0 0 24px #c7ff3826}.hidden{display:none!important}main{max-width:1450px;margin:30px auto;padding:0 24px}.hero h1{font:700 clamp(40px,5vw,68px)/1.02 'Space Grotesk',sans-serif;letter-spacing:-.06em;margin:14px 0 18px}.hero h1 em{font-style:normal;color:var(--lime)}.hero>p:not(.eyebrow){color:#a4afa5;max-width:510px;line-height:1.85;font-size:14px}.eyebrow{font-size:10px;font-weight:800;letter-spacing:.17em;color:var(--lime)}.tags{display:flex;gap:9px;flex-wrap:wrap;margin-top:25px}.tags span,.badge{font-size:10px;padding:8px 11px;border-radius:6px;background:#11170d;border:1px solid #33421d;color:#d8f5a1}.card{background:linear-gradient(145deg,#121713,#0d110e);border:1px solid var(--line);border-radius:14px;padding:21px;box-shadow:var(--shadow)}.authbox{max-width:430px;align-self:center}.authbox label,.tradebox label,.adminsettings label,.assetform label{display:block;color:#aab5ab;font-size:11px;font-weight:600;margin:13px 0}#auth{min-height:72vh;display:grid;grid-template-columns:1fr .8fr;gap:9%;align-items:center}.tabs{display:flex;gap:5px;padding:4px;background:#080b09;border:1px solid #202820;border-radius:9px;margin-bottom:18px}.tabs button{flex:1;background:transparent;color:var(--muted);border:0}.tabs button.active{background:var(--lime);color:#10150a;box-shadow:0 2px 12px #c7ff3820}input,select{width:100%;display:block;margin-top:7px;padding:12px;background:#090c0a;border:1px solid #2b342c;border-radius:8px;color:var(--text);outline:none;font:inherit;font-size:12px}input:focus,select:focus{border-color:var(--lime);box-shadow:0 0 0 3px #c7ff3815}button{border:1px solid transparent;border-radius:8px;padding:11px 13px;font:700 11px 'DM Sans',sans-serif;cursor:pointer;transition:transform .15s,filter .15s,border-color .15s}button:hover{filter:brightness(1.08);transform:translateY(-1px)}button:active{transform:translateY(0)}.primary{background:var(--lime);color:#11160a}.authbox .primary{width:100%;margin-top:8px;padding:13px}.secondary{background:#171e18;border:1px solid #344035;color:#e5ece5}.msg{min-height:16px;font-size:11px;color:#ff9ba9}.heading,.secthead,.charttitle{display:flex;justify-content:space-between;align-items:center;gap:12px}.heading h1{font:700 28px 'Space Grotesk',sans-serif;letter-spacing:-.04em;margin:3px 0 20px}.right{display:flex;gap:9px;align-items:center}.right select{margin:0;width:95px}.balances{display:grid;grid-template-columns:repeat(3,1fr);gap:13px;margin-bottom:16px}.metric{position:relative;overflow:hidden;background:linear-gradient(135deg,#121812,#0d110e);border:1px solid var(--line);padding:18px;border-radius:12px}.metric:after{content:"";position:absolute;right:-24px;top:-40px;width:90px;height:90px;border-radius:50%;background:#c7ff3809;filter:blur(3px)}.metric small{font-size:9px;letter-spacing:.1em;color:var(--muted);font-weight:800}.metric strong{display:block;font:600 25px 'Space Grotesk',sans-serif;margin:10px 0 4px;letter-spacing:-.04em}.green{color:var(--lime);font-size:10px}.layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:16px}.chartbox{min-width:0}.charttitle small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.charttitle b{font:700 13px 'Space Grotesk',sans-serif}canvas{width:100%;height:auto;display:block;margin:18px 0 12px;border:1px solid #202820;border-radius:8px;background:#090c0a}.muted{color:var(--muted);font-size:10px;line-height:1.7}.assetmeta{font-size:10px;color:#d4f38d;margin-top:-5px}.returnbox{display:flex;justify-content:space-between;align-items:center;padding:12px;background:#0a0e0b;border:1px solid #222b22;border-radius:8px;color:var(--muted);font-size:10px}.returnbox b{font:700 15px 'Space Grotesk',sans-serif;color:var(--lime)}.twobutton{display:flex;gap:9px;margin-top:12px}.twobutton button{flex:1}.up{background:#c7ff38;color:#11160a;border:1px solid #d8ff7c}.down{background:#31171b;color:#ff9eaa;border:1px solid #6d303a}hr{border:0;border-top:1px solid var(--line);margin:20px 0}.tradebox h3,.section h3{font:700 13px 'Space Grotesk',sans-serif;margin:18px 0 10px}.section{margin-top:17px}.secthead h2{font:700 19px 'Space Grotesk',sans-serif;margin:0;letter-spacing:-.03em}.scroll{overflow:auto;margin-top:13px;border:1px solid #222a23;border-radius:9px}table{border-collapse:collapse;width:100%;font-size:10px;white-space:nowrap}th,td{text-align:left;padding:12px 10px;border-bottom:1px solid #202720}th{color:#879287;font-size:9px;text-transform:uppercase;letter-spacing:.08em;background:#0a0e0b}td{color:#dce4dc}tr:last-child td{border-bottom:0}tbody tr:hover{background:#c7ff3806}.pos{color:var(--lime)}.neg{color:var(--red)}.status{background:#1a2410;color:#d7ff8a;padding:5px 7px;border:1px solid #35471b;border-radius:5px;font-size:9px}.requestlist{display:grid;gap:8px}.request{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;padding:11px;background:#0a0e0b;border:1px solid var(--line);border-radius:8px;font-size:10px}.request button{padding:7px 9px;font-size:9px}.adminsettings{display:grid;grid-template-columns:1fr 1fr 1fr;align-items:end;gap:13px}.adminsettings label{margin-bottom:12px}.assetform{display:grid;grid-template-columns:1fr 1.3fr 1fr .8fr 1fr;gap:10px;align-items:end}.assetform label{margin:0 0 12px}.assetform button{margin-bottom:12px}.useractions{display:flex;gap:6px}.useractions button{font-size:9px;padding:7px}.section>h3{margin-top:25px}footer{text-align:center;padding:30px 12px;margin-top:30px;border-top:1px solid #1d251e;color:#647064;font-size:10px;letter-spacing:.06em}@media(max-width:1000px){.layout{grid-template-columns:1fr}.adminsettings,.assetform{grid-template-columns:1fr 1fr}#auth{gap:25px}}@media(max-width:680px){main{padding:0 12px;margin:20px auto}header{padding:0 12px}.card{padding:14px}#auth{grid-template-columns:1fr;gap:18px}.authbox{max-width:none}.hero{padding:10px 0}.balances{grid-template-columns:1fr}.metric strong{font-size:21px}.heading h1{font-size:22px}.adminsettings,.assetform{grid-template-columns:1fr}.charttitle{align-items:flex-start}.badge{font-size:8px}.notice{font-size:8px}.secthead{align-items:flex-start}.right{gap:6px}.heading{align-items:flex-start}.section{overflow:hidden}.twobutton{gap:7px}}

/* Trading-first layout: chart and action buttons are the first content after login. */
#app>.heading{margin-bottom:12px}
#app>.layout{grid-template-columns:minmax(0,1fr) 350px;gap:14px;align-items:start}
#app>.layout .chartbox{padding:18px;min-width:0}
#chart{width:100%;height:auto;aspect-ratio:1200/650;margin:12px 0;border:1px solid #263126;border-radius:9px}
#app>.layout .tradebox{padding:18px}
#app>.layout .tradebox .twobutton button{min-height:52px;font-size:13px;letter-spacing:.04em}
#app>.balances{margin-top:14px}
@media(max-width:1000px){#app>.layout{grid-template-columns:minmax(0,1fr) 310px}}
@media(max-width:760px){#app>.layout{grid-template-columns:1fr;gap:10px}#app>.layout .chartbox{padding:12px}#app>.layout .tradebox{padding:14px}#chart{aspect-ratio:1.45}#app>.layout .tradebox .twobutton button{min-height:50px;font-size:12px}}

/* Referência visual: terminal de velas em fundo azul-marinho. */
#app>.layout .chartbox{background:#151923;border-color:#272e3b}
#chart{display:block;width:100%;height:auto;aspect-ratio:6/5;margin:12px 0;background:#151923;border:0;border-radius:0}
#app>.layout .charttitle b{color:#f1f3f8}
#app>.layout .charttitle small{color:#a0a8b8}
@media(max-width:760px){
 #app>.layout .chartbox{padding:8px;background:#151923;border-radius:10px}
 #chart{aspect-ratio:1/1.08;width:100%;}
 #app>.layout .tradebox .twobutton button{min-height:58px;font-size:15px;border-radius:12px}
 #app>.layout .tradebox .up{background:#58ad6a;color:#f7fff8;border-color:#58ad6a}
 #app>.layout .tradebox .down{background:#b83d3e;color:#fff5f5;border-color:#b83d3e}
}

/* FIX: deixar COMPRAR e VENDER visíveis na tela principal */
#spotButtons {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  width: 100% !important;
  gap: 12px !important;
  margin: 14px 0 !important;
}
#spotButtons button {
  display: flex !important;
  visibility: visible !important;
  opacity: 1 !important;
  flex: 1 1 50% !important;
  min-height: 58px !important;
  align-items: center !important;
  justify-content: center !important;
  font-size: 17px !important;
  font-weight: 800 !important;
  border-radius: 10px !important;
}
#spotButtons button:first-child {
  background: #16b979 !important;
  color: #fff !important;
}
#spotButtons button:last-child {
  background: #ed495c !important;
  color: #fff !important;
}
#chart{width:100%!important;height:650px!important;aspect-ratio:auto!important}
@media(max-width:760px){#chart{height:440px!important}}