/* ===== Tema CDA (marca teal/ciano) + experiência estilo Fleury ===== */
:root {
  /* tokens "--red*" mantidos por compatibilidade, mas com as cores da marca CDA (teal) */
  /* Paleta oficial CDA (guia de marca): teal Pantone 326C #00B0AB + secundárias */
  --red:#00B0AB; --red-dark:#008191; --red-soft:#e6fbfa;
  --cda:#00B0AB; --cda-dark:#008191; --cda-2:#007DC4; --cda-soft:#e6fbfa; --cda-soft2:#a9ece9;
  --ink:#1f2430; --muted:#6b7280; --muted-2:#9aa1ad;
  --line:#e8eaed; --bg:#ffffff; --soft:#f5f6f8;
  --info-bg:#eef0fb; --info-tx:#4f46e5;
  --green-bg:#dcfce7; --green-tx:#15803d;
  --amber-bg:#fef3c7; --amber-tx:#b45309;
  --blue-bg:#e0edff; --blue-tx:#1d4ed8;
  --radius:14px; --radius-sm:10px; --tap:44px;
  --shadow:0 1px 2px rgba(16,24,40,.04), 0 6px 20px -8px rgba(16,24,40,.12);
  --shadow-lg:0 12px 40px -12px rgba(16,24,40,.22);
  --safe-b:env(safe-area-inset-bottom,0px);
  --font:"Poppins",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --side-w:96px;
}
* { box-sizing:border-box; }
[hidden] { display:none !important; }
html { -webkit-text-size-adjust:100%; }
body { margin:0; font-family:var(--font); background:var(--bg); color:var(--ink); line-height:1.5; -webkit-font-smoothing:antialiased; }
h1,h2,h3 { line-height:1.2; margin:0; }
button { font-family:inherit; cursor:pointer; }
input,button,select { font-size:16px; }
:focus-visible { outline:3px solid rgba(226,55,68,.4); outline-offset:2px; border-radius:6px; }
a { color:inherit; }

