*{box-sizing:border-box}body{margin:0;background:#0b1119;color:#edf4f8;font:14px system-ui,Arial;display:flex}aside{width:225px;background:#101a25;padding:24px;min-height:100vh;flex-shrink:0}aside h2{font-size:16px;color:#38d996}nav{display:grid;gap:14px;margin-top:40px}a{color:#b9c7d5;text-decoration:none}main{padding:25px;max-width:1500px;width:100%;margin:auto}header,.section-title{display:flex;align-items:center;gap:15px;justify-content:space-between}h1{margin:0;font-size:24px}header p,.panel p,small{color:#91a2b4}.hero{margin:22px 0;background:linear-gradient(110deg,#15372f,#172a3b);border:1px solid #285447;border-radius:14px;padding:25px;display:flex;justify-content:space-between;align-items:center;gap:20px}.hero h2{font-size:42px;margin:8px 0}.positive{color:#31df91!important}.negative{color:#ff6572!important}.neutral{color:#aab7c5}.stats,.columns{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin:15px 0}.stats article,.panel{background:#121d29;border:1px solid #273646;border-radius:12px;padding:17px}.stats b{display:block;font-size:23px;margin-top:10px}.panel{margin:15px 0}.columns{grid-template-columns:1.2fr .8fr}.exchanges{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.source{background:#0d1721;padding:10px;border-radius:8px;color:#dbe6ef}.source span{float:right;color:#91a2b4;font-size:11px}input,select,button{background:#0d1721;color:#eef4f8;border:1px solid #304253;border-radius:7px;padding:10px}label input{display:block;margin-top:8px;width:150px}.scroll{overflow:auto}table{width:100%;border-collapse:collapse;white-space:nowrap}th,td{text-align:left;padding:13px;border-bottom:1px solid #273646}th{color:#91a2b4;font-size:11px}.columns small,footer{color:#7e90a3}footer{padding:15px}@media(max-width:800px){body{display:block}aside{display:none;position:fixed;z-index:2;min-height:0;width:250px}aside.open{display:block}main{padding:14px}header h1{font-size:19px}header p{font-size:11px}.hero{align-items:flex-start;flex-direction:column}.stats{grid-template-columns:1fr 1fr}.stats article:last-child{grid-column:span 2}.columns{grid-template-columns:1fr}.exchanges{grid-template-columns:1fr 1fr}.section-title{flex-wrap:wrap}}/* Correção do menu lateral no celular */
@media(max-width:800px){
  aside.open{
    display:block;
    position:fixed;
    top:0;
    left:0;
    bottom:0;
    width:250px;
    height:100vh;
    overflow-y:auto;
    z-index:1001;
  }

  .menu-backdrop{
    position:fixed;
    inset:0;
    background:rgba(0,0,0,.65);
    z-index:1000;
  }
}
