*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;background:#070a10;color:#f5f7fb}body{overflow-x:hidden}.bg{position:fixed;inset:0;overflow:hidden;pointer-events:none;background:radial-gradient(circle at 15% 10%,rgba(37,99,235,.16),transparent 30%),radial-gradient(circle at 85% 25%,rgba(239,68,68,.12),transparent 28%),#070a10}.bg i{position:absolute;width:280px;height:280px;border-radius:50%;border:1px solid rgba(255,255,255,.04);animation:float 12s ease-in-out infinite}.bg i:nth-child(1){left:-100px;top:20%;animation-delay:-2s}.bg i:nth-child(2){right:-120px;top:55%;width:360px;height:360px;animation-delay:-6s}.bg i:nth-child(3){left:45%;bottom:-180px;width:300px;height:300px;animation-delay:-9s}@keyframes float{50%{transform:translateY(-24px) scale(1.04)}}
.app{position:relative;width:min(760px,calc(100% - 24px));margin:0 auto;padding:24px 0 40px}.top{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:18px}.brand{font-size:28px;font-weight:900;letter-spacing:2px}.brand span{font-weight:500}.top p{margin:5px 0 0;color:#8993a7;font-size:13px}.badge{font-size:10px;font-weight:800;letter-spacing:1px;padding:8px 10px;border:1px solid #263044;border-radius:999px;color:#9aa6bb;background:#101621}.signal-card{position:relative;overflow:hidden;text-align:center;padding:34px 20px 28px;border:1px solid #222b3d;border-radius:26px;background:linear-gradient(145deg,rgba(17,24,39,.96),rgba(8,12,19,.96));box-shadow:0 20px 60px rgba(0,0,0,.35);animation:cardIn .5s ease}.signal-card:before{content:"";position:absolute;inset:-2px;background:conic-gradient(from 180deg,transparent,rgba(59,130,246,.2),transparent,rgba(239,68,68,.18),transparent);animation:spin 8s linear infinite;z-index:0}.signal-card>*{position:relative;z-index:1}@keyframes spin{to{transform:rotate(360deg)}}@keyframes cardIn{from{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}.eyebrow{font-size:11px;letter-spacing:2px;color:#7f8ba0;font-weight:800}.signal{font-size:clamp(27px,7vw,46px);font-weight:950;letter-spacing:-1px;margin:10px 0 8px;min-height:55px}.signal.azul{color:#60a5fa;text-shadow:0 0 28px rgba(59,130,246,.4)}.signal.vermelho{color:#fb7185;text-shadow:0 0 28px rgba(239,68,68,.4)}.signal.pulse{animation:pulse .55s ease}@keyframes pulse{50%{transform:scale(1.05)}}.pattern{color:#aab4c6;font-size:14px;min-height:20px}.force{margin-top:7px;font-size:12px;color:#7f8ba0}.meter{height:5px;background:#151c28;border-radius:99px;overflow:hidden;margin:20px auto 0;max-width:420px}.meter span{display:block;height:100%;width:0;border-radius:inherit;background:linear-gradient(90deg,#3b82f6,#22c55e);transition:width .5s ease}.input-card,.panel{margin-top:16px;padding:18px;border:1px solid #1d2635;border-radius:22px;background:rgba(12,17,27,.88);backdrop-filter:blur(12px)}.section-title{font-size:13px;font-weight:850;letter-spacing:.4px}.buttons{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:13px}.result-btn{border:1px solid #293348;border-radius:17px;padding:15px 8px;background:#101722;color:#fff;cursor:pointer;transition:.2s transform,.2s box-shadow,.2s border-color;display:flex;flex-direction:column;gap:5px;align-items:center}.result-btn b{font-size:27px}.result-btn span{font-size:11px;font-weight:850;letter-spacing:1px}.result-btn:hover{transform:translateY(-3px)}.azul:hover{border-color:#3b82f6;box-shadow:0 10px 30px rgba(59,130,246,.18)}.vermelho:hover{border-color:#ef4444;box-shadow:0 10px 30px rgba(239,68,68,.18)}.empate:hover{border-color:#aab4c6;box-shadow:0 10px 30px rgba(255,255,255,.08)}.result-btn:active{transform:scale(.97)}.clear{width:100%;margin-top:10px;border:0;background:transparent;color:#69758a;padding:8px;cursor:pointer;font-size:12px}.clear:hover{color:#fff}.stats{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}.stat{border:1px solid #1d2635;border-radius:20px;padding:16px;text-align:center;background:#0c111b;position:relative;overflow:hidden}.stat:after{content:"";position:absolute;inset:auto 0 0;height:2px;background:currentColor;opacity:.7}.stat strong{display:block;font-size:32px;line-height:1}.stat span{display:block;margin-top:6px;font-size:10px;font-weight:900;letter-spacing:1.5px;color:#8490a4}.green{color:#4ade80}.red{color:#fb7185}.panel-head{display:flex;align-items:center;justify-content:space-between;gap:10px}.panel-head small{color:#6f7a8e;font-size:11px}.library{font-size:10px;color:#718096;padding:7px 9px;border-radius:999px;background:#101621}.history{display:flex;flex-wrap:wrap;gap:7px;margin-top:14px;min-height:43px}.result{width:36px;height:36px;display:grid;place-items:center;border-radius:11px;background:#111827;border:1px solid #263044;font-size:18px;animation:pop .25s ease}@keyframes pop{from{opacity:0;transform:scale(.65)}to{opacity:1;transform:scale(1)}}.result.A{border-color:rgba(59,130,246,.4)}.result.R{border-color:rgba(239,68,68,.4)}.result.E{border-color:rgba(255,255,255,.2)}.empty{color:#5d687b;font-size:12px;padding:12px 0}.rules-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-top:13px}.rules-grid div{padding:12px 8px;border-radius:14px;background:#0b1019;border:1px solid #182131;text-align:center}.rules-grid b{display:block;font-size:13px}.rules-grid span{display:block;color:#68758a;font-size:9px;margin-top:4px}@media(max-width:560px){.app{width:min(100% - 16px,760px);padding-top:16px}.buttons{gap:7px}.result-btn{padding:13px 5px}.rules-grid{grid-template-columns:1fr 1fr}.top p{font-size:11px}.badge{display:none}}
