:root {
  --bg: #f5f6f8; --card: #fff; --text: #1d2330; --muted: #6b7280; --line: #e5e7eb;
  --primary: #4f46e5; --primary-ink: #fff; --danger: #dc2626; --ok-bg: #ecfdf5; --ok: #047857;
  --err-bg: #fef2f2; --fb: #1877f2; --ig: #c13584; --wa: #128c7e;
}
@media (prefers-color-scheme: dark) {
  :root { --bg: #0f1218; --card: #181c25; --text: #e7e9ee; --muted: #9aa3b2; --line: #2a3040;
    --ok-bg: #0f2a22; --ok: #6ee7b7; --err-bg: #2d1416; }
}
* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text);
  font: 15px/1.5 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif; }
a { color: var(--primary); }
.wrap { max-width: 1100px; margin: 0 auto; padding: 0 16px; }
main.wrap { padding-top: 20px; padding-bottom: 60px; }
h1 { font-size: 1.6rem; margin: .2em 0 .5em; }
h2 { font-size: 1.2rem; margin: 1.2em 0 .6em; }
.card h2:first-child { margin-top: 0; }
h3 { font-size: 1rem; margin: 1.2em 0 .5em; display: flex; gap: 10px; align-items: center; }
.top { background: var(--card); border-bottom: 1px solid var(--line); }
.bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 12px 16px; }
.brand { font-weight: 700; text-decoration: none; color: var(--text); }
nav { display: flex; flex-wrap: wrap; gap: 14px; align-items: center; }
nav a { text-decoration: none; color: var(--text); }
nav a:hover { color: var(--primary); }
.card { background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 18px; margin-bottom: 16px; }
.muted { color: var(--muted); }
small { display: block; margin-top: 4px; }
label { display: block; margin-bottom: 14px; font-weight: 600; }
label small { font-weight: 400; }
input, select, textarea { width: 100%; margin-top: 4px; padding: 9px 11px; border: 1px solid var(--line);
  border-radius: 8px; background: var(--bg); color: var(--text); font: inherit; }
textarea { resize: vertical; }
input[type=checkbox] { width: auto; margin: 0 6px 0 0; }
label.check { font-weight: 400; display: inline-flex; align-items: center; margin-right: 16px; }
fieldset { border: 1px solid var(--line); border-radius: 8px; margin: 0 0 14px; padding: 10px 14px; }
legend { font-weight: 600; padding: 0 4px; }
.btn { display: inline-block; padding: 9px 16px; border-radius: 8px; border: 1px solid var(--line);
  background: var(--card); color: var(--text); font: inherit; cursor: pointer; text-decoration: none; }
