:root{
  --bg:#0C0C0E; --surface:#141418; --surface2:#1B1B20; --border:#26262C;
  --text:#EDEDEA; --muted:#A3A39B; --muted2:#6E6E68;
  --green:#22C55E; --amber:#F59E0B; --red:#EF4444;
  --display:'Inter',sans-serif; --mono:'JetBrains Mono',monospace;
}
*{margin:0;padding:0;box-sizing:border-box}
html{scroll-behavior:smooth}
body{background:var(--bg);color:var(--text);font-family:var(--display);font-size:15px;line-height:1.55;-webkit-font-smoothing:antialiased;min-height:100vh}
::selection{background:var(--green);color:var(--bg)}
a{color:inherit;text-decoration:none}

.dot{display:inline-block;width:9px;height:9px;border-radius:50%;background:var(--green);flex:none}
.dot.amber{background:var(--amber)} .dot.red{background:var(--red)} .dot.off{background:var(--border)}
.dot.pulse{animation:pulse 2.4s ease-in-out infinite}
@keyframes pulse{0%,100%{box-shadow:0 0 0 0 rgba(34,197,94,.45)}55%{box-shadow:0 0 0 7px rgba(34,197,94,0)}}
@media (prefers-reduced-motion:reduce){.dot.pulse{animation:none}}

.statusbar{position:sticky;top:0;z-index:50;display:flex;align-items:center;gap:12px;flex-wrap:wrap;
  padding:12px 24px;background:rgba(12,12,14,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);
  font-family:var(--mono);font-size:12px;color:var(--muted)}
.statusbar b{color:var(--green);font-weight:500}
.statusbar .sep{color:var(--muted2)}
.statusbar .right{margin-left:auto;color:var(--muted2)}
.statusbar a:hover{color:var(--green)}

.wrap{max-width:1400px;margin:0 auto;padding:0 24px}
.wrap.narrow{max-width:860px}
.eyebrow{font-family:var(--mono);font-size:11.5px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted);margin-bottom:10px}
h1{font-weight:800;letter-spacing:-.03em;line-height:1.02;font-size:clamp(30px,5vw,52px)}
h1 .accent,h2 .accent{color:var(--green)}
h2{font-weight:800;letter-spacing:-.02em;line-height:1.1;font-size:clamp(20px,3vw,28px)}
h3{font-weight:700;font-size:15px;letter-spacing:-.01em}
.sub{color:var(--muted);max-width:64ch;margin-top:10px}
.hairline{height:1px;background:var(--border);position:relative;margin:28px 0}
.hairline::before{content:"";position:absolute;left:0;top:0;height:1px;width:72px;background:var(--green)}
.mono{font-family:var(--mono)}
.muted{color:var(--muted)} .muted2{color:var(--muted2)}
.k{font-family:var(--mono);font-size:10.5px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted2)}

header.top{padding:36px 0 22px}
.metrics{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin-top:22px}
.metric{background:var(--surface);border:1px solid var(--border);padding:14px 16px}
.metric .v{font-weight:800;font-size:28px;letter-spacing:-.02em;margin-top:4px;line-height:1.1}
.metric .v small{font-size:13px;font-weight:700;color:var(--muted)}

