@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@400;500;600;700&display=swap');
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Plus Jakarta Sans',sans-serif;background:#f0f2f7;font-size:13px;height:100vh;overflow:hidden;display:flex;flex-direction:column}
#loading{display:flex;align-items:center;justify-content:center;flex:1;flex-direction:column;gap:14px;color:#8899bb}
.spin{width:38px;height:38px;border:3px solid #e0e4f0;border-top-color:#4f8ef7;border-radius:50%;animation:spin 1s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
#app{display:none;flex-direction:row;flex:1;overflow:hidden}
.sidebar{width:62px;background:#0f1c3f;display:flex;flex-direction:column;align-items:center;padding:14px 0;gap:6px;flex-shrink:0}
.logo{color:#4f8ef7;font-weight:700;font-size:11px;text-align:center;line-height:1.2;margin-bottom:6px}
.nav{width:42px;height:42px;border-radius:10px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;color:#8899bb;gap:2px;transition:.15s;border:none;background:none}
.nav:hover,.nav.on{background:#1e3166;color:#fff}
.nav svg{width:18px;height:18px}
.nav span{font-size:7px;font-weight:500}
.main{flex:1;display:flex;flex-direction:column;min-width:0;overflow:hidden}
.topbar{background:#fff;padding:12px 18px;display:flex;align-items:center;gap:12px;border-bottom:1px solid #eaedf5;flex-shrink:0}
.ttag{color:#4f8ef7;font-size:9px;font-weight:700;letter-spacing:1.2px;text-transform:uppercase}
.th1{font-size:17px;font-weight:700;color:#0f1c3f;line-height:1.1}
.tsub{font-size:10px;color:#8899bb;margin-top:1px}
.sp{flex:1}
.frow{display:flex;gap:6px;align-items:center}
.fc{background:#f5f7ff;border:1px solid #e0e4f0;border-radius:7px;padding:5px 10px;font-size:10px;color:#3a4a6b;white-space:nowrap;cursor:default}
.date-filter{display:flex;align-items:center;gap:5px;background:#f5f7ff;border:1px solid #e0e4f0;border-radius:7px;padding:4px 8px}
.date-ico{font-size:11px}
.date-input{border:none;background:transparent;font-size:10px;color:#3a4a6b;font-family:inherit;cursor:pointer;outline:none;padding:1px 2px}
.date-input:hover{color:#4f8ef7}
.date-sep{font-size:9px;color:#8899bb}
.date-clear{border:none;background:#e8edff;color:#4f8ef7;width:16px;height:16px;border-radius:4px;font-size:9px;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0;transition:.15s}
.date-clear:hover{background:#fff1f1;color:#ef4444}
.ub{background:#f0f5ff;border:1px solid #d0deff;border-radius:7px;padding:5px 10px;font-size:10px;color:#4f8ef7;white-space:nowrap;display:flex;align-items:center;gap:5px;cursor:pointer;transition:.15s}
.ub:hover{background:#ddeaff}
.content{flex:1;padding:12px;display:flex;flex-direction:column;gap:10px;overflow-y:auto}
.krow{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;flex-shrink:0}
.kpi{background:#fff;border-radius:11px;padding:11px 12px;display:flex;align-items:center;gap:9px;border:1px solid #eef0f8;transition:.2s}
.kpi:hover{box-shadow:0 3px 14px rgba(0,0,0,.07);transform:translateY(-1px)}
.ki{width:34px;height:34px;border-radius:9px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.ki svg{width:16px;height:16px}
.kv{font-size:21px;font-weight:700;line-height:1;color:#0f1c3f}
.kl{font-size:9px;color:#8899bb;font-weight:600;margin-bottom:2px;text-transform:uppercase;letter-spacing:.4px}
.ks{font-size:9px;margin-top:2px}
.bg-blue{background:#eff4ff}.c-blue{color:#4f8ef7}
.bg-green{background:#edfff5}.c-green{color:#22c55e}
.bg-amber{background:#fffbeb}.c-amber{color:#f59e0b}
.bg-slate{background:#f1f5fb}.c-slate{color:#64748b}
.bg-red{background:#fff1f1}.c-red{color:#ef4444}
.bg-purple{background:#f5f0ff}.c-purple{color:#8b5cf6}
.crow{display:grid;grid-template-columns:1fr 1.05fr 1fr 1.1fr 1fr;gap:8px;flex-shrink:0}
.crow2{display:grid;grid-template-columns:1fr;gap:8px;flex-shrink:0}
.card{background:#fff;border-radius:11px;padding:13px;border:1px solid #eef0f8}
.ct{font-size:11px;font-weight:700;color:#0f1c3f;margin-bottom:9px;letter-spacing:.1px}
.dw{position:relative;width:118px;height:118px;margin:0 auto}
.dc{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);text-align:center;pointer-events:none}
.dcv{font-size:20px;font-weight:700;color:#0f1c3f}
.dcl{font-size:8px;color:#8899bb;margin-top:1px}
.leg{display:flex;flex-direction:column;gap:5px;margin-top:9px}
.li{display:flex;align-items:center;gap:6px;font-size:9px;color:#3a4a6b}
.ld{width:7px;height:7px;border-radius:50%;flex-shrink:0}
.hr{display:flex;align-items:center;gap:6px;margin-bottom:7px}
.hl{font-size:9px;color:#3a4a6b;width:60px;flex-shrink:0;text-align:right;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ht{flex:1;height:14px;background:#f0f2f7;border-radius:5px;overflow:hidden}
.hf{height:100%;border-radius:5px;transition:width .6s ease}
.hv{font-size:9px;font-weight:600;color:#0f1c3f;width:26px;text-align:right}
.brow{display:grid;grid-template-columns:1fr 265px;gap:8px}
.tc{background:#fff;border-radius:11px;padding:13px;border:1px solid #eef0f8}
table{width:100%;border-collapse:collapse}
th{padding:7px 8px;text-align:left;font-size:9px;font-weight:600;color:#8899bb;text-transform:uppercase;letter-spacing:.4px;border-bottom:2px solid #f0f2f7}
td{padding:6px 8px;font-size:10px;color:#3a4a6b;border-bottom:1px solid #f5f7fb}
tr:last-child td{border-bottom:none}
tbody tr:hover td{background:#fafbff}
.b{padding:2px 8px;border-radius:5px;font-size:8px;font-weight:700;display:inline-block;letter-spacing:.2px}
.bg{background:#edfff5;color:#16a34a}
.bb{background:#eff4ff;color:#3b6fd4}
.ba{background:#fffbeb;color:#b45309}
.br{background:#fff1f1;color:#dc2626}
.rn{color:#c0c8d8;font-size:9px;text-align:center;font-weight:500}
.hc{background:#fff;border-radius:11px;padding:13px;border:1px solid #eef0f8;display:flex;flex-direction:column;gap:8px}
.hi{display:flex;align-items:center;gap:9px;padding:8px 10px;border-radius:9px;background:#f8f9fe;border:1px solid #eef0f8}
.hic{width:30px;height:30px;border-radius:8px;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.hic svg{width:14px;height:14px}
.hil{font-size:9px;color:#8899bb;font-weight:500}
.hiv{font-size:16px;font-weight:700;color:#0f1c3f;line-height:1;margin-top:1px}
.hsm{margin-left:auto}
.pg{margin-bottom:12px}
.pg:last-child{margin-bottom:0}
.pgh{display:flex;align-items:center;justify-content:space-between;padding:7px 10px;background:#f5f0ff;border-radius:8px 8px 0 0;border:1px solid #ece4ff;border-bottom:none}
.pgn{font-size:11px;font-weight:700;color:#0f1c3f;display:flex;align-items:center;gap:6px}
.pgn .dot{width:8px;height:8px;border-radius:2px;background:#8b5cf6}
.pgh-hrs{font-size:10px;font-weight:700;color:#8b5cf6;background:#fff;padding:2px 9px;border-radius:20px;border:1px solid #ece4ff}
.pg table{border:1px solid #f0f2f7;border-radius:0 0 8px 8px;overflow:hidden}
.pg th{padding:5px 8px;font-size:8px}
.pg td{padding:5px 8px}
/* Nova seção */
.new-row{display:grid;grid-template-columns:1fr 1.6fr;gap:8px}
.tipo-card{background:#fff;border-radius:11px;padding:13px;border:1px solid #eef0f8}
.aberto-card{background:#fff;border-radius:11px;padding:13px;border:1px solid #eef0f8}
.eq-group{margin-bottom:10px;border:1px solid #eef0f8;border-radius:9px;overflow:hidden}
.eq-group:last-child{margin-bottom:0}
.eq-header{display:flex;align-items:center;justify-content:space-between;padding:7px 11px;background:#f8f9fe;cursor:pointer;user-select:none;transition:.15s}
.eq-header:hover{background:#f0f4ff}
.eq-name{font-size:11px;font-weight:700;color:#0f1c3f;display:flex;align-items:center;gap:7px}
.eq-avatar{width:22px;height:22px;border-radius:50%;background:linear-gradient(135deg,#4f8ef7,#8b5cf6);color:#fff;font-size:9px;font-weight:700;display:flex;align-items:center;justify-content:center;flex-shrink:0}
.eq-badges{display:flex;gap:5px;align-items:center}
.eq-count{font-size:9px;font-weight:700;color:#4f8ef7;background:#eff4ff;padding:2px 8px;border-radius:10px}
.eq-arrow{font-size:10px;color:#8899bb;transition:.2s}
.eq-arrow.open{transform:rotate(180deg)}
.eq-body{display:none;border-top:1px solid #f0f2f7;max-height:340px;overflow-y:auto}
/* Botão olho */
.eye-btn{cursor:pointer;font-size:13px;opacity:0.55;transition:.15s;display:inline-block;padding:2px 4px;border-radius:5px}
.eye-btn:hover{opacity:1;background:#eff4ff;transform:scale(1.15)}
/* Modal */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(15,28,63,0.55);z-index:1000;align-items:center;justify-content:center;padding:24px;backdrop-filter:blur(2px)}
.modal-overlay.open{display:flex}
.modal{background:#fff;border-radius:16px;max-width:560px;width:100%;max-height:85vh;overflow-y:auto;box-shadow:0 20px 60px rgba(0,0,0,.25);animation:modalIn .2s ease}
@keyframes modalIn{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
.modal-header{padding:20px 22px 16px;border-bottom:1px solid #f0f2f7;display:flex;align-items:flex-start;justify-content:space-between;gap:12px}
.modal-title{font-size:15px;font-weight:700;color:#0f1c3f;line-height:1.35}
.modal-close{background:#f5f7fb;border:none;width:30px;height:30px;border-radius:8px;cursor:pointer;font-size:16px;color:#8899bb;flex-shrink:0;display:flex;align-items:center;justify-content:center;transition:.15s}
.modal-close:hover{background:#fff1f1;color:#ef4444}
.modal-body{padding:18px 22px 22px}
.modal-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:16px}
.modal-field{background:#f8f9fe;border:1px solid #eef0f8;border-radius:9px;padding:9px 12px}
.modal-field-lbl{font-size:9px;color:#8899bb;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:3px}
.modal-field-val{font-size:12px;color:#0f1c3f;font-weight:600}
.modal-desc-lbl{font-size:9px;color:#8899bb;font-weight:600;text-transform:uppercase;letter-spacing:.5px;margin-bottom:6px}
.modal-desc{font-size:12px;color:#3a4a6b;line-height:1.6;background:#f8f9fe;border:1px solid #eef0f8;border-radius:9px;padding:12px 14px;white-space:pre-wrap;word-break:break-word}
.modal-desc.empty{color:#b0bace;font-style:italic}
.eq-body.open{display:block}
.eq-body table{width:100%}
.eq-body th{padding:5px 8px;font-size:8px;font-weight:600;color:#8899bb;text-transform:uppercase;border-bottom:1px solid #f0f2f7}
.eq-body td{padding:5px 8px;font-size:10px;color:#3a4a6b;border-bottom:1px solid #f9f9fb}
.eq-body tr:last-child td{border-bottom:none}
.tipo-chip{padding:2px 7px;border-radius:4px;font-size:8px;font-weight:700}
.tipo-melhoria{background:#eff4ff;color:#3b6fd4}
.tipo-funcionalidade{background:#edfff5;color:#16a34a}
.tipo-correcao{background:#fff1f1;color:#dc2626}
.tipo-outro{background:#f1f5fb;color:#64748b}
/* Badges de status da task */
.st-chip{padding:2px 7px;border-radius:4px;font-size:8px;font-weight:700;white-space:nowrap;display:inline-block}
.st-progresso{background:#eff4ff;color:#3b6fd4}
.st-concluido{background:#edfff5;color:#16a34a}
.st-validacao{background:#fef3ff;color:#a21caf}
.st-pendente{background:#fffbeb;color:#b45309}
.st-observacao{background:#fff7ed;color:#c2410c}
.st-outro{background:#f1f5f9;color:#475569}
/* Seção de histórico */
.hist-section{background:#fff;border-radius:11px;padding:13px;border:1px solid #eef0f8;margin-top:2px}
.hist-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;flex-wrap:wrap;gap:8px}
.hist-controls{display:flex;align-items:center;gap:8px}
.hist-select{background:#f5f7ff;border:1px solid #e0e4f0;border-radius:7px;padding:4px 9px;font-size:10px;color:#3a4a6b;font-family:inherit;cursor:pointer;outline:none}
.hist-hint{font-size:9px;color:#8899bb}
.hist-empty{padding:24px;text-align:center;font-size:11px;color:#8899bb;font-style:italic}