:root {
  --forest-950: #08291d;
  --forest-900: #0d3526;
  --forest-800: #174b36;
  --forest-700: #26634a;
  --cream: #f3f0e7;
  --paper: #fbfaf6;
  --white: #ffffff;
  --gold: #c9a761;
  --gold-soft: #e7d7b4;
  --ink: #15271e;
  --muted: #656f68;
  --line: #ded7c9;
  --danger: #a43c32;
  --danger-soft: #f8e5e1;
  --success: #2f7452;
  --success-soft: #e3f0e9;
  --warning: #9a6815;
  --warning-soft: #f8efd9;
  --info: #315e79;
  --info-soft: #e7f0f5;
  --shadow-sm: 0 3px 12px rgba(13, 53, 38, .07);
  --shadow-md: 0 16px 45px rgba(13, 53, 38, .12);
  --shadow-lg: 0 28px 80px rgba(8, 41, 29, .18);
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --sans: Inter, "Segoe UI", Arial, sans-serif;
  --serif: "Cormorant Garamond", Georgia, serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-width: 320px; color: var(--ink); background: var(--cream); font-family: var(--sans); -webkit-font-smoothing: antialiased; }
body, button, input, select, textarea { font: 14px/1.5 var(--sans); }
button, input, select, textarea { color: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
button { border: 0; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; }
h1, h2, h3, h4, p { margin-top: 0; }
svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
:focus-visible { outline: 3px solid var(--gold); outline-offset: 3px; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 1000; top: 10px; left: 10px; padding: 10px 16px; color: var(--forest-950); background: var(--gold); border-radius: var(--radius-sm); transform: translateY(-150%); }
.skip-link:focus { transform: translateY(0); }

.button { display: inline-flex; min-height: 44px; align-items: center; justify-content: center; gap: 9px; padding: 0 18px; border-radius: var(--radius-sm); cursor: pointer; font-size: 12px; font-weight: 750; letter-spacing: .035em; text-transform: uppercase; transition: transform .18s ease, box-shadow .18s ease, background .18s ease; }
.button:hover { transform: translateY(-1px); }
.button-primary { color: var(--white); background: var(--forest-800); box-shadow: 0 8px 20px rgba(23, 75, 54, .18); }
.button-primary:hover { background: var(--forest-900); box-shadow: 0 10px 24px rgba(23, 75, 54, .25); }
.button-gold { color: var(--forest-950); background: var(--gold); box-shadow: 0 8px 20px rgba(201, 167, 97, .2); }
.button-gold:hover { background: #d8ba7a; }
.button-outline { color: var(--forest-800); background: transparent; border: 1px solid var(--forest-800); }
.button-ghost { color: var(--forest-800); background: rgba(23, 75, 54, .06); }
.button-danger { color: var(--danger); background: var(--danger-soft); }
.icon-button { display: inline-grid; width: 42px; height: 42px; place-items: center; padding: 0; color: inherit; background: transparent; border-radius: var(--radius-sm); cursor: pointer; }
.icon-button:hover { background: rgba(23, 75, 54, .08); }
.chip { display: inline-flex; align-items: center; gap: 7px; min-height: 28px; padding: 3px 10px; color: var(--forest-800); background: #edf2ee; border-radius: 999px; font-size: 11px; font-weight: 750; letter-spacing: .02em; }
.chip::before { width: 6px; height: 6px; content: ""; background: currentColor; border-radius: 50%; }
.chip.success { color: var(--success); background: var(--success-soft); }
.chip.warning { color: var(--warning); background: var(--warning-soft); }
.chip.danger { color: var(--danger); background: var(--danger-soft); }
.chip.info { color: var(--info); background: var(--info-soft); }

/* Shells */
.site-shell { min-height: 100vh; background: var(--cream); }
.public-header { position: sticky; z-index: 50; top: 0; display: flex; min-height: 72px; align-items: center; gap: 28px; padding: 0 max(24px, calc((100vw - 1320px)/2)); color: var(--white); background: var(--forest-950); border-bottom: 1px solid rgba(201, 167, 97, .28); }
.public-header .brand { margin-right: auto; }
.brand img { width: 220px; max-height: 52px; object-fit: contain; object-position: left center; }
.public-nav { display: flex; align-items: center; gap: 28px; font-size: 12px; font-weight: 650; }
.public-nav a { padding: 25px 0; border-bottom: 2px solid transparent; }
.public-nav a:hover, .public-nav a.active { color: var(--gold); border-color: var(--gold); }
.public-header-actions { display: flex; align-items: center; gap: 9px; }
.public-main { min-height: calc(100vh - 72px); }
.public-footer { display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 48px; padding: 56px max(24px, calc((100vw - 1200px)/2)); color: rgba(255,255,255,.72); background: var(--forest-950); }
.public-footer img { width: 190px; margin-bottom: 14px; }
.public-footer h3 { margin-bottom: 14px; color: var(--gold); font-family: var(--serif); font-size: 24px; }
.public-footer a { display: block; margin: 8px 0; }

.app-shell { display: grid; grid-template-columns: 250px minmax(0,1fr); min-height: 100vh; background: #f6f5f0; }
.app-sidebar { position: sticky; top: 0; display: flex; height: 100vh; flex-direction: column; padding: 22px 16px; color: rgba(255,255,255,.78); background: var(--forest-950); }
.app-sidebar .brand { display: block; padding: 3px 8px 24px; border-bottom: 1px solid rgba(255,255,255,.1); }
.app-sidebar .brand img { width: 190px; }
.sidebar-label { margin: 28px 10px 9px; color: rgba(255,255,255,.38); font-size: 10px; font-weight: 750; letter-spacing: .14em; text-transform: uppercase; }
.side-nav { display: grid; gap: 3px; }
.side-nav a { display: flex; min-height: 42px; align-items: center; gap: 11px; padding: 0 11px; border-radius: 8px; font-size: 13px; }
.side-nav a svg { width: 18px; height: 18px; color: var(--gold); }
.side-nav a:hover { color: var(--white); background: rgba(255,255,255,.08); }
.side-nav a.active { color: var(--forest-950); background: var(--gold); font-weight: 750; }
.side-nav a.active svg { color: var(--forest-950); }
.sidebar-account { display: flex; align-items: center; gap: 10px; margin-top: auto; padding: 16px 9px 3px; border-top: 1px solid rgba(255,255,255,.1); }
.avatar { display: grid; width: 36px; height: 36px; flex: 0 0 36px; place-items: center; color: var(--forest-950); background: var(--gold); border-radius: 50%; font-weight: 800; }
.sidebar-account strong, .sidebar-account span { display: block; }
.sidebar-account strong { color: var(--white); font-size: 12px; }
.sidebar-account span { color: rgba(255,255,255,.48); font-size: 10px; }
.app-workspace { min-width: 0; }
.app-topbar { position: sticky; z-index: 30; top: 0; display: flex; min-height: 68px; align-items: center; gap: 14px; padding: 0 30px; background: rgba(255,255,255,.92); border-bottom: 1px solid #e7e4da; backdrop-filter: blur(12px); }
.app-topbar .crumbs { min-width: 0; margin-right: auto; color: var(--muted); font-size: 12px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.app-topbar .crumbs strong { color: var(--ink); }
.mobile-menu { display: none; }
.app-main { width: min(1180px, calc(100% - 56px)); margin: 0 auto; padding: 36px 0 72px; }

.admin-shell { grid-template-columns: 224px minmax(0,1fr); background: #f4f5f3; }
.admin-shell .app-sidebar { padding-inline: 12px; background: #10281e; }
.admin-shell .side-nav a { min-height: 38px; font-size: 12px; }
.admin-shell .app-main { width: calc(100% - 48px); max-width: 1440px; }
.admin-shell .app-topbar { min-height: 60px; }
.env-badge { padding: 4px 8px; color: #b5d8c6; background: rgba(181,216,198,.1); border: 1px solid rgba(181,216,198,.18); border-radius: 4px; font-size: 9px; font-weight: 750; letter-spacing: .12em; }

.checkout-shell { min-height: 100vh; background: #f7f5ef; }
.checkout-header { display: grid; grid-template-columns: 220px 1fr 220px; min-height: 76px; align-items: center; padding: 0 max(24px, calc((100vw - 1180px)/2)); background: var(--white); border-bottom: 1px solid var(--line); }
.checkout-header img { width: 200px; }
.checkout-progress { display: flex; align-items: center; justify-content: center; gap: 9px; }
.checkout-progress span { display: flex; align-items: center; gap: 8px; color: #a4aaa6; font-size: 11px; font-weight: 700; text-transform: uppercase; }
.checkout-progress span::before { display: grid; width: 25px; height: 25px; place-items: center; content: attr(data-step); color: var(--muted); background: #eeeee9; border-radius: 50%; }
.checkout-progress span.active { color: var(--forest-800); }
.checkout-progress span.active::before { color: var(--white); background: var(--forest-800); }
.checkout-progress i { width: 30px; height: 1px; background: var(--line); }
.secure-label { display: flex; align-items: center; justify-content: flex-end; gap: 7px; color: var(--muted); font-size: 11px; }
.checkout-main { width: min(1120px, calc(100% - 40px)); margin: 0 auto; padding: 42px 0 80px; }

.auth-shell { display: grid; min-height: 100vh; grid-template-columns: minmax(340px, .9fr) minmax(520px, 1.1fr); background: var(--paper); }
.auth-story { position: relative; display: flex; min-height: 100vh; flex-direction: column; padding: 42px clamp(32px, 5vw, 78px); overflow: hidden; color: var(--white); background: var(--forest-950); }
.auth-story::after { position: absolute; right: -26%; bottom: -10%; width: 680px; height: 680px; content: ""; background: radial-gradient(circle, rgba(201,167,97,.22), transparent 64%); border-radius: 50%; }
.auth-story .brand { position: relative; z-index: 1; }
.auth-story-copy { position: relative; z-index: 1; margin: auto 0; }
.auth-story-copy h2 { max-width: 540px; margin-bottom: 22px; color: var(--cream); font-family: var(--serif); font-size: clamp(45px, 5vw, 72px); font-weight: 500; line-height: .98; }
.auth-story-copy p { max-width: 450px; color: rgba(255,255,255,.66); font-size: 16px; }
.auth-promise { position: relative; z-index: 1; display: flex; align-items: center; gap: 11px; color: var(--gold-soft); font-size: 12px; }
.auth-main { display: grid; min-height: 100vh; place-items: center; padding: 48px; }
.auth-card { width: min(460px, 100%); }
.auth-card .eyeline { margin-bottom: 12px; color: var(--gold-dark, #8b6f36); font-size: 11px; font-weight: 800; letter-spacing: .12em; text-transform: uppercase; }
.auth-card h1 { margin-bottom: 10px; font-family: var(--serif); font-size: 46px; font-weight: 550; line-height: 1; }
.auth-card > p { margin-bottom: 30px; color: var(--muted); }
.auth-form { margin-top: 24px; }
.auth-form .form-grid { grid-template-columns: 1fr; }
.auth-form .field small:empty { display: none; }
.auth-form input[aria-invalid="true"] { border-color: #b53b32; box-shadow: 0 0 0 3px rgba(181,59,50,.1); }
.auth-form .field small:not(:empty) { color: #9b2f28; font-size: 11px; }
.auth-form .check-row { margin-top: 14px; }
.auth-form .check-row.optional { margin-top: 8px; }
.auth-form .form-actions { margin-top: 18px; }
.auth-form .form-actions .button { width: 100%; }
.auth-links { display: flex; justify-content: space-between; gap: 16px; margin-top: 15px; font-size: 12px; }
.auth-links a { color: var(--green); font-weight: 750; text-decoration: none; }
.auth-links a:hover { text-decoration: underline; }
.auth-status { margin-top: 16px; padding: 11px 13px; border: 1px solid #e7b7b2; border-radius: 9px; background: #fff4f2; color: #852c26; font-size: 12px; line-height: 1.45; }
.auth-status.success { border-color: #a9d1bb; background: #edf8f1; color: #195f3c; }
.auth-status[hidden] { display: none; }
.auth-card .auth-help { margin-top: 18px; margin-bottom: 0; text-align: center; color: var(--muted); font-size: 11px; }
.session-logout { min-height: 34px; padding: 7px 12px; font-size: 11px; }

.system-shell { display: grid; min-height: 100vh; grid-template-rows: auto 1fr auto; background: var(--paper); }
.system-header { display: flex; align-items: center; justify-content: space-between; padding: 24px 36px; }
.system-header img { width: 200px; }
.system-main { display: grid; place-items: center; padding: 40px 24px; }
.system-card { width: min(620px, 100%); text-align: center; }
.status-orb { display: grid; width: 92px; height: 92px; place-items: center; margin: 0 auto 28px; color: var(--forest-800); background: #e7eee9; border: 1px solid #cedbd2; border-radius: 50%; box-shadow: 0 0 0 12px rgba(231,238,233,.5); }
.status-orb svg { width: 38px; height: 38px; }
.system-card h1 { margin-bottom: 15px; font-family: var(--serif); font-size: clamp(40px, 6vw, 62px); font-weight: 500; line-height: 1.02; }
.system-card > p { max-width: 510px; margin: 0 auto 28px; color: var(--muted); font-size: 16px; }
.system-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.system-code { margin-top: 28px; color: #969d98; font-size: 11px; }
.system-footer { padding: 22px 36px; color: var(--muted); text-align: center; font-size: 11px; }

/* Shared page anatomy */
.page-head { display: flex; align-items: flex-start; gap: 24px; margin-bottom: 28px; }
.page-head-copy { min-width: 0; margin-right: auto; }
.breadcrumb { display: flex; align-items: center; gap: 7px; margin-bottom: 9px; color: var(--muted); font-size: 11px; }
.breadcrumb a:hover { color: var(--forest-800); }
.page-head h1 { margin: 0 0 8px; font-family: var(--serif); font-size: clamp(34px, 4vw, 48px); font-weight: 550; line-height: 1.05; }
.admin-shell .page-head h1 { font-family: var(--sans); font-size: 28px; font-weight: 750; letter-spacing: -.02em; }
.page-subtitle { max-width: 720px; margin: 0; color: var(--muted); }
.route-line { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 13px; }
.route-badge { display: inline-flex; min-width: 0; align-items: center; gap: 7px; padding: 5px 9px; color: var(--forest-700); background: rgba(23,75,54,.06); border: 1px solid rgba(23,75,54,.12); border-radius: 6px; font-size: 10px; }
.route-badge svg { width: 13px; height: 13px; }
.route-badge code { overflow: hidden; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; text-overflow: ellipsis; white-space: nowrap; }
.page-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.grid { display: grid; gap: 18px; }
.grid-2 { grid-template-columns: minmax(0,1.4fr) minmax(280px,.7fr); }
.grid-equal { grid-template-columns: repeat(2, minmax(0,1fr)); }
.grid-3 { grid-template-columns: repeat(3, minmax(0,1fr)); }
.panel { min-width: 0; padding: 22px; background: var(--white); border: 1px solid #e4e1d7; border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.panel.flush { padding: 0; overflow: hidden; }
.panel.dark { color: var(--white); background: var(--forest-900); border-color: var(--forest-900); }
.panel-head { display: flex; align-items: center; gap: 14px; margin-bottom: 18px; }
.panel-head > div:first-child { min-width: 0; margin-right: auto; }
.panel h2, .panel h3 { margin: 0; }
.panel h2 { font-size: 18px; }
.panel h3 { font-size: 14px; }
.panel-head p { margin: 4px 0 0; color: var(--muted); font-size: 12px; }
.panel.dark .panel-head p { color: rgba(255,255,255,.55); }
.section-title { display: flex; align-items: center; gap: 14px; margin: 34px 0 16px; font-size: 15px; }
.section-title::after { flex: 1; height: 1px; content: ""; background: var(--line); }

.metric-grid { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 14px; margin-bottom: 20px; }
.metric { position: relative; min-height: 122px; padding: 19px; overflow: hidden; background: var(--white); border: 1px solid #e4e1d7; border-radius: var(--radius-md); }
.metric::after { position: absolute; right: -16px; bottom: -28px; width: 86px; height: 86px; content: ""; background: rgba(201,167,97,.13); border-radius: 50%; }
.metric-top { display: flex; align-items: center; justify-content: space-between; color: var(--muted); font-size: 11px; font-weight: 650; }
.metric-top svg { width: 18px; color: var(--forest-700); }
.metric strong { display: block; margin-top: 14px; font-family: var(--serif); font-size: 34px; font-weight: 600; line-height: 1; }
.metric small { color: var(--success); font-size: 10px; font-weight: 700; }

.alert { display: flex; align-items: flex-start; gap: 12px; padding: 14px 16px; color: var(--ink); background: var(--info-soft); border: 1px solid #cbdde7; border-radius: var(--radius-sm); }
.alert svg { flex: 0 0 20px; color: var(--info); }
.alert strong, .alert span { display: block; }
.alert strong { margin-bottom: 2px; font-size: 12px; }
.alert span { color: var(--muted); font-size: 11px; }
.alert.warning { background: var(--warning-soft); border-color: #ead7aa; }
.alert.warning svg { color: var(--warning); }
.alert.danger { background: var(--danger-soft); border-color: #edc6bf; }
.alert.danger svg { color: var(--danger); }

.toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 9px; padding: 14px 16px; background: #fafaf7; border-bottom: 1px solid #e8e5dc; }
.search-field { position: relative; flex: 1 1 240px; }
.search-field svg { position: absolute; top: 50%; left: 12px; width: 17px; color: var(--muted); transform: translateY(-50%); }
.search-field input { width: 100%; min-height: 40px; padding: 8px 12px 8px 39px; background: var(--white); border: 1px solid var(--line); border-radius: 7px; }
.select-control { min-height: 40px; padding: 0 34px 0 11px; background: var(--white); border: 1px solid var(--line); border-radius: 7px; font-size: 12px; }
.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; }
th { padding: 11px 15px; color: var(--muted); background: #f7f7f3; font-size: 10px; font-weight: 800; letter-spacing: .05em; text-align: left; text-transform: uppercase; white-space: nowrap; }
td { padding: 14px 15px; border-top: 1px solid #ebe9e1; font-size: 12px; vertical-align: middle; }
tbody tr:hover { background: #fbfbf8; }
.table-entity { display: flex; align-items: center; gap: 10px; min-width: 170px; }
.table-avatar { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; color: var(--forest-800); background: #e7eee9; border-radius: 9px; font-weight: 800; }
.table-entity strong, .table-entity span { display: block; }
.table-entity span { color: var(--muted); font-size: 10px; }
.table-link { color: var(--forest-800); font-weight: 700; }
.table-link:hover { text-decoration: underline; }

.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0,1fr)); gap: 17px; }
.field { display: grid; align-content: start; gap: 7px; }
.field.full { grid-column: 1 / -1; }
.field label, .field > span:first-child { font-size: 11px; font-weight: 750; }
.field input, .field select, .field textarea { width: 100%; min-height: 44px; padding: 10px 12px; background: var(--white); border: 1px solid #cfcabc; border-radius: 8px; outline: none; transition: border .18s ease, box-shadow .18s ease; }
.field textarea { min-height: 108px; resize: vertical; }
.field input:focus, .field select:focus, .field textarea:focus { border-color: var(--forest-700); box-shadow: 0 0 0 3px rgba(38,99,74,.12); }
.field small { color: var(--muted); font-size: 10px; }
.password-wrap { position: relative; }
.password-wrap input { padding-right: 48px; }
.password-toggle { position: absolute; top: 1px; right: 1px; width: 42px; height: 42px; color: var(--muted); background: transparent; cursor: pointer; }
.check-row { display: flex; align-items: flex-start; gap: 9px; color: var(--muted); font-size: 11px; }
.check-row input { width: 16px; height: 16px; margin: 2px 0 0; accent-color: var(--forest-800); }
.form-actions { display: flex; align-items: center; gap: 10px; margin-top: 22px; }
.form-actions .button-primary { min-width: 150px; }

.support-command { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:18px; padding:15px 18px; color:var(--white); background:var(--forest-900); border-radius:var(--radius-md); }
.support-command strong, .support-command span { display:block; }
.support-command strong { font-size:13px; }
.support-command span { margin-top:3px; color:rgba(255,255,255,.68); font-size:11px; }
.support-command .button { flex:0 0 auto; color:var(--white); border-color:rgba(255,255,255,.24); }
.support-sla { font-size:11px; }
.support-sla.breached { color:var(--danger); }
.support-ticket-head { display:flex; align-items:center; justify-content:space-between; gap:18px; margin-bottom:18px; padding:20px 22px; background:var(--white); border:1px solid var(--line); border-radius:var(--radius-md); }
.support-ticket-head h2 { margin:4px 0; font-family:var(--serif); font-size:25px; }
.support-ticket-head p { margin:0; color:var(--muted); font-size:11px; }
.support-protocol { color:var(--forest-700); font-size:10px; font-weight:800; letter-spacing:.05em; }
.support-ticket-actions { display:flex; gap:9px; }
.support-ticket-layout { display:grid; grid-template-columns:minmax(0,1.7fr) minmax(280px,.7fr); gap:18px; align-items:start; }
.support-conversation { display:grid; gap:16px; }
.support-message { display:flex; gap:11px; max-width:86%; }
.support-message.agent { margin-left:auto; }
.support-message > div { padding:13px 15px; background:#f5f6f2; border:1px solid var(--line); border-radius:4px 12px 12px 12px; }
.support-message.agent > div { background:#edf4ef; border-radius:12px 4px 12px 12px; }
.support-message header { display:flex; justify-content:space-between; gap:16px; margin-bottom:6px; font-size:10px; }
.support-message time { color:var(--muted); }
.support-message p { margin:0; font-size:12px; line-height:1.6; }
.support-reply { margin-top:8px; padding-top:16px; border-top:1px solid var(--line); }
.support-reply textarea { width:100%; min-height:120px; padding:13px; border:1px solid #cfcabc; border-radius:8px; resize:vertical; }
.support-reply-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:10px; }
.support-reply-actions small { color:var(--muted); font-size:10px; }
.support-sidebar { display:grid; gap:15px; }
.support-empty { padding:34px; text-align:center; }
.support-empty strong, .support-empty span { display:block; }
.support-empty span { margin-top:5px; color:var(--muted); font-size:11px; }

@media (max-width: 900px) {
  .support-ticket-layout { grid-template-columns:1fr; }
  .support-command, .support-ticket-head { align-items:flex-start; flex-direction:column; }
  .support-message { max-width:96%; }
}

.tabs { display: flex; gap: 4px; margin-bottom: 18px; padding: 4px; background: #e9e8e2; border-radius: 9px; overflow-x: auto; }
.tab { min-height: 36px; padding: 0 14px; color: var(--muted); background: transparent; border-radius: 6px; cursor: pointer; font-size: 11px; font-weight: 700; white-space: nowrap; }
.tab.active { color: var(--ink); background: var(--white); box-shadow: 0 2px 8px rgba(0,0,0,.06); }

.timeline { position: relative; display: grid; gap: 0; }
.timeline::before { position: absolute; top: 17px; bottom: 18px; left: 12px; width: 1px; content: ""; background: var(--line); }
.timeline-item { position: relative; display: grid; grid-template-columns: 26px 1fr; gap: 12px; padding-bottom: 22px; }
.timeline-dot { z-index: 1; width: 25px; height: 25px; background: var(--white); border: 6px solid var(--forest-700); border-radius: 50%; }
.timeline-item.pending .timeline-dot { border-color: #d2d3cf; }
.timeline-item strong, .timeline-item span { display: block; }
.timeline-item strong { font-size: 12px; }
.timeline-item span { color: var(--muted); font-size: 11px; }

.entity-hero { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 18px; margin-bottom: 18px; padding: 22px; background: var(--white); border: 1px solid #e4e1d7; border-radius: var(--radius-md); }
.entity-photo { width: 82px; height: 82px; object-fit: cover; border-radius: 18px; }
.entity-hero h2 { margin-bottom: 4px; font-family: var(--serif); font-size: 30px; font-weight: 600; }
.entity-meta { display: flex; flex-wrap: wrap; gap: 8px 15px; color: var(--muted); font-size: 11px; }
.entity-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.info-list { display: grid; gap: 0; }
.info-row { display: flex; align-items: flex-start; gap: 18px; padding: 12px 0; border-bottom: 1px solid #ece9e1; }
.info-row:last-child { border-bottom: 0; }
.info-row span { width: 130px; flex: 0 0 130px; color: var(--muted); font-size: 11px; }
.info-row strong { font-size: 12px; font-weight: 650; }

.stepper { display: flex; justify-content: center; margin: 0 0 30px; }
.step { position: relative; display: grid; min-width: 94px; justify-items: center; gap: 7px; color: #a2a7a3; font-size: 9px; font-weight: 750; text-align: center; text-transform: uppercase; }
.step:not(:last-child)::after { position: absolute; top: 14px; left: calc(50% + 18px); width: calc(100% - 36px); height: 1px; content: ""; background: #d8d5cb; }
.step-number { z-index: 1; display: grid; width: 29px; height: 29px; place-items: center; background: #e6e5df; border-radius: 50%; }
.step.active { color: var(--forest-800); }
.step.active .step-number { color: var(--white); background: var(--forest-800); }
.step.done { color: var(--success); }
.step.done .step-number { color: var(--white); background: var(--success); }

.summary-card { position: sticky; top: 96px; }
.order-item { display: grid; grid-template-columns: 64px 1fr auto; gap: 12px; align-items: center; padding-bottom: 16px; border-bottom: 1px solid var(--line); }
.order-item img { width: 64px; height: 64px; object-fit: contain; background: var(--cream); border-radius: 8px; }
.order-item strong, .order-item span { display: block; }
.order-item span { color: var(--muted); font-size: 10px; }
.totals { display: grid; gap: 8px; margin-top: 16px; }
.total-row { display: flex; justify-content: space-between; color: var(--muted); font-size: 12px; }
.total-row.final { margin-top: 7px; padding-top: 13px; color: var(--ink); border-top: 1px solid var(--line); font-size: 15px; font-weight: 800; }

.rescue-main { min-height: 100vh; padding: 0 0 60px; background: var(--paper); }
.rescue-topbar { display: flex; min-height: 62px; align-items: center; justify-content: space-between; padding: 0 max(18px, calc((100vw - 760px)/2)); background: var(--forest-950); }
.rescue-topbar img { width: 180px; }
.rescue-topbar span { color: var(--gold-soft); font-size: 11px; }
.rescue-card { width: min(720px, calc(100% - 28px)); margin: 22px auto 0; overflow: hidden; background: var(--white); border: 1px solid #e6e1d5; border-radius: var(--radius-lg); box-shadow: var(--shadow-md); }
.pet-cover { position: relative; aspect-ratio: 16 / 9; background: #dfe9e2; }
.pet-cover img { width: 100%; height: 100%; object-fit: cover; object-position: center 35%; }
.pet-cover::after { position: absolute; right: 0; bottom: 0; left: 0; height: 45%; content: ""; background: linear-gradient(transparent, rgba(8,41,29,.66)); }
.pet-name { position: absolute; z-index: 1; right: 24px; bottom: 21px; left: 24px; color: var(--white); }
.pet-name h1 { margin-bottom: 4px; font-family: var(--serif); font-size: 44px; font-weight: 550; line-height: 1; }
.pet-name p { margin: 0; color: rgba(255,255,255,.78); }
.lost-banner { display: flex; align-items: center; justify-content: center; gap: 9px; min-height: 48px; color: var(--white); background: var(--danger); font-size: 13px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; }
.rescue-content { padding: 24px; }
.verified { display: flex; align-items: center; gap: 9px; margin-bottom: 20px; color: var(--success); font-size: 12px; font-weight: 750; }
.contact-actions { display: grid; grid-template-columns: repeat(3,1fr); gap: 9px; margin-bottom: 22px; }
.contact-actions .button { padding-inline: 10px; }
.pet-message { margin-bottom: 22px; padding: 16px 18px; background: var(--cream); border-left: 3px solid var(--gold); border-radius: 0 8px 8px 0; font-family: var(--serif); font-size: 20px; }
.care-grid { display: grid; grid-template-columns: repeat(2,1fr); gap: 12px; }
.care-item { padding: 15px; background: #f7f7f3; border: 1px solid #ebe8df; border-radius: 10px; }
.care-item span, .care-item strong { display: block; }
.care-item span { margin-bottom: 4px; color: var(--muted); font-size: 10px; font-weight: 750; text-transform: uppercase; }
.rescue-note { max-width: 680px; margin: 18px auto 0; color: var(--muted); font-size: 10px; text-align: center; }

.marketing-hero { display: grid; grid-template-columns: minmax(0,.9fr) minmax(420px,1.1fr); min-height: 580px; }
.marketing-copy { display: flex; flex-direction: column; justify-content: center; padding: 72px max(30px, calc((100vw - 1240px)/2)); padding-right: 30px; }
.marketing-copy h1 { max-width: 600px; margin-bottom: 20px; color: var(--forest-900); font-family: var(--serif); font-size: clamp(52px, 6vw, 82px); font-weight: 550; line-height: .95; }
.marketing-copy > p { max-width: 560px; color: #415148; font-size: 17px; }
.marketing-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 12px; }
.marketing-media { display: flex; align-items: flex-end; background: #e5e2d8; overflow: hidden; }
.marketing-media img { width: 100%; height: 100%; object-fit: cover; object-position: center; }
.benefit-band { display: grid; grid-template-columns: repeat(4,1fr); padding: 30px max(24px, calc((100vw - 1240px)/2)); color: var(--white); background: var(--forest-950); }
.benefit { display: flex; align-items: center; gap: 12px; padding: 7px 24px; border-right: 1px solid rgba(201,167,97,.35); }
.benefit:last-child { border-right: 0; }
.benefit svg { flex: 0 0 27px; width: 27px; height: 27px; color: var(--gold); }
.benefit strong, .benefit span { display: block; }
.benefit strong { color: var(--gold-soft); font-size: 11px; text-transform: uppercase; }
.benefit span { color: rgba(255,255,255,.64); font-size: 10px; }
.marketing-section { width: min(1180px, calc(100% - 44px)); margin: 0 auto; padding: 72px 0; }
.marketing-section h2 { margin-bottom: 32px; color: var(--forest-900); font-family: var(--serif); font-size: 42px; font-weight: 550; text-align: center; }
.process-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 30px; }
.process-step { text-align: center; }
.process-icon { display: grid; width: 92px; height: 92px; place-items: center; margin: 0 auto 20px; color: var(--forest-800); background: #e7e1d2; border-radius: 50%; }
.process-icon svg { width: 38px; height: 38px; }
.process-step h3 { font-family: var(--serif); font-size: 24px; }
.process-step p { max-width: 280px; margin-inline: auto; color: var(--muted); font-size: 12px; }

.product-layout { display: grid; grid-template-columns: minmax(0,1.1fr) minmax(380px,.8fr); gap: 52px; width: min(1200px, calc(100% - 44px)); margin: 0 auto; padding: 56px 0 80px; }
.product-gallery { position: sticky; top: 100px; display: grid; grid-template-columns: 76px 1fr; gap: 14px; align-self: start; }
.product-thumbs { display: grid; align-content: start; gap: 10px; }
.product-thumb { display: grid; aspect-ratio: 1; place-items: center; padding: 7px; background: var(--paper); border: 1px solid var(--line); border-radius: 8px; cursor: pointer; }
.product-thumb.active { border: 2px solid var(--forest-800); }
.product-image { display: grid; min-height: 520px; place-items: center; padding: 30px; background: #e9e4d8; border-radius: var(--radius-lg); }
.product-image img { max-height: 500px; object-fit: contain; }
.product-info h1 { margin: 5px 0 12px; font-family: var(--serif); font-size: 52px; font-weight: 550; line-height: 1; }
.stars { color: var(--gold-dark, #8e7135); font-size: 12px; }
.price { margin: 22px 0 2px; font-family: var(--serif); font-size: 36px; font-weight: 650; }
.installments { margin-bottom: 24px; color: var(--muted); font-size: 11px; }
.option-group { margin: 20px 0; }
.option-group > span { display: block; margin-bottom: 9px; font-size: 11px; font-weight: 750; }
.options { display: flex; flex-wrap: wrap; gap: 8px; }
.option { min-height: 38px; padding: 0 13px; background: var(--white); border: 1px solid var(--line); border-radius: 7px; cursor: pointer; font-size: 11px; }
.option.active { color: var(--white); background: var(--forest-800); border-color: var(--forest-800); }
.buy-row { display: grid; grid-template-columns: 106px 1fr; gap: 10px; margin-top: 24px; }
.quantity { display: grid; grid-template-columns: 34px 1fr 34px; align-items: center; background: var(--white); border: 1px solid var(--line); border-radius: 8px; }
.quantity button { height: 42px; background: transparent; cursor: pointer; }
.quantity span { text-align: center; font-weight: 750; }
.shipping-box { margin-top: 20px; padding: 16px; background: var(--paper); border: 1px solid var(--line); border-radius: 9px; }
.shipping-box strong { display: block; margin-bottom: 9px; font-size: 11px; }
.inline-input { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.inline-input input { min-width: 0; height: 42px; padding: 0 12px; border: 1px solid var(--line); border-radius: 7px; }

.article-layout { display: grid; grid-template-columns: 230px minmax(0,760px); gap: 60px; width: min(1120px, calc(100% - 44px)); margin: 0 auto; padding: 60px 0 90px; }
.article-aside { position: sticky; top: 105px; align-self: start; padding-right: 25px; border-right: 1px solid var(--line); }
.article-aside strong { display: block; margin-bottom: 15px; font-size: 11px; text-transform: uppercase; }
.article-aside a { display: block; padding: 7px 0; color: var(--muted); font-size: 12px; }
.article-aside a.active { color: var(--forest-800); font-weight: 750; }
.article h1 { margin-bottom: 16px; font-family: var(--serif); font-size: 52px; font-weight: 550; line-height: 1; }
.article .lead { color: var(--muted); font-size: 16px; }
.article h2 { margin: 38px 0 13px; font-family: var(--serif); font-size: 28px; }
.article p, .article li { color: #4e5c54; line-height: 1.75; }
.faq-search { display: flex; align-items: center; gap: 12px; margin: 28px 0; padding: 14px 18px; background: var(--white); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow-sm); }
.faq-search input { flex: 1; border: 0; outline: 0; background: transparent; font-size: 15px; }
.accordion { border-top: 1px solid var(--line); }
.accordion details { border-bottom: 1px solid var(--line); }
.accordion summary { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 18px 0; cursor: pointer; font-weight: 750; list-style: none; }
.accordion summary::-webkit-details-marker { display: none; }
.accordion summary svg { transition: transform .18s ease; }
.accordion details[open] summary svg { transform: rotate(180deg); }
.accordion details p { padding: 0 35px 17px 0; color: var(--muted); }

.spec-details { margin-top: 38px; background: rgba(255,255,255,.5); border: 1px dashed #c9c4b7; border-radius: var(--radius-md); }
.spec-details > summary { display: flex; align-items: center; gap: 10px; padding: 14px 17px; cursor: pointer; color: var(--muted); font-size: 11px; font-weight: 750; list-style: none; }
.spec-details > summary::-webkit-details-marker { display: none; }
.spec-body { padding: 0 18px 18px; }
.spec-meta { margin: 0 0 14px; padding: 10px 12px; color: var(--muted); background: #f0eee8; border-radius: 7px; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 10px; }
.spec-groups { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.spec-group { padding: 14px; background: var(--white); border: 1px solid #e7e3d9; border-radius: 8px; }
.spec-group h4 { margin-bottom: 8px; font-size: 11px; }
.spec-group ul { margin: 0; padding-left: 18px; color: var(--muted); font-size: 10px; }
.spec-group li + li { margin-top: 5px; }
.prototype-nav { display: flex; align-items: center; justify-content: space-between; gap: 14px; margin-top: 26px; padding-top: 20px; border-top: 1px solid var(--line); }
.prototype-nav a { display: inline-flex; align-items: center; gap: 7px; color: var(--forest-800); font-size: 11px; font-weight: 750; }
.prototype-nav .disabled { color: #aaa; pointer-events: none; }

.toast-region { position: fixed; z-index: 200; right: 20px; bottom: 20px; display: grid; gap: 9px; }
.toast { display: flex; width: min(390px, calc(100vw - 32px)); align-items: flex-start; gap: 10px; padding: 14px 16px; color: var(--white); background: var(--forest-900); border: 1px solid rgba(255,255,255,.12); border-radius: 10px; box-shadow: var(--shadow-lg); animation: toast-in .25s ease both; }
.toast strong, .toast span { display: block; }
.toast strong { font-size: 12px; }
.toast span { color: rgba(255,255,255,.67); font-size: 10px; }
@keyframes toast-in { from { opacity: 0; transform: translateY(10px); } }
.modal-backdrop { position: fixed; z-index: 150; inset: 0; display: grid; place-items: center; padding: 20px; background: rgba(5,25,17,.66); backdrop-filter: blur(4px); }
.modal { width: min(470px,100%); padding: 24px; background: var(--white); border-radius: var(--radius-md); box-shadow: var(--shadow-lg); }
.modal-icon { display: grid; width: 44px; height: 44px; place-items: center; margin-bottom: 15px; color: var(--danger); background: var(--danger-soft); border-radius: 50%; }
.modal h2 { margin-bottom: 8px; font-family: var(--serif); font-size: 30px; }
.modal p { color: var(--muted); font-size: 12px; }
.modal-actions { display: flex; justify-content: flex-end; gap: 8px; margin-top: 20px; }
.modal .field { margin-top: 12px; }
.modal-consent { display: flex; align-items: center; gap: 7px; margin-top: 14px; color: var(--muted); font-size: 11px; }
.modal-consent svg { flex: none; width: 15px; color: var(--forest-700); }

/* Cropper de foto do pet — quadro fixo 4:3 com guia do avatar redondo. */
.modal.modal-wide { width: min(560px, 100%); }
.cropper h2 { font-size: 24px; }
.cropper-hint { margin-bottom: 14px; }
.cropper-stage { position: relative; overflow: hidden; aspect-ratio: 4 / 3; background: var(--forest-950); border-radius: var(--radius-md); touch-action: none; cursor: grab; user-select: none; }
.cropper-stage:active { cursor: grabbing; }
.cropper-stage canvas { display: block; width: 100%; height: 100%; }
.cropper-circle-guide { position: absolute; top: 0; bottom: 0; left: 50%; aspect-ratio: 1; transform: translateX(-50%); border: 2px dashed rgba(255,255,255,.9); border-radius: 50%; box-shadow: 0 0 0 1px rgba(0,0,0,.28); pointer-events: none; }
.cropper-controls { display: flex; align-items: center; gap: 12px; margin-top: 16px; }
.cropper-controls input[type="range"] { flex: 1; accent-color: var(--forest-800); }
.cropper-zoom { display: grid; width: 38px; height: 38px; flex: none; place-items: center; color: var(--forest-800); background: var(--paper); border: 1px solid var(--line); border-radius: 9px; font-size: 21px; line-height: 1; cursor: pointer; }
.cropper-zoom:hover { background: #eef2ee; }
.cropper [data-cortar] svg { width: 17px; }
.field-opt { color: var(--muted); font-weight: 500; }
.button-danger-outline { color: var(--danger); border-color: rgba(174,63,49,.4); }
.button-danger-outline svg { color: var(--danger); }

/* Catalog */
.catalog-page { background: #f5f2e9; }
.catalog-header { position: sticky; z-index: 20; top: 0; display: flex; min-height: 70px; align-items: center; gap: 24px; padding: 0 max(24px, calc((100vw - 1280px)/2)); color: rgba(255,255,255,.55); background: var(--forest-950); border-bottom: 1px solid rgba(201,167,97,.25); font-size: 11px; }
.catalog-brand { padding-right: 24px; border-right: 1px solid rgba(255,255,255,.12); }
.catalog-brand img { width: 215px; }
.catalog-main { width: min(1280px, calc(100% - 44px)); margin: 0 auto; padding: 66px 0 90px; }
.catalog-hero { display: grid; grid-template-columns: minmax(0,1fr) 260px; align-items: end; gap: 50px; padding-bottom: 46px; border-bottom: 1px solid var(--line); }
.catalog-kicker { margin-bottom: 13px; color: #8b713f; font-size: 11px; font-weight: 800; letter-spacing: .14em; text-transform: uppercase; }
.catalog-hero h1 { max-width: 780px; margin-bottom: 20px; color: var(--forest-900); font-family: var(--serif); font-size: clamp(48px, 7vw, 86px); font-weight: 500; line-height: .92; }
.catalog-hero p:not(.catalog-kicker) { max-width: 700px; margin: 0; color: var(--muted); font-size: 15px; }
.catalog-hero code { padding: 2px 5px; color: var(--forest-800); background: rgba(23,75,54,.07); border-radius: 4px; }
.catalog-summary { padding: 26px; color: var(--white); background: var(--forest-900); border-radius: var(--radius-md); box-shadow: var(--shadow-md); }
.catalog-summary strong, .catalog-summary span, .catalog-summary small { display: block; }
.catalog-summary strong { color: var(--gold); font-family: var(--serif); font-size: 64px; line-height: .8; }
.catalog-summary span { margin-top: 10px; font-size: 12px; font-weight: 750; }
.catalog-summary small { margin-top: 5px; color: rgba(255,255,255,.5); font-size: 10px; }
.catalog-tools { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin: 30px 0; }
.catalog-search { position: relative; display: block; width: min(520px,100%); }
.catalog-search svg { position: absolute; top: 50%; left: 15px; color: var(--muted); transform: translateY(-50%); }
.catalog-search input { width: 100%; height: 48px; padding: 0 16px 0 48px; background: var(--white); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow-sm); outline: none; }
.catalog-search input:focus { border-color: var(--forest-700); box-shadow: 0 0 0 3px rgba(38,99,74,.12); }
.catalog-legend { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 10px; }
.catalog-legend i { width: 7px; height: 7px; background: var(--gold); border-radius: 50%; }
.catalog-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; align-items: start; }
.catalog-module { padding: 22px; background: var(--white); border: 1px solid #e3ded2; border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.catalog-module-head { display: flex; align-items: flex-start; gap: 15px; margin-bottom: 16px; }
.catalog-module-head > div { display: flex; min-width: 0; align-items: center; gap: 11px; margin-right: auto; }
.catalog-index { display: grid; width: 30px; height: 30px; flex: 0 0 30px; place-items: center; color: var(--forest-950); background: var(--gold); border-radius: 7px; font-size: 10px; font-weight: 800; }
.catalog-module h2 { margin: 0; font-family: var(--serif); font-size: 23px; font-weight: 600; line-height: 1.05; }
.count { color: var(--muted); font-size: 9px; white-space: nowrap; }
.screen-links { display: grid; }
.screen-links a { display: grid; grid-template-columns: 28px 1fr 18px; align-items: center; gap: 8px; min-height: 39px; padding: 5px 7px; color: #415148; border-top: 1px solid #efede7; font-size: 11px; }
.screen-links a:hover { color: var(--forest-800); background: #f7f8f5; }
.screen-links a > span:first-child { color: #a4aaa5; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 9px; }
.screen-link-copy { display: block; min-width: 0; }
.screen-link-copy b, .screen-link-copy small { display: block; }
.screen-link-copy b { color: #415148; font-size: 11px; font-weight: 600; }
.screen-link-copy small { margin-top: 1px; color: #969e98; font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: 8px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.screen-links a:hover .screen-link-copy b { color: var(--forest-800); }
.screen-links a svg { width: 15px; opacity: .5; transition: transform .18s ease; }
.screen-links a:hover svg { transform: translateX(3px); }
.empty-search { padding: 60px 20px; color: var(--muted); text-align: center; }
.catalog-footer { display: flex; align-items: center; gap: 12px; padding: 27px max(24px, calc((100vw - 1280px)/2)); color: rgba(255,255,255,.55); background: var(--forest-950); font-size: 10px; }
.catalog-footer img { width: 28px; }
.catalog-footer span:last-child { margin-left: auto; }
.coverage-main { width: min(1200px, calc(100% - 40px)); margin: 0 auto; padding: 50px 0 90px; }
.coverage-main h1 { margin: 30px 0 8px; font-family: var(--serif); font-size: 54px; font-weight: 550; }
.coverage-main > p { color: var(--muted); }
.coverage-main .table-wrap { margin-top: 25px; background: var(--white); border: 1px solid var(--line); border-radius: var(--radius-md); }
.back-link { color: var(--forest-800); font-size: 12px; font-weight: 750; }

/* Lotes de medalhas e cadeia de custódia */
.batch-page { display: grid; gap: 22px; }
.batch-page .page-head { margin-bottom: 0; }
.batch-command { display: flex; align-items: center; justify-content: space-between; gap: 22px; padding: 18px 20px; color: var(--white); background: var(--forest-900); border: 1px solid rgba(201,167,97,.25); border-radius: var(--radius-md); box-shadow: var(--shadow-sm); }
.batch-command strong, .batch-command span { display: block; }
.batch-command strong { color: var(--gold-soft); font-size: 13px; }
.batch-command span { margin-top: 3px; color: rgba(255,255,255,.65); font-size: 10px; }
.batch-command .button svg { width: 16px; }
.batch-metrics { margin: 0; }
.metric-alert { border-color: rgba(174,63,49,.28); background: linear-gradient(145deg,#fff 55%,#fff1ee); }
.metric-alert .metric-top svg { color: var(--danger); }
.batch-toolbar { flex-wrap: wrap; }
.batch-toolbar .search-field { min-width: min(390px,100%); flex: 1; }
.batch-list-panel { overflow: hidden; }
.batch-table { min-width: 900px; }
.batch-table td { vertical-align: middle; }
.cell-note { display: block; margin-top: 2px; color: var(--muted); font-size: 9px; }
.table-footer { display: flex; align-items: center; justify-content: space-between; gap: 14px; padding: 14px 18px; color: var(--muted); border-top: 1px solid var(--line); font-size: 10px; }
.table-footer > div { display: flex; gap: 7px; }
.batch-back { margin-top: -8px; }
.batch-back a { display: inline-flex; align-items: center; gap: 7px; color: var(--forest-800); font-size: 11px; font-weight: 750; }
.batch-back svg { width: 15px; }
.batch-editor-layout { grid-template-columns: minmax(0,1.55fr) minmax(280px,.65fr); align-items: start; }
.batch-form { padding: 24px; }
.batch-form .panel-head h2 { font-size: 22px; }
.batch-import, .batch-form-section { margin-top: 24px; padding-top: 22px; border-top: 1px solid var(--line); }
.batch-import > div:first-child strong, .batch-import > div:first-child span { display: block; }
.batch-import > div:first-child strong { font-size: 12px; }
.batch-import > div:first-child span { margin-top: 3px; color: var(--muted); font-size: 10px; }
.batch-choice { display: flex; flex-wrap: wrap; gap: 10px; margin: 14px 0; }
.batch-choice label { display: flex; align-items: center; gap: 8px; padding: 10px 12px; background: var(--paper); border: 1px solid var(--line); border-radius: 8px; font-size: 11px; cursor: pointer; }
.batch-choice label:has(input:checked) { color: var(--forest-900); background: #edf3ef; border-color: #a8c1b1; box-shadow: inset 0 0 0 1px rgba(23,75,54,.08); font-weight: 750; }
[data-batch-mode-panel][hidden] { display: none !important; }
.batch-generate-panel { display: grid; min-height: 112px; grid-template-columns: 42px minmax(0,1fr); align-items: center; gap: 13px; padding: 18px; color: var(--forest-900); background: #f1f5f2; border: 1px solid #cddbd2; border-radius: 10px; }
.batch-mode-icon { display: grid; width: 40px; height: 40px; place-items: center; color: var(--gold); background: var(--forest-900); border-radius: 10px; }
.batch-mode-icon svg { width: 20px; }
.batch-generate-panel strong, .batch-generate-panel p, .batch-generate-panel small { display: block; }
.batch-generate-panel strong { font-size: 12px; }
.batch-generate-panel p { margin: 5px 0; color: var(--muted); font-size: 10px; line-height: 1.5; }
.batch-generate-panel p b { color: var(--forest-900); }
.batch-generate-panel small { color: #77847c; font-size: 9px; }
.upload-zone { display: grid; min-height: 126px; place-items: center; align-content: center; gap: 5px; color: var(--forest-800); background: #f5f4ee; border: 1px dashed #aaa895; border-radius: 10px; cursor: pointer; text-align: center; }
.upload-zone svg { width: 24px; height: 24px; }
.upload-zone strong { font-size: 12px; }
.upload-zone span { color: var(--muted); font-size: 9px; }
.batch-form-status { min-height: 18px; margin: 10px 0 0; color: var(--muted); font-size: 10px; }
.batch-form-status.error { color: var(--danger); }
.batch-form-status.success { color: var(--success); }
.batch-rules { position: sticky; top: 86px; }
.batch-rule { display: flex; align-items: flex-start; gap: 11px; padding: 14px 0; border-top: 1px solid var(--line); }
.batch-rule:first-of-type { border-top: 0; }
.batch-rule > svg { width: 20px; height: 20px; flex: 0 0 20px; color: var(--forest-700); }
.batch-rule strong, .batch-rule span { display: block; }
.batch-rule strong { font-size: 11px; }
.batch-rule span { margin-top: 3px; color: var(--muted); font-size: 9px; line-height: 1.5; }
.batch-hero { display: flex; align-items: center; justify-content: space-between; gap: 30px; padding: 24px; color: var(--white); background: var(--forest-900); border-radius: var(--radius-md); box-shadow: var(--shadow-md); }
.batch-title-line { display: flex; align-items: center; gap: 12px; }
.batch-title-line h2 { color: var(--gold-soft); font-family: var(--serif); font-size: 34px; font-weight: 600; }
.batch-hero p { margin: 4px 0 12px; color: rgba(255,255,255,.65); font-size: 11px; }
.batch-hero .batch-generation-state { display: inline-flex; margin: 10px 0 0; padding: 7px 10px; color: var(--gold-soft); background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12); border-radius: 7px; font-size: 10px; font-weight: 700; }
.batch-hero .batch-generation-state[hidden] { display: none; }
.batch-hero .entity-meta { color: rgba(255,255,255,.55); }
.batch-hero .entity-meta span::after { color: rgba(255,255,255,.25); }
.batch-hero-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.batch-hero .button-outline { color: var(--white); border-color: rgba(255,255,255,.3); }
.batch-tabs { padding: 0 20px; }
.batch-tab-panel { padding: 0; }
.batch-tab-panel[hidden] { display: none; }
.batch-movement-list { display: grid; padding: 4px 22px 18px; }
.batch-movement-list article { display: grid; grid-template-columns: 36px 1fr auto; align-items: center; gap: 12px; padding: 17px 0; border-top: 1px solid var(--line); }
.batch-movement-list article:first-child { border-top: 0; }
.movement-mark { display: grid; width: 34px; height: 34px; place-items: center; border-radius: 50%; }
.movement-mark svg { width: 17px; height: 17px; }
.movement-mark.success { color: var(--success); background: var(--success-soft); }
.movement-mark.info { color: var(--forest-800); background: #e8f0eb; }
.movement-mark.warning { color: #8c6413; background: var(--warning-soft); }
.batch-movement-list strong, .batch-movement-list p, .batch-movement-list small { display: block; }
.batch-movement-list strong { font-size: 11px; }
.batch-movement-list p { margin: 3px 0; color: var(--muted); font-size: 10px; }
.batch-movement-list small { color: #91988f; font-size: 9px; }
.batch-movement-list a { color: var(--forest-700); font-size: 10px; font-weight: 750; }
.batch-flow { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(285px,.55fr); gap: 18px; align-items: start; }
.selection-count { min-width: 96px; padding: 8px 11px; color: var(--muted); background: var(--paper); border: 1px solid var(--line); border-radius: 8px; font-size: 9px; text-align: center; }
.selection-count strong { display: block; color: var(--forest-900); font-family: var(--serif); font-size: 23px; line-height: 1; }
.compact-table { max-height: 275px; overflow: auto; border: 1px solid var(--line); border-radius: 8px; }
.compact-table thead { position: sticky; z-index: 1; top: 0; }
.row-disabled { color: #9b9e99; background: #f5f4f0; }
.batch-preview { position: sticky; top: 86px; }
.batch-route-visual { display: grid; grid-template-columns: 1fr 35px 1fr; align-items: center; gap: 8px; margin-bottom: 18px; padding: 16px; background: var(--paper); border-radius: 10px; }
.batch-route-visual > div span, .batch-route-visual > div strong, .batch-route-visual > div small { display: block; }
.batch-route-visual > div span { color: var(--muted); font-size: 8px; text-transform: uppercase; }
.batch-route-visual > div strong { margin: 4px 0; font-size: 10px; }
.batch-route-visual > div small { color: var(--muted); font-size: 8px; }
.batch-route-visual i { display: grid; place-items: center; color: var(--gold-dark); }
.batch-route-visual i svg { width: 18px; }
.text-success { color: var(--success); }
.batch-receipt-summary { display: grid; grid-template-columns: repeat(4,1fr); gap: 8px; margin-bottom: 18px; }
.batch-receipt-summary > div { padding: 13px; background: var(--paper); border: 1px solid var(--line); border-radius: 9px; }
.batch-receipt-summary span, .batch-receipt-summary strong { display: block; }
.batch-receipt-summary span { color: var(--muted); font-size: 8px; text-transform: uppercase; }
.batch-receipt-summary strong { margin-top: 4px; color: var(--forest-900); font-family: var(--serif); font-size: 26px; }
.batch-receipt-summary .danger { background: var(--danger-soft); border-color: rgba(174,63,49,.25); }
.batch-receipt-summary .danger strong { color: var(--danger); }
.scan-box { display: grid; grid-template-columns: 1fr minmax(230px,.7fr); align-items: center; gap: 18px; margin-bottom: 20px; padding: 16px; color: var(--white); background: var(--forest-800); border-radius: 10px; }
.scan-box > div:first-child { display: flex; align-items: center; gap: 11px; }
.scan-box > div:first-child > svg { width: 28px; height: 28px; color: var(--gold); }
.scan-box strong, .scan-box span { display: block; }
.scan-box strong { font-size: 11px; }
.scan-box span { color: rgba(255,255,255,.6); font-size: 9px; }
.scan-box .inline-input input { background: var(--white); }
.batch-divergence { margin: 20px 0; padding: 16px; background: var(--danger-soft); border: 1px solid rgba(174,63,49,.22); border-radius: 10px; }
.batch-divergence h3 { color: var(--danger); font-size: 14px; }
.divergence-row { display: grid; grid-template-columns: 34px 1fr minmax(190px,.7fr); align-items: center; gap: 10px; }
.divergence-row > span { display: grid; width: 32px; height: 32px; place-items: center; color: var(--danger); background: var(--white); border-radius: 50%; }
.divergence-row > span svg { width: 17px; }
.divergence-row strong, .divergence-row small { display: block; }
.divergence-row strong { font-size: 10px; }
.divergence-row small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.divergence-row select { min-height: 40px; padding: 0 10px; background: var(--white); border: 1px solid var(--line); border-radius: 7px; font-size: 9px; }

/* Tutor home: responsive SaaS experience */
.tutor-home { display: grid; gap: 28px; }
.tutor-home-head { display: flex; align-items: flex-end; gap: 28px; padding: 8px 0 2px; }
.tutor-home-head > div:first-child { min-width: 0; margin-right: auto; }
.tutor-home-head p { margin: 0 0 7px; color: var(--forest-700); font-size: 12px; font-weight: 800; }
.tutor-home-head h1 { max-width: 720px; margin: 0; color: var(--forest-950); font-family: var(--serif); font-size: clamp(42px, 4.6vw, 62px); font-weight: 550; letter-spacing: -.025em; line-height: .98; }
.tutor-home-head > div:first-child > span { display: block; max-width: 620px; margin-top: 12px; color: var(--muted); font-size: 14px; }
.tutor-home-actions { display: flex; flex: 0 0 auto; gap: 9px; }
.tutor-home-layout { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(320px,.75fr); align-items: start; gap: 20px; }
.tutor-home-primary, .tutor-home-aside { display: grid; min-width: 0; gap: 20px; }
.tutor-section-head { display: flex; align-items: flex-end; gap: 20px; margin-bottom: 13px; }
.tutor-section-head > div { min-width: 0; margin-right: auto; }
.tutor-section-head h2 { margin: 0; font-family: var(--serif); font-size: 28px; font-weight: 600; }
.tutor-section-head p { margin: 3px 0 0; color: var(--muted); font-size: 12px; }
.tutor-section-head > a { display: inline-flex; align-items: center; gap: 5px; color: var(--forest-800); font-size: 11px; font-weight: 800; }
.tutor-section-head > a svg { width: 15px; }
.tutor-pet-card { display: grid; min-height: 178px; grid-template-columns: 164px minmax(0,1fr) auto; align-items: center; overflow: hidden; background: var(--white); border: 1px solid #e3e0d5; border-radius: 18px; box-shadow: var(--shadow-sm); }
.tutor-pet-visual { display: grid; width: 164px; height: 100%; place-items: center; background: var(--forest-950); border-radius: 0 48% 48% 0; }
.tutor-pet-visual img { width: 116px; height: 116px; object-fit: cover; object-position: center 30%; background: var(--cream); border: 5px solid var(--white); border-radius: 50%; box-shadow: 0 0 0 2px var(--gold), 0 12px 28px rgba(0,0,0,.2); }
.tutor-pet-copy { min-width: 0; padding: 22px; }
.tutor-pet-title { display: flex; align-items: flex-start; gap: 18px; }
.tutor-pet-title > div { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-right: auto; }
.tutor-pet-title h3 { margin: 0; color: var(--forest-950); font-family: var(--serif); font-size: 34px; font-weight: 600; line-height: 1; }
.tutor-protected { display: inline-flex; align-items: center; gap: 6px; color: var(--muted); font-size: 10px; white-space: nowrap; }
.tutor-protected svg { width: 15px; color: var(--gold-dark, #9a752e); }
.tutor-pet-progress { margin-top: 18px; }
.tutor-pet-progress > div:first-child { display: flex; justify-content: space-between; gap: 14px; margin-bottom: 7px; color: var(--muted); font-size: 10px; }
.tutor-pet-progress strong { display: inline-flex; align-items: center; gap: 4px; color: var(--forest-800); }
.tutor-pet-progress strong svg { width: 12px; }
.tutor-progress-track { height: 6px; overflow: hidden; background: #eceee9; border-radius: 999px; }
.tutor-progress-track i { display: block; width: 100%; height: 100%; background: var(--forest-700); border-radius: inherit; }
.tutor-progress-track.large { height: 8px; margin: -4px 0 7px; }
.tutor-pet-meta { display: flex; flex-wrap: wrap; gap: 10px 16px; margin-top: 14px; color: var(--muted); font-size: 9px; }
.tutor-pet-meta span { display: inline-flex; align-items: center; gap: 5px; }
.tutor-pet-meta svg { width: 14px; color: var(--forest-700); }
.tutor-pet-open { margin-right: 22px; white-space: nowrap; }
.tutor-pet-open svg { width: 16px; }
.tutor-activity { padding-bottom: 8px; }
.tutor-activity-list { display: grid; }
.tutor-activity-list article { display: grid; grid-template-columns: 38px minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 14px 0; border-top: 1px solid #ece9e1; }
.tutor-activity-list article:first-child { border-top: 0; }
.tutor-activity-icon { display: grid; width: 36px; height: 36px; place-items: center; color: var(--forest-800); background: #e7eee9; border-radius: 50%; }
.tutor-activity-icon.verified { color: var(--success); background: var(--success-soft); }
.tutor-activity-icon.delivery { color: var(--warning); background: var(--warning-soft); }
.tutor-activity-icon svg { width: 17px; }
.tutor-activity-list strong, .tutor-activity-list p { display: block; margin: 0; }
.tutor-activity-list strong { font-size: 12px; }
.tutor-activity-list p, .tutor-activity-list time { color: var(--muted); font-size: 10px; }
.tutor-next .panel-head > strong { color: var(--forest-800); font-family: var(--serif); font-size: 28px; }
.tutor-next .panel-head .tutor-essential-badge { display: inline-flex; min-height: 28px; align-items: center; gap: 5px; padding: 5px 9px; color: var(--forest-800); background: var(--success-soft); border-radius: 999px; font-family: var(--sans); font-size: 9px; font-weight: 900; white-space: nowrap; }
.tutor-essential-badge svg { width: 13px; }
.tutor-progress-caption { margin: 0 0 10px; color: var(--forest-700); font-size: 9px; font-weight: 800; text-align: right; }
.tutor-next-list { display: grid; }
.tutor-next-list a { display: grid; min-height: 64px; grid-template-columns: 34px minmax(0,1fr) 18px; align-items: center; gap: 10px; border-top: 1px solid #ece9e1; }
.tutor-next-list a > span { display: grid; width: 32px; height: 32px; place-items: center; color: var(--warning); background: var(--warning-soft); border-radius: 50%; }
.tutor-next-list a > span.done { color: var(--success); background: var(--success-soft); }
.tutor-next-list a > span svg, .tutor-next-list a > svg { width: 16px; }
.tutor-next-list a > svg { color: #929a95; }
.tutor-next-list strong, .tutor-next-list small { display: block; }
.tutor-next-list strong { font-size: 11px; }
.tutor-next-list small { margin-top: 2px; color: var(--muted); font-size: 9px; }
.tutor-optional { margin-top: 13px; padding: 12px; background: #fbf8f0; border: 1px solid #e9dfc7; border-radius: 14px; }
.tutor-optional-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; margin-bottom: 5px; }
.tutor-optional-head span, .tutor-optional-head strong { display: block; }
.tutor-optional-head span { margin-bottom: 2px; color: var(--warning); font-size: 8px; font-weight: 900; letter-spacing: .07em; text-transform: uppercase; }
.tutor-optional-head strong { font-family: var(--serif); font-size: 15px; }
.tutor-optional-head > small { padding: 4px 7px; color: #74633e; background: #f3e8cc; border-radius: 999px; font-size: 7px; font-weight: 800; white-space: nowrap; }
.tutor-optional > a { display: grid; min-height: 55px; grid-template-columns: 32px minmax(0,1fr) 16px; align-items: center; gap: 9px; border-top: 1px solid #e8dec6; }
.tutor-optional > a > span { display: grid; width: 30px; height: 30px; place-items: center; color: var(--warning); background: var(--warning-soft); border-radius: 50%; }
.tutor-optional > a svg { width: 15px; }
.tutor-optional > a > svg { color: #929a95; }
.tutor-optional > a strong, .tutor-optional > a small { display: block; }
.tutor-optional > a strong { font-size: 10px; }
.tutor-optional > a small { margin-top: 2px; color: var(--muted); font-size: 8px; }
.tutor-continue { width: 100%; margin-top: 16px; }
.tutor-continue small { margin-left: 3px; color: var(--muted); font-size: 9px; font-weight: 600; }
.tutor-medal-head { display: flex; align-items: center; gap: 13px; margin-bottom: 12px; }
.tutor-medal-head > span { display: grid; width: 48px; height: 48px; place-items: center; color: var(--gold); background: var(--forest-950); border-radius: 50%; }
.tutor-medal-head > span svg { width: 23px; }
.tutor-medal-head h2 { margin: 0; font-family: var(--serif); font-size: 21px; }
.tutor-medal-head p { margin: 2px 0 0; color: var(--muted); font-size: 10px; }
.tutor-medal .info-row { padding: 10px 0; }
.tutor-medal .info-row span { width: 105px; flex-basis: 105px; }
.tutor-medal > a { display: inline-flex; align-items: center; gap: 6px; margin-top: 14px; color: var(--forest-800); font-size: 11px; font-weight: 800; }
.tutor-medal > a svg { width: 15px; }

/* Lista de medalhas em cards ilustrados, com a arte real de cada medalha. */
.medal-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 16px; }
.medal-card { display: grid; grid-template-columns: 116px minmax(0,1fr); gap: 16px; align-items: center; padding: 18px; background: var(--white); border: 1px solid #e3e0d5; border-radius: 16px; box-shadow: var(--shadow-sm); }
.medal-card-art { display: grid; place-items: center; }
.medal-card-art img { width: 108px; height: 108px; border-radius: 50%; box-shadow: 0 0 0 1px #e5e0d2, 0 10px 22px rgba(0,0,0,.12); }
.medal-card-top { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 6px; }
.medal-card-top strong { font-family: var(--serif); font-size: 19px; }
.medal-card .info-row { padding: 7px 0; }
.medal-card .info-row span { width: 92px; flex-basis: 92px; }
.medal-card-link { display: inline-flex; align-items: center; gap: 6px; margin-top: 12px; color: var(--forest-800); font-size: 11px; font-weight: 800; }
.medal-card-link svg { width: 15px; }
.medal-empty { display: grid; justify-items: center; gap: 10px; padding: 30px 20px; text-align: center; }
.medal-empty img { width: 132px; height: 132px; margin-bottom: 4px; }
.medal-empty h2 { margin: 0; font-family: var(--serif); font-size: 24px; }
.medal-empty p { max-width: 380px; margin: 0 0 8px; color: var(--muted); font-size: 13px; }
@media (max-width: 520px) { .medal-card { grid-template-columns: 1fr; } }

/* Perfil do animal (documento animal): coluna única reusando a linguagem tutor-* */
.pet-profile { display: grid; gap: 18px; max-width: 720px; margin: 0 auto; }
.pet-profile-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; }
.pet-profile-bar-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.pet-profile-identity { min-height: 160px; }
.pet-profile-illustration { display: grid; width: 116px; height: 116px; place-items: center; color: var(--forest-700); background: var(--cream); border: 5px solid var(--white); border-radius: 50%; box-shadow: 0 0 0 2px var(--gold), 0 12px 28px rgba(0,0,0,.2); }
.pet-profile-illustration svg { width: 52px; }
.pet-profile-note { display: grid; justify-items: start; gap: 12px; }
.pet-profile-note p { margin: 0; color: var(--muted); font-size: 13px; }
.pet-profile-medal-art { display: block; width: 100%; max-width: 340px; height: auto; margin: 2px 0 14px; border-radius: 14px; }
/* Lista de animais em coluna única, com rolagem e busca quando há muitos pets. */
.pet-search { max-width: 440px; margin-bottom: 16px; }
.pet-search input { width: 100%; min-height: 44px; padding: 0 14px; color: inherit; background: var(--white); border: 1px solid #e3e0d5; border-radius: 12px; font: inherit; font-size: 14px; }
.pet-search input:focus-visible { outline: 2px solid var(--forest-700); outline-offset: 1px; }
.pet-list { display: grid; gap: 12px; }
.pet-list.scrollable { max-height: 560px; overflow-y: auto; padding: 4px; margin: 0 -4px; }
.pet-list .tutor-pet-card { min-height: 178px; }
.tutor-pet-actions { display: flex; flex-direction: column; gap: 8px; margin-right: 22px; }
.tutor-pet-actions .button { white-space: nowrap; }
.tutor-pet-actions svg { width: 16px; }
.tutor-pet-visual .pet-profile-illustration { width: 116px; height: 116px; }
.pet-list-empty { margin: 14px 0 0; color: var(--muted); font-size: 13px; }
@media (max-width: 680px) {
  /* No celular o 4:3 fica ótimo; no desktop viraria um bloco alto demais, então lá vale o 16:9 base. */
  .pet-cover { aspect-ratio: 4 / 3; }
  .tutor-pet-card { grid-template-columns: 1fr; }
  .tutor-pet-visual { width: 100%; height: 132px; border-radius: 0; }
  .tutor-pet-actions { flex-direction: row; margin: 0 22px 22px; }
  .tutor-pet-actions .button { flex: 1; }
}
.tutor-optional > a > span.done { color: var(--success); background: var(--success-soft); }
.tutor-medal .info-row strong .chip { font-size: 10px; }
@media (max-width: 520px) {
  .pet-profile-identity { grid-template-columns: 116px minmax(0,1fr); }
  .pet-profile-identity .tutor-pet-visual { width: 116px; }
  .pet-profile-identity .tutor-pet-visual img, .pet-profile-identity .pet-profile-illustration { width: 88px; height: 88px; }
  .pet-profile-identity .tutor-pet-title h3 { font-size: 26px; }
}

/* Administração — gestão do negócio */
.admin-shell .app-sidebar { overflow: hidden; }
.admin-nav-groups { flex: 1; align-content: start; gap: 16px; margin: 18px -4px 10px 0; padding-right: 4px; overflow-y: auto; scrollbar-width: thin; scrollbar-color: rgba(255,255,255,.18) transparent; }
.admin-nav-group { display: grid; gap: 3px; }
.admin-nav-group > p { margin: 0 10px 4px; color: rgba(255,255,255,.35); font-size: 9px; font-weight: 800; letter-spacing: .13em; text-transform: uppercase; }
.admin-shell .sidebar-account { flex: 0 0 auto; margin-top: 0; }
.admin-business { display: grid; gap: 22px; }
.admin-page-heading { display: flex; align-items: flex-start; gap: 24px; }
.admin-page-heading > div:first-child { min-width: 0; margin-right: auto; }
.admin-page-heading > div:first-child > span { display: block; margin-bottom: 7px; color: #8f743d; font-size: 10px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.admin-page-heading h1 { margin: 0; color: var(--forest-950); font-family: var(--sans); font-size: clamp(30px, 3vw, 42px); font-weight: 790; letter-spacing: -.035em; line-height: 1; }
.admin-page-heading p { max-width: 720px; margin: 9px 0 0; color: var(--muted); font-size: 13px; }
.admin-heading-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 9px; }
.admin-heading-actions svg { width: 16px; }
.admin-title-line { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.admin-order-heading { flex-wrap: wrap; }
.admin-order-heading .admin-heading-actions { max-width: 100%; margin-left: auto; }
.admin-back-link { display: inline-flex; width: max-content; align-items: center; gap: 7px; color: var(--forest-700); font-size: 11px; font-weight: 750; }
.admin-back-link svg { width: 15px; }

.admin-kpis { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: 12px; }
.admin-kpis.compact { grid-template-columns: repeat(4,minmax(0,1fr)); }
.admin-kpi { min-width: 0; padding: 17px 18px; background: var(--white); border: 1px solid #e3e1d8; border-radius: 12px; box-shadow: var(--shadow-sm); }
.admin-kpi > div { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 10px; font-weight: 740; text-transform: uppercase; }
.admin-kpi > div svg { width: 17px; height: 17px; color: var(--forest-700); }
.admin-kpi strong { display: block; margin-top: 12px; color: var(--forest-950); font-family: var(--sans); font-size: clamp(22px, 2.2vw, 31px); font-weight: 780; letter-spacing: -.035em; line-height: 1; }
.admin-kpi small { display: block; margin-top: 8px; color: var(--muted); font-size: 10px; }
.admin-kpi.positive small { color: var(--success); font-weight: 700; }
.admin-kpi.attention { background: #fffbf2; border-color: #ebd9ab; }
.admin-kpi.attention > div svg, .admin-kpi.attention small { color: var(--warning); }

.admin-overview-grid { display: grid; grid-template-columns: minmax(0,1.65fr) minmax(280px,.72fr); gap: 16px; }
.admin-overview-lower { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(320px,.65fr); gap: 16px; }
.admin-panel-head { display: flex; align-items: flex-start; gap: 14px; margin-bottom: 18px; }
.admin-panel-head > div:first-child { min-width: 0; margin-right: auto; }
.admin-panel-head h2 { margin: 0; color: var(--forest-950); font-size: 17px; letter-spacing: -.015em; }
.admin-panel-head p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.admin-panel-head > a, .admin-panel-head > button.table-link { display: inline-flex; align-items: center; gap: 5px; color: var(--forest-700); font-size: 11px; font-weight: 760; white-space: nowrap; }
.admin-panel-head > a svg { width: 14px; }
.admin-orders-panel .admin-panel-head { padding: 20px 20px 0; }
.table-entity { display: flex; align-items: center; gap: 10px; white-space: nowrap; }
.table-avatar { display: grid; width: 34px; height: 34px; flex: 0 0 34px; place-items: center; color: var(--forest-800); background: #e6eee8; border-radius: 8px; font-size: 10px; font-weight: 820; }
.table-entity strong, .table-entity span { display: block; }
.table-entity span { margin-top: 2px; color: var(--muted); font-size: 9px; }
.table-link { color: var(--forest-900); font-weight: 780; }
.table-link:hover { text-decoration: underline; text-underline-offset: 3px; }
.admin-health-list { display: grid; }
.admin-health-list a { display: grid; grid-template-columns: 38px minmax(0,1fr) auto 16px; align-items: center; gap: 11px; min-height: 74px; border-top: 1px solid #ebe9e1; }
.admin-health-list a:first-child { border-top: 0; }
.admin-health-list a > svg { width: 15px; color: #8e9691; }
.admin-health-list strong, .admin-health-list small { display: block; }
.admin-health-list strong { color: var(--ink); font-size: 11px; }
.admin-health-list small { margin-top: 3px; color: var(--muted); font-size: 9px; line-height: 1.35; }
.admin-health-list b { min-width: 28px; color: var(--forest-800); font-size: 12px; text-align: right; }
.admin-health-icon { display: grid; width: 36px; height: 36px; place-items: center; color: var(--info); background: var(--info-soft); border-radius: 10px; }
.admin-health-icon.warning { color: var(--warning); background: var(--warning-soft); }
.admin-health-icon.danger { color: var(--danger); background: var(--danger-soft); }
.admin-health-icon svg { width: 17px; }
.admin-summary-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 1px; overflow: hidden; background: #e7e4dc; border: 1px solid #e7e4dc; border-radius: 10px; }
.admin-summary-grid > div { min-width: 0; padding: 15px; background: #fafaf7; }
.admin-summary-grid span, .admin-summary-grid strong, .admin-summary-grid small { display: block; }
.admin-summary-grid span { color: var(--muted); font-size: 10px; }
.admin-summary-grid strong { margin-top: 7px; color: var(--forest-950); font-size: 19px; }
.admin-summary-grid small { margin-top: 4px; color: var(--success); font-size: 9px; }
.admin-shortcuts > div:last-child { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 8px; }
.admin-shortcuts > div:last-child a { display: flex; min-height: 54px; align-items: center; gap: 9px; padding: 10px; color: var(--forest-800); background: #f5f6f2; border: 1px solid #e5e5dc; border-radius: 9px; font-size: 10px; font-weight: 760; }
.admin-shortcuts > div:last-child svg { width: 17px; color: #a27f37; }

.admin-order-list { overflow: visible; }
.admin-order-filters { display: flex; align-items: center; gap: 8px; padding: 14px; border-bottom: 1px solid #ebe9e1; }
.admin-order-filters .search-field { min-width: 260px; }
.admin-order-filters .button { flex: 0 0 auto; min-height: 40px; }
.admin-saved-view { display: flex; min-height: 62px; align-items: center; gap: 16px; padding: 10px 16px; background: #fbfbf8; border-bottom: 1px solid #ebe9e1; }
.admin-saved-view > div { display: flex; min-width: 0; align-items: center; gap: 9px; margin-right: auto; }
.admin-saved-view strong { font-size: 11px; }
.admin-saved-view small, .admin-saved-view > span { color: var(--muted); font-size: 10px; }
.admin-orders-table { min-width: 1060px; }
.admin-orders-table tbody tr { transition: background .15s ease; }
.admin-orders-table tbody tr:hover { background: #fbfcf9; }
.admin-orders-table td { height: 70px; }
.admin-cell-note { display: block; margin-top: 4px; color: var(--muted); font-size: 9px; }
.admin-risk { display: inline-flex; align-items: center; gap: 6px; color: var(--success); font-size: 10px; font-weight: 750; }
.admin-risk::before { width: 6px; height: 6px; content: ''; background: currentColor; border-radius: 50%; }
.admin-risk.attention { color: var(--warning); }
.admin-row-open { border: 1px solid transparent; border-radius: 50%; }
.admin-orders-table tr:hover .admin-row-open { color: var(--forest-800); background: #e7eee9; border-color: #d5e0d8; }
.admin-table-footer { display: flex; min-height: 62px; align-items: center; gap: 16px; padding: 10px 16px; border-top: 1px solid #ebe9e1; }
.admin-table-footer > span { margin-right: auto; color: var(--muted); font-size: 10px; }
.admin-table-footer > div { display: flex; gap: 7px; }
.admin-table-footer .button { min-height: 36px; }

.admin-order-layout { display: grid; grid-template-columns: minmax(0,1.48fr) minmax(320px,.62fr); align-items: start; gap: 16px; }
.admin-order-main, .admin-order-aside { display: grid; gap: 16px; }
.admin-order-aside { position: sticky; top: 82px; }
.admin-order-items > article { display: grid; grid-template-columns: 72px minmax(0,1fr) auto; align-items: center; gap: 14px; padding: 15px 0; border-top: 1px solid #ebe9e1; border-bottom: 1px solid #ebe9e1; }
.admin-order-items > article img { width: 68px; height: 68px; object-fit: contain; background: #f4f0e6; border-radius: 10px; }
.admin-order-items > article strong, .admin-order-items > article span, .admin-order-items > article small { display: block; }
.admin-order-items > article strong { color: var(--forest-950); font-size: 12px; }
.admin-order-items > article span, .admin-order-items > article small { margin-top: 4px; color: var(--muted); font-size: 9px; }
.admin-order-items > article > b { font-size: 12px; white-space: nowrap; }
.admin-order-totals { width: min(360px,100%); margin: 14px 0 0 auto; }
.admin-order-totals > div { display: flex; justify-content: space-between; gap: 18px; padding: 7px 0; color: var(--muted); font-size: 11px; }
.admin-order-totals .final { margin-top: 5px; padding-top: 13px; color: var(--forest-950); border-top: 1px solid #dedbd1; font-size: 13px; }
.admin-order-timeline { display: grid; }
.admin-order-timeline article { position: relative; display: grid; min-height: 68px; grid-template-columns: 32px minmax(0,1fr); gap: 12px; }
.admin-order-timeline article::before { position: absolute; top: 31px; bottom: 0; left: 15px; width: 1px; content: ''; background: #dfe2dd; }
.admin-order-timeline article:last-child::before { display: none; }
.admin-order-timeline article > span { z-index: 1; display: grid; width: 32px; height: 32px; place-items: center; color: #9ca39f; background: #f1f2ef; border: 1px solid #e1e3df; border-radius: 50%; }
.admin-order-timeline article.done > span { color: var(--success); background: var(--success-soft); }
.admin-order-timeline article.current > span { color: #8a671d; background: var(--warning-soft); border-color: #ead19a; }
.admin-order-timeline article > span svg { width: 14px; }
.admin-order-timeline strong, .admin-order-timeline small { display: block; }
.admin-order-timeline strong { font-size: 11px; }
.admin-order-timeline small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.admin-order-aside address { margin-bottom: 10px; color: var(--ink); font-size: 11px; font-style: normal; line-height: 1.65; }
.admin-danger-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin-top: 14px; }
.admin-danger-actions .button { min-height: 38px; padding-inline: 10px; font-size: 9px; }
.admin-internal-note textarea { width: 100%; min-height: 88px; padding: 11px; resize: vertical; background: #fbfbf8; border: 1px solid var(--line); border-radius: 8px; font-size: 11px; }
.admin-internal-note > .button { width: 100%; min-height: 38px; margin-top: 8px; }

/* Portal do afiliado */
.affiliate-shell { background: #f5f4ee; }
.affiliate-shell .app-main { width: min(1240px, calc(100% - 56px)); }
.affiliate-page { display: grid; gap: 22px; }
.affiliate-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 28px; padding: 8px 0 4px; }
.affiliate-heading > div:first-child { max-width: 760px; }
.affiliate-eyebrow { display: block; margin-bottom: 7px; color: var(--forest-700); font-size: 10px; font-weight: 850; letter-spacing: .13em; text-transform: uppercase; }
.affiliate-heading h1 { margin-bottom: 9px; color: var(--forest-950); font-family: var(--serif); font-size: clamp(42px,5vw,60px); font-weight: 600; line-height: .95; }
.affiliate-heading p { max-width: 690px; margin: 0; color: var(--muted); font-size: 14px; }
.affiliate-heading-actions { display: flex; flex: 0 0 auto; gap: 9px; }
.affiliate-share-card { display: grid; min-height: 104px; grid-template-columns: 52px minmax(0,1fr) auto; align-items: center; gap: 16px; padding: 18px 22px; color: var(--white); background: linear-gradient(135deg,var(--forest-950),var(--forest-800)); border: 1px solid rgba(201,167,97,.25); border-radius: 18px; box-shadow: var(--shadow-md); }
.affiliate-share-icon { display: grid; width: 48px; height: 48px; place-items: center; color: var(--gold); background: rgba(255,255,255,.08); border-radius: 50%; }
.affiliate-share-card div > span, .affiliate-share-card div > strong, .affiliate-share-card div > small { display: block; }
.affiliate-share-card div > span { margin-bottom: 3px; color: var(--gold-soft); font-size: 9px; font-weight: 850; letter-spacing: .1em; text-transform: uppercase; }
.affiliate-share-card div > strong { font-size: 17px; overflow-wrap: anywhere; }
.affiliate-share-card div > small { margin-top: 4px; color: rgba(255,255,255,.62); font-size: 10px; }
.affiliate-share-card .button { min-width: 150px; }
.affiliate-kpis { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.affiliate-kpi { min-height: 142px; padding: 18px; background: var(--white); border: 1px solid #e1ddd2; border-radius: 16px; box-shadow: var(--shadow-sm); }
.affiliate-kpi > div { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 10px; font-weight: 750; text-transform: uppercase; }
.affiliate-kpi > div svg { width: 18px; color: var(--forest-700); }
.affiliate-kpi > strong, .affiliate-kpi > small { display: block; }
.affiliate-kpi > strong { margin-top: 18px; font-family: var(--serif); font-size: 32px; line-height: 1; }
.affiliate-kpi > small { margin-top: 8px; color: var(--muted); font-size: 9px; }
.affiliate-kpi.positive > small { color: var(--success); font-weight: 750; }
.affiliate-dashboard-layout { display: grid; grid-template-columns: minmax(0,1.55fr) minmax(280px,.65fr); align-items: start; gap: 18px; }
.affiliate-dashboard-main, .affiliate-dashboard-aside { display: grid; gap: 18px; }
.affiliate-panel-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 15px; }
.affiliate-panel-head h2, .affiliate-panel-head p { margin: 0; }
.affiliate-panel-head h2 { font-family: var(--serif); font-size: 24px; font-weight: 650; line-height: 1; }
.affiliate-panel-head p { margin-top: 5px; color: var(--muted); font-size: 10px; }
.affiliate-panel-head > a, .affiliate-release a, .affiliate-link-rules a, .affiliate-next-payment a { display: inline-flex; align-items: center; gap: 5px; color: var(--forest-700); font-size: 10px; font-weight: 800; white-space: nowrap; }
.affiliate-panel-head a svg, .affiliate-release a svg, .affiliate-link-rules a svg, .affiliate-next-payment a svg { width: 14px; }
.affiliate-funnel { display: grid; grid-template-columns: 1fr 24px 1fr 24px 1fr; align-items: center; gap: 7px; }
.affiliate-funnel > div { min-height: 104px; padding: 15px; background: #f5f7f3; border: 1px solid #e4e8e1; border-radius: 12px; }
.affiliate-funnel > div:last-child { background: var(--success-soft); border-color: #cee2d7; }
.affiliate-funnel span, .affiliate-funnel strong, .affiliate-funnel small { display: block; }
.affiliate-funnel span { color: var(--muted); font-size: 9px; font-weight: 750; text-transform: uppercase; }
.affiliate-funnel strong { margin-top: 8px; font-family: var(--serif); font-size: 28px; }
.affiliate-funnel small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.affiliate-funnel > i { color: #98a29c; }
.affiliate-funnel > i svg { width: 17px; }
.affiliate-sale-list { display: grid; }
.affiliate-sale-list article { display: grid; min-height: 68px; grid-template-columns: 38px minmax(0,1fr) auto 76px; align-items: center; gap: 10px; border-top: 1px solid #ece9e1; }
.affiliate-sale-list article:first-child { border-top: 0; }
.affiliate-sale-icon { display: grid; width: 34px; height: 34px; place-items: center; color: var(--success); background: var(--success-soft); border-radius: 50%; }
.affiliate-sale-icon.pending { color: var(--warning); background: var(--warning-soft); }
.affiliate-sale-icon svg { width: 15px; }
.affiliate-sale-list strong, .affiliate-sale-list small { display: block; }
.affiliate-sale-list strong { font-size: 11px; }
.affiliate-sale-list small { color: var(--muted); font-size: 9px; }
.affiliate-sale-list b { text-align: right; }
.affiliate-balance-card { padding: 22px; color: var(--white); background: var(--forest-950); border-radius: 18px; box-shadow: var(--shadow-md); }
.affiliate-balance-card > span, .affiliate-balance-card > strong, .affiliate-balance-card > small { display: block; }
.affiliate-balance-card > span { color: var(--gold-soft); font-size: 10px; font-weight: 800; text-transform: uppercase; }
.affiliate-balance-card > strong { margin-top: 7px; font-family: var(--serif); font-size: 38px; line-height: 1; }
.affiliate-balance-card > small { margin-top: 6px; color: rgba(255,255,255,.56); font-size: 9px; }
.affiliate-balance-card > div { display: flex; justify-content: space-between; gap: 12px; margin: 18px 0; padding-top: 14px; color: rgba(255,255,255,.68); border-top: 1px solid rgba(255,255,255,.13); font-size: 9px; }
.affiliate-balance-card > div b { color: var(--white); }
.affiliate-balance-card .button { width: 100%; }
.affiliate-opportunity h2 { margin: 0 0 7px; font-family: var(--serif); font-size: 24px; line-height: 1; }
.affiliate-opportunity p { margin-bottom: 15px; color: var(--muted); font-size: 10px; }
.affiliate-opportunity .button { width: 100%; }
.affiliate-release { display: grid; grid-template-columns: 42px minmax(0,1fr); align-items: start; gap: 12px; }
.affiliate-release-icon { display: grid; width: 40px; height: 40px; place-items: center; color: var(--forest-700); background: var(--success-soft); border-radius: 50%; }
.affiliate-release-icon svg { width: 18px; }
.affiliate-release strong, .affiliate-release p { display: block; margin: 0; }
.affiliate-release p { margin: 4px 0 9px; color: var(--muted); font-size: 9px; }
.affiliate-setup-summary { display: grid; grid-template-columns: 52px minmax(0,1fr) minmax(180px,320px); align-items: center; gap: 16px; padding: 20px 22px; background: var(--success-soft); border: 1px solid #cfe1d6; border-radius: 16px; }
.affiliate-setup-check { display: grid; width: 48px; height: 48px; place-items: center; color: var(--white); background: var(--success); border-radius: 50%; }
.affiliate-setup-summary strong, .affiliate-setup-summary p { display: block; margin: 0; }
.affiliate-setup-summary strong { font-family: var(--serif); font-size: 22px; }
.affiliate-setup-summary p { color: var(--forest-700); font-size: 10px; }
.affiliate-setup-progress { height: 8px; overflow: hidden; background: rgba(47,116,82,.14); border-radius: 99px; }
.affiliate-setup-progress i { display: block; width: 100%; height: 100%; background: var(--success); }
.affiliate-setup-layout { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(270px,.6fr); align-items: start; gap: 18px; }
.affiliate-setup-list > a { display: grid; min-height: 82px; grid-template-columns: 42px minmax(0,1fr) 18px; align-items: center; gap: 12px; border-top: 1px solid #ece9e1; }
.affiliate-setup-list > a > span { display: grid; width: 38px; height: 38px; place-items: center; color: var(--success); background: var(--success-soft); border-radius: 50%; }
.affiliate-setup-list > a > span svg, .affiliate-setup-list > a > svg { width: 16px; }
.affiliate-setup-list > a > svg { color: #8c9690; }
.affiliate-setup-list small, .affiliate-setup-list strong, .affiliate-setup-list p { display: block; margin: 0; }
.affiliate-setup-list small { color: var(--success); font-size: 8px; font-weight: 800; text-transform: uppercase; }
.affiliate-setup-list strong { margin-top: 2px; font-size: 12px; }
.affiliate-setup-list p { margin-top: 2px; color: var(--muted); font-size: 9px; }
.affiliate-setup-aside { display: grid; gap: 18px; }
.affiliate-setup-aside h2 { margin: 0 0 8px; font-family: var(--serif); font-size: 26px; }
.affiliate-setup-aside p { color: var(--muted); font-size: 10px; }
.affiliate-setup-aside .button { width: 100%; }
.affiliate-links-layout { display: grid; grid-template-columns: minmax(0,1.45fr) minmax(250px,.55fr); align-items: start; gap: 18px; }
.affiliate-link-builder > .button { margin-top: 16px; }
.affiliate-link-rules { text-align: left; }
.affiliate-link-rules h2 { margin: 13px 0 7px; font-family: var(--serif); font-size: 24px; }
.affiliate-link-rules p { color: var(--muted); font-size: 10px; }
.affiliate-campaign-list { display: grid; gap: 8px; }
.affiliate-campaign-list article { display: grid; min-height: 90px; grid-template-columns: minmax(220px,1fr) minmax(300px,.8fr) 42px; align-items: center; gap: 18px; padding: 13px 0; border-top: 1px solid #ece9e1; }
.affiliate-campaign-list article:first-child { border-top: 0; }
.affiliate-campaign-list article > div > strong, .affiliate-campaign-list article > div > small { display: block; }
.affiliate-campaign-list article > div > strong { margin-top: 6px; font-size: 12px; }
.affiliate-campaign-list article > div > small { margin-top: 3px; color: var(--muted); font-size: 8px; overflow-wrap: anywhere; }
.affiliate-campaign-list dl { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; margin: 0; }
.affiliate-campaign-list dt { color: var(--muted); font-size: 8px; text-transform: uppercase; }
.affiliate-campaign-list dd { margin: 3px 0 0; font-weight: 800; }
.affiliate-money-summary { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.affiliate-money-summary article { padding: 18px; background: var(--white); border: 1px solid #e1ddd2; border-radius: 14px; }
.affiliate-money-summary article.available { color: var(--white); background: var(--forest-800); border-color: var(--forest-800); }
.affiliate-money-summary span, .affiliate-money-summary strong, .affiliate-money-summary small { display: block; }
.affiliate-money-summary span { color: var(--muted); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.affiliate-money-summary strong { margin-top: 11px; font-family: var(--serif); font-size: 28px; }
.affiliate-money-summary small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.affiliate-money-summary .available span, .affiliate-money-summary .available small { color: rgba(255,255,255,.65); }
.affiliate-financial-toolbar { display: flex; align-items: flex-end; gap: 9px; padding: 20px; border-bottom: 1px solid #e7e4da; }
.affiliate-financial-toolbar > div { min-width: 0; margin-right: auto; }
.affiliate-financial-toolbar h2, .affiliate-financial-toolbar p { margin: 0; }
.affiliate-financial-toolbar h2 { font-family: var(--serif); font-size: 24px; }
.affiliate-financial-toolbar p { margin-top: 3px; color: var(--muted); font-size: 9px; }
.affiliate-financial-list td strong, .affiliate-financial-list td small { display: block; }
.affiliate-financial-list td small { margin-top: 3px; color: var(--muted); font-size: 8px; }
.affiliate-balance-steps ol { display: grid; grid-template-columns: repeat(4,1fr); gap: 12px; padding: 0; margin: 0; list-style: none; }
.affiliate-balance-steps li { display: grid; grid-template-columns: 32px 1fr; align-items: start; gap: 9px; padding: 13px; background: #f7f7f3; border-radius: 10px; }
.affiliate-balance-steps li > span { display: grid; width: 30px; height: 30px; place-items: center; color: var(--muted); background: #e7e9e5; border-radius: 50%; font-size: 10px; font-weight: 800; }
.affiliate-balance-steps li.done > span { color: var(--success); background: var(--success-soft); }
.affiliate-balance-steps li span svg { width: 14px; }
.affiliate-balance-steps strong, .affiliate-balance-steps small { display: block; }
.affiliate-balance-steps strong { font-size: 10px; }
.affiliate-balance-steps small { margin-top: 4px; color: var(--muted); font-size: 8px; }
.affiliate-withdraw-hero { display: grid; grid-template-columns: 1fr 1fr auto; align-items: center; gap: 24px; padding: 24px; color: var(--white); background: linear-gradient(135deg,var(--forest-950),var(--forest-800)); border-radius: 18px; box-shadow: var(--shadow-md); }
.affiliate-withdraw-hero > div + div { padding-left: 24px; border-left: 1px solid rgba(255,255,255,.15); }
.affiliate-withdraw-hero span, .affiliate-withdraw-hero strong, .affiliate-withdraw-hero p { display: block; margin: 0; }
.affiliate-withdraw-hero span { color: var(--gold-soft); font-size: 9px; font-weight: 800; text-transform: uppercase; }
.affiliate-withdraw-hero strong { margin-top: 6px; font-family: var(--serif); font-size: 31px; }
.affiliate-withdraw-hero p { margin-top: 4px; color: rgba(255,255,255,.57); font-size: 9px; }
.affiliate-withdraw-layout { display: grid; grid-template-columns: minmax(0,1.35fr) minmax(260px,.65fr); align-items: start; gap: 18px; }
.affiliate-withdraw-values { display: grid; gap: 10px; margin-bottom: 16px; }
.affiliate-withdraw-values > div { display: flex; justify-content: space-between; gap: 18px; color: var(--muted); font-size: 10px; }
.affiliate-withdraw-values > div strong { color: var(--ink); }
.affiliate-withdraw-values > div.total { padding-top: 12px; color: var(--ink); border-top: 1px solid var(--line); font-weight: 800; }
.affiliate-withdraw-values > div.total strong { color: var(--forest-700); font-size: 18px; }
.affiliate-safe-note { display: flex; gap: 10px; margin-bottom: 16px; padding: 12px; color: var(--info); background: var(--info-soft); border-radius: 10px; }
.affiliate-safe-note > svg { flex: 0 0 auto; }
.affiliate-safe-note strong, .affiliate-safe-note span { display: block; }
.affiliate-safe-note strong { font-size: 10px; }
.affiliate-safe-note span { margin-top: 3px; color: #567182; font-size: 8px; }
.affiliate-withdraw-details > .button { width: 100%; }
.affiliate-next-payment { display: grid; grid-template-columns: 44px minmax(0,1fr); gap: 13px; }
.affiliate-next-payment h2 { margin: 0 0 8px; font-family: var(--serif); font-size: 24px; line-height: 1; }
.affiliate-next-payment p { color: var(--muted); font-size: 9px; }
.affiliate-coupon-hero { display: flex; min-height: 150px; align-items: center; justify-content: space-between; gap: 24px; padding: 26px 30px; color: var(--white); background: linear-gradient(135deg,var(--forest-950),var(--forest-800)); border-radius: 18px; box-shadow: var(--shadow-md); }
.affiliate-coupon-hero span, .affiliate-coupon-hero strong, .affiliate-coupon-hero p { display: block; margin: 0; }
.affiliate-coupon-hero span { color: var(--gold-soft); font-size: 9px; font-weight: 800; letter-spacing: .1em; text-transform: uppercase; }
.affiliate-coupon-hero strong { margin-top: 6px; color: var(--gold); font-family: var(--serif); font-size: 42px; letter-spacing: .05em; line-height: 1; }
.affiliate-coupon-hero p { margin-top: 7px; color: rgba(255,255,255,.62); font-size: 10px; }
.affiliate-resource-layout { display: grid; grid-template-columns: minmax(0,1.4fr) minmax(260px,.6fr); align-items: start; gap: 18px; }
.affiliate-materials article { display: grid; min-height: 84px; grid-template-columns: 44px minmax(0,1fr) auto; align-items: center; gap: 13px; border-top: 1px solid #ece9e1; }
.affiliate-materials article:first-of-type { border-top: 0; }
.affiliate-material-icon { display: grid; width: 40px; height: 40px; place-items: center; color: var(--forest-700); background: var(--success-soft); border-radius: 10px; }
.affiliate-material-icon svg { width: 17px; }
.affiliate-materials article strong, .affiliate-materials article small, .affiliate-materials article div > span { display: block; }
.affiliate-materials article strong { font-size: 11px; }
.affiliate-materials article small { margin-top: 2px; color: var(--muted); font-size: 9px; }
.affiliate-materials article div > span { margin-top: 4px; color: var(--forest-700); font-size: 8px; font-weight: 750; }
.affiliate-support-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 12px; }
.affiliate-support-grid > button { display: grid; min-height: 126px; grid-template-columns: 40px minmax(0,1fr); align-items: start; gap: 11px; padding: 17px; text-align: left; background: var(--white); border: 1px solid #e1ddd2; border-radius: 14px; cursor: pointer; box-shadow: var(--shadow-sm); }
.affiliate-support-grid > button > svg:first-child { width: 38px; height: 38px; padding: 9px; color: var(--forest-700); background: var(--success-soft); border-radius: 50%; }
.affiliate-support-grid > button > svg:last-child { grid-column: 2; width: 15px; margin-top: 4px; color: #8f9893; }
.affiliate-support-grid strong, .affiliate-support-grid small { display: block; }
.affiliate-support-grid strong { font-family: var(--serif); font-size: 18px; }
.affiliate-support-grid small { margin-top: 5px; color: var(--muted); font-size: 8px; }
.affiliate-support-ticket { display: grid; grid-template-columns: minmax(0,1fr) auto; align-items: end; gap: 18px; }
.affiliate-support-ticket .affiliate-panel-head { grid-column: 1 / -1; }
.affiliate-support-ticket > div:not(.affiliate-panel-head) span, .affiliate-support-ticket > div:not(.affiliate-panel-head) strong, .affiliate-support-ticket > div:not(.affiliate-panel-head) small { display: block; }
.affiliate-support-ticket > div:not(.affiliate-panel-head) span { color: var(--forest-700); font-size: 8px; font-weight: 850; }
.affiliate-support-ticket > div:not(.affiliate-panel-head) strong { margin-top: 4px; font-size: 12px; }
.affiliate-support-ticket > div:not(.affiliate-panel-head) small { margin-top: 4px; color: var(--muted); font-size: 9px; }

@media (max-width: 1050px) {
  .public-nav { display: none; }
  .public-header .button-gold { display: none; }
  .app-shell, .admin-shell { grid-template-columns: 80px minmax(0,1fr); }
  .app-sidebar .brand img { display: none; }
  .app-sidebar .brand { display: grid; height: 58px; place-items: center; background: url('../assets/symbol-gold.svg') center/38px no-repeat; }
  .sidebar-label, .side-nav a span, .sidebar-account > div:last-child { display: none; }
  .admin-nav-group > p { display: none; }
  .admin-nav-groups { margin-top: 18px; }
  .side-nav a { justify-content: center; padding: 0; }
  .marketing-hero { grid-template-columns: 1fr 1fr; }
  .marketing-copy h1 { font-size: 56px; }
  .benefit-band { grid-template-columns: repeat(2,1fr); row-gap: 24px; }
  .benefit:nth-child(2) { border-right: 0; }
  .product-layout { gap: 30px; }
  .catalog-grid { grid-template-columns: 1fr; }
  .batch-editor-layout, .batch-flow { grid-template-columns: 1fr; }
  .batch-rules, .batch-preview { position: static; }
  .tutor-home-layout { grid-template-columns: minmax(0,1.3fr) minmax(285px,.7fr); }
  .tutor-pet-card { grid-template-columns: 146px minmax(0,1fr); }
  .tutor-pet-visual { width: 146px; }
  .tutor-pet-copy { padding-right: 16px; }
  .tutor-pet-open { grid-column: 2; justify-self: start; margin: 0 16px 18px 22px; }
  .tutor-protected { display: none; }
  .admin-kpis { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .admin-kpis.compact { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-overview-grid, .admin-overview-lower, .admin-order-layout { grid-template-columns: 1fr; }
  .admin-order-aside { position: static; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-order-aside .admin-payment-card, .admin-order-aside .admin-internal-note { grid-column: auto; }
  .affiliate-kpis, .affiliate-money-summary { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .affiliate-dashboard-layout, .affiliate-setup-layout, .affiliate-links-layout, .affiliate-withdraw-layout, .affiliate-resource-layout { grid-template-columns: 1fr; }
  .affiliate-dashboard-aside { grid-template-columns: repeat(3,minmax(0,1fr)); }
  .affiliate-support-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 780px) {
  .public-header { min-height: 62px; padding-inline: 16px; }
  .public-header .brand img { width: 174px; }
  .public-footer { grid-template-columns: 1fr; gap: 22px; padding: 42px 24px; }
  .app-shell, .admin-shell { display: block; }
  .app-sidebar { position: fixed; z-index: 90; inset: 0 auto 0 0; width: 250px; transform: translateX(-105%); transition: transform .22s ease; box-shadow: var(--shadow-lg); }
  .app-sidebar.open { transform: translateX(0); }
  /* Scrim: escurece e bloqueia o conteúdo com o drawer aberto; clicar nele fecha (ver boot.js). */
  .app-shell::before { content: ""; position: fixed; inset: 0; z-index: 80; background: rgba(5,25,17,.5); opacity: 0; visibility: hidden; transition: opacity .22s ease, visibility .22s; }
  .app-shell:has(#app-sidebar.open)::before { opacity: 1; visibility: visible; }
  .app-sidebar .brand img, .sidebar-label, .side-nav a span, .sidebar-account > div:last-child { display: block; }
  .admin-nav-group > p { display: block; }
  .app-sidebar .brand { display: block; height: auto; background: none; }
  .side-nav a { justify-content: flex-start; padding: 0 11px; }
  .mobile-menu { display: inline-grid; }
  .app-topbar { min-height: 58px; padding: 0 15px; }
  .app-main, .admin-shell .app-main { width: calc(100% - 28px); padding-top: 24px; }
  .page-head { display: grid; }
  .page-actions { width: 100%; }
  .page-actions .button { flex: 1; }
  .metric-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .grid-2, .grid-equal, .grid-3 { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .field.full { grid-column: auto; }
  .spec-groups { grid-template-columns: 1fr; }
  .checkout-header { grid-template-columns: 1fr auto; min-height: 65px; padding-inline: 18px; }
  .checkout-header img { width: 176px; }
  .checkout-progress { display: none; }
  .checkout-main { width: calc(100% - 28px); padding-top: 26px; }
  .auth-shell { display: block; }
  .auth-story { min-height: 240px; padding: 28px 24px; }
  .auth-story-copy { margin: 38px 0 20px; }
  .auth-story-copy h2 { max-width: 400px; margin-bottom: 12px; font-size: 40px; }
  .auth-story-copy p { font-size: 13px; }
  .auth-promise { display: none; }
  .auth-main { min-height: auto; padding: 40px 22px 65px; }
  .marketing-hero { display: flex; min-height: auto; flex-direction: column; }
  .marketing-copy { padding: 52px 24px 38px; }
  .marketing-copy h1 { font-size: 50px; }
  .marketing-media { min-height: 370px; }
  .benefit-band { grid-template-columns: 1fr 1fr; padding: 26px 10px; }
  .benefit { display: block; padding: 10px 14px; text-align: center; }
  .benefit svg { margin: 0 auto 8px; }
  .process-grid { grid-template-columns: 1fr; gap: 40px; }
  .marketing-section { padding: 52px 0; }
  .product-layout { grid-template-columns: 1fr; padding-top: 24px; }
  .product-gallery { position: static; grid-template-columns: 1fr; }
  .product-thumbs { grid-template-columns: repeat(4,1fr); grid-row: 2; }
  .product-image { min-height: 390px; }
  .product-info h1 { font-size: 44px; }
  .article-layout { grid-template-columns: 1fr; gap: 28px; padding-top: 35px; }
  .article-aside { position: static; display: flex; gap: 15px; padding: 0 0 15px; border-right: 0; border-bottom: 1px solid var(--line); overflow-x: auto; }
  .article-aside strong { display: none; }
  .article-aside a { white-space: nowrap; }
  .entity-hero { grid-template-columns: auto 1fr; }
  .entity-actions { grid-column: 1 / -1; justify-content: stretch; }
  .entity-actions .button { flex: 1; }
  .catalog-main { width: calc(100% - 28px); padding-top: 38px; }
  .catalog-hero { grid-template-columns: 1fr; gap: 28px; }
  .catalog-summary { width: min(300px,100%); }
  .catalog-tools { align-items: stretch; flex-direction: column; }
  .catalog-legend { display: none; }
  .catalog-footer span:last-child { display: none; }
  .batch-command, .batch-hero { align-items: stretch; flex-direction: column; }
  .batch-command .button, .batch-hero-actions .button { justify-content: center; width: 100%; }
  .batch-hero-actions { display: grid; grid-template-columns: 1fr; }
  .batch-title-line { align-items: flex-start; flex-direction: column; }
  .batch-receipt-summary { grid-template-columns: repeat(2,1fr); }
  .scan-box { grid-template-columns: 1fr; }
  .divergence-row { grid-template-columns: 34px 1fr; }
  .divergence-row select { grid-column: 1 / -1; }
  .tutor-home { gap: 22px; }
  .tutor-home-head { align-items: flex-start; flex-direction: column; }
  .tutor-home-head h1 { font-size: 42px; }
  .tutor-home-actions { width: 100%; }
  .tutor-home-actions .button { flex: 1; }
  .tutor-home-layout { grid-template-columns: 1fr; }
  .tutor-home-aside { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-page-heading { align-items: stretch; flex-direction: column; }
  .admin-heading-actions { justify-content: flex-start; }
  .admin-heading-actions .button { flex: 1; }
  .admin-kpis { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-overview-lower, .admin-order-aside { grid-template-columns: 1fr; }
  .admin-summary-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .admin-order-filters { align-items: stretch; flex-direction: column; }
  .admin-order-filters .search-field { width: 100%; min-width: 0; flex: 0 0 auto; }
  .admin-saved-view > div { flex-wrap: wrap; }
  .admin-order-items > article { grid-template-columns: 58px minmax(0,1fr); }
  .admin-order-items > article img { width: 56px; height: 56px; }
  .admin-order-items > article > b { grid-column: 2; }
  .affiliate-heading { align-items: stretch; flex-direction: column; }
  .affiliate-page, .affiliate-page > *, .affiliate-heading > div:first-child, .affiliate-heading-actions { min-width: 0; max-width: 100%; }
  .affiliate-heading-actions { width: 100%; }
  .affiliate-heading-actions .button { flex: 1; }
  .affiliate-share-card { grid-template-columns: 48px minmax(0,1fr); }
  .affiliate-share-card .button { grid-column: 1 / -1; width: 100%; }
  .affiliate-dashboard-aside { grid-template-columns: 1fr; }
  .affiliate-funnel { grid-template-columns: 1fr; }
  .affiliate-funnel > i { display: grid; place-items: center; transform: rotate(90deg); }
  .affiliate-sale-list article { grid-template-columns: 38px minmax(0,1fr) auto; padding: 10px 0; }
  .affiliate-sale-list article > b { grid-column: 2; text-align: left; }
  .affiliate-setup-summary { grid-template-columns: 48px 1fr; }
  .affiliate-setup-progress { grid-column: 1 / -1; }
  .affiliate-campaign-list article { grid-template-columns: 1fr 42px; }
  .affiliate-campaign-list dl { grid-column: 1 / -1; grid-row: 2; }
  .affiliate-campaign-list article > button { grid-column: 2; grid-row: 1; }
  .affiliate-financial-toolbar { align-items: stretch; flex-direction: column; }
  .affiliate-financial-toolbar > div { margin-right: 0; }
  .affiliate-balance-steps ol { grid-template-columns: repeat(2,1fr); }
  .affiliate-withdraw-hero { grid-template-columns: 1fr 1fr; }
  .affiliate-withdraw-hero > button { grid-column: 1 / -1; width: 100%; }
  .affiliate-coupon-hero { align-items: stretch; flex-direction: column; }
  .affiliate-coupon-hero .button { width: 100%; }
}

@media (max-width: 480px) {
  .button { padding-inline: 13px; font-size: 10px; }
  .page-head h1 { font-size: 36px; }
  .metric-grid { grid-template-columns: 1fr 1fr; gap: 9px; }
  .metric { min-height: 104px; padding: 15px; }
  .metric strong { font-size: 28px; }
  .panel { padding: 17px; }
  .entity-photo { width: 64px; height: 64px; }
  .entity-hero h2 { font-size: 25px; }
  .step { min-width: 64px; }
  .step span:last-child { display: none; }
  .rescue-card { width: calc(100% - 18px); margin-top: 9px; border-radius: 15px; }
  .pet-name h1 { font-size: 38px; }
  .rescue-content { padding: 18px; }
  .contact-actions { grid-template-columns: 1fr; }
  .care-grid { grid-template-columns: 1fr; }
  .marketing-copy h1 { font-size: 44px; }
  .marketing-media { min-height: 300px; }
  .benefit { border-right: 0; }
  .buy-row { grid-template-columns: 96px 1fr; }
  .product-image { min-height: 310px; padding: 12px; }
  .article h1 { font-size: 42px; }
  .catalog-hero h1 { font-size: 48px; }
  .catalog-module { padding: 17px; }
  .catalog-module h2 { font-size: 20px; }
  .tutor-home-head h1 { font-size: 37px; }
  .tutor-home-head > div:first-child > span { font-size: 12px; }
  .tutor-home-actions { display: grid; grid-template-columns: 1fr; }
  .tutor-pet-card { grid-template-columns: 112px minmax(0,1fr); }
  .tutor-pet-visual { width: 112px; min-height: 154px; border-radius: 0 46% 46% 0; }
  .tutor-pet-visual img { width: 88px; height: 88px; border-width: 4px; }
  .tutor-pet-copy { padding: 16px 12px; }
  .tutor-pet-title h3 { font-size: 28px; }
  .tutor-pet-title .chip { min-height: 24px; padding-inline: 8px; font-size: 9px; }
  .tutor-pet-progress { margin-top: 13px; }
  .tutor-pet-meta { display: none; }
  .tutor-pet-open { grid-column: 1 / -1; width: calc(100% - 24px); justify-self: stretch; margin: 0 12px 12px; }
  .tutor-home-aside { grid-template-columns: 1fr; }
  .tutor-activity-list time { display: none; }
  .admin-business { gap: 16px; }
  .admin-page-heading h1 { font-size: 32px; }
  .admin-kpis, .admin-kpis.compact { gap: 8px; }
  .admin-kpi { padding: 14px; }
  .admin-kpi strong { font-size: 22px; }
  .admin-heading-actions { display: grid; grid-template-columns: 1fr; }
  .admin-saved-view > span { display: none; }
  .admin-table-footer { align-items: flex-start; flex-direction: column; }
  .admin-table-footer > div { width: 100%; }
  .admin-table-footer .button { flex: 1; }
  .admin-danger-actions { grid-template-columns: 1fr; }
  .affiliate-heading h1 { font-size: 39px; }
  .affiliate-heading-actions { display: grid; grid-template-columns: 1fr; }
  .affiliate-kpis, .affiliate-money-summary { grid-template-columns: 1fr 1fr; gap: 8px; }
  .affiliate-kpi { min-height: 126px; padding: 14px; }
  .affiliate-kpi > strong, .affiliate-money-summary strong { font-size: 25px; }
  .affiliate-share-card { padding: 16px; }
  .affiliate-share-card div > strong { font-size: 13px; }
  .affiliate-coupon-hero strong { font-size: 32px; overflow-wrap: anywhere; }
  .affiliate-panel-head { align-items: flex-start; flex-direction: column; }
  .affiliate-sale-list article .chip { grid-column: 3; }
  .affiliate-balance-steps ol { grid-template-columns: 1fr; }
  .affiliate-withdraw-hero { grid-template-columns: 1fr; padding: 20px; }
  .affiliate-withdraw-hero > div + div { padding: 16px 0 0; border-top: 1px solid rgba(255,255,255,.15); border-left: 0; }
  .affiliate-support-grid { grid-template-columns: 1fr; }
  .affiliate-materials article { grid-template-columns: 40px minmax(0,1fr); padding: 11px 0; }
  .affiliate-materials article .button { grid-column: 2; justify-self: start; }
  .affiliate-support-ticket { grid-template-columns: 1fr; }
  .affiliate-support-ticket .button { width: 100%; }
}

/* Card de pet na lista do painel: em telas estreitas vira um card empilhado limpo —
   cabeçalho verde com gradiente, foto centralizada e botões centralizados. */
@media (max-width: 1050px) {
  .pet-list .tutor-pet-card { grid-template-columns: 1fr; }
  /* A foto preenche todo o cabeçalho (cover), em vez de um circulinho perdido no verde. */
  .pet-list .tutor-pet-visual { position: relative; width: 100%; height: 200px; min-height: 200px; overflow: hidden; border-radius: 0; background: linear-gradient(155deg, var(--forest-800), var(--forest-950)); }
  .pet-list .tutor-pet-visual img { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; border-radius: 0; box-shadow: none; object-fit: cover; object-position: center 35%; }
  .pet-list .tutor-pet-visual .pet-profile-illustration { width: 92px; height: 92px; }
  .pet-list .tutor-pet-actions { flex-direction: row; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 0 22px 22px; }
  .pet-list .tutor-pet-actions .button { flex: 0 1 auto; }
}

@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}