/* ===== Marca ===== */
.brand { display:flex; align-items:center; gap:10px; }
.brand__logo { display:grid; place-items:center; width:40px; height:40px; border-radius:11px; background:linear-gradient(135deg,var(--red),var(--red-dark)); color:#fff; }
.brand--sm .brand__logo { width:34px; height:34px; border-radius:9px; }
.brand__name { font-weight:800; letter-spacing:-.02em; font-size:1.15rem; }
.brand__name b { color:var(--red); }

/* ===== LOGIN ===== */
.login { min-height:100dvh; display:grid; place-items:center; padding:24px; background:radial-gradient(900px 500px at 50% -10%, var(--red-soft), transparent 60%), var(--bg); }
.login__card { width:100%; max-width:400px; background:var(--bg); border:1px solid var(--line); border-radius:22px; padding:34px 26px; box-shadow:var(--shadow-lg); }
.login__card .brand { justify-content:center; margin-bottom:22px; }
.login h1 { font-size:1.5rem; text-align:center; letter-spacing:-.02em; }
.login__sub { text-align:center; color:var(--muted); margin:8px 0 24px; }
.login__foot { text-align:center; color:var(--muted-2); font-size:.8rem; margin:20px 0 0; }

/* ===== LOGIN dividido (estilo Fleury) ===== */
.login-split { min-height:100dvh; display:grid; grid-template-columns:1fr; }
.login-hero { display:none; position:relative; overflow:hidden; padding:64px 56px; background:linear-gradient(160deg, #fff 0%, var(--cda-soft) 100%); }
.login-hero h1 { color:var(--cda); font-size:2.2rem; letter-spacing:-.02em; }
.login-hero p { color:var(--ink); font-size:1.25rem; max-width:420px; margin-top:16px; font-weight:500; }
.login-hero__dots { position:absolute; inset:0; background-image:radial-gradient(var(--cda-soft2) 2px, transparent 2px); background-size:26px 26px; opacity:.5; -webkit-mask-image:radial-gradient(120% 90% at 20% 90%, #000, transparent 70%); mask-image:radial-gradient(120% 90% at 20% 90%, #000, transparent 70%); }
.login-hero__in { position:relative; z-index:1; }
.login-panel { display:grid; place-items:center; padding:32px 24px; }
.login-panel__card { width:100%; max-width:380px; }
.login-panel__card .brand { margin-bottom:26px; }
.login-panel h2 { font-size:1.7rem; letter-spacing:-.02em; }
.login-panel__sub { color:var(--muted); margin:6px 0 22px; }
.login-panel__sub a, .link-inline { color:var(--cda); font-weight:700; }
.field__hint { font-size:.78rem; color:var(--muted); margin:4px 2px 0; }

/* ===== Canais de verificação (estilo Fleury) ===== */
.canal { display:flex; align-items:center; gap:14px; width:100%; padding:16px 18px; margin-bottom:12px; border:1.5px solid var(--line); border-radius:16px; background:var(--bg); text-align:left; transition:border-color .15s, box-shadow .15s; }
.canal:hover { border-color:var(--cda); box-shadow:var(--shadow); }
.canal__ico { display:grid; place-items:center; width:36px; height:36px; flex-shrink:0; color:var(--cda); }
.canal__tx b { display:block; font-weight:700; }
.canal__tx span { color:var(--muted); font-size:.9rem; }

@media (min-width:900px) {
  .login-split { grid-template-columns:1.1fr 1fr; }
  .login-hero { display:block; }
}

/* ===== Card de dados do paciente ===== */
.patient-card { background:linear-gradient(135deg, var(--cda-soft), #fff); border:1px solid var(--cda-soft2); border-radius:var(--radius); padding:18px; margin-bottom:22px; }
.patient-card__top { display:flex; align-items:center; gap:14px; margin-bottom:14px; }
.patient-card__av { display:grid; place-items:center; width:48px; height:48px; border-radius:50%; background:var(--cda); color:#fff; font-weight:800; font-size:1.1rem; }
.patient-card__name { font-weight:800; font-size:1.1rem; text-transform:capitalize; }
.patient-card__cod { color:var(--muted); font-size:.85rem; }
.patient-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(150px,1fr)); gap:10px 18px; }
.patient-grid div span { display:block; color:var(--muted); font-size:.74rem; text-transform:uppercase; letter-spacing:.03em; }
.patient-grid div b { font-weight:600; font-size:.92rem; }

/* ===== Campos ===== */
.field { display:block; margin-bottom:16px; }
.field__label { display:block; font-size:.85rem; font-weight:600; color:var(--muted); margin-bottom:6px; }
.field input, .fld { width:100%; min-height:var(--tap); padding:12px 14px; border:1.5px solid var(--line); border-radius:var(--radius-sm); background:var(--bg); color:var(--ink); transition:border-color .15s, box-shadow .15s; }
.field input:focus, .fld:focus { border-color:var(--red); box-shadow:0 0 0 4px var(--red-soft); outline:none; }
.field__pwd { position:relative; display:block; }
.field__toggle { position:absolute; right:6px; top:50%; transform:translateY(-50%); width:var(--tap); height:var(--tap); border:0; background:transparent; font-size:18px; opacity:.6; }

/* ===== Botões ===== */
.btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:var(--tap); padding:12px 18px; border:0; border-radius:999px; font-weight:700; transition:transform .05s, background .15s, opacity .15s; }
.btn:active { transform:scale(.98); }
.btn--primary { background:var(--red); color:#fff; }
.btn--primary:hover { background:var(--red-dark); }
.btn--block { width:100%; }
.btn[aria-busy="true"] { pointer-events:none; opacity:.8; }
.btn__spinner { display:none; width:18px; height:18px; border:2.5px solid rgba(255,255,255,.4); border-top-color:#fff; border-radius:50%; animation:spin .7s linear infinite; }
.btn[aria-busy="true"] .btn__spinner { display:inline-block; }
@keyframes spin { to { transform:rotate(360deg); } }

.alert { padding:10px 14px; border-radius:var(--radius-sm); font-size:.9rem; margin:0 0 16px; }
.alert--error { background:var(--red-soft); color:#b3261e; }
.alert--ok { background:var(--green-bg); color:var(--green-tx); }
.link-esqueci { display:block; width:100%; margin-top:12px; background:none; border:0; color:var(--red); font-weight:700; font-size:.9rem; padding:8px; }
.otp-info { text-align:center; color:var(--muted); font-size:.9rem; margin:0 0 16px; }
.otp-info b { color:var(--ink); }
.otp-input { text-align:center; letter-spacing:.4em; font-size:1.4rem !important; font-weight:700; }

/* ===== Topbar ===== */
.fl-top { position:sticky; top:0; z-index:30; background:var(--bg); border-bottom:1px solid var(--line); }
.fl-top__in { display:flex; align-items:center; justify-content:space-between; padding:12px 20px; gap:16px; }
.fl-user { display:flex; align-items:center; gap:12px; }
.fl-bell { display:grid; place-items:center; width:var(--tap); height:var(--tap); border:0; background:transparent; border-radius:12px; color:var(--muted); }
.fl-bell:hover { background:var(--soft); color:var(--ink); }
.fl-acct { display:flex; align-items:center; gap:10px; border:0; background:transparent; padding:4px 8px; border-radius:12px; }
.fl-acct:hover { background:var(--soft); }
.fl-avatar { display:grid; place-items:center; width:38px; height:38px; border-radius:50%; background:var(--red-soft); color:var(--red); font-weight:800; }
.fl-acct__txt { display:flex; flex-direction:column; text-align:left; line-height:1.2; }
.fl-acct__hi { font-weight:700; font-size:.92rem; }
.fl-acct__role { font-size:.76rem; color:var(--muted); }

/* ===== Shell: sidebar + main ===== */
.fl-shell { display:flex; min-height:calc(100dvh - 63px); }
.fl-side { width:var(--side-w); flex-shrink:0; border-right:1px solid var(--line); padding:14px 8px; display:flex; flex-direction:column; gap:4px; position:sticky; top:63px; align-self:flex-start; height:calc(100dvh - 63px); }
.fl-nav { display:flex; flex-direction:column; align-items:center; gap:6px; width:100%; padding:12px 6px; border:0; background:transparent; border-radius:12px; color:var(--muted); font-size:.72rem; font-weight:600; text-align:center; }
.fl-nav svg { width:24px; height:24px; }
.fl-nav:hover { background:var(--soft); color:var(--ink); }
.fl-nav.is-active { background:var(--soft); color:var(--red); }
.fl-main { flex:1; min-width:0; padding:28px 28px calc(40px + var(--safe-b)); max-width:1000px; }

/* ===== Cabeçalho de seção ===== */
.sec-head { display:flex; align-items:center; gap:12px; margin-bottom:8px; }
.sec-head__ico { display:grid; place-items:center; width:30px; height:30px; color:var(--ink); }
.sec-head h2 { font-size:1.6rem; letter-spacing:-.02em; }
.sec-divider { height:1px; background:var(--line); margin:14px 0 22px; }
.sec-sub { color:var(--muted); margin:-8px 0 18px; }
.greeting { margin-bottom:18px; }
.greeting__hi { color:var(--muted); }
.greeting__name { font-size:1.5rem; letter-spacing:-.02em; text-transform:capitalize; }

/* ===== Busca em pílula ===== */
.searchbar { display:flex; align-items:center; gap:12px; margin-bottom:22px; }
.search { position:relative; flex:1; max-width:440px; }
.search input { width:100%; min-height:48px; padding:12px 48px 12px 18px; border:1.5px solid var(--line); border-radius:999px; background:var(--bg); color:var(--ink); }
.search input:focus { border-color:var(--red); box-shadow:0 0 0 4px var(--red-soft); outline:none; }
.search__ico { position:absolute; right:8px; top:50%; transform:translateY(-50%); width:34px; height:34px; display:grid; place-items:center; color:var(--muted); }

/* ===== Barra de pagamento/paciente (estilo Dasa) ===== */
.paybar { display:flex; flex-wrap:wrap; gap:10px; background:var(--cda-dark); border-radius:16px; padding:14px 18px; color:#fff; }
.paybar__cell { flex:1; min-width:150px; display:flex; flex-direction:column; gap:3px; }
.paybar__cell > span { font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; opacity:.8; }
.paybar__cell > b { font-weight:700; }
.fld--inline { background:rgba(255,255,255,.12); border:1px solid rgba(255,255,255,.25); color:#fff; min-height:38px; padding:6px 10px; border-radius:10px; max-width:280px; }
.fld--inline option { color:#1f2430; }

/* ===== Card de agendamento (estilo CDB) ===== */
.sched-card { border:1px solid var(--line); border-radius:18px; padding:20px; background:var(--bg); box-shadow:var(--shadow); }
.sched-pat { font-size:.9rem; color:var(--muted); margin-bottom:16px; }
.sched-pat b { color:var(--ink); text-transform:capitalize; }
.sched-label { font-weight:700; margin:18px 0 10px; color:var(--ink); }
.sched-label:first-of-type { margin-top:0; }
.paytabs { display:inline-flex; gap:8px; flex-wrap:wrap; }
.paytab { padding:10px 20px; border:1.5px solid var(--cda); border-radius:10px; background:var(--bg); color:var(--cda); font-weight:700; }
.paytab.is-active { background:var(--cda-dark); border-color:var(--cda-dark); color:#fff; }
.pay-fields { margin-top:14px; }
.pay-fields[hidden] { display:none; }
.pay-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px 16px; }
@media (max-width:560px){ .pay-grid { grid-template-columns:1fr; } }

/* ===== Item de exame (carrinho) ===== */
.exam { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; background:var(--bg); border:1px solid var(--line); border-radius:var(--radius); padding:16px; box-shadow:var(--shadow); }
.exam__main { min-width:0; }
.exam__name { font-weight:700; letter-spacing:-.01em; }
.exam__mn { color:var(--muted); font-size:.8rem; margin-top:2px; }
.exam__prep { margin-top:10px; }
.exam__preplink { background:none; border:0; color:var(--cda); font-weight:700; font-size:.84rem; padding:0; display:inline-flex; align-items:center; gap:4px; }
.exam__prepbox { margin-top:8px; font-size:.86rem; color:var(--ink); background:var(--cda-soft); border-radius:10px; padding:10px 12px; line-height:1.45; }
.exam__prepbox h5 { margin:8px 0 2px; font-size:.74rem; text-transform:uppercase; letter-spacing:.03em; color:var(--cda-dark); }
.exam__prepbox h5:first-child { margin-top:0; }
.exam__prazo { display:flex; align-items:center; gap:6px; font-weight:600; color:var(--cda-dark); background:#fff; border:1px solid var(--cda-soft2); border-radius:8px; padding:7px 10px; margin-bottom:8px; }
.exam__prazo svg { width:15px; height:15px; flex-shrink:0; }
.exam__add { flex-shrink:0; display:inline-flex; align-items:center; gap:6px; min-height:38px; padding:8px 14px; border-radius:999px; border:1.5px solid var(--cda); background:var(--bg); color:var(--cda); font-weight:700; font-size:.86rem; white-space:nowrap; }
.exam__add:hover { background:var(--cda-soft); }
.exam.is-sel { border-color:var(--cda); }
.exam.is-sel .exam__add { background:var(--cda); color:#fff; }

/* ===== Início (hub estilo Dasa) ===== */
.home-greet { margin-bottom:18px; }
.home-greet p { color:var(--muted); margin:0; }
.home-greet h2 { font-size:1.7rem; letter-spacing:-.02em; text-transform:capitalize; }
.home-hero { display:grid; grid-template-columns:repeat(auto-fit,minmax(260px,1fr)); gap:14px; margin-bottom:8px; }
.hero-card { display:flex; align-items:center; gap:14px; padding:18px; border:1px solid var(--line); border-radius:18px; text-align:left; background:var(--bg); box-shadow:var(--shadow); transition:transform .1s ease, box-shadow .15s, border-color .15s; }
.hero-card:hover { transform:translateY(-2px); box-shadow:var(--shadow-lg); border-color:transparent; }
.hero-card__badge { display:grid; place-items:center; width:50px; height:50px; border-radius:14px; color:#fff; flex-shrink:0; }
.hero-card--a .hero-card__badge { background:linear-gradient(145deg, var(--cda), var(--cda-dark)); }
.hero-card--b .hero-card__badge { background:linear-gradient(145deg, #2aa9c0, var(--cda-2)); }
.hero-card--c .hero-card__badge { background:linear-gradient(145deg, #2bb673, #0f766e); }
.hero-card__body { flex:1; min-width:0; display:flex; flex-direction:column; gap:3px; }
.hero-card__tt { font-size:1.05rem; font-weight:750; letter-spacing:-.015em; color:var(--ink); line-height:1.2; }
.hero-card__sb { font-size:.84rem; color:var(--muted); line-height:1.3; }
.hero-card__arrow { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:var(--soft); color:var(--muted); flex-shrink:0; transition:background .15s, color .15s, transform .15s; }
.hero-card--a:hover .hero-card__arrow { background:var(--cda); color:#fff; }
.hero-card--b:hover .hero-card__arrow { background:#0a6b77; color:#fff; }
.hero-card--c:hover .hero-card__arrow { background:#0f766e; color:#fff; }
.short__ic { display:grid; place-items:center; width:42px; height:42px; border-radius:12px; background:var(--cda-soft); color:var(--cda-dark); }
.short__ic svg { width:22px; height:22px; }
.hero-card:hover .hero-card__arrow { transform:translateX(2px); }
.home-short { display:grid; grid-template-columns:repeat(auto-fit,minmax(92px,1fr)); gap:10px; }
.short { display:flex; flex-direction:column; align-items:center; gap:9px; padding:16px 6px; border:1px solid var(--line); border-radius:16px; background:var(--bg); color:var(--ink); font-size:.78rem; font-weight:600; box-shadow:var(--shadow); transition:transform .08s, border-color .15s; }
.short:hover { border-color:var(--cda); }
.short span { font-size:1.5rem; }
.short:active { transform:scale(.97); }
.resumo-card { display:flex; align-items:center; gap:14px; }
.resumo { display:flex; flex-direction:column; gap:2px; }
.resumo__n { font-size:1.5rem; font-weight:800; letter-spacing:-.02em; }
.resumo__l { color:var(--muted); font-size:.88rem; }

/* ===== Banner info ===== */
.info-banner { display:flex; align-items:center; gap:10px; background:var(--info-bg); color:var(--info-tx); padding:14px 18px; border-radius:12px; font-weight:500; }
.info-banner--warn { background:var(--amber-bg); color:var(--amber-tx); }

/* ===== Cards ===== */
.section-h { font-size:.82rem; text-transform:uppercase; letter-spacing:.05em; color:var(--muted); margin:24px 2px 12px; }
.cards { display:grid; gap:12px; }
.cards--compact { gap:8px; }
.card { background:var(--bg); border:1px solid var(--line); border-radius:var(--radius); padding:16px; box-shadow:var(--shadow); transition:transform .08s, border-color .15s, box-shadow .15s; }
.card--tappable { width:100%; text-align:left; display:block; }
.card--tappable:hover { border-color:var(--red); box-shadow:var(--shadow-lg); }
.card--tappable:active { transform:scale(.99); }
.card--agenda { border-left:4px solid var(--red); }
.card__top { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; }
.card__date { font-size:.8rem; color:var(--muted); }
.card__title { font-size:1.02rem; font-weight:700; letter-spacing:-.01em; }
.card__meta { display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:10px; font-size:.82rem; color:var(--muted); }
.card__meta b { color:var(--ink); font-weight:600; }
.card__procs { margin:12px 0 0; padding:12px 0 0; border-top:1px dashed var(--line); display:grid; gap:6px; }
.proc { display:flex; align-items:center; justify-content:space-between; gap:8px 12px; font-size:.9rem; flex-wrap:wrap; }
.proc__nm { flex:1; min-width:55%; }
.proc__nm b { color:var(--cda-dark); }

/* ===== Badges ===== */
.badge { display:inline-flex; align-items:center; gap:6px; padding:4px 10px; border-radius:999px; font-size:.76rem; font-weight:700; white-space:nowrap; }
.badge::before { content:""; width:7px; height:7px; border-radius:50%; background:currentColor; }
.badge--ok { background:var(--green-bg); color:var(--green-tx); }
.badge--proc { background:var(--amber-bg); color:var(--amber-tx); }
.badge--info { background:var(--blue-bg); color:var(--blue-tx); }
.badge--warn { background:var(--red-soft); color:#b3261e; }
.badge--neutral { background:var(--soft); color:var(--muted); }

/* ===== Botão laudo/pdf ===== */
.pdf-btn { margin-top:14px; display:inline-flex; align-items:center; gap:8px; min-height:40px; padding:8px 16px; border-radius:999px; background:var(--red); color:#fff; border:0; font-weight:700; font-size:.9rem; }
.pdf-btn:hover { background:var(--red-dark); }
.pdf-btn--ghost { background:var(--red-soft); color:var(--red); }
.pdf-btn--ghost:hover { background:#fcdede; }
.pdf-btn--danger { background:var(--red-soft); color:#b3261e; }
.link-back { background:none; border:0; color:var(--red); font-weight:700; padding:4px 0 12px; font-size:.9rem; }

/* ===== Card de agendamento ===== */
.ag-head { display:flex; align-items:flex-start; gap:14px; }
.ag-cal { display:grid; place-items:center; width:44px; height:44px; border-radius:12px; background:var(--cda-soft); color:var(--cda-dark); flex-shrink:0; }
.ag-cal--hist { background:var(--soft); color:var(--muted); }
.ag-info { flex:1; min-width:0; }
.ag-when { font-size:.8rem; color:var(--muted); margin-bottom:2px; }
.ag-info .card__title { font-size:1.02rem; }
.ag-info .card__meta { margin-top:6px; }
.card__meta span { display:inline-flex; align-items:center; gap:5px; }
.card__meta span svg { opacity:.7; }
.ag-actions { display:flex; gap:8px; margin-top:14px; padding-top:14px; border-top:1px solid var(--line); }
.ag-btn { display:inline-flex; align-items:center; gap:7px; padding:8px 16px; min-height:38px; border-radius:10px; border:0; font-weight:650; font-size:.86rem; transition:background .15s; }
.ag-btn svg { width:16px; height:16px; }
.ag-btn--ghost { background:var(--cda-soft); color:var(--cda-dark); }
.ag-btn--ghost:hover { background:#cdeef2; }
.ag-btn--danger { background:transparent; color:#b3261e; }
.ag-btn--danger:hover { background:var(--red-soft); }
.ag-btn--danger { margin-left:auto; }

/* ===== Slots de horário ===== */
.card--slot { text-align:center; padding:14px 8px; display:flex; flex-direction:column; gap:4px; align-items:center; }
.slot__dow { font-size:.72rem; text-transform:uppercase; letter-spacing:.04em; color:var(--red); font-weight:800; }
.slot__time { font-size:.82rem; color:var(--muted); line-height:1.3; }
.slot__time b { font-size:1.15rem; color:var(--ink); }
.slot__per { font-size:.7rem; color:var(--muted); }

/* ===== Cartão selecionável (orçamento) ===== */
.card--check { position:relative; padding-right:44px; }
.card--check .check { position:absolute; right:12px; top:50%; transform:translateY(-50%); width:28px; height:28px; display:grid; place-items:center; border-radius:50%; background:var(--soft); color:var(--muted); font-weight:800; }
.card--check.is-sel { border-color:var(--red); background:var(--red-soft); }
.card--check.is-sel .check { background:var(--red); color:#fff; }
.floatbar { position:fixed; left:16px; right:16px; bottom:calc(16px + var(--safe-b)); z-index:25; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:12px 16px; background:var(--bg); border:1px solid var(--line); border-radius:999px; box-shadow:var(--shadow-lg); max-width:560px; margin:0 auto; }
.floatbar span { font-weight:700; }

/* ===== Vazio / skeleton ===== */
.empty { text-align:center; color:var(--muted); padding:48px 16px; }
.empty__emoji { font-size:2.5rem; }
.empty__sub { font-size:.85rem; margin-top:4px; opacity:.85; }
.skeleton { position:relative; overflow:hidden; background:var(--soft); border-radius:var(--radius); height:120px; }
.skeleton::after { content:""; position:absolute; inset:0; background:linear-gradient(90deg, transparent, rgba(255,255,255,.7), transparent); transform:translateX(-100%); animation:shimmer 1.3s infinite; }
@keyframes shimmer { to { transform:translateX(100%); } }

/* ===== Bottom nav (mobile) ===== */
.fl-bottom { display:none; position:fixed; inset-inline:0; bottom:0; z-index:40; border-top:1px solid var(--line); background:rgba(255,255,255,.94); backdrop-filter:blur(12px); padding-bottom:var(--safe-b); }
.fl-bottom button { flex:1; display:flex; flex-direction:column; align-items:center; gap:3px; min-height:calc(var(--tap)+12px); padding:8px 4px; border:0; background:transparent; color:var(--muted); font-size:.68rem; font-weight:700; }
.fl-bottom button svg { width:22px; height:22px; }
.fl-bottom button.is-active { color:var(--red); }

/* ===== Modal / bottom sheet ===== */
.modal { position:fixed; inset:0; z-index:60; display:grid; }
.modal__backdrop { position:absolute; inset:0; background:rgba(16,24,40,.45); animation:fade .2s; }
.modal__sheet { position:relative; align-self:center; width:100%; max-width:520px; margin:auto; background:var(--bg); border-radius:20px; padding:26px 22px; max-height:86dvh; overflow-y:auto; box-shadow:var(--shadow-lg); animation:pop .22s ease; }
.modal__close { position:absolute; right:14px; top:14px; width:36px; height:36px; border:0; border-radius:50%; background:var(--soft); color:var(--muted); font-size:16px; }
.modal__title { font-size:1.2rem; padding-right:40px; letter-spacing:-.01em; }
.modal__body { margin-top:16px; }
.modal__hint { color:var(--muted); font-size:.9rem; margin:0 0 16px; }
.modal__body h4 { margin:18px 0 6px; font-size:.78rem; text-transform:uppercase; letter-spacing:.04em; color:var(--muted); }
.modal__body .kv { display:flex; gap:10px; padding:8px 0; border-bottom:1px solid var(--line); font-size:.92rem; }
.modal__body .kv span:first-child { color:var(--muted); min-width:110px; }
@keyframes pop { from { transform:scale(.96); opacity:0; } }
@keyframes fade { from { opacity:0; } }
@keyframes slideup { from { transform:translateY(100%); } }

/* ===== Perfis (Minha família) ===== */
.perfil-list { display:flex; flex-direction:column; gap:8px; }
.perfil { display:flex; align-items:center; gap:12px; width:100%; padding:12px 14px; border:1.5px solid var(--line); border-radius:14px; background:var(--bg); text-align:left; }
.perfil:hover { border-color:var(--cda); }
.perfil.is-ativo { border-color:var(--cda); background:var(--cda-soft); }
.perfil__av { display:grid; place-items:center; width:38px; height:38px; border-radius:50%; background:var(--cda); color:#fff; font-weight:800; flex-shrink:0; }
.perfil__tx { flex:1; min-width:0; }
.perfil__tx b { display:block; text-transform:capitalize; }
.perfil__tx span { color:var(--muted); font-size:.8rem; }
.perfil__ck { color:var(--cda); font-weight:800; }
.addfam { width:100%; margin-top:12px; padding:12px; border:1.5px dashed var(--cda-soft2); border-radius:14px; background:var(--cda-soft); color:var(--cda); font-weight:700; }
.addfam:hover { background:#e0f7fb; }

/* ===== Acessibilidade ===== */
.a11y-row { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:14px 0; border-bottom:1px solid var(--line); }
.a11y-ctrl { display:flex; align-items:center; gap:12px; }
.a11y-ctrl button { width:42px; height:42px; border-radius:12px; border:1.5px solid var(--cda-soft2); background:var(--cda-soft); color:var(--cda-dark); font-weight:800; }
.a11y-ctrl b { min-width:48px; text-align:center; font-weight:700; }
.a11y-toggle { width:52px; height:30px; border-radius:999px; border:0; background:var(--slate-200,#e2e8f0); position:relative; transition:background .15s; }
.a11y-toggle span { position:absolute; top:3px; left:3px; width:24px; height:24px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.2); transition:transform .15s; }
.a11y-toggle.is-on { background:var(--cda); }
.a11y-toggle.is-on span { transform:translateX(22px); }
/* Modo alto contraste */
body.alto-contraste { --ink:#000; --muted:#3a3a3a; --line:#888; --bg:#fff; }
body.alto-contraste .card, body.alto-contraste .exam, body.alto-contraste .hero-card, body.alto-contraste .short { border-width:2px; border-color:#000; }
body.alto-contraste .badge { outline:1px solid currentColor; }
body.alto-contraste .fl-nav, body.alto-contraste .fl-bottom button { color:#000; }

/* ===== Toast ===== */
.toast { position:fixed; left:16px; right:16px; bottom:calc(86px + var(--safe-b)); z-index:70; margin:0 auto; max-width:480px; padding:14px 18px; border-radius:14px; color:#fff; font-weight:700; text-align:center; box-shadow:var(--shadow-lg); animation:slideup .25s; }
.toast--ok { background:var(--green-tx); }
.toast--err { background:#b3261e; }
.toast--info { background:var(--red-dark); }

/* ===== Mobile ===== */
@media (max-width:760px) {
  .fl-side { display:none; }
  .fl-bottom { display:flex; }
  .fl-main { padding:20px 16px calc(96px + var(--safe-b)); }
  .sec-head h2 { font-size:1.35rem; }
  .fl-acct__txt { display:none; }
  .cards { grid-template-columns:1fr; }
}
@media (min-width:761px) {
  .cards--compact { grid-template-columns:1fr 1fr 1fr; }
  .cards--2 { grid-template-columns:1fr 1fr; }
}
@media (prefers-reduced-motion:reduce) { *,*::after { animation:none !important; transition:none !important; } }

/* ===== Saúde — linha do tempo ===== */
.tl-stats { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; margin-bottom:18px; }
.tl-stat { display:flex; flex-direction:column; align-items:center; gap:2px; padding:14px 8px; border:1px solid var(--line); border-radius:var(--radius); background:var(--bg); cursor:pointer; transition:.15s; }
.tl-stat:hover { background:var(--cda-soft); border-color:var(--cda-soft2); }
.tl-stat__n { font-size:1.5rem; font-weight:800; color:var(--cda); line-height:1; }
.tl-stat__l { font-size:.74rem; font-weight:600; color:var(--muted); text-align:center; }
.tl-filters { display:flex; gap:8px; overflow-x:auto; padding-bottom:4px; margin-bottom:18px; -webkit-overflow-scrolling:touch; }
.tl-chip { flex:0 0 auto; padding:7px 15px; border:1px solid var(--line); border-radius:999px; background:var(--bg); color:var(--muted); font-size:.82rem; font-weight:700; cursor:pointer; transition:.15s; }
.tl-chip:hover { color:var(--ink); }
.tl-chip.is-active { background:var(--cda); border-color:var(--cda); color:#fff; }

.timeline { position:relative; padding-left:34px; }
.timeline::before { content:''; position:absolute; left:15px; top:6px; bottom:6px; width:2px; background:var(--line); }
.tl-group { position:relative; margin:18px 0 12px -34px; padding-left:34px; font-size:.78rem; font-weight:800; letter-spacing:.03em; text-transform:uppercase; color:var(--muted-2); }
.tl-group:first-child { margin-top:0; }
.tl-row { position:relative; margin-bottom:12px; padding:14px 16px; border:1px solid var(--line); border-radius:var(--radius); background:var(--bg); box-shadow:var(--shadow); }
.tl-dot { position:absolute; left:-34px; top:14px; width:30px; height:30px; display:grid; place-items:center; border-radius:50%; background:var(--soft); color:var(--muted); box-shadow:0 0 0 4px var(--bg); }
.tl-dot svg { width:16px; height:16px; }
.tl--ag .tl-dot { background:var(--blue-bg); color:var(--blue-tx); }
.tl--res .tl-dot { background:var(--green-bg); color:var(--green-tx); }
.tl--hist .tl-dot { background:var(--cda-soft); color:var(--cda-dark); }
.tl-body { display:flex; flex-direction:column; gap:6px; }
.tl-top { display:flex; align-items:center; justify-content:space-between; gap:10px; }
.tl-when { font-size:.8rem; font-weight:700; color:var(--muted); }
.tl-title { font-size:1rem; font-weight:700; color:var(--ink); }
.tl-actions { display:flex; gap:8px; margin-top:4px; }
body.alto-contraste .tl-row, body.alto-contraste .tl-stat { border-width:2px; border-color:#000; }

/* ===== Resultados — toolbar e destaque de laudo pronto ===== */
.res-toolbar { display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; margin-bottom:14px; }
.res-toolbar .tl-filters { margin-bottom:0; flex:1 1 auto; }
.res-toolbar #res-periodo { flex:0 0 auto; min-width:160px; }
#res-resumo { margin-bottom:14px; }
.card--pronto { border-color:var(--cda-soft2); }
.card--pronto::before { content:''; position:absolute; left:0; top:0; bottom:0; width:4px; border-radius:var(--radius) 0 0 var(--radius); background:var(--green-tx); }
.card { position:relative; }
@media (max-width:760px){ .res-toolbar #res-periodo { width:100%; } }

/* ===== Compartilhar laudo ===== */
.laudo-acts { display:flex; gap:8px; flex-wrap:wrap; margin-top:12px; }
.laudo-acts .pdf-btn { margin-top:0; flex:1 1 auto; justify-content:center; }
.share-meta { display:flex; flex-direction:column; gap:2px; background:var(--soft); border-radius:12px; padding:12px 14px; margin-bottom:16px; }
.share-meta span { font-size:.78rem; color:var(--muted); font-weight:600; }
.share-meta b { color:var(--ink); }
.share-link { display:flex; gap:8px; margin-top:6px; }
.share-link input { flex:1 1 auto; min-width:0; border:1px solid var(--line); border-radius:10px; padding:10px 12px; font-size:.9rem; background:var(--soft); color:var(--ink); }
.share-link .btn { flex:0 0 auto; background:var(--soft); color:var(--ink); border:1px solid var(--line); }
.share-ativos { margin-top:18px; }
.share-h { font-size:.82rem; font-weight:800; text-transform:uppercase; letter-spacing:.03em; color:var(--muted-2); margin:0 0 10px; }
.share-item { display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 0; border-top:1px solid var(--line); }
.share-item__tx { display:flex; flex-direction:column; gap:1px; font-size:.9rem; }
.share-item__tx span { font-size:.76rem; color:var(--muted); }
.ag-btn.ag-btn--danger { flex:0 0 auto; }
body.alto-contraste .share-meta, body.alto-contraste .share-link input { border:1px solid #000; }

/* ===========================================================================
   VIDA & COR — paleta multicolor por seção + apresentação mais viva
   (100% CSS, sem mexer no HTML/JS)
   =========================================================================== */
:root {
  --c-inicio:#00B0AB; --c-saude:#16a34a; --c-resultados:#007DC4; --c-agendar:#7c3aed;
  --c-orcamento:#ea8a0c; --c-coleta:#e11d48; --c-vacinas:#0d9488; --c-unidades:#4f46e5; --c-familia:#c026d3;
  --shadow:0 1px 2px rgba(16,24,40,.04), 0 8px 24px -12px rgba(14,138,153,.22);
  --shadow-lg:0 16px 44px -14px rgba(14,138,153,.30);
}

/* Fundo levemente tonalizado para os cards brancos "saltarem" */
body { background:linear-gradient(180deg,#f6fbfc 0%, #eef5f7 38%, #f4f1fb 100%); background-attachment:fixed; }
.login { background:radial-gradient(900px 520px at 50% -10%, var(--cda-soft), transparent 60%), linear-gradient(180deg,#f6fbfc,#eef5f7); }

/* Topbar translúcida + faixa colorida (arco-íris da marca) */
.fl-top { background:rgba(255,255,255,.82); backdrop-filter:saturate(1.4) blur(12px); border-bottom:0; box-shadow:0 1px 0 var(--line); }
.fl-top::after { content:""; display:block; height:3px; background:linear-gradient(90deg,var(--c-saude),var(--c-resultados),var(--c-agendar),var(--c-orcamento),var(--c-coleta),var(--c-vacinas)); }
.fl-avatar { background:linear-gradient(135deg,var(--cda),var(--cda-2)); color:#fff; }

/* Sidebar translúcida + item ativo com pílula colorida e barra de acento */
.fl-side { background:rgba(255,255,255,.55); backdrop-filter:blur(8px); }
.fl-nav { position:relative; transition:background .15s, color .15s; }
.fl-nav[data-tab="inicio"] svg     { color:var(--c-inicio); }
.fl-nav[data-tab="saude"] svg      { color:var(--c-saude); }
.fl-nav[data-tab="resultados"] svg { color:var(--c-resultados); }
.fl-nav[data-tab="agendar"] svg    { color:var(--c-agendar); }
.fl-nav[data-tab="orcamento"] svg  { color:var(--c-orcamento); }
.fl-nav[data-tab="coleta"] svg     { color:var(--c-coleta); }
.fl-nav[data-tab="vacinas"] svg    { color:var(--c-vacinas); }
.fl-nav[data-tab="unidades"] svg   { color:var(--c-unidades); }
.fl-nav#side-familia svg           { color:var(--c-familia); }
.fl-nav.is-active { color:var(--ink); background:transparent; }
.fl-nav.is-active[data-tab="inicio"]     { background:color-mix(in srgb,var(--c-inicio) 13%,#fff); color:var(--c-inicio); }
.fl-nav.is-active[data-tab="saude"]      { background:color-mix(in srgb,var(--c-saude) 13%,#fff); color:var(--c-saude); }
.fl-nav.is-active[data-tab="resultados"] { background:color-mix(in srgb,var(--c-resultados) 13%,#fff); color:var(--c-resultados); }
.fl-nav.is-active[data-tab="agendar"]    { background:color-mix(in srgb,var(--c-agendar) 13%,#fff); color:var(--c-agendar); }
.fl-nav.is-active[data-tab="orcamento"]  { background:color-mix(in srgb,var(--c-orcamento) 14%,#fff); color:var(--c-orcamento); }
.fl-nav.is-active[data-tab="coleta"]     { background:color-mix(in srgb,var(--c-coleta) 13%,#fff); color:var(--c-coleta); }
.fl-nav.is-active[data-tab="vacinas"]    { background:color-mix(in srgb,var(--c-vacinas) 13%,#fff); color:var(--c-vacinas); }
.fl-nav.is-active[data-tab="unidades"]   { background:color-mix(in srgb,var(--c-unidades) 13%,#fff); color:var(--c-unidades); }
.fl-nav.is-active svg { color:currentColor; }
.fl-nav.is-active::before { content:""; position:absolute; left:0; top:18%; bottom:18%; width:4px; border-radius:0 4px 4px 0; background:currentColor; }

/* Bottom nav (mobile) — ícones coloridos + ativo na cor da seção */
.fl-bottom button[data-tab="inicio"] svg     { color:var(--c-inicio); }
.fl-bottom button[data-tab="saude"] svg      { color:var(--c-saude); }
.fl-bottom button[data-tab="resultados"] svg { color:var(--c-resultados); }
.fl-bottom button[data-tab="agendar"] svg    { color:var(--c-agendar); }
.fl-bottom button[data-tab="orcamento"] svg  { color:var(--c-orcamento); }
.fl-bottom button[data-tab="unidades"] svg   { color:var(--c-unidades); }
.fl-bottom button.is-active[data-tab="inicio"]     { color:var(--c-inicio); }
.fl-bottom button.is-active[data-tab="saude"]      { color:var(--c-saude); }
.fl-bottom button.is-active[data-tab="resultados"] { color:var(--c-resultados); }
.fl-bottom button.is-active[data-tab="agendar"]    { color:var(--c-agendar); }
.fl-bottom button.is-active[data-tab="orcamento"]  { color:var(--c-orcamento); }
.fl-bottom button.is-active[data-tab="unidades"]   { color:var(--c-unidades); }
.fl-bottom button.is-active svg { color:currentColor; }

/* Banner de boas-vindas com gradiente da marca */
.home-greet { background:linear-gradient(120deg,var(--cda-dark),var(--cda) 55%,var(--cda-2)); color:#fff; padding:24px 24px; border-radius:20px; position:relative; overflow:hidden; box-shadow:var(--shadow); }
.home-greet::after { content:""; position:absolute; inset:0; background-image:radial-gradient(rgba(255,255,255,.16) 2px, transparent 2px); background-size:22px 22px; -webkit-mask-image:radial-gradient(120% 120% at 90% 0%, #000, transparent 60%); mask-image:radial-gradient(120% 120% at 90% 0%, #000, transparent 60%); }
.home-greet p { color:rgba(255,255,255,.82); position:relative; }
.home-greet h2 { color:#fff; position:relative; }

/* Hero cards do início — fundo levemente tonalizado por tipo */
.hero-card--a { background:linear-gradient(135deg,#fff, color-mix(in srgb,var(--c-resultados) 8%,#fff)); }
.hero-card--b { background:linear-gradient(135deg,#fff, color-mix(in srgb,var(--c-agendar) 8%,#fff)); }
.hero-card--c { background:linear-gradient(135deg,#fff, color-mix(in srgb,var(--c-orcamento) 9%,#fff)); }
.hero-card--b .hero-card__badge { background:linear-gradient(145deg,#8b5cf6,var(--c-agendar)); }
.hero-card--c .hero-card__badge { background:linear-gradient(145deg,#f59e0b,var(--c-orcamento)); }

/* Atalhos do início — cada tile com sua cor (arco-íris suave) */
.short[data-tab="resultados"] .short__ic { background:color-mix(in srgb,var(--c-resultados) 14%,#fff); color:var(--c-resultados); }
.short[data-tab="agendar"] .short__ic    { background:color-mix(in srgb,var(--c-agendar) 14%,#fff); color:var(--c-agendar); }
.short[data-tab="orcamento"] .short__ic  { background:color-mix(in srgb,var(--c-orcamento) 15%,#fff); color:var(--c-orcamento); }
.short[data-tab="unidades"] .short__ic   { background:color-mix(in srgb,var(--c-unidades) 14%,#fff); color:var(--c-unidades); }
.short[data-tab="coleta"] .short__ic     { background:color-mix(in srgb,var(--c-coleta) 13%,#fff); color:var(--c-coleta); }
.short[data-tab="vacinas"] .short__ic    { background:color-mix(in srgb,var(--c-vacinas) 14%,#fff); color:var(--c-vacinas); }
.short#short-familia .short__ic          { background:color-mix(in srgb,var(--c-familia) 13%,#fff); color:var(--c-familia); }
.short:hover { transform:translateY(-2px); box-shadow:var(--shadow-lg); }

/* Resumo da home em 3 colunas (desktop) + card de orçamento colorido */
@media (min-width:761px) { .cards--3 { grid-template-columns:repeat(3,1fr); } }
.resumo--orc .short__ic { background:color-mix(in srgb,var(--c-orcamento) 15%,#fff); color:var(--c-orcamento); }
.resumo--orc .resumo__n { color:var(--c-orcamento); }

/* Botões com gradiente */
.btn--primary { background:linear-gradient(135deg,var(--cda),var(--cda-dark)); }
.btn--primary:hover { background:linear-gradient(135deg,var(--cda),var(--cda-dark)); filter:brightness(1.06); }
.pdf-btn { background:linear-gradient(135deg,var(--cda),var(--cda-dark)); }
.pdf-btn:hover { filter:brightness(1.06); }

/* Ícone do cabeçalho de seção num círculo tonalizado */
.sec-head__ico { background:linear-gradient(135deg,var(--cda-soft),#fff); color:var(--cda-dark); border-radius:12px; }

/* Lift suave e entrada com vida */
.card:hover { transform:translateY(-2px); box-shadow:var(--shadow-lg); }
@keyframes cardin { from { opacity:0; transform:translateY(10px); } }
.hero-card, .tl-row, .home-greet, .patient-card { animation:cardin .4s ease both; }

/* ===== Orçamento emitido — detalhe completo (replica /orc) ===== */
.orc-toggle { background:transparent; border:0; color:var(--teal,#0e8a99); font-weight:600; font-size:.86rem; cursor:pointer; padding:4px 0; }
/* Agendamento real (data/hora/unidade do Conecta) ligado ao orçamento */
.orc-agendado { margin-top:8px; background:var(--blue-bg); color:var(--blue-tx); border-radius:12px; padding:10px 14px; font-size:.9rem; display:flex; flex-direction:column; gap:4px; }
.orc-agendado > div { display:flex; align-items:center; gap:6px; flex-wrap:wrap; }
.orc-agendado svg { width:15px; height:15px; flex-shrink:0; }
.orc-agendado .muted { color:inherit; opacity:.75; }

/* ===== Imagens (MobileMed/PACS) ===== */
:root { --c-imagens:#0891b2; }
.fl-nav[data-tab="imagens"] svg { color:var(--c-imagens); }
.fl-nav.is-active[data-tab="imagens"] { background:color-mix(in srgb,var(--c-imagens) 13%,#fff); color:var(--c-imagens); }
.fl-bottom button[data-tab="imagens"] svg { color:var(--c-imagens); }
.fl-bottom button.is-active[data-tab="imagens"] { color:var(--c-imagens); }
.img-card .card__title { margin-top:2px; }
.img-acts { display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
.img-acts .pdf-btn { margin-top:0; }

/* ===== Logo oficial CDA (imagem) ===== */
.brand-img { height:30px; width:auto; display:block; }
.brand--sm .brand-img { height:28px; }
.brand-img--lg { height:56px; }
.brand--stack { flex-direction:column; gap:6px; }
.brand-sub { color:var(--muted); font-size:.86rem; font-weight:600; letter-spacing:.02em; }
.app-ver { display:inline-block; margin-left:6px; color:var(--muted-2); font-size:.74rem; font-weight:600; }

/* ===== Botão flutuante de Feedback (fase de testes) ===== */
.fab-feedback { position:fixed; right:18px; bottom:calc(22px + var(--safe-b)); z-index:45; display:inline-flex; align-items:center; gap:8px; padding:11px 16px; border:0; border-radius:999px; background:linear-gradient(135deg,var(--cda),var(--cda-dark)); color:#fff; font-weight:700; font-size:.9rem; box-shadow:var(--shadow-lg); }
.fab-feedback:active { transform:scale(.97); }
@media (max-width:760px){ .fab-feedback { bottom:calc(84px + var(--safe-b)); right:14px; } .fab-feedback span { display:none; } .fab-feedback { padding:13px; } }
.fb-cats { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:12px; }
.fb-cat { padding:8px 14px; border:1.5px solid var(--line); border-radius:999px; background:var(--bg); color:var(--ink); font-weight:600; font-size:.88rem; }
.fb-cat.is-active { border-color:var(--cda); background:var(--cda-soft); color:var(--cda-dark); }

/* ===== Carrinho de exames: floatbar não tampa o último card / menu inferior ===== */
body.cart-open .fl-main { padding-bottom:120px; }
@media (max-width:760px) {
  .floatbar { bottom:calc(76px + var(--safe-b)); }       /* acima do bottom nav */
  body.cart-open .fl-main { padding-bottom:calc(168px + var(--safe-b)); }
}
.orc-detalhe { margin-top:10px; padding-top:10px; border-top:1px dashed var(--line); }
.orc-detalhe h5 { font-size:.78rem; text-transform:uppercase; letter-spacing:.03em; color:var(--muted); }
.orc-dados { display:grid; grid-template-columns:repeat(2,1fr); gap:8px 14px; }
.orc-dados div b { display:block; font-size:.72rem; text-transform:uppercase; letter-spacing:.03em; color:var(--muted); }
.orc-dados div span { font-size:.92rem; color:var(--ink); }
.orc-tbl { width:100%; border-collapse:collapse; font-size:.9rem; }
.orc-tbl td { padding:7px 0; border-bottom:1px solid var(--line); vertical-align:top; }
.orc-tbl tr.orc-total td { border-bottom:0; border-top:2px solid var(--line); padding-top:9px; }
.orc-list { margin:0; padding-left:18px; font-size:.9rem; }
.orc-list li { margin:3px 0; }
.orc-obs { font-size:.9rem; color:var(--ink); background:var(--soft); border-radius:10px; padding:10px 12px; }
.orc-prep { font-size:.88rem; margin:6px 0; }
.orc-prep a { color:var(--teal,#0e8a99); font-weight:600; }
.orc-prep > div { color:var(--muted); margin-top:2px; }
.orc-pag { display:flex; flex-wrap:wrap; gap:6px; }
.chip { display:inline-block; padding:5px 11px; border:1px solid var(--line); border-radius:999px; font-size:.82rem; background:var(--soft); }