body{max-width:520px;margin:0 auto;min-height:100vh}
.entrar{min-height:100vh;padding:28px 22px 30px;text-align:center;
  background:radial-gradient(ellipse at 80% 0,rgba(255,184,0,.18),transparent 55%),repeating-linear-gradient(115deg,transparent 0 50px,rgba(255,255,255,.018) 50px 51px),#09090b}
.entrar .logo{width:92%;max-width:360px;margin-top:10px}
.slogan{font-family:'Saira Condensed','Arial Narrow',Impact,sans-serif;font-style:italic;font-weight:800;font-size:27px;line-height:1.05;margin:14px 0 24px;transform:rotate(-3deg)}
.slogan b{color:var(--am)}
.campos{display:grid;gap:13px}
.campo{display:flex;align-items:center;gap:10px;background:rgba(30,31,36,.9);border:1px solid var(--linha);border-radius:16px;padding:4px 16px}
.campo input{border:0;background:transparent;padding:13px 0;font-size:16px}
.campo span{color:#ddd;display:flex}
.grande{padding:15px;font-size:18px;border-radius:16px}
.ou{display:flex;align-items:center;gap:14px;color:var(--sub);margin:16px 0}.ou::before,.ou::after{content:'';flex:1;height:1px;background:var(--linha)}
.atalhos-login{display:grid;grid-template-columns:repeat(4,1fr);margin:26px 0 22px}
.atalhos-login div{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:13px;border-right:1px solid var(--linha)}
.atalhos-login div:last-child{border:0}.atalhos-login span{color:var(--am)}
.faixa-clube{display:flex;align-items:center;gap:14px;justify-content:center;padding:16px;border-radius:16px;background:linear-gradient(100deg,var(--am) 0 18%,#151515 18.2%);text-align:left}
.faixa-clube .trofeu{font-size:30px;margin-right:18px}.faixa-clube b{font-size:24px;display:block}.faixa-clube i{color:var(--am);font-size:17px}

.topo{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;padding-top:max(12px,env(safe-area-inset-top));background:rgba(9,9,11,.94);backdrop-filter:blur(8px)}
.logo-topo{height:42px}
.topo h1{font-size:19px;flex:1;text-align:center}
.ico{background:none;border:0;color:var(--txt);display:flex;padding:6px;cursor:pointer;position:relative}
.sino{color:var(--txt)}.sino b{position:absolute;top:0;right:0;background:var(--verm);color:#fff;font-size:10px;border-radius:99px;min-width:17px;height:17px;display:grid;place-items:center}
#tela{padding:6px 16px 100px}
.abas-baixo{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:520px;display:grid;grid-template-columns:repeat(5,1fr);background:#111114;border-top:1px solid var(--linha);padding:8px 4px max(10px,env(safe-area-inset-bottom));z-index:20}
.abas-baixo a{display:flex;flex-direction:column;align-items:center;gap:3px;font-size:11px;color:#8d8e96;font-weight:600}
.abas-baixo a.on{color:var(--am)}
.ola{display:flex;align-items:center;gap:12px;margin:6px 0 16px}
.ola .avatar{width:52px;height:52px;border-radius:50%;background:linear-gradient(135deg,var(--am2),var(--am));color:#000;display:grid;place-items:center;font-weight:800;font-size:22px}
.ola h2{font-size:21px}
.cartao-moto{display:flex;gap:14px;align-items:center}
.cartao-moto .ic{width:62px;height:62px;border-radius:16px;background:var(--card2);display:grid;place-items:center;color:var(--am);flex-shrink:0}
.secao{margin:20px 0 10px;display:flex;justify-content:space-between;align-items:center}
.secao h3{font-size:16px}
.grade-atalhos{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.grade-atalhos a{background:var(--card);border:1px solid var(--linha);border-radius:14px;padding:14px 6px;display:flex;flex-direction:column;align-items:center;gap:7px;color:var(--txt);font-size:12.5px;font-weight:600;text-align:center}
.grade-atalhos a span{color:var(--am)}
.lst{background:var(--card);border:1px solid var(--linha);border-radius:16px;overflow:hidden}
.lst>a,.lst>div{display:flex;align-items:center;gap:12px;padding:14px;border-bottom:1px solid var(--linha);color:var(--txt)}
.lst>*:last-child{border:0}
.seta{color:var(--sub);margin-left:auto}
.cartao-clube{border-radius:20px;padding:22px;position:relative;overflow:hidden;background:linear-gradient(135deg,#1c1c1f 0%,#0d0d0f 60%),#000;border:1px solid #3a2e08}
.cartao-clube>*{position:relative;z-index:1}
.cartao-clube::before{content:'';position:absolute;right:-110px;opacity:.85;top:-30px;width:200px;height:240px;background:linear-gradient(120deg,transparent 30%,var(--am) 31%,var(--am) 40%,transparent 41%,transparent 50%,rgba(255,184,0,.5) 51%,rgba(255,184,0,.5) 55%,transparent 56%)}
.cartao-clube .t{font-family:'Saira Condensed','Arial Narrow',Impact,sans-serif;font-style:italic;font-weight:900;font-size:34px;line-height:1}
.cartao-clube .t b{color:var(--am)}
.pts{font-size:46px;font-weight:800;letter-spacing:-.02em}.pts small{font-size:20px;color:var(--am)}
.horas{display:grid;grid-template-columns:repeat(4,1fr);gap:8px}
.horas button{padding:11px 0;border-radius:12px;border:1px solid var(--linha);background:var(--card);font-weight:700;cursor:pointer}
.horas button.on{background:var(--am);color:#000;border-color:var(--am)}
.passo{display:flex;align-items:center;gap:10px;margin:18px 0 8px;font-weight:700}
.passo i{width:24px;height:24px;border-radius:50%;background:var(--am);color:#000;font-style:normal;display:grid;place-items:center;font-size:12px}
.trilha-v .e{display:flex;gap:12px;position:relative;padding-bottom:18px}
.trilha-v .e::before{content:'';position:absolute;left:13px;top:28px;bottom:0;width:2px;background:var(--linha)}
.trilha-v .e:last-child::before{display:none}
.trilha-v .e i{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;font-style:normal;background:#2c2d33;color:#888;flex-shrink:0;font-size:13px}
.trilha-v .e.ok i{background:var(--verde);color:#fff}.trilha-v .e.at i{background:var(--am);color:#000;box-shadow:0 0 0 5px rgba(255,184,0,.18)}
.vant{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;text-align:center;font-size:12px}
.vant div{display:flex;flex-direction:column;align-items:center;gap:6px}.vant span{font-size:26px}
