:root{
  --bg:#edf4f7;
  --bg-soft:#f7fbff;
  --surface:#ffffff;
  --surface-2:#f3f8fc;
  --line:#dbe4ee;
  --line-strong:#dce7f2;
  --text:#122436;
  --muted:#5d6b7b;
  --nav-start:#162b5f;
  --nav-end:#2b7f9f;
  --pill:#eaf2fb;
  --shadow:0 14px 34px rgba(15,35,66,.08);
  --radius-2xl:20px;
  --radius-xl:18px;
  --radius-lg:16px;
  --radius-md:12px;
  --sidebar-width:260px;
  --topbar-height:74px;
  --topbar-control-h:46px;
}

*{box-sizing:border-box}
html,body{margin:0;padding:0;max-width:100%;overflow-x:hidden}
body{
  min-height:100vh;
  background:
    radial-gradient(circle at top left, rgba(52,177,187,.12) 0%, rgba(52,177,187,0) 28%),
    radial-gradient(circle at top right, rgba(22,43,95,.08) 0%, rgba(22,43,95,0) 34%),
    linear-gradient(180deg,#edf4f7 0%,#f8fbfc 100%);
  color:var(--text);
  font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  overflow-y:auto;
}

a{color:inherit;text-decoration:none}
img{display:block;max-width:100%}
button{font:inherit}

.zero-shell{min-height:100vh;padding:0}

.app-frame{
  min-height:100vh;
  display:block;
  background:transparent;
  border:0;
  border-radius:0;
  overflow:visible;
  box-shadow:none;
}

.sidebar{
  position:fixed;
  left:0;
  top:0;
  width:var(--sidebar-width);
  height:100vh;
  height:100dvh;
  z-index:1030;
  background:
    radial-gradient(circle at top, rgba(255,255,255,.08) 0%, rgba(255,255,255,0) 32%),
    radial-gradient(circle at bottom right, rgba(255,255,255,.08) 0%, rgba(255,255,255,0) 24%),
    linear-gradient(180deg,var(--nav-start) 0%, #1d3f73 52%, var(--nav-end) 100%);
  color:#fff;
  padding:0 0 calc(16px + env(safe-area-inset-bottom, 0px));
  display:grid;
  grid-template-rows:auto 1fr auto;
  min-height:100vh;
  overflow-y:auto;
  overflow-x:hidden;
  box-shadow:10px 0 32px rgba(10,25,48,.18);
  transition:transform .26s cubic-bezier(.22,.61,.36,1), box-shadow .2s ease;
}

.sidebar-brand{
  min-height:var(--topbar-height);
  height:var(--topbar-height);
  background:linear-gradient(180deg, rgba(255,255,255,.98) 0%, rgba(244,249,251,.98) 100%);
  margin:0;
  padding:8px 18px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-bottom:1px solid #dce6f0;
}

.sidebar-brand img{
  width:100%;
  max-width:190px;
  max-height:54px;
  height:auto;
  object-fit:contain;
}

.sidebar-nav{padding:12px 16px 0;display:grid;gap:8px;align-content:start}

.sidebar-link{
  min-height:46px;
  display:flex;
  align-items:center;
  padding:10px 13px;
  border-radius:14px;
  border:0;
  background:transparent;
  color:#fff;
  font-size:15px;
  font-weight:800;
  letter-spacing:.15px;
  box-shadow:none;
  transition:all .18s ease;
}

.sidebar-link:hover,
.sidebar-link.is-active{
  background:linear-gradient(135deg, rgba(255,255,255,.18) 0%, rgba(255,255,255,.10) 100%);
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.14), 0 10px 18px rgba(16,36,81,.12);
  transform:translateX(2px);
}

.sidebar-foot{
  margin:10px 16px 0;
  padding:10px 0 0;
  border-top:1px solid rgba(255,255,255,.14);
  color:rgba(255,255,255,.82);
  font-size:11px;
  line-height:1.45;
  font-weight:700;
}

.main{
  margin-left:var(--sidebar-width);
  margin-top:84px;
  padding:20px;
  background:transparent;
  display:grid;
  grid-template-rows:1fr;
  min-width:0;
  overflow-x:hidden;
}

.topbar{
  position:fixed;
  left:var(--sidebar-width);
  right:0;
  top:0;
  min-height:var(--topbar-height);
  height:var(--topbar-height);
  z-index:1020;
  background:rgba(255,255,255,.86);
  border-bottom:1px solid rgba(203,219,232,.8);
  padding:0 20px;
  display:grid;
  align-items:center;
  gap:10px;
  backdrop-filter:blur(12px);
  box-shadow:0 8px 24px rgba(17,39,73,.06);
}

.topbar.desktop{grid-template-columns:minmax(220px,.9fr) minmax(260px,1.1fr) minmax(260px,1.1fr) auto auto}

.top-pill{
  min-height:var(--topbar-control-h);
  height:var(--topbar-control-h);
  max-height:var(--topbar-control-h);
  border-radius:18px;
  border:1px solid #d5e3ef;
  background:linear-gradient(180deg,#f7fbff 0%,#eef5fb 100%);
  box-shadow:0 8px 18px rgba(16,36,81,.06);
  display:flex;
  align-items:center;
  gap:10px;
  padding:4px 12px 4px 6px;
  min-width:0;
  color:#204564;
}

.top-pill.is-user{justify-content:flex-start}

.top-pill-asset{
  width:36px;
  min-width:36px;
  height:36px;
  border-radius:12px;
  background:#fff;
  border:1px solid rgba(39,69,111,.12);
  overflow:hidden;
  display:grid;
  place-items:center;
  box-shadow:inset 0 0 0 1px rgba(255,255,255,.16);
}

.top-pill-asset img{width:100%;height:100%;object-fit:contain;background:#fff}

.top-pill-asset.top-pill-asset-profile{
  background:#1f4d7d;
  color:#fff;
  font-weight:900;
  font-size:13px;
  letter-spacing:.02em;
}

.top-pill-copy{min-width:0;display:grid;gap:2px}

.eyebrow{
  font-size:10px;
  line-height:1.1;
  font-weight:800;
  letter-spacing:.4px;
  text-transform:uppercase;
  color:#7a91a7;
}

.top-pill-title{
  font-size:13px;
  line-height:1.1;
  font-weight:900;
  letter-spacing:0;
  color:#223f61;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.top-icon-button{
  min-height:var(--topbar-control-h);
  height:var(--topbar-control-h);
  min-width:var(--topbar-control-h);
  border-radius:16px;
  border:1px solid #d7e4ef;
  background:#fff;
  display:grid;
  place-items:center;
  color:#18385d;
  font-size:16px;
  font-weight:900;
  box-shadow:none;
  position:relative;
  cursor:pointer;
}

.top-icon-button:hover{
  transform:translateY(-1px);
  box-shadow:0 10px 18px rgba(16,36,81,.10);
  border-color:#c5d8e8;
}

.top-exit{font-size:13px;min-width:76px}
.icon-badge{
  position:absolute;
  top:-4px;
  right:-2px;
  min-width:20px;
  height:20px;
  border-radius:999px;
  padding:0 6px;
  background:#d7445d;
  color:#fff;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:11px;
  font-weight:900;
  line-height:1;
}
.mobile-header{display:none}
.mobile-context{display:none}

.content{
  padding:0;
  display:grid;
  gap:16px;
  align-content:start;
}

.hero-card,
.surface-card{
  background:var(--surface);
  border:1px solid var(--line);
  border-radius:20px;
  box-shadow:var(--shadow);
}

.hero-card{padding:20px;border-radius:20px}

.hero-card h1{
  margin:0;
  font-size:26px;
  line-height:1.12;
  letter-spacing:-.03em;
  color:#18385d;
}

.hero-card p{
  margin:8px 0 0;
  font-size:14px;
  line-height:1.5;
  color:#5d6b7b;
  max-width:760px;
}

.hero-eyebrow{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:0 10px;
  border-radius:999px;
  background:#edf4fb;
  color:#647f9f;
  font-size:11px;
  font-weight:900;
  letter-spacing:.45px;
  text-transform:uppercase;
  margin-bottom:10px;
}

.card-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.surface-card{padding:20px;border-radius:20px;box-shadow:var(--shadow)}
.surface-card h2,.surface-card h3{margin:0;letter-spacing:-.04em}
.surface-card h2{font-size:19px;line-height:1.15;color:#18385d}
.surface-card p{margin:8px 0 0;color:#5d6b7b;line-height:1.5;font-size:14px}
.list-card{display:grid;gap:12px}

.list-row{
  min-height:50px;
  border-radius:14px;
  border:1px solid rgba(209,225,240,.92);
  background:linear-gradient(180deg,#fbfdff,#f3f8fd);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:16px;
  align-items:center;
  padding:0 18px;
}

.list-row strong{font-size:15px}
.list-row span{font-size:13px;color:var(--muted);font-weight:700}
.two-col{display:grid;grid-template-columns:1.3fr 1fr;gap:16px}
.metric-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}

.metric-card{
  min-height:112px;
  border-radius:18px;
  padding:16px;
  border:1px solid var(--line);
  background:linear-gradient(135deg,#274578,#4e88ad);
  color:#fff;
}

.metric-card.light{background:linear-gradient(180deg,#fff,#f5f9fd);color:var(--text)}
.metric-card .eyebrow{color:rgba(255,255,255,.72)}
.metric-card.light .eyebrow{color:#8ea6c2}
.metric-card strong{display:block;margin-top:8px;font-size:28px;letter-spacing:-.04em}
.metric-card p{margin-top:8px;color:inherit;opacity:.82}

.portal-highlight{
  min-height:72px;
  border-radius:22px;
  border:1px solid var(--line);
  background:#f5f9fd;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 18px;
  gap:16px;
}

.portal-highlight span{color:#7c96b2;font-weight:700}
.detail-grid{display:grid;gap:18px}
.detail-grid.two{grid-template-columns:1.1fr .9fr}
.detail-grid.three{grid-template-columns:repeat(3,minmax(0,1fr))}
.summary-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}

.clients-tabs-card{
  display:flex;
  align-items:center;
  gap:10px;
}

.clients-tabs-card .section-tabs{
  width:100%;
}

.client-reference-topbox{
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  box-shadow:0 12px 28px rgba(24,57,102,.08);
  padding:20px 22px;
  display:grid;
  gap:10px;
}

.client-reference-topbox p{
  margin:0;
  color:#5f7898;
  line-height:1.45;
  font-weight:700;
}

.didactic-guide{
  border:1px solid var(--line);
  border-radius:14px;
  background:#f7fbff;
  overflow:hidden;
}

.didactic-guide summary{
  min-height:42px;
  padding:0 14px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  cursor:pointer;
  color:#2b486f;
  font-weight:900;
}

.didactic-guide-body{
  border-top:1px solid var(--line);
  padding:14px;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:10px;
}

.didactic-step{
  border:1px solid var(--line);
  border-radius:14px;
  background:#fff;
  padding:12px;
  display:grid;
  gap:4px;
}

.didactic-step strong{
  color:#2b486f;
  font-size:14px;
}

.didactic-step span{
  color:#6c86a5;
  font-size:13px;
  line-height:1.35;
  font-weight:700;
}

.client-workspace{
  border:1px solid var(--line);
  border-radius:24px;
  background:#fff;
  display:grid;
  gap:0;
  overflow:hidden;
  max-width:100%;
  box-shadow:0 12px 28px rgba(24,57,102,.08);
}

.client-section{
  padding:18px;
}

.client-section .primary-action{
  min-height:44px;
  border-radius:12px;
}

.client-section .form-actions{
  grid-template-columns:auto;
  justify-content:start;
}

.client-entry-card{
  display:grid;
  gap:14px;
}

.client-entry-head{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:12px;
  flex-wrap:wrap;
}

.client-entry-head h2{
  margin:0;
  font-size:22px;
  letter-spacing:-.04em;
}

.client-entry-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:10px;
  align-items:end;
}

.client-span-2{grid-column:span 2}
.client-span-3{grid-column:span 3}
.client-span-4{grid-column:span 4}
.client-span-6{grid-column:span 6}
.client-span-12{grid-column:1 / -1}

.client-entry-grid .field{
  gap:5px;
}

.client-entry-grid .field span{
  font-size:11px;
}

.client-entry-grid .input-box,
.client-entry-grid .textarea-input.compact{
  min-height:44px;
  border-radius:10px;
  padding:0 12px;
  font-size:15px;
}

.client-entry-grid .textarea-input.compact{
  padding-top:11px;
  line-height:1.35;
}

.mini-eyebrow{
  display:inline-flex;
  align-items:center;
  min-height:28px;
  padding:0 12px;
  border-radius:999px;
  background:#eef5fc;
  color:#6d88a7;
  font-size:11px;
  font-weight:900;
  letter-spacing:.12em;
  text-transform:uppercase;
}

.stack{display:grid;gap:14px}
.field-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.field-span-2{grid-column:1 / -1}
.field{display:grid;gap:8px}

.field span{
  color:#6f87a6;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
}

.field-box,
.textarea-box,
.select-box,
.input-box{
  min-height:58px;
  border-radius:18px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,#fdfefe,#f4f9fd);
  display:flex;
  align-items:center;
  padding:0 16px;
  color:#29466f;
  font-weight:800;
}

.input-box{
  width:100%;
  font:inherit;
  outline:none;
}

.password-field{
  position:relative;
  display:flex;
  align-items:center;
}

.password-input{
  padding-right:104px;
}

.password-toggle{
  position:absolute;
  right:10px;
  min-height:40px;
  border-radius:14px;
  border:1px solid var(--line);
  background:#fff;
  color:#315d94;
  font-weight:900;
  padding:0 12px;
  cursor:pointer;
}

.input-box::placeholder{color:#7f97b4}

.textarea-input{
  width:100%;
  min-height:150px;
  border-radius:18px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,#fdfefe,#f4f9fd);
  padding:16px;
  color:#29466f;
  font:inherit;
  font-weight:800;
  resize:vertical;
  outline:none;
}

.textarea-input::placeholder{color:#9dafc3}
.textarea-input.compact{min-height:58px}

.textarea-box{min-height:132px;align-items:flex-start;padding-top:16px}
.select-box{justify-content:space-between}
.chip-row,.toggle-row,.tag-row{display:flex;gap:10px;flex-wrap:wrap}

.chip,
.tag,
.toggle{
  min-height:38px;
  border-radius:999px;
  padding:0 14px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--line);
  background:#f7fbff;
  color:#39577f;
  font-weight:800;
}

.toggle.is-active,.chip.is-active{background:#e8f2fd;border-color:#bfd5ea}

.check-toggle{
  min-height:38px;
  border-radius:14px;
  padding:0 12px;
  display:inline-flex;
  align-items:center;
  gap:8px;
  border:1px solid var(--line);
  background:#f7fbff;
  color:#39577f;
  font-weight:900;
}

.check-toggle input{accent-color:#315d94}
.check-toggle.is-inline{justify-content:flex-start}
.brand-check-grid{
  align-items:center;
  display:grid;
  grid-template-columns:repeat(9,minmax(0,1fr));
  gap:8px;
  width:100%;
}
.brand-check-grid .check-toggle{
  min-width:0;
  width:100%;
  justify-content:flex-start;
}
.mock-table{display:grid;gap:10px}
.mock-table-head,.mock-row{display:grid;gap:10px;align-items:center}

.mock-table-head{
  grid-template-columns:1.2fr .9fr .7fr .7fr;
  color:#8aa3bf;
  font-size:12px;
  font-weight:900;
  text-transform:uppercase;
  letter-spacing:.08em;
  padding:0 8px;
}

.mock-row{
  min-height:60px;
  grid-template-columns:1.2fr .9fr .7fr .7fr;
  padding:0 14px;
  border-radius:18px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,#fbfdff,#f3f8fd);
  color:#29466f;
  font-weight:800;
}

.stat-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}

.soft-box{
  min-height:96px;
  border-radius:22px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,#fbfdff,#f2f8fd);
  padding:16px 18px;
  display:grid;
  gap:8px;
  align-content:start;
}

.soft-box strong{font-size:17px;letter-spacing:-.03em}
.soft-box span{color:#88a1bc;font-size:12px;font-weight:900;text-transform:uppercase;letter-spacing:.08em}
.soft-box p{margin:0;color:#65809e;line-height:1.4}

.soft-box.accent{
  background:linear-gradient(135deg,#244477,#4b86ab);
  color:#fff;
  border-color:rgba(160,195,229,.35);
}

.soft-box.accent span{color:rgba(255,255,255,.72)}
.soft-box.accent p{color:rgba(255,255,255,.82)}

.brand-wall{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}

.brand-card{
  padding:18px;
  border-radius:24px;
  border:1px solid var(--line);
  background:rgba(255,255,255,.78);
  box-shadow:var(--shadow);
  display:grid;
  gap:14px;
  align-content:start;
}

.logo-stage{
  aspect-ratio:1 / 1;
  border-radius:30px;
  display:grid;
  place-items:center;
  padding:24px;
  position:relative;
  overflow:hidden;
  background:#f0f5fa;
}

.logo-stage::after{
  content:"";
  position:absolute;
  inset:auto 16px 12px;
  height:16px;
  border-radius:999px;
  background:rgba(255,255,255,.22);
  filter:blur(18px);
  pointer-events:none;
}

.logo-stage img{
  max-width:100%;
  max-height:100%;
  object-fit:contain;
  display:block;
  position:relative;
  z-index:1;
}

.stage-burgundy{background:linear-gradient(160deg,#6c1630,#4e1326 58%,#3f0d1d)}
.stage-navy{background:linear-gradient(160deg,#153460,#0e2241 58%,#081327)}
.stage-gold{background:linear-gradient(160deg,#f7f2e4,#eadfc4 58%,#dbc38c)}
.stage-gramado-green{background:linear-gradient(160deg,#2f7d52,#1d5e3b 58%,#123b25)}
.stage-emerald{background:linear-gradient(160deg,#0f624d,#0b4035 58%,#072b23)}
.stage-ocean{background:linear-gradient(160deg,#0b3d9a,#0b2e75 58%,#071d4c)}
.stage-graphite{background:linear-gradient(160deg,#f5f6f8,#dde3ea 60%,#ced5de)}
.stage-forest{background:linear-gradient(160deg,#125f38,#0d4628 58%,#082a17)}
.stage-ink{background:linear-gradient(160deg,#14171e,#08090c 58%,#000)}
.stage-soft{background:linear-gradient(160deg,#fff,#f5f8fb 58%,#e2e9f1)}
.poehma-stage{background:linear-gradient(160deg,#e8edf3,#d7dee6 58%,#c8d1dc)}

.poehma img{
  mix-blend-mode:multiply;
  opacity:1;
  max-width:106%;
  max-height:106%;
}

.lgm-shape{
  border-radius:36px;
  background:#5a172d;
  padding:0;
}

.lgm-shape img{
  width:136%;
  height:136%;
  object-fit:cover;
  max-width:none;
  max-height:none;
}

.kempinski-stage{
  background:#e7ddcc;
  padding:18px;
}

.kempinski-stage img{
  max-width:112%;
  max-height:112%;
  mix-blend-mode:multiply;
  opacity:1;
}

.gav img,
.golden img,
.gramado img,
.gpk img{
  filter:brightness(0) invert(1);
}

.golden img{
  max-width:112%;
  max-height:112%;
}

.wam-stage{
  background:#0f7a3a;
  padding:0;
}

.wam img{
  width:132%;
  height:132%;
  object-fit:cover;
  max-width:none;
  max-height:none;
  filter:none;
}

.mundo-stage{
  background:linear-gradient(160deg,#1f7fd1,#145ca4 58%,#0c3d70);
}

.mundo img{
  filter:none;
  max-width:106%;
  max-height:106%;
  mix-blend-mode:screen;
}

.own img{
  filter:brightness(0) invert(1);
  max-width:116%;
  max-height:116%;
}

.gramado img{
  max-width:106%;
  max-height:106%;
}

.own-stage{
  background:linear-gradient(160deg,#171717,#090909 58%,#000);
}

.brand-card strong{font-size:15px;line-height:1.2}

.top-pill-asset.logo-stage{
  aspect-ratio:auto;
  width:36px;
  min-width:36px;
  height:36px;
  padding:6px;
  border-radius:12px;
}

.top-pill-asset.logo-stage::after{display:none}

.top-pill-asset.logo-stage.lgm-shape,
.top-pill-asset.logo-stage.wam-stage{
  padding:0;
}

.zero-form{display:grid;gap:16px}
.compact-form{
  border-top:1px solid var(--line);
  padding-top:16px;
}

.form-actions{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
}

.primary-action,
.danger-action{
  min-height:52px;
  border-radius:18px;
  border:1px solid var(--line);
  padding:0 18px;
  font-weight:900;
  cursor:pointer;
}

.primary-action{
  background:linear-gradient(135deg,#244477,#4b86ab);
  color:#fff;
  border-color:rgba(160,195,229,.5);
}

.danger-action{
  background:#fff5f6;
  color:#aa4155;
  border-color:#f1c8d0;
}

.empty-state{
  min-height:128px;
  border-radius:24px;
  border:1px dashed #bfd3e8;
  background:linear-gradient(180deg,#fbfdff,#f3f8fd);
  display:grid;
  align-content:center;
  gap:8px;
  padding:22px;
}

.empty-state strong{font-size:18px}
.empty-state p{margin:0;color:#718ba8}

.cadastro-list{display:grid;gap:12px}
.finance-list{display:grid;gap:12px}

.cadastro-row{
  min-height:76px;
  border-radius:20px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,#fbfdff,#f3f8fd);
  display:grid;
  grid-template-columns:minmax(0,1.35fr) auto auto minmax(0,1fr) minmax(0,1fr);
  align-items:center;
  gap:14px;
  padding:14px 16px;
}

.finance-row{
  min-height:84px;
  border-radius:20px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,#fbfdff,#f3f8fd);
  display:grid;
  grid-template-columns:minmax(0,1.5fr) auto minmax(240px,.9fr);
  gap:14px;
  align-items:center;
  padding:14px 16px;
}

.finance-row-main strong{display:block;font-size:15px;line-height:1.25}
.finance-row-main p{margin:3px 0 0;color:#718ba8;font-size:13px}
.finance-row-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:flex-end}

.mini-action{
  min-height:34px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  padding:0 12px;
  color:#2d5d91;
  font-size:12px;
  font-weight:900;
  cursor:pointer;
}

.mini-action.danger{
  background:#fff5f6;
  color:#aa4155;
  border-color:#f1c8d0;
}

.cadastro-row strong{display:block;font-size:15px;line-height:1.25}
.cadastro-row p{margin:3px 0 0;color:#718ba8;font-size:13px}
.inline-link{
  display:inline-flex;
  margin-top:8px;
  min-height:30px;
  align-items:center;
  border-radius:999px;
  border:1px solid var(--line);
  background:#fff;
  padding:0 12px;
  color:#2d5d91;
  font-size:12px;
  font-weight:900;
}
.timeline{display:grid;gap:12px}

.timeline-row{
  min-height:66px;
  border-radius:20px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,#fbfdff,#f3f8fd);
  padding:12px 16px;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:14px;
  align-items:center;
}

.timeline-dot{width:12px;height:12px;border-radius:999px;background:#5d88b4}
.timeline-row strong{display:block;font-size:16px}
.timeline-row p{margin:2px 0 0;color:#6d87a4;font-size:14px}
.timeline-row span{color:#88a0ba;font-size:12px;font-weight:900;text-transform:uppercase}

.dual-persona{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:14px;
}

.persona-card{
  min-height:156px;
  border-radius:24px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,#fbfdff,#f1f7fd);
  padding:18px;
  display:grid;
  gap:10px;
  align-content:start;
}

.persona-card.is-active{
  background:linear-gradient(180deg,#edf5fd,#e5f0fc);
  border-color:#bfd5ea;
}

.persona-card strong{
  font-size:18px;
  letter-spacing:-.03em;
}

.persona-card p{
  margin:0;
  color:#6783a2;
  line-height:1.4;
}

.pill-list{
  display:flex;
  gap:8px;
  flex-wrap:wrap;
}

.pill-list span{
  min-height:30px;
  padding:0 12px;
  border-radius:999px;
  background:#fff;
  border:1px solid var(--line);
  display:inline-flex;
  align-items:center;
  color:#446382;
  font-size:12px;
  font-weight:800;
}

.mobile-toggle{
  min-height:var(--topbar-control-h);
  height:var(--topbar-control-h);
  border-radius:12px;
  border:1px solid #d7e4ef;
  background:#fff;
  padding:0 14px;
  font-weight:900;
  color:#18385d;
  box-shadow:none;
}

.mobile-overlay{display:none}
.profile-inline{display:flex;align-items:center;gap:14px;min-width:0}
.profile-inline .top-pill-title{font-size:17px}
.profile-inline .eyebrow{font-size:12px}
.hidden-mobile{display:block}

.loading-frame{
  min-height:calc(100vh - 56px);
  border:1px solid var(--line);
  border-radius:28px;
  background:linear-gradient(180deg,#fff,#f1f7fc);
  box-shadow:var(--shadow);
  display:grid;
  place-items:center;
  align-content:center;
  gap:16px;
  padding:28px;
  text-align:center;
}

.loading-frame img{width:126px}
.loading-frame h1{margin:0;font-size:32px;letter-spacing:-.04em}
.loading-frame p{margin:0;color:#6d87a4;font-weight:800}

.system-alert{
  border-color:#efc9d0;
  background:linear-gradient(180deg,#fff8f9,#fff);
}

.system-alert h2{color:#9d3d51}
.system-alert.warm{
  border-color:#f1ddaf;
  background:linear-gradient(180deg,#fffdf4,#fff);
}
.system-alert.warm h2{color:#9f6a1a}
.system-alert.ok{
  border-color:#b8dfc6;
  background:linear-gradient(180deg,#f5fff8,#fff);
}
.system-alert.ok h2{color:#277449}

.notice-backdrop{
  position:fixed;
  inset:0;
  background:rgba(11,26,48,.22);
  opacity:0;
  pointer-events:none;
  transition:opacity .18s ease;
  z-index:35;
}

.notice-backdrop.is-open{
  opacity:1;
  pointer-events:auto;
}

.notice-drawer{
  position:fixed;
  top:18px;
  right:18px;
  bottom:18px;
  width:min(420px,calc(100vw - 36px));
  border:1px solid var(--line);
  border-radius:28px;
  background:linear-gradient(180deg,#fff,#f4f9fd);
  box-shadow:0 30px 70px rgba(10,25,47,.24);
  transform:translateX(calc(100% + 24px));
  transition:transform .2s ease;
  z-index:40;
  display:grid;
  grid-template-rows:auto 1fr;
  overflow:hidden;
}

.notice-drawer.is-open{transform:translateX(0)}

.notice-drawer-header{
  padding:20px 20px 18px;
  border-bottom:1px solid var(--line);
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  gap:12px;
  align-items:start;
  background:rgba(255,255,255,.86);
}

.notice-drawer-header h2{
  margin:4px 0 0;
  font-size:24px;
  letter-spacing:-.04em;
}

.notice-drawer-header p{
  margin:8px 0 0;
  color:#6d87a4;
  line-height:1.4;
}

.notice-close{
  min-height:42px;
  border-radius:16px;
  border:1px solid var(--line);
  background:#fff;
  padding:0 14px;
  color:#35567f;
  font-weight:900;
  cursor:pointer;
}

.notice-drawer-body{
  padding:18px;
  overflow:auto;
}

.auth-shell{
  min-height:100vh;
  padding:28px;
  display:grid;
  place-items:center;
}

.auth-panel{
  width:min(1120px,100%);
  display:grid;
  grid-template-columns:minmax(0,1.1fr) minmax(380px,.9fr);
  gap:22px;
  align-items:stretch;
}

.auth-copy,
.auth-card{
  border:1px solid var(--line);
  border-radius:28px;
  background:linear-gradient(180deg,#fff,#f3f8fd);
  box-shadow:var(--shadow);
}

.auth-copy{
  padding:36px 36px 34px;
  display:flex;
  align-items:center;
  justify-content:center;
}

.auth-logo-wrap{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}

.auth-logo{width:124px}

.auth-logo-large{
  width:min(100%, 420px);
  height:auto;
}

.auth-card{
  padding:28px;
  display:grid;
  gap:16px;
  align-content:start;
}

.auth-card h2{
  margin:0;
  font-size:28px;
  letter-spacing:-.04em;
}

.auth-card p{
  margin:0;
  color:#5c7798;
  line-height:1.45;
}

.auth-brand-wall{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:12px;
}

.auth-brand{
  min-height:88px;
  border-radius:24px;
  padding:18px;
}

.auth-error{
  min-height:54px;
  border-radius:18px;
  border:1px solid #efc9d0;
  background:#fff7f8;
  color:#9d3d51;
  display:flex;
  align-items:center;
  padding:0 14px;
  font-weight:800;
}

.auth-notice{
  min-height:54px;
  border-radius:18px;
  display:flex;
  align-items:center;
  padding:0 14px;
  font-weight:800;
}

.auth-notice.err{
  border:1px solid #efc9d0;
  background:#fff7f8;
  color:#9d3d51;
}

.auth-notice.ok{
  border:1px solid #cde6d1;
  background:#f4fbf5;
  color:#2f6b3d;
}

.auth-recovery-actions{
  display:grid;
  gap:10px;
}

.auth-card .form-actions{
  grid-template-columns:minmax(0,1fr);
}

.auth-card .primary-action,
.auth-card .secondary-action{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}

.auth-card .primary-action{
  min-height:60px;
  border-radius:24px;
}

.auth-switch{
  width:100%;
  min-height:54px;
  border-radius:18px;
  border:1px solid var(--line);
  background:#f7fbff;
  display:flex;
  align-items:center;
  gap:12px;
  padding:0 16px;
  cursor:pointer;
}

.auth-switch input{
  position:absolute;
  opacity:0;
  pointer-events:none;
}

.auth-switch-track{
  width:52px;
  min-width:52px;
  height:30px;
  border-radius:999px;
  background:#d7e3f1;
  position:relative;
  transition:background .2s ease;
}

.auth-switch-thumb{
  width:24px;
  height:24px;
  border-radius:999px;
  background:#fff;
  position:absolute;
  top:3px;
  left:3px;
  box-shadow:0 4px 12px rgba(39,69,111,.16);
  transition:transform .2s ease;
}

.auth-switch-copy{
  color:#39577f;
  font-weight:900;
}

.auth-switch input:checked + .auth-switch-track{
  background:#4b86ab;
}

.auth-switch input:checked + .auth-switch-track .auth-switch-thumb{
  transform:translateX(22px);
}

.passkey-panel{
  display:grid;
  gap:14px;
}

.passkey-list{
  display:grid;
  gap:10px;
}

.secondary-action{
  min-height:54px;
  border-radius:999px;
  border:1px solid var(--line);
  background:#f5f9fd;
  color:var(--text);
  font-weight:900;
  padding:0 18px;
  box-shadow:0 4px 16px rgba(39,69,111,.06);
}

.secondary-action.is-active{
  background:#e8f2fd;
  border-color:#bfd5ea;
}

.text-action{
  border:0;
  background:transparent;
  color:#315d94;
  font-weight:900;
  padding:0;
  justify-self:start;
  cursor:pointer;
}

.modal-backdrop{
  position:fixed;
  inset:0;
  background:rgba(15,31,55,.22);
  display:grid;
  place-items:center;
  padding:18px;
  overflow:auto;
  z-index:80;
}

.modal-backdrop[hidden]{
  display:none !important;
}

.modal-card [hidden]{
  display:none !important;
}

.modal-card{
  width:min(520px,calc(100vw - 24px));
  border-radius:28px;
  border:1px solid var(--line);
  background:#fff;
  box-shadow:var(--shadow);
  padding:24px;
  display:grid;
  gap:14px;
  margin:auto;
}

.modal-card h2{
  margin:0;
  font-size:28px;
  letter-spacing:-.04em;
}

.modal-card p{
  margin:0;
  color:#6b86a4;
  line-height:1.45;
}

.recovery-preview{
  min-height:0;
  border-radius:18px;
  border:0;
  background:transparent;
  padding:0;
  display:grid;
  gap:10px;
}

.recovery-footer{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto;
  align-items:center;
  gap:12px;
}

.recovery-footer-close{
  justify-self:end;
}

.recovery-preview strong{
  font-size:15px;
  line-height:1.25;
}

.recovery-preview p{
  margin:0;
}

.zero-form.compact{
  gap:12px;
}

.compact-actions{
  grid-template-columns:minmax(0,1fr);
}

.compact-actions .primary-action{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:center;
}

@media (max-width:1100px){
  .sidebar{
    position:fixed;
    z-index:1030;
    inset:0 auto 0 0;
    width:min(86vw,320px);
    height:100vh;
    height:100dvh;
    transform:translateX(-102%);
    border-radius:0;
    padding-bottom:calc(28px + env(safe-area-inset-bottom, 0px));
    box-shadow:0 24px 60px rgba(8,18,39,.35);
  }
  .sidebar.is-open{transform:translateX(0)}
  .mobile-overlay{position:fixed;inset:0;background:rgba(11,26,48,.32);z-index:1025}
  .mobile-overlay.is-open{display:block}
  .topbar{display:none}
  .main{
    margin-left:0;
    margin-top:112px;
    padding:12px;
    width:100%;
    max-width:100%;
    overflow-x:hidden;
  }
  .mobile-header{
    position:fixed;
    left:0;
    right:0;
    top:0;
    z-index:1020;
    display:grid;
    gap:8px;
    padding:8px 14px 10px;
    background:rgba(255,255,255,.86);
    border-bottom:1px solid rgba(203,219,232,.8);
    backdrop-filter:blur(12px);
    box-shadow:0 8px 24px rgba(17,39,73,.06);
  }
  .mobile-header-main{display:grid;grid-template-columns:auto minmax(0,1fr) 46px 64px;gap:8px;align-items:center}
  .mobile-greeting{
    min-height:var(--topbar-control-h);
    height:var(--topbar-control-h);
    border-radius:18px;
    border:1px solid #d5e8ee;
    background:linear-gradient(180deg,#f8fcff 0%,#edf5fb 100%);
    display:flex;
    align-items:center;
    gap:8px;
    padding:4px 10px 4px 6px;
    min-width:0;
    color:#204564;
  }
  .mobile-greeting .top-pill-asset{width:36px;min-width:36px;height:36px;border-radius:12px}
  .mobile-greeting .top-pill-title{font-size:13px}
.mobile-context{
    display:flex;
    min-height:var(--topbar-control-h);
    height:var(--topbar-control-h);
    border-radius:18px;
    border:1px solid #d5e3ef;
    background:linear-gradient(180deg,#f7fbff 0%,#eef5fb 100%);
    align-items:center;
    gap:10px;
    padding:4px 12px 4px 6px;
  width:100%;
}

.mobile-context-secondary{
  background:linear-gradient(180deg,#f9fcff 0%,#f1f7fb 100%);
}
  .mobile-context .top-pill-asset{width:36px;min-width:36px;height:36px;border-radius:12px}
  .mobile-context .top-pill-title{font-size:12px;white-space:nowrap;line-height:1.1}
  .content{padding:0}
  .hero-card p{font-size:14px}
  .card-grid,
  .summary-grid,
  .metric-strip,
  .two-col,
  .detail-grid.two,
  .detail-grid.three,
  .dual-persona,
  .field-grid,
  .didactic-guide-body,
  .client-entry-grid,
  .stat-pair,
  .brand-wall{grid-template-columns:1fr}
  .client-span-2,
  .client-span-3,
  .client-span-4,
  .client-span-6,
  .client-span-12{grid-column:1 / -1}
  .brand-check-grid{grid-template-columns:repeat(auto-fit,minmax(128px,1fr))}
  .form-actions,
  .cadastro-row,
  .finance-row,
  .auth-panel{grid-template-columns:1fr}
}

@media (max-width:620px){
  .notice-drawer{
    top:10px;
    right:10px;
    bottom:10px;
    width:calc(100vw - 20px);
    border-radius:24px;
  }
  .auth-shell{padding:10px}
  .zero-shell{padding:0}
  .app-frame{min-height:100vh;border-radius:0}
  .mobile-header-main{grid-template-columns:auto minmax(0,1fr) 46px 64px}
  .mobile-toggle,.top-icon-button,.mobile-greeting{min-height:48px;border-radius:16px}
  .mobile-context{min-height:46px;border-radius:16px}
  .hero-card,.surface-card{border-radius:18px}
  .hero-card{padding:16px}
  .hero-card h1{font-size:24px}
  .hero-card p{font-size:14px}
  .surface-card{padding:16px}
  .auth-copy,.auth-card{padding:20px;border-radius:24px}
  .auth-copy h1{font-size:34px}
  .auth-logo-large{width:min(100%, 320px)}
  .modal-backdrop{padding:12px}
  .modal-card{width:min(520px,calc(100vw - 24px));padding:20px;border-radius:24px}
  .auth-brand-wall{grid-template-columns:repeat(2,minmax(0,1fr))}
  .list-row{min-height:58px;border-radius:18px;padding:0 14px}
  .list-row strong{font-size:15px}
  .list-row span{font-size:13px}
  .sidebar-link{min-height:52px;font-size:16px}
  .sidebar-brand{min-height:var(--topbar-height);height:var(--topbar-height);padding:8px 18px}
}

body.preview-compact .app-frame{grid-template-columns:1fr}
body.preview-compact .sidebar{
  position:fixed;
  z-index:30;
  inset:0 auto 0 0;
  width:min(82vw,320px);
  height:100vh;
  height:100dvh;
  transform:translateX(-102%);
  transition:transform .22s ease;
  border-radius:0;
  padding-bottom:calc(28px + env(safe-area-inset-bottom, 0px));
  box-shadow:0 24px 60px rgba(8,18,39,.35);
}
body.preview-compact .sidebar.is-open{transform:translateX(0)}
body.preview-compact .mobile-overlay{position:fixed;inset:0;background:rgba(11,26,48,.32);z-index:20}
body.preview-compact .mobile-overlay.is-open{display:block}
body.preview-compact .topbar{display:none}
body.preview-compact .mobile-header{display:grid;gap:14px;padding:20px 18px 0}
body.preview-compact .mobile-header-main{display:grid;grid-template-columns:auto minmax(0,1fr) 56px 74px;gap:10px;align-items:center}
body.preview-compact .mobile-greeting{
  min-height:54px;
  border-radius:18px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,#fafdff,#edf5fc);
  display:flex;
  align-items:center;
  gap:10px;
  padding:0 12px;
  min-width:0;
}
body.preview-compact .mobile-greeting .top-pill-asset{width:42px;min-width:42px;height:42px;border-radius:14px}
body.preview-compact .mobile-greeting .top-pill-title{font-size:16px}
body.preview-compact .mobile-context{
  display:flex;
  min-height:76px;
  border-radius:22px;
  border:1px solid var(--line);
  background:linear-gradient(180deg,#fafdff,#edf5fc);
  align-items:center;
  gap:12px;
  padding:10px 14px;
}
body.preview-compact .mobile-context .top-pill-asset{width:56px;min-width:56px;height:56px;border-radius:18px}
body.preview-compact .mobile-context .top-pill-title{font-size:16px;white-space:normal;line-height:1.15}
body.preview-compact .content{padding:18px}
body.preview-compact .hero-card p{font-size:18px}
body.preview-compact .card-grid,
body.preview-compact .summary-grid,
body.preview-compact .metric-strip,
body.preview-compact .two-col,
body.preview-compact .detail-grid.two,
body.preview-compact .detail-grid.three,
body.preview-compact .dual-persona,
body.preview-compact .field-grid,
body.preview-compact .didactic-guide-body,
body.preview-compact .client-entry-grid,
body.preview-compact .stat-pair,
body.preview-compact .brand-wall{grid-template-columns:1fr}
body.preview-compact .client-span-2,
body.preview-compact .client-span-3,
body.preview-compact .client-span-4,
body.preview-compact .client-span-6,
body.preview-compact .client-span-12{grid-column:1 / -1}
body.preview-compact .brand-check-grid{grid-template-columns:repeat(auto-fit,minmax(128px,1fr))}
body.preview-compact .form-actions,
body.preview-compact .cadastro-row,
body.preview-compact .finance-row,
body.preview-compact .auth-panel{grid-template-columns:1fr}

body.preview-mobile .notice-drawer{
  top:10px;
  right:10px;
  bottom:10px;
  width:calc(100vw - 20px);
  border-radius:24px;
}
body.preview-mobile .auth-shell{padding:10px}
body.preview-mobile .zero-shell{padding:0}
body.preview-mobile .app-frame{min-height:100vh;border-radius:0}
body.preview-mobile .mobile-header-main{grid-template-columns:auto minmax(0,1fr) 46px 64px}
body.preview-mobile .mobile-toggle,
body.preview-mobile .top-icon-button,
body.preview-mobile .mobile-greeting{min-height:48px;border-radius:16px}
body.preview-mobile .mobile-context{min-height:46px;border-radius:16px}
body.preview-mobile .hero-card,
body.preview-mobile .surface-card{border-radius:24px}
body.preview-mobile .hero-card{padding:22px 20px}
body.preview-mobile .hero-card h1{font-size:34px}
body.preview-mobile .hero-card p{font-size:17px}
body.preview-mobile .surface-card{padding:20px}
body.preview-mobile .auth-copy,
body.preview-mobile .auth-card{padding:20px;border-radius:24px}
body.preview-mobile .auth-copy h1{font-size:34px}
body.preview-mobile .auth-logo-large{width:min(100%, 320px)}
body.preview-mobile .auth-brand-wall{grid-template-columns:repeat(2,minmax(0,1fr))}
body.preview-mobile .list-row{min-height:58px;border-radius:18px;padding:0 14px}
body.preview-mobile .list-row strong{font-size:15px}
body.preview-mobile .list-row span{font-size:13px}
body.preview-mobile .sidebar-link{min-height:52px;font-size:16px}
body.preview-mobile .sidebar{
  border-radius:0;
  height:100vh;
  height:100dvh;
  padding-bottom:calc(28px + env(safe-area-inset-bottom, 0px));
}
body.preview-mobile .sidebar-brand{
  min-height:var(--topbar-height);
  height:var(--topbar-height);
  padding:8px 18px;
}
