:root{
  --bg:#ece3d6;
  --paper:#fcfaf6;
  --ink:#16130f;
  --muted:#6f675d;
  --line:rgba(22,19,15,.09);
  --sidebar:#111410;
  --sidebar-2:#1a1f18;
  --accent:#0a9b57;
  --accent-2:#74d39f;
  --champagne:#ddc39b;
  --champagne-2:#f3e4c6;
  --danger:#b63f3f;
  --warning:#b3761f;
  --info:#2563eb;
  --shadow:0 24px 70px rgba(23,25,21,.12);
  --radius-xl:34px;
  --radius-lg:22px;
  --radius-md:16px;
}
*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family:"Manrope",system-ui,sans-serif;
  background:
    radial-gradient(circle at top right, rgba(116,211,159,.22), transparent 24%),
    radial-gradient(circle at left 18%, rgba(221,195,155,.18), transparent 26%),
    linear-gradient(180deg,#f8f3eb 0%, var(--bg) 100%);
  color:var(--ink);
  position:relative;
}
body::before{
  content:"";
  position:fixed;inset:0;pointer-events:none;opacity:.25;
  background-image:radial-gradient(rgba(255,255,255,.9) .6px, transparent .6px);
  background-size:18px 18px;
  mask-image:linear-gradient(180deg, rgba(0,0,0,.36), transparent 80%);
}
a{color:inherit;text-decoration:none}
h1,h2,h3,h4,p{margin:0}
img{max-width:100%;display:block}
button,input,select,textarea{font:inherit}
.wa-shell{min-height:100vh;display:grid;grid-template-columns:280px minmax(0,1fr)}
.wa-sidebar{
  position:sticky;top:0;height:100vh;padding:1.2rem;
  background:
    radial-gradient(circle at 20% 0%, rgba(116,211,159,.18), transparent 30%),
    linear-gradient(180deg,var(--sidebar) 0%, var(--sidebar-2) 100%);
  color:#f5f2ec;display:grid;grid-template-rows:auto 1fr auto;gap:1.15rem;
  overflow:hidden;
}
.wa-sidebar-aura{
  position:absolute;inset:auto -80px -100px auto;width:220px;height:220px;border-radius:999px;
  background:radial-gradient(circle, rgba(221,195,155,.18), rgba(221,195,155,0));
  filter:blur(8px);pointer-events:none;
}
.wa-brand{
  position:relative;z-index:1;
  display:flex;align-items:center;gap:1rem;padding:1rem 1.05rem;border-radius:28px;
  background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.08)
}
.wa-brand-mark{
  width:68px;height:68px;display:grid;place-items:center;flex:0 0 68px;
  border-radius:22px;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(243,228,198,.86));
  box-shadow:0 14px 34px rgba(0,0,0,.24)
}
.wa-brand img{width:44px;height:44px;object-fit:contain}
.wa-brand small{display:block;color:rgba(255,255,255,.64);font-size:.73rem;text-transform:uppercase;letter-spacing:.18em}
.wa-brand strong{display:block;font-size:1.16rem;letter-spacing:-.03em}
.wa-brand-copy{display:block;margin-top:.2rem;color:rgba(255,255,255,.56);font-size:.88rem}
.wa-nav{display:grid;gap:.3rem}
.wa-nav a{
  padding:.9rem 1rem;border-radius:18px;color:rgba(255,255,255,.74);font-weight:700;
  border:1px solid transparent;
  transition:background .2s ease,color .2s ease,transform .2s ease,border-color .2s ease
}
.wa-nav a:hover,.wa-nav a.active{
  background:rgba(255,255,255,.08);color:#fff;transform:translateX(2px);
  border-color:rgba(255,255,255,.08)
}
.wa-sidebar-footer{display:grid;gap:.7rem}
.wa-mini-card{
  padding:1rem;border-radius:22px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.08)
}
.wa-mini-card small{display:block;color:rgba(255,255,255,.62);margin-bottom:.35rem}
.wa-rail-note{
  padding:.95rem 1rem;border-radius:22px;
  background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,.04));
  border:1px solid rgba(255,255,255,.08)
}
.wa-rail-note p{margin-top:.45rem;color:rgba(255,255,255,.68);font-size:.92rem}
.wa-main{padding:1.25rem 1.25rem 2rem;display:grid;align-content:start;gap:1rem}
.wa-topbar{
  position:relative;overflow:hidden;
  display:flex;justify-content:space-between;gap:1rem;align-items:flex-start;
  padding:1.35rem 1.45rem;border-radius:var(--radius-xl);
  background:
    linear-gradient(135deg,rgba(255,255,255,.94),rgba(250,244,233,.86)),
    rgba(251,248,243,.8);
  backdrop-filter:blur(18px);border:1px solid var(--line);
  box-shadow:var(--shadow)
}
.wa-topbar-orb{
  position:absolute;right:-40px;top:-40px;width:180px;height:180px;border-radius:999px;
  background:radial-gradient(circle, rgba(221,195,155,.3), rgba(221,195,155,0));
  pointer-events:none
}
.wa-eyebrow{font-size:.78rem;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.wa-topbar h1{font-family:"Cormorant Garamond",serif;font-size:3rem;letter-spacing:-.05em;line-height:.92}
.wa-intro{max-width:64ch;margin-top:.4rem;color:var(--muted);line-height:1.7}
.wa-top-actions{display:flex;gap:.7rem;flex-wrap:wrap;justify-content:flex-end}
.wa-status-chip{
  min-width:180px;padding:.9rem 1rem;border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.88),rgba(255,255,255,.68));
  border:1px solid rgba(22,19,15,.08);display:grid;gap:.35rem
}
.wa-status-chip small{color:var(--muted);font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:.7rem}
.wa-status-chip strong{font-size:1rem;letter-spacing:-.02em}
.wa-card{
  background:
    linear-gradient(180deg,rgba(255,255,255,.96),rgba(251,248,243,.88));
  border:1px solid var(--line);border-radius:var(--radius-xl);
  box-shadow:var(--shadow);padding:1.15rem
}
.wa-card h2{
  font-family:"Cormorant Garamond",serif;
  font-size:2rem;letter-spacing:-.04em;line-height:.95;margin-bottom:.85rem
}
.wa-grid{display:grid;gap:1rem}
.wa-grid.two{grid-template-columns:1.05fr .95fr}
.wa-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.wa-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:1rem}
.wa-kpi{
  position:relative;overflow:hidden;
  padding:1.05rem 1.1rem;border-radius:28px;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(255,255,255,.78));
  border:1px solid rgba(25,22,18,.07)
}
.wa-kpi::after{
  content:"";position:absolute;inset:auto -18px -28px auto;width:100px;height:100px;border-radius:999px;
  background:radial-gradient(circle, rgba(116,211,159,.22), rgba(116,211,159,0));
}
.wa-kpi small{display:block;color:var(--muted);font-weight:700;margin-bottom:.45rem}
.wa-kpi strong{display:block;font-size:1.9rem;letter-spacing:-.06em}
.wa-kpi span{display:inline-flex;margin-top:.55rem}
.flash{
  padding:1rem 1.1rem;border-radius:18px;font-weight:700;border:1px solid transparent
}
.flash.success{background:rgba(15,157,88,.12);border-color:rgba(15,157,88,.16);color:#166534}
.flash.error{background:rgba(182,63,63,.1);border-color:rgba(182,63,63,.16);color:#842c2c}
.notice{display:grid;gap:.45rem}
.notice p{line-height:1.7;color:var(--muted)}
.notice.danger{border-color:rgba(182,63,63,.14);background:rgba(255,245,245,.84)}
.button{
  display:inline-flex;align-items:center;justify-content:center;gap:.45rem;
  min-height:46px;padding:.82rem 1.05rem;border-radius:999px;border:1px solid transparent;
  font-weight:800;cursor:pointer;transition:transform .2s ease,box-shadow .2s ease,background .2s ease
}
.button:hover{transform:translateY(-1px);box-shadow:0 10px 24px rgba(22,19,15,.08)}
.button-primary{background:linear-gradient(135deg,var(--accent),var(--accent-2));color:#fff}
.button-light{background:linear-gradient(180deg,#fff,rgba(255,255,255,.84));border-color:var(--line);color:var(--ink)}
.button-ghost{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.08);color:#fff}
.button-danger{background:#1c1515;border-color:#1c1515;color:#fff}
.button-outline{background:rgba(255,255,255,.44);border-color:var(--line);color:var(--ink)}
.toolbar{display:flex;justify-content:space-between;gap:1rem;align-items:center;flex-wrap:wrap}
.toolbar .inline-form{display:flex;gap:.6rem;flex-wrap:wrap}
.inline-form{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center}
.inline-form input{
  min-height:46px;padding:.82rem 1rem;border-radius:999px;border:1px solid rgba(25,22,18,.1);background:#fff
}
.wa-card pre{
  margin:0;white-space:pre-wrap;word-break:break-word;
  padding:1rem;border-radius:18px;background:rgba(25,22,18,.05)
}
.stats-line{display:flex;gap:.55rem;flex-wrap:wrap}
.wa-pill{
  display:inline-flex;align-items:center;justify-content:center;gap:.35rem;
  min-height:34px;padding:.4rem .8rem;border-radius:999px;font-size:.86rem;font-weight:800
}
.tone-success{background:rgba(15,157,88,.12);color:#166534}
.tone-danger{background:rgba(182,63,63,.12);color:#842c2c}
.tone-warning{background:rgba(179,118,31,.12);color:#8a5a13}
.tone-info{background:rgba(37,99,235,.12);color:#1d4ed8}
.tone-muted{background:rgba(25,22,18,.08);color:#5d5750}
.wa-form-grid{display:grid;gap:.9rem}
.wa-field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}
.wa-field{display:grid;gap:.42rem}
.wa-field label{font-size:.85rem;font-weight:800;color:var(--muted)}
.wa-field input,.wa-field select,.wa-field textarea{
  width:100%;padding:.9rem 1rem;border-radius:18px;border:1px solid rgba(25,22,18,.1);
  background:#fff;color:var(--ink)
}
.wa-field textarea{min-height:124px;resize:vertical}
.helper{font-size:.87rem;color:var(--muted);line-height:1.6}
.checkbox-line{display:flex;align-items:center;gap:.55rem;color:var(--muted);font-weight:700}
.checkbox-line input{width:auto;accent-color:var(--accent)}
.wa-table-wrap{overflow:auto}
.wa-table{width:100%;border-collapse:collapse;min-width:760px}
.wa-table th,.wa-table td{padding:.92rem .8rem;text-align:left;border-bottom:1px solid rgba(25,22,18,.08);vertical-align:top}
.wa-table th{font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;color:var(--muted)}
.wa-table td strong{display:block}
.wa-table tr:hover{background:rgba(255,255,255,.74)}
.muted{color:var(--muted)}
.progress{
  width:100%;height:10px;border-radius:999px;background:rgba(25,22,18,.08);overflow:hidden
}
.progress > span{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,var(--accent),var(--accent-2))}
.chart-bars{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:.8rem;align-items:end;min-height:220px}
.chart-col{display:grid;gap:.5rem}
.chart-stack{
  min-height:180px;display:flex;align-items:flex-end;justify-content:center;gap:.2rem
}
.chart-bar{width:18px;border-radius:999px 999px 6px 6px}
.chart-bar.sent{background:rgba(15,157,88,.28)}
.chart-bar.delivered{background:rgba(15,157,88,.52)}
.chart-bar.reply{background:#1c7f46}
.chart-label{text-align:center;font-size:.8rem;color:var(--muted);font-weight:800}
.conversation-list,.activity-list,.stat-list{display:grid;gap:.75rem}
.list-item{
  padding:1rem 1.05rem;border-radius:24px;background:linear-gradient(180deg,rgba(255,255,255,.82),rgba(255,255,255,.66));
  border:1px solid rgba(25,22,18,.07)
}
.list-item p{margin-top:.35rem;color:var(--muted);line-height:1.6}
.split-line{display:flex;justify-content:space-between;gap:.8rem;align-items:flex-start}
.empty{
  padding:1.15rem;border-radius:20px;background:rgba(255,255,255,.54);border:1px dashed rgba(25,22,18,.12);
  color:var(--muted)
}
.auth-shell{
  min-height:100vh;display:grid;place-items:center;padding:1.2rem;
  background:
    radial-gradient(circle at top left, rgba(116,211,159,.24), transparent 26%),
    radial-gradient(circle at right 18%, rgba(221,195,155,.22), transparent 22%),
    linear-gradient(180deg,#f7f1e7 0%, #ebe2d4 100%)
}
.auth-card{
  width:min(1080px,100%);padding:1.2rem;border-radius:36px;background:rgba(251,248,243,.92);
  border:1px solid rgba(25,22,18,.08);box-shadow:var(--shadow);
  display:grid;grid-template-columns:1.1fr .9fr;gap:1rem
}
.auth-card h1{font-family:"Cormorant Garamond",serif;font-size:4.2rem;line-height:.88;letter-spacing:-.06em}
.auth-card .hero-copy{display:grid;gap:.45rem}
.auth-card .hero-copy p{color:var(--muted);line-height:1.7}
.auth-hero{
  position:relative;overflow:hidden;padding:1.35rem;border-radius:30px;
  background:
    radial-gradient(circle at top right, rgba(221,195,155,.22), transparent 24%),
    linear-gradient(160deg,#161915 0%, #22261f 100%);
  color:#f7f4ee;display:grid;gap:1.2rem
}
.auth-hero::after{
  content:"";position:absolute;right:-60px;bottom:-70px;width:220px;height:220px;border-radius:999px;
  background:radial-gradient(circle, rgba(116,211,159,.18), rgba(116,211,159,0))
}
.auth-logo{display:flex;align-items:center;gap:1rem}
.auth-logo-mark{
  width:76px;height:76px;display:grid;place-items:center;flex:0 0 76px;border-radius:24px;
  background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(243,228,198,.84));
  box-shadow:0 20px 44px rgba(0,0,0,.22)
}
.auth-logo img{width:50px;height:50px;object-fit:contain}
.auth-brand-name{display:block;margin-top:.22rem;color:rgba(247,244,238,.64)}
.auth-highlight{
  padding:1rem;border-radius:22px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08)
}
.auth-highlight p{margin-top:.45rem;color:rgba(247,244,238,.74)}
.auth-panel{
  padding:1.25rem;border-radius:30px;background:linear-gradient(180deg,rgba(255,255,255,.98),rgba(248,243,234,.9));
  border:1px solid rgba(25,22,18,.08);display:grid;align-content:center;gap:1rem
}
.auth-panel-head h2{
  font-family:"Cormorant Garamond",serif;font-size:2.5rem;letter-spacing:-.04em;line-height:.94;margin-top:.25rem
}
.stack{display:grid;gap:1rem}
.mini-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem}
.mini-kpi{padding:.9rem;border-radius:20px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.08)}
.mini-kpi strong{display:block;font-size:1.35rem}
.inline-code{
  padding:.25rem .45rem;border-radius:8px;background:rgba(25,22,18,.08);
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.86rem
}
@media (max-width:1180px){
  .wa-shell{grid-template-columns:1fr}
  .wa-sidebar{position:relative;height:auto}
  .wa-kpis,.wa-grid.two,.wa-grid.three,.wa-field-grid,.mini-kpis,.auth-card{grid-template-columns:1fr}
  .chart-bars{grid-template-columns:repeat(4,minmax(0,1fr))}
}
@media (max-width:760px){
  .wa-main{padding:1rem}
  .wa-topbar{padding:1rem}
  .wa-topbar h1{font-size:2.35rem}
  .wa-kpis{grid-template-columns:1fr 1fr}
  .chart-bars{grid-template-columns:repeat(3,minmax(0,1fr))}
  .wa-brand{padding:.9rem}
  .auth-card h1{font-size:3.1rem}
}