.btn:hover { border-color: var(--primary); }
.btn.primary { background: var(--primary); color: var(--primary-ink); border-color: var(--primary); }
.btn.danger { color: var(--danger); border-color: var(--danger); }
.btn.small { padding: 4px 10px; font-size: .85rem; }
.btn.full { width: 100%; }
.linkbtn { background: none; border: 0; color: var(--text); font: inherit; cursor: pointer; padding: 0; }
form.inline { display: inline; }
.row { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.row input { flex: 1 1 220px; margin: 0; }
.grid { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); margin-bottom: 16px; }
.grid2 { display: grid; gap: 14px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.grid3 { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); align-items: end; }
.grid3 > div { margin-bottom: 14px; }
.stats { display: grid; gap: 12px; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
.stat { text-decoration: none; color: var(--text); }
.stat b { display: block; font-size: 1.8rem; }
.stat span { color: var(--muted); }
.account-card { text-decoration: none; color: var(--text); }
.account-card h3 { margin-top: 0; }
.tag { display: inline-block; font-size: .75rem; padding: 2px 8px; border-radius: 99px; color: #fff; background: var(--muted); font-weight: 600; }
.tag.facebook { background: var(--fb); } .tag.instagram { background: var(--ig); } .tag.whatsapp { background: var(--wa); }
.tag.off { background: var(--muted); }
.table-wrap { overflow-x: auto; }
table { width: 100%; border-collapse: collapse; background: var(--card); }
th, td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--line); vertical-align: top; font-size: .9rem; }
th { color: var(--muted); font-weight: 600; }
tr.off { opacity: .55; }
td.clip { max-width: 280px; overflow-wrap: anywhere; }
td.err { color: var(--danger); }
.nowrap { white-space: nowrap; }
.actions { display: flex; flex-wrap: wrap; gap: 6px; }
.inline-details summary { list-style: none; }
.inline-details[open] { width: 100%; }
.inline-details form { margin-top: 8px; }
.flash { background: var(--ok-bg); color: var(--ok); padding: 10px 14px; border-radius: 8px; margin-bottom: 16px; }
.flash.error { background: var(--err-bg); color: var(--danger); }
.note { background: var(--bg); border-left: 3px solid var(--primary); padding: 10px 12px; border-radius: 6px; }
.filters { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.filters a { padding: 4px 12px; border: 1px solid var(--line); border-radius: 99px; text-decoration: none; color: var(--text); }
.filters a.on { background: var(--primary); color: #fff; border-color: var(--primary); }
.media-grid { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); }
.media-item img { width: 100%; height: 140px; object-fit: cover; border-radius: 8px; }
.media-item small { overflow-wrap: anywhere; margin: 6px 0; }
.login { max-width: 380px; margin: 60px auto; }
.narrow { max-width: 460px; }
.right { text-align: right; }
.danger-zone { border-color: var(--danger); }
code { font-size: .85rem; }
.brandbox { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.company-pill { font-size: .8rem; padding: 3px 10px; border-radius: 99px; background: var(--bg); border: 1px solid var(--line); }
.superbar { background: #fff7e6; border-top: 1px solid #f5d38a; color: #7a4b00; font-size: .9rem; }
.superbar .bar { padding: 6px 16px; }
@media (prefers-color-scheme: dark) { .superbar { background: #2b2210; border-color: #5c4513; color: #f3c868; } }
.tag.ok { background: var(--ok); }
.end { display: flex; align-items: end; margin-bottom: 14px; }
.card.flush { padding: 0; overflow: hidden; }
.card.flush table { border: 0; }
/* Bryntor Chat: sistema visual blanco, tinta y lima. */
:root{--accent:#c7f464;--ink:#101310}body{font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink);background:#f7f9f6}a{color:#315a14}.btn.primary,.cta{background:var(--accent);color:#101310;border-color:var(--accent)}.top{background:#fff;color:#101310}.top a{color:#101310}.card{border-radius:16px}.landing{background:white;margin:0 calc(50% - 50vw);min-height:100vh}.landing-nav,.hero,.steps,.closing,.landing-footer{max-width:1440px;margin:auto;padding-left:5%;padding-right:5%}.landing-nav{min-height:76px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #e1e5df}.wordmark{font-size:27px;letter-spacing:-1px;text-decoration:none;color:#111}.landing-nav nav{display:flex;gap:34px;align-items:center}.landing-nav nav a{text-decoration:none;color:#111;font-size:14px}.cta,.secondary{display:inline-flex;align-items:center;justify-content:center;gap:22px;text-decoration:none;padding:15px 24px;border-radius:10px;font-weight:650;font-size:16px}.cta:hover{background:#b4e64d}.secondary{color:#111;border:1px solid #111;background:white}.hero{display:grid;grid-template-columns:1fr 1.05fr;gap:40px;padding-top:58px;padding-bottom:60px;align-items:center}.hero h1{font-size:clamp(38px,4.2vw,64px);line-height:1.07;letter-spacing:-2.8px;margin:0 0 27px;font-weight:750}.hero p{font-size:21px;line-height:1.5;color:#5c615e;max-width:600px}.hero-actions{display:flex;gap:16px;margin-top:34px}.product-demo{border:1px solid #d8dfd8;border-radius:16px;box-shadow:0 18px 35px #1628170c;background:#f5f7f6;overflow:hidden}.windowbar{height:38px;display:flex;gap:7px;align-items:center;padding:0 14px;border-bottom:1px solid #e2e6e2}.windowbar i{height:10px;width:10px;border-radius:50%;background:#fa675e}.windowbar i:nth-child(2){background:#ffc151}.windowbar i:nth-child(3){background:#43c865}.windowbar span{margin-left:auto;font-size:11px;color:#677066}.demo-body{display:flex;min-height:260px}.demo-body aside{width:125px;background:white;display:flex;flex-direction:column;padding:20px 12px;gap:18px;flex-shrink:0;font-size:12px;border-right:1px solid #e3e7e3}.demo-body aside b{font-size:14px;margin-bottom:8px}.demo-body aside span{padding:8px}.selected{background:#eefece;border-radius:7px}.conversation{flex:1;padding:42px 20px 20px;display:flex;flex-direction:column;gap:20px}.message{font-size:14px;padding:17px;background:#fff;border-radius:12px;box-shadow:0 3px 12px #17261707}.incoming{align-self:flex-start}.outgoing{align-self:flex-end;background:#e0f9ae}.conversation-note{font-size:12px;color:#7c867d;text-align:center;margin-top:20px}.flow{background:white;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:22px 18px;border-top:1px solid #e1e5df}.flow b{font-size:12px}.flow small{display:block;font-size:10px;color:#69716a;margin-top:8px}.channel-strip{display:flex;justify-content:center;gap:0;border-block:1px solid #e1e5df;padding:23px}.channel-strip span{padding:0 40px;font-size:20px}.channel-strip span+span{border-left:1px solid #d9dfd7}.steps{padding-top:36px;padding-bottom:42px}.steps h2,.closing h2{font-size:clamp(26px,2.7vw,39px);letter-spacing:-1.2px;text-align:center;line-height:1.2;margin:0 0 38px}.steps-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px}.steps article{display:flex;gap:22px}.steps article+article{border-left:1px solid #dce2da;padding-left:30px}.steps article>span{display:grid;place-items:center;width:45px;height:45px;border-radius:50%;background:#edfccf;flex-shrink:0;font-size:19px;font-weight:700}.steps h3{font-size:22px;margin:7px 0 9px;letter-spacing:-.6px}.steps p{font-size:17px;line-height:1.5;color:#60665f;margin:0}.closing{text-align:center;border-top:1px solid #e1e5df;padding-top:30px;padding-bottom:28px}.closing h2{margin-bottom:20px}.landing-footer{text-align:center;padding-block:18px;font-size:12px;color:#777}.landing-footer a{margin-left:20px}a:focus-visible,button:focus-visible{outline:3px solid #4b741a;outline-offset:4px}.guide-list li{margin:14px 0;line-height:1.6}@media(max-width:850px){.hero{grid-template-columns:1fr;padding-top:38px;gap:32px}.hero h1{font-size:48px;letter-spacing:-2px}.hero p{font-size:18px}.landing-nav nav{gap:16px}.steps-grid{gap:22px}.steps article{display:block}.steps article+article{padding-left:20px}.steps h3{font-size:18px}.steps p{font-size:15px}}@media(max-width:560px){.landing-nav{padding-block:15px;flex-wrap:wrap;gap:15px}.landing-nav nav{width:100%;justify-content:space-between;gap:10px}.landing-nav nav a{font-size:12px}.landing-nav nav .cta{padding:10px 12px}.hero h1{font-size:42px}.hero-actions{flex-direction:column;align-items:stretch}.demo-body aside{width:95px;padding:15px 8px;font-size:11px}.demo-body aside b{font-size:12px}.conversation{padding:28px 10px 16px}.message{font-size:12px;padding:12px}.flow{padding:14px 10px;gap:7px}.flow b{font-size:10px}.flow small{font-size:9px}.channel-strip span{font-size:15px;padding:0 17px}.steps-grid{grid-template-columns:1fr}.steps article{display:flex}.steps article+article{border:0;padding:0}.steps h2{margin-bottom:28px}.steps h3{font-size:20px}.steps p{font-size:16px}}
@font-face{font-family:Inter;src:url('/static/fonts/inter-400.ttf') format('truetype');font-weight:400;font-display:swap}@font-face{font-family:Inter;src:url('/static/fonts/inter-500.ttf') format('truetype');font-weight:500;font-display:swap}@font-face{font-family:Inter;src:url('/static/fonts/inter-600.ttf') format('truetype');font-weight:600;font-display:swap}@font-face{font-family:Inter;src:url('/static/fonts/inter-700.ttf') format('truetype');font-weight:700 800;font-display:swap}
:root{--bg:#f7f9f6;--card:#fff;--text:#101310;--muted:#60675f;--line:#dfe5dc;--primary:#315a14;--primary-ink:#101310;--ok-bg:#edf9df;--ok:#315a14;--err-bg:#fef2f2}.marketing main.wrap{max-width:none;padding:0}.landing{margin:0;width:100%}
.landing-nav,.hero,.steps,.closing,.landing-footer{max-width:1600px}