/* kanban */
.board{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(250px,1fr);gap:12px;overflow-x:auto;padding:8px 0 40px;scroll-snap-type:x proximity}
.col{background:var(--surface);border:1px solid var(--border);min-height:420px;display:flex;flex-direction:column;scroll-snap-align:start}
.col-h{display:flex;align-items:center;gap:10px;padding:14px 14px 12px;border-bottom:1px solid var(--border)}
.col-h .n{font-family:var(--mono);font-size:11px;color:var(--muted2);letter-spacing:.1em}
.col-h h3{font-size:14px}
.col-h .cnt{margin-left:auto;font-family:var(--mono);font-size:11.5px;color:var(--muted);border:1px solid var(--border);padding:2px 8px}
.col-h .cnt.on{color:var(--green);border-color:var(--green)}
.col-d{font-family:var(--mono);font-size:10.5px;color:var(--muted2);padding:8px 14px;border-bottom:1px solid var(--border);line-height:1.5}
.cards{display:flex;flex-direction:column;gap:8px;padding:10px}
.card{display:block;background:var(--bg);border:1px solid var(--border);padding:12px 12px 10px;transition:border-color .15s}
.card:hover{border-color:var(--green)}
.card .nm{font-weight:700;font-size:15px;letter-spacing:-.01em;display:flex;align-items:center;gap:8px}
.card .nm .arr{margin-left:auto;color:var(--green);font-weight:400}
.card .emp{font-family:var(--mono);font-size:11px;color:var(--muted2);margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.chips{display:flex;flex-wrap:wrap;gap:4px;margin-top:8px}
.chip{font-family:var(--mono);font-size:9.5px;letter-spacing:.08em;text-transform:uppercase;border:1px solid var(--border);color:var(--muted);padding:2px 6px}
.chip.wa{border-color:#25D36655;color:#4ade80}
.chip.ig{border-color:#E1306C55;color:#f472b6}
.chip.fb,.chip.fl{border-color:#1877F255;color:#93c5fd}
.chip.mk{border-color:var(--amber);color:var(--amber)}
.card .meta{display:flex;gap:10px;flex-wrap:wrap;font-family:var(--mono);font-size:10.5px;color:var(--muted2);margin-top:9px}
.card .meta b{color:var(--muted);font-weight:500}
.card .pend{font-family:var(--mono);font-size:10.5px;color:var(--amber);margin-top:6px}
.col.empty .cards::after{content:"vazio";font-family:var(--mono);font-size:11px;color:var(--muted2);padding:18px 4px;text-align:center}

/* stepper */
.steps{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-top:22px}
.step{border:1px solid var(--border);background:var(--surface);padding:12px 12px 10px;position:relative;min-height:96px}
.step .sn{font-family:var(--mono);font-size:10px;letter-spacing:.12em;color:var(--muted2)}
.step .st{font-weight:700;font-size:13px;margin-top:6px;line-height:1.25}
.step .sd{font-family:var(--mono);font-size:10.5px;color:var(--muted2);margin-top:6px}
.step.done{border-color:rgba(34,197,94,.45)} .step.done .sn,.step.done .st{color:var(--green)}
.step.now{border-color:var(--green);background:var(--surface2)} .step.now .st{color:var(--text)}
.step.now::before{content:"";position:absolute;left:0;top:0;height:2px;width:100%;background:var(--green)}
.step.todo .st{color:var(--muted2)}
.step .dotrow{display:flex;align-items:center;gap:6px;margin-top:8px}
@media (max-width:760px){.steps{grid-template-columns:repeat(2,1fr)}}

/* detail */
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-top:20px}
@media (max-width:760px){.grid2{grid-template-columns:1fr}}
.box{background:var(--surface);border:1px solid var(--border);padding:16px 18px}
.box.amber{border-color:rgba(245,158,11,.5)}
.box.green{border-color:rgba(34,197,94,.45)}
.box h3{display:flex;align-items:center;gap:8px;margin-bottom:10px}
.box ul{list-style:none}
.box li{padding:7px 0;border-top:1px solid var(--border);font-size:14px}
.box li:first-child{border-top:0}
.chk{display:grid;grid-template-columns:auto 1fr auto;gap:8px 12px;align-items:baseline}
.chk .lab{font-family:var(--mono);font-size:11px;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.chk .val{font-size:14px}
.chk .when{font-family:var(--mono);font-size:10.5px;color:var(--muted2)}
.ok{color:var(--green)} .no{color:var(--red)} .na{color:var(--muted2)}
.timeline li{display:grid;grid-template-columns:72px 1fr;gap:12px}
.timeline .when{font-family:var(--mono);font-size:11px;color:var(--muted2);padding-top:2px}
.btnrow{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}
.btn{font-family:var(--mono);font-size:11.5px;letter-spacing:.1em;text-transform:uppercase;border:1px solid var(--border);color:var(--muted);padding:10px 14px;display:inline-block}
.btn:hover{border-color:var(--green);color:var(--green)}
.btn.solid{background:var(--green);color:var(--bg);border-color:var(--green);font-weight:700}
.btn.solid:hover{background:#16a34a;color:var(--bg)}

/* client page */
.client{padding:44px 0 60px}
.client .big{margin-top:26px}
.client .steps{margin-top:30px}
.now-text{background:var(--surface);border:1px solid var(--green);padding:18px 20px;margin-top:22px;font-size:16px}
.now-text .k{color:var(--green);margin-bottom:6px}
footer{border-top:1px solid var(--border);margin-top:40px;padding:18px 0;font-family:var(--mono);font-size:11px;color:var(--muted2);display:flex;gap:14px;flex-wrap:wrap;align-items:center}
footer b{color:var(--muted);font-weight:500}
footer .rule{height:1px;background:var(--border);flex:1;position:relative;min-width:60px}
footer .rule::before{content:"";position:absolute;left:0;top:0;height:1px;width:72px;background:var(--green)}