/* MarJo — team app, client area and login. Same type and colour as the site,
   tuned for daily use: calmer surfaces, dense lists, big touch targets. */

@font-face { font-family: 'Archivo'; src: url(/fonts/archivo.woff2?v=e3a28eade2) format('woff2'); font-weight: 100 900; font-stretch: 62% 125%; font-display: swap; }
@font-face { font-family: 'Delafield'; src: url(/fonts/delafield.woff2?v=0672851f27) format('woff2'); font-display: swap; }

:root {
  --terra: #9b5e41; --terra-600: #b06d4c; --terra-300: #e0a383; --terra-100: #f3dccd; --terra-50: #faf0e9;
  --cocoa: #1a110d; --cocoa-800: #26190f;
  --paper: #fbf7f2; --cream: #f4ece3; --card: #fff;
  --ink: #23170f; --muted: #75635a; --line: rgba(35, 23, 15, .11); --line-2: rgba(35, 23, 15, .2);
  --ok: #2f7a46; --ok-bg: #e5f2e8; --warn: #a8641b; --warn-bg: #fbefdc; --bad: #b0482c; --bad-bg: #fae6e0; --info: #3a5f9a; --info-bg: #e5edf8;
  --f: 'Archivo', ui-sans-serif, system-ui, -apple-system, 'Segoe UI', Roboto, sans-serif;
  --script: 'Delafield', cursive;
  --r: 14px; --r-sm: 10px;
  --ease: cubic-bezier(.2, .8, .2, 1);
  --side: 256px;
  --shadow: 0 1px 2px rgba(35, 23, 15, .05), 0 8px 24px -14px rgba(35, 23, 15, .2);
}
*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--f); font-size: 15.5px; line-height: 1.5; -webkit-font-smoothing: antialiased; }
img { display: block; max-width: 100%; }
a { color: inherit; }
button, input, select, textarea { font: inherit; color: inherit; }
button { cursor: pointer; }
h1, h2, h3, p { margin: 0; }
ul, ol { margin: 0; padding: 0; list-style: none; }
.i { width: 1.2em; height: 1.2em; flex: none; vertical-align: -.22em; }
:focus-visible { outline: 2px solid var(--terra); outline-offset: 2px; }
.muted { color: var(--muted); }
.small { font-size: 13.5px; }
.pre { white-space: pre-wrap; }
.mono { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .02em; }
.script { font-family: var(--script); font-weight: 400; }
.grow { flex: 1; }
.noscript { padding: 40px; text-align: center; }
.boot { min-height: 100vh; display: grid; place-items: center; }
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; } }

/* ── controls ────────────────────────────────────────────────── */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 44px; padding: 0 18px; border-radius: 999px; border: 0; font-weight: 650; font-size: 15px; text-decoration: none; white-space: nowrap; transition: background-color .2s, box-shadow .2s, transform .15s; }
.btn:active { transform: scale(.98); }
.btn.sm { min-height: 38px; padding: 0 14px; font-size: 14px; }
.btn.big { min-height: 52px; font-size: 16px; width: 100%; }
.btn.primary { background: var(--terra); color: #fff; }
.btn.primary:hover { background: var(--terra-600); }
.btn.ghost { background: var(--card); box-shadow: inset 0 0 0 1.5px var(--line-2); }
.btn.ghost:hover { box-shadow: inset 0 0 0 1.5px var(--ink); }
.btn.danger { background: var(--bad); color: #fff; }
.btn.danger-ghost { background: transparent; color: var(--bad); box-shadow: inset 0 0 0 1.5px rgba(176, 72, 44, .35); }
.btn.danger-ghost:hover { background: var(--bad-bg); }
.btn[disabled] { opacity: .5; pointer-events: none; }
.round-btn { width: 48px; padding: 0; flex: none; }
.icon-btn { width: 40px; height: 40px; border-radius: 50%; border: 0; background: transparent; display: inline-grid; place-items: center; color: var(--muted); text-decoration: none; flex: none; transition: background-color .2s, color .2s; }
.icon-btn:hover { background: var(--cream); color: var(--ink); }
.link { color: var(--terra); font-weight: 650; text-decoration: none; font-size: 14px; }
.row-btns { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.row-btns.center { justify-content: center; }
.row-btns.end { justify-content: flex-end; }
.inp { width: 100%; min-height: 46px; padding: 10px 13px; border-radius: var(--r-sm); border: 1.5px solid var(--line-2); background: var(--card); font-size: 16px; transition: border-color .2s, box-shadow .2s; }
.inp:focus { outline: none; border-color: var(--terra); box-shadow: 0 0 0 4px rgba(155, 94, 65, .13); }
textarea.inp { resize: vertical; min-height: 46px; line-height: 1.45; }
select.inp { appearance: none; background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%); background-position: calc(100% - 18px) 50%, calc(100% - 13px) 50%; background-size: 5px 5px; background-repeat: no-repeat; padding-right: 34px; }
.sel { width: auto; min-height: 40px; font-size: 14.5px; font-weight: 600; }
.inp-ic { position: relative; display: block; }
.inp-ic .i { position: absolute; left: 13px; top: 50%; transform: translateY(-50%); color: var(--terra); }
.inp-ic .inp { padding-left: 40px; }
.fld { display: grid; gap: 6px; }
.fld-l { font-size: 13.5px; font-weight: 650; display: flex; align-items: center; gap: 7px; }
.fld-l .i { color: var(--terra); }
.fld-h { color: var(--muted); font-size: 12.5px; }
.form { display: grid; gap: 14px; }
.form.cols { grid-template-columns: repeat(auto-fit, minmax(210px, 1fr)); }
.form-row { display: flex; gap: 12px; }
.w-time { width: 120px; flex: none; }
.check-row { display: flex; gap: 10px; align-items: center; margin-top: 16px; font-size: 14.5px; }
.check-row input { width: 20px; height: 20px; accent-color: var(--terra); }
.seg { display: inline-flex; flex-wrap: wrap; gap: 4px; padding: 4px; border-radius: 999px; background: var(--cream); }
.seg button { display: inline-flex; align-items: center; gap: 6px; min-height: 38px; padding: 0 15px; border-radius: 999px; border: 0; background: transparent; font-weight: 650; font-size: 14px; color: var(--muted); }
.seg button.on { background: var(--card); color: var(--ink); box-shadow: var(--shadow); }
.seg.sm button { min-height: 34px; padding: 0 12px; font-size: 13.5px; }
.chips { display: flex; flex-wrap: wrap; gap: 7px; }
.pick { display: inline-flex; align-items: center; gap: 6px; min-height: 36px; padding: 0 13px 0 10px; border-radius: 999px; border: 1.5px solid var(--line-2); background: var(--card); font-size: 14px; font-weight: 600; transition: all .2s; }
.pick .i { width: 16px; height: 16px; color: var(--terra); }
.pick.on { background: var(--terra); border-color: var(--terra); color: #fff; }
.pick.on .i { color: #fff; }
.pick.more { border-style: dashed; color: var(--muted); }
.svc-group { margin-bottom: 10px; }
.svc-group small { display: block; font-weight: 700; color: var(--muted); font-size: 12px; text-transform: uppercase; letter-spacing: .08em; margin: 4px 0 6px; }
.tag { display: inline-flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 999px; font-size: 12px; font-weight: 700; background: var(--cream); color: var(--muted); white-space: nowrap; }
.tag .i { width: 13px; height: 13px; }
.tag.light { background: rgba(255, 255, 255, .18); color: inherit; backdrop-filter: blur(6px); }
.tag.demo { background: #efe3ff; color: #6a3fc0; }
.tag.ok, .st-confirmado.tag, .st-ganho.tag { background: var(--ok-bg); color: var(--ok); }
.tag.warn, .st-pendente.tag, .st-proposta.tag { background: var(--warn-bg); color: var(--warn); }
.st-novo.tag { background: var(--terra); color: #fff; }
.st-contacto.tag { background: var(--info-bg); color: var(--info); }
.st-perdido.tag, .st-cancelado.tag { background: var(--bad-bg); color: var(--bad); }
.st-realizado.tag { background: var(--cream); color: var(--muted); }
.st-dot { width: 9px; height: 9px; border-radius: 50%; background: var(--muted); flex: none; }
.st-dot.st-novo { background: var(--terra); box-shadow: 0 0 0 4px var(--terra-100); }
.st-dot.st-contacto { background: var(--info); } .st-dot.st-proposta { background: var(--warn); }
.badge { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--terra); color: #fff; font-size: 11.5px; font-weight: 750; display: inline-grid; place-items: center; line-height: 1; }
.badge.abs { position: absolute; top: 10px; right: 10px; }
.warn { color: var(--warn); font-weight: 600; display: inline-flex; align-items: center; gap: 4px; }
.warn.block { display: flex; margin-top: 4px; font-size: 13px; }
.bar { display: block; height: 6px; border-radius: 3px; background: var(--cream); overflow: hidden; margin-top: 6px; }
.bar.big { height: 10px; border-radius: 5px; }
.bar i { display: block; height: 100%; background: var(--terra); border-radius: inherit; transition: width .5s var(--ease); }
.avatar { width: 34px; height: 34px; border-radius: 50%; display: inline-grid; place-items: center; font-size: 12.5px; font-weight: 750; flex: none; }
.avatar.client { background: var(--terra-100); color: var(--terra); }
.avatar.team { background: var(--terra); color: #fff; }
.avatar.team .i { width: 16px; height: 16px; }
.save-state { font-size: 12.5px; font-weight: 650; color: var(--muted); min-height: 1em; }
.save-state.saved { color: var(--ok); }
.save-state.saved::before { content: '✓ '; }
.save-state.error { color: var(--bad); }

/* ── cards & layout bits ─────────────────────────────────────── */
.card { background: var(--card); border-radius: var(--r); padding: 20px; box-shadow: var(--shadow); min-width: 0; }
.card.flat { box-shadow: none; border: 1.5px solid var(--line); }
.card-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 14px; }
.card-h .card-t { margin: 0; }
.card-t { font-size: 17px; font-weight: 750; display: flex; align-items: center; gap: 8px; margin-bottom: 12px; }
.card-t .i { color: var(--terra); }
.sub-t { font-size: 13px; font-weight: 750; text-transform: uppercase; letter-spacing: .08em; color: var(--muted); margin: 18px 0 10px; }
.grid-2 { display: grid; gap: 16px; align-items: start; }
@media (min-width: 1000px) { .grid-2 { grid-template-columns: 1fr 1fr; } .span-2-md { grid-column: 1 / -1; } }
.page-head { margin-bottom: 22px; }
.page-head.row { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; flex-wrap: wrap; }
.page-head .muted { margin-top: 6px; max-width: 620px; }
.eyebrow-s { font-size: 12.5px; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; color: var(--terra); }
.h1 { font-size: clamp(30px, 4vw, 42px); font-weight: 850; font-stretch: 70%; text-transform: uppercase; line-height: 1; letter-spacing: -.005em; }
.h2 { font-size: 30px; font-weight: 850; font-stretch: 70%; text-transform: uppercase; line-height: 1.02; }
.page-h { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; margin-bottom: 18px; }
.page-t { font-size: 26px; font-weight: 850; font-stretch: 70%; text-transform: uppercase; line-height: 1.05; }
.page-h .muted { margin-top: 4px; }
.empty { text-align: center; padding: 48px 20px; display: grid; justify-items: center; gap: 10px; }
.empty-ic { width: 64px; height: 64px; border-radius: 50%; background: var(--terra-50); color: var(--terra); display: grid; place-items: center; }
.empty-ic .i { width: 28px; height: 28px; }
.empty h3 { font-size: 18px; }
.empty p { color: var(--muted); max-width: 420px; }
.empty .row-btns { margin-top: 10px; }
.loading { display: flex; gap: 6px; justify-content: center; padding: 60px 0; }
.loading span { width: 9px; height: 9px; border-radius: 50%; background: var(--terra); animation: dot 1s infinite ease-in-out; }
.loading span:nth-child(2) { animation-delay: .15s; } .loading span:nth-child(3) { animation-delay: .3s; }
@keyframes dot { 0%, 80%, 100% { transform: scale(.5); opacity: .4; } 40% { transform: none; opacity: 1; } }

/* ── shell ───────────────────────────────────────────────────── */
.shell { min-height: 100vh; min-height: 100dvh; }
.side { display: none; }
.main { min-width: 0; }
.topbar { position: sticky; top: 0; z-index: 20; display: flex; align-items: center; gap: 12px; height: calc(60px + env(safe-area-inset-top)); padding: env(safe-area-inset-top) 12px 0 16px; background: rgba(251, 247, 242, .9); backdrop-filter: saturate(1.4) blur(14px); border-bottom: 1px solid var(--line); }
.topbar .side-logo svg { height: 34px; }
.topbar .side-sub { display: none; }
.top-t { flex: 1; font-weight: 750; font-size: 16px; }
.side-logo { display: flex; align-items: center; gap: 12px; color: var(--terra); text-decoration: none; }
.side-logo svg { height: 46px; width: auto; aspect-ratio: 274 / 254; }
.side-sub { font-size: 30px; color: var(--ink); line-height: 1; }
.content { padding: 20px 16px calc(96px + env(safe-area-inset-bottom)); max-width: 1180px; margin: 0 auto; animation: viewIn .4s var(--ease); }
@keyframes viewIn { from { opacity: 0; transform: translateY(6px); } }
.tabbar { position: fixed; z-index: 30; left: 0; right: 0; bottom: 0; display: flex; justify-content: space-around; padding: 6px 4px calc(6px + env(safe-area-inset-bottom)); background: rgba(255, 255, 255, .94); backdrop-filter: saturate(1.4) blur(16px); border-top: 1px solid var(--line); }
.tabbar a { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 4px 2px; text-decoration: none; color: var(--muted); font-size: 11px; font-weight: 650; border-radius: 12px; }
.tabbar .tb-ic { position: relative; width: 52px; height: 30px; border-radius: 15px; display: grid; place-items: center; transition: background-color .25s; }
.tabbar .tb-ic .i { width: 22px; height: 22px; }
.tabbar .badge { position: absolute; top: -3px; right: 4px; height: 18px; min-width: 18px; font-size: 10.5px; }
.tabbar a.on { color: var(--terra); }
.tabbar a.on .tb-ic { background: var(--terra-100); }
.demo-bar { display: flex; align-items: center; gap: 10px; padding: 10px 16px; background: #2b1d16; color: #f4ece3; font-size: 13.5px; }
.demo-bar .i { color: var(--terra-300); }
.demo-bar span { flex: 1; }
.demo-bar a { color: var(--terra-300); font-weight: 700; white-space: nowrap; }
@media (min-width: 900px) {
  .shell { display: grid; grid-template-columns: var(--side) minmax(0, 1fr); }
  .side { display: flex; flex-direction: column; gap: 22px; position: sticky; top: 0; height: 100vh; padding: 26px 16px 18px; background: var(--card); border-right: 1px solid var(--line); }
  .side .side-logo { padding: 0 10px; flex-direction: column; align-items: flex-start; gap: 10px; }
  .side-nav { display: grid; gap: 2px; }
  .side-nav a { display: flex; align-items: center; gap: 12px; padding: 11px 12px; border-radius: 12px; text-decoration: none; font-weight: 650; color: var(--muted); transition: background-color .2s, color .2s; }
  .side-nav a:hover { background: var(--paper); color: var(--ink); }
  .side-nav a.on { background: var(--terra-50); color: var(--terra); }
  .side-nav a span { flex: 1; }
  .side-me { margin-top: auto; display: flex; align-items: center; gap: 10px; padding: 10px; border-radius: 14px; border: 0; background: var(--paper); text-align: left; }
  .side-me > span:not(.avatar) { flex: 1; min-width: 0; display: grid; }
  .side-me b { font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .side-me small { color: var(--muted); font-size: 12px; }
  .side-me > .i { color: var(--muted); }
  .topbar, .tabbar { display: none; }
  .content { padding: 32px 36px 60px; }
}

/* ── modal & toasts ──────────────────────────────────────────── */
.modal { border: 0; padding: 0; background: transparent; max-width: min(560px, 100vw); width: 100%; max-height: 100dvh; margin: auto auto 0; overflow: visible; }
.modal.wide { max-width: min(760px, 100vw); }
.modal::backdrop { background: rgba(26, 17, 13, .5); backdrop-filter: blur(3px); }
.modal[open] .modal-box { animation: sheetIn .35s var(--ease); }
@keyframes sheetIn { from { transform: translateY(30px); opacity: 0; } }
.modal-box { background: var(--card); border-radius: 22px 22px 0 0; max-height: 92dvh; display: flex; flex-direction: column; box-shadow: 0 -10px 40px -20px rgba(0, 0, 0, .4); }
.modal-h { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 18px 16px 10px 22px; }
.modal-h h2 { font-size: 21px; font-weight: 800; font-stretch: 85%; }
.modal-b { padding: 6px 22px 20px; overflow-y: auto; overscroll-behavior: contain; }
.modal-f { display: flex; flex-wrap: wrap; gap: 8px; justify-content: flex-end; padding: 14px 22px calc(14px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); }
@media (min-width: 700px) {
  .modal { margin: auto; }
  .modal-box { border-radius: 22px; }
  .modal-f { padding-bottom: 14px; }
}
.toasts { position: fixed; z-index: 100; left: 50%; bottom: calc(86px + env(safe-area-inset-bottom)); transform: translateX(-50%); display: grid; gap: 8px; width: max-content; max-width: calc(100vw - 24px); pointer-events: none; }
.toasts[popover] { top: auto; right: auto; margin: 0; border: 0; padding: 0; background: none; color: inherit; overflow: visible; }
@media (min-width: 900px) { .toasts { bottom: 28px; } }
.toast-i { display: flex; align-items: center; gap: 10px; padding: 12px 18px; border-radius: 999px; background: var(--ink); color: #fff; font-weight: 600; font-size: 14.5px; box-shadow: 0 14px 30px -12px rgba(0, 0, 0, .45); animation: toastIn .35s var(--ease); }
.toast-i .i { color: #8fd5a6; }
.toast-i.err { background: var(--bad); }
.toast-i.err .i { color: #fff; }
@keyframes toastIn { from { opacity: 0; transform: translateY(10px); } }

/* ── event hero & tabs ───────────────────────────────────────── */
.ev-hero { position: relative; overflow: hidden; border-radius: 22px; background: var(--cocoa); color: #fff; padding: 22px; min-height: 210px; display: flex; align-items: flex-end; gap: 16px; margin-bottom: 18px; isolation: isolate; transition: min-height .4s var(--ease); }
.ev-hero.compact { min-height: 132px; }
.ev-cover { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.ev-hero::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(26, 17, 13, .1), rgba(26, 17, 13, .78)); }
.ev-hero-in { flex: 1; min-width: 0; }
.ev-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 8px; }
.ev-title { font-family: var(--script); font-weight: 400; font-size: clamp(46px, 7vw, 76px); line-height: .95; text-shadow: 0 2px 20px rgba(0, 0, 0, .3); }
.ev-hero.compact .ev-title { font-size: clamp(38px, 5vw, 54px); }
.ev-title.plain-t { font-family: var(--f); font-weight: 850; font-stretch: 75%; font-size: clamp(32px, 4.6vw, 52px); line-height: 1; letter-spacing: -.01em; }
.ev-hero.compact .ev-title.plain-t { font-size: clamp(26px, 3.4vw, 38px); }
.ev-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 8px; font-size: 14px; color: rgba(255, 255, 255, .88); }
.ev-meta span { display: inline-flex; align-items: center; gap: 6px; }
.ev-meta span:first-letter { text-transform: uppercase; }
.ev-count { flex: none; text-align: center; padding: 10px 14px; border-radius: 16px; background: rgba(255, 255, 255, .14); backdrop-filter: blur(10px); display: grid; min-width: 78px; }
.ev-count b { font-size: 34px; font-weight: 850; font-stretch: 70%; line-height: 1; }
.ev-count span { font-size: 12px; font-weight: 650; }
@media (max-width: 599px) { .ev-hero { padding: 18px; min-height: 190px; } .ev-hero.compact { min-height: 120px; } .ev-hero.compact .ev-meta { display: none; } .ev-count { position: absolute; top: 14px; right: 14px; min-width: 64px; padding: 8px 10px; } .ev-count b { font-size: 26px; } .ev-tags { padding-right: 74px; } }
.ws-tabs { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; margin: 0 -16px 18px; padding: 0 16px 2px; position: sticky; top: calc(60px + env(safe-area-inset-top)); z-index: 10; background: var(--paper); }
.ws-tabs::-webkit-scrollbar { display: none; }
@media (min-width: 900px) { .ws-tabs { top: 0; margin: 0 0 20px; padding: 8px 0; } }
.ws-tabs a { display: inline-flex; align-items: center; gap: 7px; padding: 10px 14px; border-radius: 999px; text-decoration: none; font-weight: 650; font-size: 14.5px; color: var(--muted); white-space: nowrap; }
.ws-tabs a:hover { background: var(--cream); color: var(--ink); }
.ws-tabs a.on { background: var(--ink); color: #fff; }
.ws-tabs .badge { height: 18px; min-width: 18px; font-size: 10.5px; }

/* ── overview ────────────────────────────────────────────────── */
.ov { display: grid; gap: 16px; align-items: start; }
@media (min-width: 1000px) { .ov { grid-template-columns: 1fr 1fr; } .ov-prog { grid-column: 1 / -1; } }
.ov-prog { display: flex; gap: 22px; align-items: center; background: linear-gradient(120deg, var(--card), var(--terra-50)); }
.ov-prog-txt { display: grid; gap: 8px; justify-items: start; }
.ov-prog .card-t { margin: 0; font-size: 22px; font-stretch: 85%; }
.ring { --p: 0; width: 108px; height: 108px; flex: none; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(var(--terra) calc(var(--p) * 1%), var(--cream) 0); position: relative; }
.ring::before { content: ''; position: absolute; inset: 10px; border-radius: 50%; background: var(--card); }
.ring span { position: relative; text-align: center; font-size: 11.5px; color: var(--muted); font-weight: 600; line-height: 1.1; }
.ring b { display: block; font-size: 28px; color: var(--ink); font-weight: 850; font-stretch: 70%; }
@media (max-width: 520px) { .ov-prog { flex-direction: column; align-items: flex-start; } .ring { width: 92px; height: 92px; } }
.checklist { display: grid; }
.checklist li + li { border-top: 1px solid var(--line); }
.cl-row { display: flex; align-items: center; gap: 14px; padding: 12px 4px; text-decoration: none; border-radius: 10px; }
a.cl-row:hover { background: var(--paper); }
.cl-ic { width: 38px; height: 38px; border-radius: 50%; display: grid; place-items: center; background: var(--cream); color: var(--muted); flex: none; }
.done .cl-ic { background: var(--ok-bg); color: var(--ok); }
.cl-txt { flex: 1; min-width: 0; display: grid; }
.cl-txt small { color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cl-go { color: var(--line-2); }
.facts { display: grid; gap: 12px; margin: 0; }
.facts.cols { grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); margin: 18px 0; }
.facts div { display: grid; gap: 2px; }
.facts dt { font-size: 12.5px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .06em; }
.facts dd { margin: 0; font-weight: 600; }
.facts dd::first-letter { text-transform: uppercase; }
.card .row-btns { margin-top: 14px; }
.feed { display: grid; gap: 12px; }
.feed li { display: flex; gap: 12px; align-items: flex-start; }
.feed li > span:last-child, .feed li > a { display: grid; min-width: 0; text-decoration: none; }
.feed b { font-weight: 550; font-size: 14.5px; }
.feed small { color: var(--muted); font-size: 12.5px; }
.feed-dot { width: 32px; height: 32px; border-radius: 50%; display: grid; place-items: center; background: var(--cream); color: var(--muted); flex: none; }
.feed-dot .i { width: 16px; height: 16px; }
.feed-dot.client { background: var(--terra-100); color: var(--terra); }
.feed-dot.admin { background: var(--terra); color: #fff; }
.internal { background: #fff9ec; box-shadow: inset 0 0 0 1.5px #f1dfb8; }
.contact-card { background: var(--cocoa); color: #fff; }
.contact-card .muted { color: rgba(255, 255, 255, .7); margin-bottom: 4px; }
.contact-card .btn.ghost { background: rgba(255, 255, 255, .1); color: #fff; box-shadow: none; }

/* ── timeline ────────────────────────────────────────────────── */
.approval { display: inline-flex; align-items: center; gap: 6px; margin-top: 6px; font-size: 14px; font-weight: 650; color: var(--warn); }
.approval.ok { color: var(--ok); }
.tl { position: relative; display: grid; gap: 8px; }
.tl::before { content: ''; position: absolute; left: 75px; top: 18px; bottom: 18px; width: 2px; background: var(--terra-100); }
.tl-card { width: 100%; display: grid; grid-template-columns: 56px 16px minmax(0, 1fr) auto; gap: 12px; align-items: start; padding: 14px 14px 14px 10px; border-radius: var(--r); border: 0; background: var(--card); box-shadow: var(--shadow); text-align: left; transition: transform .2s var(--ease), box-shadow .2s; }
button.tl-card:hover { transform: translateY(-1px); box-shadow: 0 1px 2px rgba(35, 23, 15, .05), 0 12px 30px -14px rgba(35, 23, 15, .3); }
.tl-card.static { box-shadow: none; background: transparent; padding: 8px 0; }
.tl-time { font-size: 20px; font-weight: 800; font-stretch: 75%; font-variant-numeric: tabular-nums; text-align: right; line-height: 1.2; }
.tl-dot { width: 14px; height: 14px; margin-top: 5px; border-radius: 50%; background: var(--card); border: 3px solid var(--terra); position: relative; z-index: 1; }
.tl-main { display: grid; gap: 5px; min-width: 0; }
.tl-title { font-weight: 750; font-size: 16.5px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.owner { font-style: normal; font-size: 11.5px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: var(--terra-50); color: var(--terra); }
.owner.o-noivos { background: #fde8ef; color: #b03a63; }
.owner.o-espaco { background: var(--info-bg); color: var(--info); }
.owner.o-outro { background: var(--cream); color: var(--muted); }
.tl-det { color: var(--muted); font-size: 14.5px; white-space: pre-wrap; }
/* Steps inside a moment, a) b) c); and the arrows of a moment without a time, which stays where it is put. */
.tl-steps { display: grid; gap: 3px; font-size: 14.5px; }
.tl-step b { color: var(--terra); font-weight: 750; margin-right: 6px; }
.tl-i { position: relative; }
.tl-i.loose .tl-main { padding-right: 80px; }
.tl-move { position: absolute; top: 6px; right: 40px; display: flex; gap: 2px; }
/* On a phone: on their own row at the bottom of the card, so the title keeps its width. */
@media (max-width: 599px) { .tl-i.loose .tl-main { padding-right: 0; } .tl-i.loose .tl-card { padding-bottom: 50px; } .tl-move { top: auto; bottom: 8px; right: 10px; } }
.tl-move .icon-btn:disabled { opacity: .3; cursor: default; }
.steps-ed { display: grid; gap: 6px; justify-items: start; }
.step-row { display: flex; align-items: center; gap: 4px; width: 100%; }
.step-row .inp { flex: 1; min-width: 0; }
.step-row .icon-btn:disabled { opacity: .3; cursor: default; }
.step-l { width: 1.7em; flex: none; color: var(--terra); font-weight: 750; text-align: right; margin-right: 4px; }
.tl-items { display: flex; flex-wrap: wrap; gap: 5px; }
.mini-chip { display: inline-flex; align-items: center; gap: 5px; padding: 3px 9px 3px 7px; border-radius: 999px; background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); font-size: 12.5px; font-weight: 600; }
.mini-chip .i { width: 14px; height: 14px; color: var(--terra); }
.tl-by { font-size: 12px; color: var(--muted); opacity: .8; }
.tl-by:empty { display: none; }
.tl-edit { color: var(--line-2); margin-top: 3px; }
.tl-mini::before { left: 75px; }
@media (max-width: 520px) {
  .tl::before { left: 59px; }
  .tl-card { grid-template-columns: 44px 14px minmax(0, 1fr); gap: 10px; }
  .tl-time { font-size: 17px; }
  .tl-edit { display: none; }
}
.print-sheet { display: none; }

/* ── music, lists ────────────────────────────────────────────── */
.list-ed { display: flex; flex-wrap: wrap; gap: 6px; }
.li-chip { display: inline-flex; align-items: center; gap: 4px; padding: 5px 4px 5px 12px; border-radius: 999px; background: var(--terra-50); font-size: 14px; font-weight: 600; }
.li-chip button { width: 26px; height: 26px; border-radius: 50%; border: 0; background: transparent; display: grid; place-items: center; color: var(--muted); }
.li-chip button:hover { background: rgba(0, 0, 0, .06); }
.li-chip .i { width: 14px; height: 14px; }
.add-row { display: flex; gap: 8px; }
.music .chips { margin-bottom: 16px; }

/* ── ideas ───────────────────────────────────────────────────── */
.composer { margin-bottom: 18px; display: grid; gap: 14px; }
.drop { position: relative; display: grid; place-items: center; min-height: 140px; border-radius: var(--r-sm); border: 2px dashed var(--line-2); background: var(--paper); color: var(--muted); font-weight: 650; cursor: pointer; overflow: hidden; }
.drop span { display: inline-flex; gap: 8px; align-items: center; }
.drop img { max-height: 240px; width: auto; }
.drop input { position: absolute; inset: 0; opacity: 0; cursor: pointer; }
.board { columns: 1; column-gap: 14px; }
@media (min-width: 640px) { .board { columns: 2; } }
@media (min-width: 1100px) { .board { columns: 3; } }
.idea { break-inside: avoid; margin-bottom: 14px; background: var(--card); border-radius: var(--r); box-shadow: var(--shadow); overflow: hidden; }
.idea-img { display: block; width: 100%; padding: 0; border: 0; background: var(--cream); cursor: zoom-in; }
.idea-img img { width: 100%; height: auto; }
.idea-b { padding: 14px 16px 12px; display: grid; gap: 8px; }
.idea h3 { font-size: 16.5px; font-weight: 750; }
.idea p { color: var(--muted); font-size: 14.5px; white-space: pre-wrap; }
.idea-link { display: inline-flex; align-items: center; gap: 6px; font-weight: 650; color: var(--terra); text-decoration: none; font-size: 14px; word-break: break-all; }
.idea-link .i:last-child { width: 14px; height: 14px; opacity: .6; }
.idea-f { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding-top: 6px; border-top: 1px solid var(--line); }
.idea-by { display: inline-flex; align-items: center; gap: 8px; font-size: 12.5px; color: var(--muted); min-width: 0; }
.idea-by .avatar { width: 26px; height: 26px; font-size: 11px; }
.idea-acts { display: inline-flex; align-items: center; gap: 2px; }
.like, .cmt { display: inline-flex; align-items: center; gap: 4px; min-height: 36px; padding: 0 8px; border: 0; border-radius: 999px; background: transparent; color: var(--muted); font-weight: 650; font-size: 13px; }
.like:hover, .cmt:hover { background: var(--paper); }
.like.on { color: #d6416b; }
.like.on .i { animation: likePop .4s var(--ease); }
@keyframes likePop { 50% { transform: scale(1.35); } }
.liked-team { color: var(--terra); display: inline-grid; place-items: center; width: 26px; }
.liked-team .i { width: 16px; height: 16px; }
.idea-full { width: 100%; border-radius: var(--r-sm); margin-bottom: 14px; }
.comments { display: grid; gap: 12px; margin-bottom: 14px; }
.comments li { display: flex; gap: 10px; }
.comments li small { color: var(--muted); }
.comments p { white-space: pre-wrap; }

/* ── documents ───────────────────────────────────────────────── */
.upload { display: flex; flex-wrap: wrap; align-items: center; gap: 14px; margin-bottom: 20px; border: 2px dashed transparent; transition: border-color .2s, background-color .2s; }
.upload.over { border-color: var(--terra); background: var(--terra-50); }
.up-ic { width: 46px; height: 46px; border-radius: 50%; background: var(--terra-50); color: var(--terra); display: grid; place-items: center; }
.up-txt { flex: 1; min-width: 180px; display: grid; }
.up-txt small { color: var(--muted); }
.up-prog { flex-basis: 100%; display: grid; gap: 2px; font-size: 13px; }
.doc-group { margin-bottom: 8px; }
.doc-list { display: grid; gap: 8px; }
.doc { display: flex; align-items: center; gap: 12px; padding: 12px 10px 12px 12px; background: var(--card); border-radius: var(--r-sm); box-shadow: var(--shadow); }
.doc-ic { width: 44px; height: 52px; flex: none; border-radius: 8px; display: grid; place-items: center; font-size: 11px; font-weight: 800; background: var(--cream); color: var(--muted); letter-spacing: .04em; }
.doc-ic.pdf { background: #fbe4df; color: #b33b26; }
.doc-ic.img { background: #e3eefc; color: #2e5ea1; }
.doc-main { flex: 1; min-width: 0; display: grid; }
.doc-main b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.doc-main small { color: var(--muted); font-size: 12.5px; }
.doc-acts { display: flex; }

/* ── chat ────────────────────────────────────────────────────── */
.chat { display: flex; flex-direction: column; min-height: calc(100dvh - 330px); }
.chat-list { flex: 1; display: grid; align-content: end; gap: 6px; padding-bottom: 12px; }
.day-sep { text-align: center; margin: 14px 0 6px; }
.day-sep span { font-size: 12px; font-weight: 700; color: var(--muted); background: var(--cream); padding: 4px 12px; border-radius: 999px; }
.day-sep span::first-letter { text-transform: uppercase; }
.msg { display: flex; gap: 8px; align-items: flex-end; max-width: 82%; animation: msgIn .3s var(--ease); }
@keyframes msgIn { from { opacity: 0; transform: translateY(6px); } }
.msg .avatar { width: 28px; height: 28px; font-size: 11px; }
.msg.me { margin-left: auto; flex-direction: row-reverse; }
.bubble { padding: 9px 13px 6px; border-radius: 18px 18px 18px 6px; background: var(--card); box-shadow: var(--shadow); min-width: 0; }
.bubble b { display: block; font-size: 12px; color: var(--terra); }
.bubble p { white-space: pre-wrap; word-wrap: break-word; }
.bubble small { display: block; text-align: right; font-size: 11px; color: var(--muted); margin-top: 2px; }
.msg.me .bubble { background: var(--terra); color: #fff; border-radius: 18px 18px 6px 18px; }
.msg.me .bubble small { color: rgba(255, 255, 255, .7); }
.msg.same .bubble { background: var(--terra-50); }
.chat-box { position: sticky; bottom: calc(76px + env(safe-area-inset-bottom)); display: flex; gap: 8px; align-items: flex-end; padding: 10px; border-radius: 26px; background: var(--card); box-shadow: 0 -2px 30px -12px rgba(35, 23, 15, .3), inset 0 0 0 1px var(--line); }
.chat-box .inp { border: 0; min-height: 46px; max-height: 160px; resize: none; box-shadow: none; padding: 12px 10px; }
@media (min-width: 900px) { .chat-box { bottom: 16px; } .chat { min-height: calc(100vh - 340px); } }

/* ── manage ──────────────────────────────────────────────────── */
.covers { display: grid; grid-template-columns: repeat(auto-fill, minmax(84px, 1fr)); gap: 8px; }
.cover-pick { padding: 0; border: 3px solid transparent; border-radius: 12px; overflow: hidden; aspect-ratio: 1; background: var(--cream); }
.cover-pick img { width: 100%; height: 100%; object-fit: cover; }
.cover-pick.on { border-color: var(--terra); }
.pay { display: grid; gap: 6px; margin: 14px 0; font-weight: 650; font-size: 14px; }
.acc-list { display: grid; gap: 10px; }
.acc-list li { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.acc-main { flex: 1; min-width: 160px; display: grid; }
.acc-main small { color: var(--muted); font-size: 12.5px; word-break: break-all; }
.danger-zone { box-shadow: inset 0 0 0 1.5px var(--bad-bg); }
.cred { display: grid; gap: 10px; padding: 16px; border-radius: var(--r-sm); background: var(--paper); margin-bottom: 12px; }
.cred div { display: grid; }
.cred small { color: var(--muted); font-size: 12px; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; }
.cred b { font-size: 18px; }
.msg-preview { white-space: pre-wrap; font-family: var(--f); font-size: 13.5px; background: var(--cream); padding: 12px 14px; border-radius: var(--r-sm); margin: 12px 0 0; }
.acc-me { display: flex; gap: 12px; align-items: center; margin-bottom: 8px; }
.acc-me div { display: grid; }
.acc-me small { color: var(--muted); }

/* ── team: dashboard ─────────────────────────────────────────── */
.kpis { display: grid; grid-template-columns: repeat(2, 1fr); gap: 12px; margin-bottom: 16px; }
@media (min-width: 900px) { .kpis { grid-template-columns: repeat(4, 1fr); } }
.kpi { position: relative; display: grid; gap: 2px; padding: 18px; border-radius: var(--r); background: var(--card); box-shadow: var(--shadow); text-decoration: none; overflow: hidden; transition: transform .2s var(--ease); }
.kpi:hover { transform: translateY(-2px); }
.kpi b { font-size: 40px; font-weight: 850; font-stretch: 70%; line-height: 1; }
.kpi span { color: var(--muted); font-weight: 600; font-size: 14px; }
.kpi .i { position: absolute; right: 14px; top: 14px; color: var(--terra-100); width: 28px; height: 28px; }
.kpi.hot { background: var(--terra); color: #fff; }
.kpi.hot span { color: rgba(255, 255, 255, .8); }
.kpi.hot .i { color: rgba(255, 255, 255, .35); }
.next-ev { position: relative; padding: 0; overflow: hidden; min-height: 240px; display: flex; align-items: flex-end; text-decoration: none; color: #fff; background: var(--cocoa); isolation: isolate; }
.next-ev img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; transition: transform 1s var(--ease); }
.next-ev:hover img { transform: scale(1.04); }
.next-ev::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(26, 17, 13, .05) 15%, rgba(26, 17, 13, .9)); }
.next-in { display: grid; gap: 6px; padding: 22px; width: 100%; }
.next-in small { font-weight: 700; letter-spacing: .08em; text-transform: uppercase; font-size: 11.5px; color: rgba(255, 255, 255, .78); }
.next-in b { font-size: 54px; line-height: 1; text-shadow: 0 2px 18px rgba(0, 0, 0, .35); }
.next-in b.script { padding-top: 6px; }
.next-in b.plain-t { font-size: clamp(28px, 3.4vw, 40px); }
.next-in > span { font-size: 14px; opacity: .88; }
.next-in > span::first-letter { text-transform: uppercase; }
.next-count { position: absolute; top: 18px; right: 18px; padding: 6px 12px; border-radius: 999px; background: rgba(26, 17, 13, .55); backdrop-filter: blur(8px); font-weight: 750; font-size: 14px; }
.rows { display: grid; }
.rows li + li { border-top: 1px solid var(--line); }
.rows a { display: flex; align-items: center; gap: 12px; padding: 11px 2px; text-decoration: none; }
.rows a:hover { background: var(--paper); }
.rows a > span { display: grid; min-width: 0; }
.rows small { color: var(--muted); font-size: 12.5px; }
.rows .i { color: var(--terra); }

/* ── team: requests ──────────────────────────────────────────── */
.filter-row { display: flex; gap: 6px; overflow-x: auto; scrollbar-width: none; margin: 0 -16px 16px; padding: 0 16px; }
.filter-row::-webkit-scrollbar { display: none; }
.fchip { flex: none; display: inline-flex; align-items: center; gap: 7px; min-height: 38px; padding: 0 8px 0 14px; border-radius: 999px; border: 1.5px solid var(--line-2); background: var(--card); font-weight: 650; font-size: 14px; }
.fchip b { min-width: 22px; height: 22px; border-radius: 11px; background: var(--cream); font-size: 12px; display: grid; place-items: center; padding: 0 6px; }
.fchip.on { background: var(--ink); border-color: var(--ink); color: #fff; }
.fchip.on b { background: rgba(255, 255, 255, .2); }
.req-list { display: grid; gap: 8px; }
.req { display: flex; gap: 12px; align-items: flex-start; padding: 14px; border-radius: var(--r); background: var(--card); box-shadow: var(--shadow); text-decoration: none; border: 2px solid transparent; transition: border-color .2s; }
.req.on { border-color: var(--terra); }
.req.unseen .req-ic { position: relative; }
.req.unseen .req-ic::after { content: ''; position: absolute; top: -3px; right: -3px; width: 11px; height: 11px; border-radius: 50%; background: var(--terra); box-shadow: 0 0 0 2px var(--card); }
.req-ic { width: 42px; height: 42px; border-radius: 12px; background: var(--terra-50); color: var(--terra); display: grid; place-items: center; flex: none; }
.req-main { flex: 1; min-width: 0; display: grid; }
.req-main small { color: var(--muted); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.req-side { display: grid; justify-items: end; gap: 4px; text-align: right; }
.req-side small { color: var(--muted); font-size: 12px; }
.split-detail { display: none; }
.split.has-detail .split-list { display: none; }
.split.has-detail .split-detail { display: block; }
.split-empty { display: grid; place-items: center; gap: 10px; color: var(--muted); padding: 120px 20px; text-align: center; }
.split-empty .i { width: 40px; height: 40px; color: var(--terra-100); }
.back-link { display: inline-flex; align-items: center; gap: 6px; font-weight: 650; color: var(--muted); text-decoration: none; margin-bottom: 14px; }
@media (min-width: 1250px) {
  .split { display: grid; grid-template-columns: minmax(320px, 440px) minmax(0, 1fr); gap: 26px; align-items: start; }
  .split.has-detail .split-list, .split-list { display: block; }
  .split-detail { display: block; padding: 4px 4px 20px; min-width: 0; }
  .back-link { display: none; }
}
.req-detail { display: grid; gap: 16px; }
.rd-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 14px; flex-wrap: wrap; }
.status-sel { min-width: 170px; }
.req-detail .facts.cols { margin: 0; }
.quote { margin: 0; padding: 14px 18px; border-left: 4px solid var(--terra); background: var(--terra-50); border-radius: 0 var(--r-sm) var(--r-sm) 0; white-space: pre-wrap; }
.rd-actions { display: flex; flex-wrap: wrap; gap: 10px; justify-content: space-between; }

/* ── team: events ────────────────────────────────────────────── */
.ev-group { margin-top: 24px; }
.month-t { font-size: 13px; font-weight: 750; text-transform: uppercase; letter-spacing: .1em; color: var(--muted); margin-bottom: 10px; }
.month-t::first-letter { text-transform: uppercase; }
.ev-grid { display: grid; gap: 10px; }
@media (min-width: 760px) { .ev-grid { grid-template-columns: 1fr 1fr; } }
.ev-card { position: relative; display: flex; gap: 14px; align-items: center; padding: 12px; border-radius: var(--r); background: var(--card); box-shadow: var(--shadow); text-decoration: none; transition: transform .2s var(--ease); }
.ev-card:hover { transform: translateY(-2px); }
.ev-thumb { width: 78px; height: 78px; border-radius: 12px; overflow: hidden; flex: none; background: var(--terra-50); color: var(--terra); display: grid; place-items: center; }
.ev-thumb img { width: 100%; height: 100%; object-fit: cover; }
.ev-info { display: grid; gap: 3px; min-width: 0; }
.ev-info b { font-size: 34px; line-height: 1; }
.ev-info b.plain-t { font-size: 21px; line-height: 1.15; }
.ev-info small { color: var(--muted); font-size: 13px; }
.ev-info small::first-letter { text-transform: uppercase; }
.ev-info .ev-tags { margin: 4px 0 0; }

/* ── team: agenda ────────────────────────────────────────────── */
.cal-nav { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.cal-t { font-size: 22px; font-weight: 800; font-stretch: 80%; min-width: 200px; text-align: center; }
.cal-t::first-letter { text-transform: uppercase; }
.cal { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 4px; }
.cal-wd { text-align: center; font-size: 12px; font-weight: 700; color: var(--muted); text-transform: uppercase; padding: 6px 0; }
.cal-d { min-height: 64px; padding: 6px; border-radius: 10px; border: 0; background: var(--card); text-align: left; display: flex; flex-direction: column; gap: 3px; overflow: hidden; box-shadow: inset 0 0 0 1px var(--line); }
.cal-d.void { background: transparent; box-shadow: none; }
.cal-d.we { background: #fffdf9; }
.cal-d.today .cal-n { background: var(--terra); color: #fff; }
.cal-d.on { box-shadow: inset 0 0 0 2px var(--ink); }
.cal-d.blocked { background: repeating-linear-gradient(-45deg, #f6efe8, #f6efe8 6px, #efe5da 6px, #efe5da 12px); }
.cal-n { font-size: 13px; font-weight: 750; width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; }
.cal-ev { font-size: 11px; font-weight: 650; padding: 2px 6px; border-radius: 6px; background: var(--terra); color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cal-ev.st-pendente { background: var(--warn-bg); color: var(--warn); }
.cal-ev.st-realizado, .cal-ev.st-cancelado { background: var(--cream); color: var(--muted); }
.cal-ev.req { background: transparent; color: var(--terra); box-shadow: inset 0 0 0 1px var(--terra-300); }
.cal-ev.blk { background: var(--ink); color: #fff; }
@media (max-width: 640px) { .cal-d { min-height: 52px; padding: 4px; } .cal-ev { font-size: 0; height: 6px; padding: 0; border-radius: 3px; } }
@media (min-width: 1000px) { .cal-d { min-height: 104px; } }
.day-card { margin-top: 16px; }
.row-link { display: flex; align-items: center; gap: 10px; padding: 10px 0; text-decoration: none; border-bottom: 1px solid var(--line); }
.row-link b { flex: 1; }
.row-link .i { color: var(--terra); }
.how { list-style: decimal; padding-left: 20px; display: grid; gap: 6px; }

/* ── login ───────────────────────────────────────────────────── */
.login-page { background: var(--cocoa); }
.login { min-height: 100vh; min-height: 100dvh; display: grid; }
.login-art { position: relative; min-height: 34vh; overflow: hidden; display: flex; align-items: flex-end; color: #fff; isolation: isolate; }
.login-art img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; z-index: -2; }
.login-art::after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(26, 17, 13, .2), rgba(26, 17, 13, .85)); }
.login-art-in { padding: 24px; display: grid; gap: 14px; }
.login-logo { width: 90px; color: #fff; }
.login-quote { font-size: 20px; font-weight: 700; font-stretch: 80%; max-width: 380px; line-height: 1.2; }
.login-form-wrap { background: var(--paper); border-radius: 24px 24px 0 0; margin-top: -20px; position: relative; padding: 18px 20px 40px; display: grid; align-content: start; justify-items: center; }
.login-back { justify-self: start; display: inline-flex; align-items: center; gap: 6px; text-decoration: none; color: var(--muted); font-weight: 650; font-size: 14px; padding: 8px 0; }
.login-form { width: 100%; max-width: 400px; display: grid; gap: 14px; margin-top: 8px; }
.login-mark { display: none; width: 70px; color: var(--terra); }
.login-form h1 { font-size: 32px; font-weight: 850; font-stretch: 70%; text-transform: uppercase; line-height: 1; }
.pw { position: relative; display: block; }
.pw .inp { padding-right: 48px; }
.pw-eye { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); width: 40px; height: 40px; border-radius: 50%; border: 0; background: transparent; color: var(--muted); display: grid; place-items: center; }
.login-err { color: var(--bad); font-weight: 650; font-size: 14px; }
.login-err:empty { display: none; }
.or { display: flex; align-items: center; gap: 12px; color: var(--muted); font-size: 13px; }
.or::before, .or::after { content: ''; flex: 1; height: 1px; background: var(--line); }
.demo-btn .i { color: var(--terra); }
@media (min-width: 860px) {
  .login { grid-template-columns: 1.1fr 1fr; }
  .login-art { min-height: 100vh; }
  .login-art-in { padding: 48px; }
  .login-logo { width: 120px; }
  .login-quote { font-size: 30px; }
  .login-form-wrap { border-radius: 0; margin: 0; align-content: center; padding: 40px; }
  .login-back { position: absolute; top: 26px; left: 32px; }
  .login-mark { display: block; }
}

/* ── print: the day sheet ────────────────────────────────────── */
@media print {
  @page { margin: 14mm; }
  body { background: #fff; font-size: 11.5pt; }
  .side, .topbar, .tabbar, .ws-tabs, .ev-hero, .ws-body > *:not(.tl-wrap):not(.contract-wrap), .tl-wrap > *:not(.print-sheet), .toasts, .demo-bar { display: none !important; }
  /* The contract prints alone, on A4. */
  .contract-wrap .no-print, .contract-wrap .ct-edit, .contract-wrap > .card { display: none !important; }
  .contract-wrap, .ct-draft { display: block !important; }
  .ct-preview { position: static !important; max-height: none !important; overflow: visible !important; }
  .contract-doc { box-shadow: none !important; padding: 0 !important; max-width: none !important; border-radius: 0 !important; font-size: 10.5pt !important; }
  /* A heading stays with what follows it, and a condition is not split between two pages. */
  .contract-doc h2 { break-after: avoid; } .cd-clauses > li, .cd-dl > div, .cd-table tr, .cd-valid { break-inside: avoid; }
  .content { padding: 0; animation: none; }
  .print-sheet { display: block; color: #000; }
  .print-sheet header { display: flex; gap: 16px; align-items: center; border-bottom: 2px solid #9b5e41; padding-bottom: 10px; margin-bottom: 12px; }
  .print-logo { width: 60px; color: #9b5e41; }
  .print-sheet h1 { font-family: var(--script); font-size: 34pt; font-weight: 400; line-height: 1; }
  .print-sheet h2 { font-size: 11pt; text-transform: uppercase; letter-spacing: .1em; color: #9b5e41; margin: 16px 0 6px; }
  .print-sheet table { width: 100%; border-collapse: collapse; }
  .print-sheet td { vertical-align: top; padding: 6px 4px; border-bottom: 1px solid #ddd; }
  .print-sheet .pt { width: 90px; font-weight: 700; white-space: nowrap; }
  .print-sheet .ps { margin: 2px 0 0 4px; }
  .print-sheet .pi { color: #9b5e41; font-size: 10pt; }
  .print-foot { margin-top: 18px; font-size: 9pt; color: #666; }
}

/* ══ Round 2: permissions, money, guests, site editor, numbers, contacts ══ */
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.skip { position: absolute; left: 12px; top: -60px; z-index: 100; padding: 10px 16px; border-radius: 999px; background: var(--ink); color: #fff; font-weight: 700; text-decoration: none; }
.skip:focus { top: 12px; }
.side-me { text-decoration: none; color: inherit; }
.side-me:hover { background: var(--cream); }
.fchip:not(:has(b)) { padding: 0 14px; }
.rows button { width: 100%; display: flex; align-items: center; gap: 12px; padding: 11px 4px; border: 0; background: transparent; text-align: left; border-radius: 10px; }
.rows button:hover { background: var(--paper); }
.rows button > span { display: grid; min-width: 0; }
.rows button small, .rows button b { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tag.hot { background: var(--terra-100); color: var(--terra); }
.tag.bad { background: var(--bad-bg); color: var(--bad); }
.ok-note { display: flex; gap: 8px; align-items: flex-start; padding: 12px 14px; border-radius: var(--r-sm); background: var(--ok-bg); color: var(--ok); font-size: 14px; margin-bottom: 12px; }
.ok-note .i { margin-top: 2px; }
.tip { display: flex; gap: 8px; align-items: center; margin-bottom: 14px; }
.tip .i { color: var(--terra); }
.narrow { max-width: 620px; }

/* notices: a whole card that says "look at this" */
.notice { display: flex; align-items: center; gap: 14px; text-decoration: none; color: inherit; width: 100%; border: 0; text-align: left; font: inherit; margin-bottom: 16px; }
.notice > .i:first-child { width: 22px; height: 22px; color: var(--terra); flex: none; }
.notice > span { flex: 1; display: grid; gap: 2px; min-width: 0; }
.notice small { color: var(--muted); font-size: 13.5px; }
.notice > .i:last-child:not(:first-child) { color: var(--muted); flex: none; }
.notice.hot, .hot-card { box-shadow: inset 0 0 0 1.5px var(--terra-300), var(--shadow); background: var(--terra-50); }
a.notice:hover, button.notice:hover { box-shadow: inset 0 0 0 1.5px var(--terra), var(--shadow); }
.notice .btn { flex: none; }
.ov > .notice { margin: 0; grid-column: 1 / -1; }
.acc-fact { display: grid; gap: 2px; justify-items: start; }
.acc-fact .link { font-size: 13.5px; font-weight: 600; }

/* switches, sub-tabs, help */
.switches { display: grid; gap: 12px; }
.switch { display: flex; align-items: flex-start; gap: 12px; cursor: pointer; }
.switch input { position: absolute; opacity: 0; width: 1px; height: 1px; }
.sw-track { flex: none; width: 44px; height: 26px; border-radius: 13px; background: var(--line-2); position: relative; transition: background-color .2s; margin-top: 1px; }
.sw-dot { position: absolute; top: 3px; left: 3px; width: 20px; height: 20px; border-radius: 50%; background: #fff; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); transition: transform .25s var(--ease); }
.switch input:checked + .sw-track { background: var(--ok); }
.switch input:checked + .sw-track .sw-dot { transform: translateX(18px); }
.switch input:focus-visible + .sw-track { outline: 2px solid var(--terra); outline-offset: 2px; }
.switch.off { opacity: .55; cursor: default; }
.sw-txt { display: grid; gap: 1px; min-width: 0; }
.sw-txt b { font-size: 14.5px; font-weight: 650; }
.sw-txt small { color: var(--muted); font-size: 13px; }
.subtabs { display: flex; gap: 4px; overflow-x: auto; scrollbar-width: none; margin: 0 -16px 18px; padding: 0 16px 2px; border-bottom: 1px solid var(--line); }
.subtabs::-webkit-scrollbar { display: none; }
.subtabs button { flex: none; display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 0 12px; border: 0; background: transparent; font-weight: 650; font-size: 14.5px; color: var(--muted); border-bottom: 2.5px solid transparent; margin-bottom: -1px; }
.subtabs button:hover { color: var(--ink); }
.subtabs button.on { color: var(--terra); border-bottom-color: var(--terra); }
@media (min-width: 900px) { .subtabs { margin: 0 0 20px; padding: 0; } }
.help { margin: 16px 0; }
.help summary { list-style: none; display: inline-flex; align-items: center; gap: 6px; cursor: pointer; color: var(--terra); font-weight: 650; font-size: 14px; }
.help summary::after { content: 'Saber mais'; }
.help summary::-webkit-details-marker { display: none; }
.help-b { margin-top: 8px; padding: 12px 14px; border-radius: var(--r-sm); background: var(--terra-50); font-size: 14px; max-width: 680px; }

/* inputs with a unit, small widths */
.inp-suffix { position: relative; display: block; }
.inp-suffix .inp { padding-right: 34px; }
.inp-suffix span { position: absolute; right: 13px; top: 50%; transform: translateY(-50%); color: var(--muted); font-weight: 650; pointer-events: none; }
.w-qty { width: 130px; flex: none; }
.w-price { width: 150px; flex: none; }
.w-num { max-width: 190px; }
.form-row { flex-wrap: wrap; align-items: flex-end; }
.form-row > .grow { min-width: 180px; }
fieldset.price-box, fieldset.seo-box { border: 1.5px solid var(--line); border-radius: var(--r-sm); padding: 14px; margin: 0; display: grid; gap: 12px; min-width: 0; }
fieldset legend { padding: 0 6px; font-weight: 700; font-size: 13.5px; display: inline-flex; align-items: center; gap: 6px; }
fieldset legend .i { color: var(--terra); }

/* ── money ── */
.money-sum { margin-bottom: 16px; }
.ms-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; margin-bottom: 12px; }
.ms-row div { display: grid; gap: 2px; }
.ms-row small { color: var(--muted); font-size: 12.5px; font-weight: 650; }
.ms-row b { font-size: clamp(20px, 5vw, 28px); font-weight: 800; font-stretch: 88%; font-variant-numeric: tabular-nums; }
.ms-row b.ok { color: var(--ok); }
.money-sum .muted { margin-top: 8px; }
.budget > .card { margin-bottom: 16px; }
.lines { display: grid; }
.lines > li + li { border-top: 1px solid var(--line); }
.line { display: flex; align-items: center; gap: 12px; padding: 12px 2px; width: 100%; }
button.line { border: 0; background: transparent; text-align: left; border-radius: 10px; font: inherit; }
button.line:hover { background: var(--paper); }
.ln-ic { width: 30px; height: 30px; border-radius: 50%; background: var(--ok-bg); color: var(--ok); display: grid; place-items: center; flex: none; }
.ln-main { flex: 1; display: grid; gap: 2px; min-width: 0; }
.ln-main small { color: var(--muted); font-size: 13px; }
.ln-note { color: var(--ink) !important; font-style: italic; opacity: .8; }
.ln-price { flex: none; text-align: right; font-variant-numeric: tabular-nums; }
.ln-price small { color: var(--muted); }
.ln-edit { color: var(--muted); flex: none; }
.line.total { padding-top: 14px; }
.lines > li.ln-sub { padding: 14px 2px 2px; }
.ln-sub small { color: var(--muted); font-size: 12px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; }
.line.total b { font-size: 17px; }
.muted-line b { color: var(--muted); text-decoration: line-through; text-decoration-thickness: 1px; }
.decide { display: grid; gap: 12px; padding: 16px 0; }
.decide + .decide { border-top: 1px solid var(--terra-100); }
.dc-head { display: grid; gap: 2px; }
.dc-head b { font-size: 16px; }
.dc-head small { color: var(--muted); }
.dc-total { display: grid; padding-bottom: 6px; }
.dc-total small { color: var(--muted); font-size: 12.5px; }
.dc-total b { font-size: 20px; font-variant-numeric: tabular-nums; }
.tl-pick { display: grid; gap: 6px; margin-top: 12px; }
.tp-head, .tp-row { display: grid; grid-template-columns: 24px minmax(0, 1fr) 90px 120px; gap: 10px; align-items: center; }
.tp-head { font-size: 12px; font-weight: 700; color: var(--muted); text-transform: uppercase; letter-spacing: .05em; padding: 0 10px; }
.tp-row { padding: 6px 10px; border-radius: var(--r-sm); background: var(--paper); cursor: pointer; }
.tp-row input[type=checkbox] { width: 20px; height: 20px; accent-color: var(--terra); }
.tp-row b { font-weight: 650; font-size: 14.5px; }
.tp-row small { color: var(--muted); font-weight: 500; }
.tp-row .inp { min-height: 40px; padding: 8px 10px; }
.tp-row.off { opacity: .55; }
.inp.needs { border-color: var(--warn); background: var(--warn-bg); }
.foot-note { margin-right: auto; align-self: center; }
@media (max-width: 520px) { .tp-head { display: none; } .tp-row { grid-template-columns: 24px 1fr 1fr; } .tp-row b { grid-column: 2 / -1; } .tp-row > .inp { grid-column: 2; } }
.svc-sec { margin-bottom: 26px; }
.svc-sec .sub-t { margin-bottom: 12px; }
.svc-cards { display: grid; gap: 14px; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); }
.svc-card { background: var(--card); border-radius: var(--r); overflow: hidden; box-shadow: var(--shadow); display: flex; flex-direction: column; }
.svc-card > img, .svc-ph { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; background: var(--cream); }
.svc-ph { display: grid; place-items: center; color: var(--terra); }
.svc-ph .i { width: 34px; height: 34px; }
.svc-b { padding: 14px 16px 16px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.svc-b h4 { margin: 0; font-size: 16px; display: flex; gap: 8px; align-items: center; }
.svc-b h4 .i { color: var(--terra); }
.svc-b p { color: var(--muted); font-size: 14px; flex: 1; }
.svc-f { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 4px; }
.svc-price { font-weight: 750; font-variant-numeric: tabular-nums; }
.svc-f a.tag { text-decoration: none; }
.ask-photo { width: 100%; aspect-ratio: 16 / 9; object-fit: cover; border-radius: var(--r-sm); margin-bottom: 12px; }
.est { margin: 14px 0 6px; padding: 12px 14px; border-radius: var(--r-sm); background: var(--terra-50); }

/* ── guests ── */
.guests > .card { margin-bottom: 16px; }
.guest-intro { display: grid; gap: 18px; }
.gi-art { width: 72px; height: 72px; border-radius: 20px; background: var(--terra-50); color: var(--terra); display: grid; place-items: center; }
.gi-art .i { width: 36px; height: 36px; }
.guest-intro p { margin: 8px 0; }
.ticks { display: grid; gap: 8px; margin: 12px 0 14px; }
.ticks li { display: flex; gap: 10px; align-items: center; }
.ticks .i { color: var(--terra); }
.guest-head { display: grid; gap: 16px; }
.gh-qr { width: 132px; height: 132px; padding: 8px; border-radius: 14px; background: #fff; box-shadow: inset 0 0 0 1.5px var(--line); display: block; }
.gh-qr img { width: 100%; height: 100%; }
.gh-main { display: grid; gap: 12px; min-width: 0; }
.copy-row { display: flex; gap: 8px; }
.copy-row .inp { min-height: 40px; font-size: 14px; }
.gh-stats { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; margin: 0; }
.gh-stats div { text-align: center; padding: 8px 2px; border-radius: 10px; background: var(--paper); }
.gh-stats dt { font-size: 11.5px; color: var(--muted); font-weight: 650; }
.gh-stats dd { margin: 0; font-size: 20px; font-weight: 800; font-variant-numeric: tabular-nums; }
@media (min-width: 760px) { .guest-intro { grid-template-columns: auto 1fr; } .guest-head { grid-template-columns: auto 1fr; } .gh-stats { grid-column: 1 / -1; } }
@media (min-width: 1150px) { .guest-head { grid-template-columns: auto 1fr 300px; align-items: start; } .gh-stats { grid-column: auto; grid-template-columns: repeat(3, 1fr); } }
.queue { display: grid; }
.q-i { display: flex; align-items: center; gap: 12px; padding: 12px 0; flex-wrap: wrap; }
.q-i + .q-i { border-top: 1px solid var(--line); }
.q-i.dim { opacity: .6; }
.q-n { width: 34px; height: 34px; border-radius: 50%; background: var(--terra-50); color: var(--terra); font-weight: 800; display: grid; place-items: center; flex: none; }
.q-main { flex: 1; min-width: 160px; display: grid; }
.q-main b { font-size: 16px; }
.q-main small { color: var(--muted); }
.wall { display: grid; }
.w-i { display: flex; gap: 12px; justify-content: space-between; align-items: flex-start; padding: 12px 0; }
.w-i + .w-i { border-top: 1px solid var(--line); }
.w-i p { margin-top: 4px; white-space: pre-wrap; }
.w-i.oculto { opacity: .55; }
.w-i.pendente { background: var(--warn-bg); margin: 0 -12px; padding: 12px; border-radius: 10px; }
.album { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 6px; }
.al-i { position: relative; padding: 0; border: 0; aspect-ratio: 1; border-radius: 10px; overflow: hidden; background: var(--cream); }
.al-i img { width: 100%; height: 100%; object-fit: cover; transition: transform .4s var(--ease); }
.al-i:hover img { transform: scale(1.04); }
.al-i.oculto img { opacity: .35; }
.al-vid { width: 100%; height: 100%; display: grid; place-items: center; color: var(--muted); }
.al-play { position: absolute; inset: auto auto 8px 8px; width: 28px; height: 28px; border-radius: 50%; background: rgba(0, 0, 0, .55); color: #fff; display: grid; place-items: center; }
.al-play .i { width: 14px; height: 14px; }
.al-st { position: absolute; left: 6px; right: 6px; top: 6px; padding: 3px 6px; border-radius: 6px; background: var(--warn-bg); color: var(--warn); font-size: 11px; font-weight: 700; text-align: center; }
.viewer { position: fixed; inset: 0; z-index: 200; background: rgba(15, 10, 8, .94); display: grid; grid-template-rows: 1fr auto; padding: env(safe-area-inset-top) 0 env(safe-area-inset-bottom); }
.viewer img, .viewer video { max-width: 100%; max-height: calc(100dvh - 120px); margin: auto; object-fit: contain; align-self: center; }
.v-close { position: absolute; top: calc(10px + env(safe-area-inset-top)); right: 10px; color: #fff; background: rgba(255, 255, 255, .12); z-index: 2; }
.v-close:hover { background: rgba(255, 255, 255, .25); color: #fff; }
.v-bar { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; padding: 12px 16px; color: #f4ece3; font-size: 14px; }
.v-bar .btn.ghost { background: rgba(255, 255, 255, .1); color: #fff; box-shadow: none; }
.v-bar .btn.danger-ghost { color: #ffb4a0; box-shadow: inset 0 0 0 1.5px rgba(255, 180, 160, .4); }
.danger-zone.inline { display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-top: 22px; padding: 14px; border-radius: var(--r-sm); }
.danger-zone.inline div { display: grid; }

/* ── events & staff ── */
.ev-staff { display: flex !important; align-items: center; gap: 5px; color: var(--muted); font-size: 12.5px; }
.ev-staff .i { width: 14px; height: 14px; }
.chips.staff { margin: 10px 0 12px; }
.li-chip small { color: var(--muted); font-weight: 500; }
.cover-pick.more { font-size: 12.5px; font-weight: 700; color: var(--muted); border: 1.5px dashed var(--line-2); }
.cover-pick.tile { display: grid; place-content: center; justify-items: center; gap: 6px; padding: 6px; font: inherit; font-size: 12px; font-weight: 700; line-height: 1.2; color: var(--ink); text-align: center; border: 1.5px dashed var(--line-2); }
.cover-pick.tile .i { width: 20px; height: 20px; color: var(--terra); }
.cover-pick.tile.on { border: 3px solid var(--terra); background: var(--terra-50); }
.cover-pick.tile:disabled { color: var(--muted); }
.cover-tip { margin: 0 0 12px; }
/* On the event's photo: change it without going to Gestão. */
.ev-cover-btn { position: absolute; top: 14px; right: 14px; display: inline-flex; align-items: center; gap: 6px; padding: 7px 12px; border: 0; border-radius: 999px; background: rgba(26, 17, 13, .55); color: #fff; font: inherit; font-size: 13px; font-weight: 650; cursor: pointer; backdrop-filter: blur(6px); }
.ev-cover-btn:hover { background: rgba(26, 17, 13, .78); }
.ev-cover-btn .i { width: 16px; height: 16px; }
@media (max-width: 599px) { .ev-cover-btn { top: 14px; left: 14px; right: auto; padding: 6px 10px; font-size: 12.5px; } }

/* ── settings ── */
.acc-out { margin-top: 18px; }
.member-list { display: grid; }
.member-list li { display: grid; grid-template-columns: auto 1fr; gap: 10px 12px; align-items: center; padding: 14px 0; }
.member-list li + li { border-top: 1px solid var(--line); }
.member-list li.inactive .acc-main { opacity: .55; }
.member-list .sel { grid-column: 1 / -1; }
.member-list .row-btns { grid-column: 1 / -1; }
@media (min-width: 760px) { .member-list li { grid-template-columns: auto 1fr 190px auto; } .member-list .sel, .member-list .row-btns { grid-column: auto; } }
.acc-main { display: grid; min-width: 0; }
.acc-main small { overflow: hidden; text-overflow: ellipsis; }
.roles { display: grid; gap: 16px; }
@media (min-width: 1000px) { .roles { grid-template-columns: repeat(2, 1fr); } }
.role .card-t .tag { margin-left: 4px; }
.perm-list { display: grid; gap: 2px; }
.perm { display: flex; gap: 12px; align-items: flex-start; padding: 9px 8px; border-radius: 10px; cursor: pointer; }
.perm:hover { background: var(--paper); }
.perm input { width: 20px; height: 20px; margin-top: 2px; accent-color: var(--terra); flex: none; }
.perm span { display: grid; }
.perm b { font-size: 14.5px; font-weight: 650; }
.perm small { color: var(--muted); font-size: 13px; }
.perm.locked { cursor: default; }
.mail-rows .tag { flex: none; }
.mail-frame { width: 100%; height: min(70vh, 720px); border: 1.5px solid var(--line); border-radius: var(--r-sm); background: #f4ece3; }
.audit { display: grid; }
.audit li { padding: 10px 0; font-size: 14.5px; display: grid; }
.audit li + li { border-top: 1px solid var(--line); }
.audit small { color: var(--muted); font-size: 12.5px; }
.device .dev-row { display: flex; gap: 14px; align-items: flex-start; padding: 12px 0; flex-wrap: wrap; }
.device .dev-row + .dev-row { border-top: 1px solid var(--line); }
.dev-ic { width: 38px; height: 38px; border-radius: 12px; background: var(--terra-50); color: var(--terra); display: grid; place-items: center; flex: none; }
.dev-row .grow { display: grid; gap: 2px; min-width: 180px; }
.dev-row small { color: var(--muted); font-size: 13.5px; }
.dev-row .how { margin-top: 8px; font-size: 14px; }

/* ── mobile: install banner, "Mais" sheet ── */
.install-banner { display: flex; align-items: center; gap: 12px; margin: 12px 16px 0; padding: 10px 8px 10px 12px; border-radius: 16px; background: var(--card); box-shadow: var(--shadow); }
.install-banner img { border-radius: 10px; }
.install-banner .grow { display: grid; min-width: 0; }
.install-banner small { color: var(--muted); font-size: 12.5px; }
.tabbar button { flex: 1; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 2px; padding: 4px 2px; border: 0; background: transparent; color: var(--muted); font-size: 11px; font-weight: 650; border-radius: 12px; }
.tabbar button.on { color: var(--terra); }
.tabbar button.on .tb-ic { background: var(--terra-100); }
.more-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; margin-bottom: 14px; }
.more-grid a { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 14px 6px; border-radius: 16px; background: var(--paper); text-decoration: none; font-weight: 650; font-size: 13.5px; text-align: center; }
.more-grid a.on { background: var(--terra-50); color: var(--terra); }
.more-grid .tb-ic { position: relative; width: 44px; height: 44px; border-radius: 14px; background: var(--card); display: grid; place-items: center; color: var(--terra); box-shadow: var(--shadow); }
.more-grid .tb-ic .badge { position: absolute; top: -6px; right: -8px; }
.more-me { display: flex; align-items: center; gap: 12px; padding: 12px; border-radius: 16px; background: var(--paper); text-decoration: none; }
.more-me span:not(.avatar) { flex: 1; display: grid; }
.more-me small { color: var(--muted); font-size: 13px; }

/* ── site editor ── */
.draft-bar { position: sticky; top: calc(60px + env(safe-area-inset-top)); z-index: 12; display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; justify-content: space-between; padding: 12px 14px; margin: 0 -4px 16px; border-radius: 16px; background: var(--card); box-shadow: var(--shadow); }
.draft-bar.dirty { background: var(--terra-50); box-shadow: inset 0 0 0 1.5px var(--terra-300), var(--shadow); }
@media (min-width: 900px) { .draft-bar { top: 12px; } }
.db-txt { display: flex; gap: 10px; align-items: center; }
.db-txt .i { color: var(--ok); }
.dirty .db-txt .i { color: var(--terra); }
.db-txt > span { display: grid; }
.db-txt small { color: var(--muted); font-size: 12.5px; }
.texts { display: grid; gap: 10px; }
.sec-ed { padding: 0; }
.sec-ed summary { list-style: none; display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 16px 18px; cursor: pointer; }
.sec-ed summary::-webkit-details-marker { display: none; }
.sec-ed summary > span { display: grid; }
.sec-ed summary small { color: var(--muted); font-size: 13px; }
.sec-ed summary .i { transition: transform .25s var(--ease); color: var(--muted); flex: none; }
.sec-ed[open] summary .i { transform: rotate(180deg); }
.sec-ed > .form { padding: 4px 18px 20px; }
.items-ed { display: grid; gap: 8px; justify-items: start; }
.it-card { width: 100%; border: 1.5px solid var(--line); border-radius: var(--r-sm); background: var(--card); }
.it-card.open { border-color: var(--terra-300); }
.it-h { display: flex; align-items: center; gap: 4px; padding: 4px 4px 4px 0; }
.it-t { flex: 1; min-width: 0; display: flex; align-items: center; gap: 10px; padding: 8px 10px; border: 0; background: transparent; text-align: left; font-weight: 650; }
.it-t span { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.it-t img { width: 36px; height: 36px; border-radius: 8px; object-fit: cover; flex: none; }
.it-t .i { color: var(--muted); }
.it-acts { display: flex; flex: none; }
.it-acts .icon-btn { width: 36px; height: 36px; }
.it-acts .icon-btn[disabled] { opacity: .3; }
.it-b { padding: 6px 14px 16px; }
.photo-field { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.photo-field img, .pf-empty { width: 96px; height: 72px; border-radius: 10px; object-fit: cover; background: var(--cream); }
.pf-empty { display: grid; place-items: center; color: var(--muted); }
.lib-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; align-items: center; }
.pick-up { display: flex; align-items: center; gap: 10px; margin-bottom: 12px; }
.lib-bar > .inp-ic { flex: 1 1 220px; }
.lib-bar > .sel { flex: 0 1 220px; width: auto; }
.lib-bar .row-btns { margin: 0; }
.ph-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(110px, 1fr)); gap: 8px; }
.ph { position: relative; padding: 0; border: 3px solid transparent; border-radius: 12px; overflow: hidden; aspect-ratio: 1; background: var(--cream); }
.ph img { width: 100%; height: 100%; object-fit: cover; }
.ph.on { border-color: var(--terra); }
.ph-check { position: absolute; top: 6px; right: 6px; width: 24px; height: 24px; border-radius: 50%; background: var(--terra); color: #fff; display: grid; place-items: center; }
.ph-check .i { width: 14px; height: 14px; }
.ph-tag { position: absolute; left: 6px; bottom: 6px; padding: 2px 7px; border-radius: 6px; background: rgba(26, 17, 13, .7); color: #fff; font-size: 11px; font-weight: 700; }
.gal-ed { display: grid; grid-template-columns: repeat(auto-fill, minmax(132px, 1fr)); gap: 10px; }
.gal-ed li { position: relative; border-radius: 12px; overflow: hidden; background: var(--cream); cursor: grab; transition: opacity .2s; }
.gal-ed li.dragging { opacity: .4; }
.gal-ed li.cut::before { content: 'Depois de Ver mais'; position: absolute; top: 6px; right: 6px; z-index: 1; padding: 2px 7px; border-radius: 6px; background: var(--terra); color: #fff; font-size: 11px; font-weight: 700; }
.gal-ed img { width: 100%; aspect-ratio: 1; object-fit: cover; pointer-events: none; }
.g-n { position: absolute; top: 6px; left: 6px; min-width: 24px; height: 24px; padding: 0 6px; border-radius: 12px; background: rgba(26, 17, 13, .72); color: #fff; font-size: 12px; font-weight: 750; display: grid; place-items: center; }
.g-acts { display: flex; justify-content: space-between; background: var(--card); }
.g-acts .icon-btn { width: 36px; height: 34px; border-radius: 8px; }
.g-acts .icon-btn[disabled] { opacity: .3; }
.photos > .card { margin-bottom: 16px; }
.ph-edit { display: grid; gap: 18px; }
.ph-edit img { width: 100%; max-height: 50vh; object-fit: contain; border-radius: var(--r-sm); }
@media (min-width: 760px) { .ph-edit { grid-template-columns: 1fr 1fr; align-items: start; } }
.svc-admin > .card { margin-bottom: 16px; }
.svc-g.off { opacity: .7; }
.svc-g .card-h { align-items: flex-start; }
.svc-g .link .i { width: 13px; height: 13px; }
.svc-rows { display: grid; }
.svc-rows li { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.svc-rows li + li { border-top: 1px solid var(--line); }
.svc-rows li.off .svc-row { opacity: .5; }
.svc-row { flex: 1 1 260px; min-width: 0; display: flex; align-items: center; gap: 12px; padding: 11px 4px; border: 0; background: transparent; text-align: left; border-radius: 10px; }
.svc-row:hover { background: var(--paper); }
.svc-row .grow { display: grid; min-width: 0; }
.svc-row small { color: var(--muted); font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.svc-ic { width: 36px; height: 36px; border-radius: 10px; background: var(--terra-50); color: var(--terra); display: grid; place-items: center; flex: none; }
.svc-acts { display: flex; align-items: center; gap: 2px; margin-left: auto; }
.svc-acts .switch { margin-right: 8px; align-items: center; }
.svc-acts .sw-txt b { font-size: 13px; color: var(--muted); }
.svc-acts .icon-btn[disabled] { opacity: .3; }
.icon-pick { display: grid; grid-template-columns: repeat(auto-fill, minmax(44px, 1fr)); gap: 6px; }
.icon-pick button { height: 44px; border-radius: 10px; border: 1.5px solid var(--line); background: var(--card); color: var(--ink); display: grid; place-items: center; }
.icon-pick button.on { border-color: var(--terra); background: var(--terra-50); color: var(--terra); }
.counter { font-size: 12.5px; color: var(--muted); }
.counter.ok { color: var(--ok); }
.counter.warn { color: var(--warn); }
.counter.bad { color: var(--bad); }
.g-prev { padding: 14px; border-radius: var(--r-sm); background: #fff; box-shadow: inset 0 0 0 1px var(--line); font-family: Arial, sans-serif; display: grid; gap: 3px; }
.g-prev small { color: #4d5156; font-size: 12.5px; }
.g-prev b { color: #1a0dab; font-size: 18px; font-weight: 400; line-height: 1.3; }
.g-prev p { color: #4d5156; font-size: 13.5px; line-height: 1.5; }
.share-prev { margin-top: 12px; border-radius: var(--r-sm); overflow: hidden; background: var(--paper); box-shadow: inset 0 0 0 1px var(--line); }
.share-prev img { width: 100%; aspect-ratio: 1.91; object-fit: cover; }
.share-prev div { padding: 10px 12px; display: grid; gap: 2px; }
.share-prev small { color: var(--muted); text-transform: uppercase; font-size: 11px; letter-spacing: .04em; }
.share-prev p { color: var(--muted); font-size: 13.5px; }
.seo .grid-2 { margin-bottom: 16px; }
.seo .card > .fld, .seo .card > .switch { margin-bottom: 12px; }
.checks { display: grid; gap: 6px; margin-top: 12px; }
.checks li { display: flex; gap: 8px; align-items: center; color: var(--muted); font-size: 14px; }
.checks li .i { color: var(--bad); }
.checks li.ok { color: var(--ink); }
.checks li.ok .i { color: var(--ok); }
.versions { display: grid; }
.versions li { display: flex; align-items: center; gap: 12px; padding: 12px 0; flex-wrap: wrap; }
.versions li + li { border-top: 1px solid var(--line); }
.versions .grow { display: grid; }
.versions small { color: var(--muted); font-size: 13px; }

/* ── numbers ── */
.tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 10px; margin-bottom: 16px; }
.tile { background: var(--card); border-radius: var(--r); padding: 14px 16px; box-shadow: var(--shadow); display: grid; gap: 2px; align-content: start; }
.tiles.in-card .tile { box-shadow: none; background: var(--paper); }
.tile small { color: var(--muted); font-size: 12.5px; font-weight: 650; }
.tile b { font-size: clamp(22px, 4vw, 30px); font-weight: 800; font-stretch: 88%; font-variant-numeric: tabular-nums; line-height: 1.15; }
.t-sub { color: var(--muted); font-size: 12.5px; display: inline-flex; align-items: center; gap: 3px; }
.t-sub .i { width: 13px; height: 13px; }
.t-sub.up { color: var(--ok); }
.t-sub.down { color: var(--bad); }
.charts { display: grid; gap: 16px; }
@media (min-width: 1000px) { .charts { grid-template-columns: 1fr 1fr; } .chart-card.span-2 { grid-column: 1 / -1; } }
.ch-h { display: flex; justify-content: space-between; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.ch-h .card-t { margin: 0; }
.legend { display: flex; gap: 14px; flex-wrap: wrap; font-size: 13px; color: var(--muted); align-items: center; }
.legend li { display: inline-flex; align-items: center; gap: 6px; }
.legend i { width: 10px; height: 10px; border-radius: 3px; }
.chart { position: relative; min-height: 220px; }
.chart svg { display: block; touch-action: pan-y; }
.chart .grid { stroke: var(--line); stroke-width: 1; }
.chart .ax { fill: var(--muted); font-size: 11px; font-family: var(--f); }
.chart .cross { stroke: var(--ink); stroke-width: 1; stroke-dasharray: 3 3; opacity: .45; }
.chart g.dim path { opacity: .35; }
.tip-box { position: absolute; transform: translate(-50%, -8px); pointer-events: none; z-index: 3; min-width: 130px; padding: 8px 10px; border-radius: 10px; background: var(--ink); color: #fff; font-size: 12.5px; display: grid; gap: 3px; box-shadow: 0 8px 20px -8px rgba(0, 0, 0, .4); }
.tip-box span { display: flex; align-items: center; gap: 6px; }
.tip-box span b { margin-left: auto; padding-left: 10px; font-variant-numeric: tabular-nums; }
.tip-box i { width: 8px; height: 8px; border-radius: 2px; box-shadow: 0 0 0 1.5px #fff; }
.tbl { margin-top: 10px; }
.tbl summary { cursor: pointer; color: var(--terra); font-weight: 650; font-size: 13.5px; }
.tbl table { width: 100%; border-collapse: collapse; margin-top: 8px; font-size: 13.5px; }
.tbl th { text-align: left; color: var(--muted); font-weight: 650; padding: 6px 4px; border-bottom: 1px solid var(--line-2); }
.tbl td { padding: 6px 4px; border-bottom: 1px solid var(--line); }
.tbl .num, .tbl th + th { text-align: right; font-variant-numeric: tabular-nums; }
.hbars { display: grid; gap: 8px; }
.hbars li { display: grid; grid-template-columns: minmax(90px, 38%) 1fr auto; align-items: center; gap: 10px; font-size: 14px; border-radius: 6px; }
.hbars li:hover { background: var(--paper); }
.hb-l { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.hb-t { height: 14px; display: block; }
.hb-t i { display: block; height: 100%; border-radius: 0 4px 4px 0; }
.hb-v { font-weight: 700; font-variant-numeric: tabular-nums; text-align: right; min-width: 40px; }
.hb-v small { color: var(--muted); font-weight: 500; margin-left: 6px; }
.funnel { display: grid; gap: 14px; }
.funnel li { display: grid; gap: 4px; }
.fn-l { display: flex; gap: 8px; align-items: baseline; font-size: 14px; }
.fn-l b { font-size: 18px; font-variant-numeric: tabular-nums; }
.funnel .hb-t { height: 16px; }
.fn-p { color: var(--muted); font-size: 12.5px; }

/* ── contacts & campaigns ── */
.contact-rows .cdot { width: 10px; height: 10px; border-radius: 50%; background: var(--line-2); flex: none; }
.contact-rows .cdot.ok { background: var(--ok); }
.contact-rows .cdot.off { background: var(--bad); }
.consent { margin: 16px 0; padding: 14px; border-radius: var(--r-sm); background: var(--paper); display: grid; gap: 8px; justify-items: start; }
.consent.ok { background: var(--ok-bg); }
.consent .sub-t { display: flex; gap: 8px; align-items: center; margin: 0; }
.rgpd { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.rgpd .sub-t { display: flex; gap: 8px; align-items: center; }
.back-link.always { display: inline-flex; }
.camp-grid { display: grid; gap: 16px; }
.camp-ed { display: grid; gap: 16px; align-content: start; }
@media (min-width: 1150px) { .camp-grid { grid-template-columns: minmax(0, 1fr) 440px; } .camp-prev .card { position: sticky; top: 12px; } }
.blocks { display: grid; gap: 10px; margin-bottom: 12px; }
.blk { padding: 12px; border-radius: var(--r-sm); border: 1.5px solid var(--line); display: grid; gap: 8px; }
.blk-h { display: flex; justify-content: space-between; align-items: center; }
.blk-h .tag.light { background: var(--paper); color: var(--muted); }
.blk-img { display: flex; gap: 12px; align-items: center; }
.blk-img img { width: 120px; height: 80px; object-fit: cover; border-radius: 8px; }
.add-blocks { margin-top: 4px; }
.aud-count { margin-top: 14px; padding: 12px 14px; border-radius: var(--r-sm); background: var(--terra-50); }
.aud-count b { font-size: 20px; }
.camp-actions { padding: 4px 0 20px; }
.camp-prev .mail-frame { height: 640px; }
@media (min-width: 900px) and (max-width: 1500px) { .ws-tabs a { padding: 9px 11px; gap: 6px; font-size: 14px; } .ws-tabs a .i { width: 1.1em; height: 1.1em; } }
@media (min-width: 900px) and (max-width: 1240px) { .ws-tabs a .i { display: none; } }
.line:has(> .btn) { flex-wrap: wrap; }
.line:has(> .btn) > .ln-main { flex: 1 1 100%; }
.line:has(> .btn) > .ln-price { margin-right: auto; text-align: left; }
@media (max-width: 599px) {
  .svc-cards { grid-template-columns: 1fr; gap: 10px; }
  .svc-card { flex-direction: row; }
  .svc-card > img, .svc-ph { width: 104px; aspect-ratio: auto; flex: none; align-self: stretch; min-height: 120px; }
  .svc-b { padding: 12px 14px; }
  .svc-b h4 .i { display: none; }
  .svc-b p { font-size: 13.5px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
  .svc-f { flex-wrap: wrap; }
}
/* On a computer every tab shows (they wrap to a second line when needed), so none hides off the edge. */
@media (min-width: 900px) { .ws-tabs { flex-wrap: wrap; overflow: visible; } }
@media (min-width: 900px) and (max-width: 1100px) { :root { --side: 214px; } .content { padding: 28px 24px 60px; } }

/* ── Google Drive ── */
.gdrive > .card { margin-bottom: 16px; }
.gd-intro { display: grid; gap: 16px; }
@media (min-width: 760px) { .gd-intro { grid-template-columns: auto 1fr; } }
.gd-ic { width: 64px; height: 64px; border-radius: 18px; background: var(--info-bg); color: var(--info); display: grid; place-items: center; }
.gd-ic .i { width: 32px; height: 32px; }
.gd-intro .ticks { margin: 8px 0 10px; }
.gd-step { width: 26px; height: 26px; border-radius: 50%; background: var(--terra); color: #fff; font-size: 14px; display: inline-grid; place-items: center; flex: none; }
.gd-tiles { margin: 16px 0; }
.gd-err { padding: 10px 12px; border-radius: var(--r-sm); background: var(--paper); margin: 10px 0; }
.gd-setup { margin-top: 16px; border-top: 1px solid var(--line); padding-top: 14px; }
.gd-setup summary { cursor: pointer; color: var(--terra); font-weight: 650; font-size: 14px; }
.gd-setup .how { margin: 14px 0 16px; gap: 10px; font-size: 14.5px; }
.gd-setup .copy-row { margin-top: 8px; }
.gd-setup code { font-size: 13px; background: var(--paper); padding: 1px 6px; border-radius: 5px; }
.drive-bar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; padding: 12px 14px; border-radius: var(--r-sm); background: var(--info-bg); margin-bottom: 14px; font-size: 14px; }
.drive-bar > .i { color: var(--info); }
.drive-bar > span:not(.row-btns) { flex: 1; min-width: 200px; display: grid; }
.drive-bar small { color: var(--muted); }
.drive-bar .row-btns { margin: 0; flex: none; }

/* ── leaving ── */
.sheet-out { margin-top: 12px; }
@media (min-width: 900px) {
  .side-foot { margin-top: auto; display: grid; gap: 4px; }
  .side-foot .side-me { margin-top: 0; }
  .side-out { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 0; border-radius: 12px; background: transparent; color: var(--muted); font-weight: 650; text-align: left; transition: background-color .2s, color .2s; }
  .side-out:hover { background: var(--bad-bg); color: var(--bad); }
}

/* ── round 2 polish: dashboard rhythm, plain titles, requests split ── */
.plain-t { font-family: var(--f); font-weight: 850; font-stretch: 75%; letter-spacing: -.005em; }
.side-sub.plain-t { font-size: 20px; line-height: 1.1; }
.dash .hot-card { margin-bottom: 16px; }
.dash-cols { display: grid; gap: 16px; align-items: start; }
.dash-col { display: grid; gap: 16px; align-content: start; min-width: 0; }
@media (min-width: 1000px) { .dash-cols { grid-template-columns: minmax(0, 1.1fr) minmax(0, 1fr); } }
.req-detail .h2 { font-size: clamp(24px, 2.4vw, 30px); }
.btn.big { white-space: normal; text-align: center; line-height: 1.25; padding-top: 10px; padding-bottom: 10px; }
@media (min-width: 900px) { .filter-row { flex-wrap: wrap; overflow: visible; margin: 0 0 16px; padding: 0; } }
@media (min-width: 1250px) { .content:has(.split) { max-width: 1440px; } }
.chat-end { scroll-margin-bottom: calc(170px + env(safe-area-inset-bottom)); }
@media (min-width: 900px) { .chat-end { scroll-margin-bottom: 100px; } }
.card-h { flex-wrap: wrap; }
.card-h .seg { flex-wrap: nowrap; }
.notice { flex-wrap: wrap; }
.notice > span { min-width: 180px; }
.notice > .btn { margin-left: auto; }
.spotlight { animation: spotlight 2.6s var(--ease); }
@keyframes spotlight { 0%, 60% { box-shadow: 0 0 0 3px var(--terra), var(--shadow); } 100% { box-shadow: var(--shadow); } }
.inp-suffix input[type=number] { -moz-appearance: textfield; appearance: textfield; }
.inp-suffix input[type=number]::-webkit-inner-spin-button, .inp-suffix input[type=number]::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
.extras-card .card-h { margin-bottom: 6px; }
.extras-card .card-t .badge { margin-left: 2px; }
.extras-card .card-h p { margin-top: 2px; }
.extras { display: grid; }
.extras li + li { border-top: 1px solid var(--terra-100); }
.extras a { display: flex; align-items: center; gap: 12px; padding: 12px 2px; text-decoration: none; }
.extras a > .grow { display: grid; gap: 2px; min-width: 0; }
.extras small { color: var(--muted); }
.extras i { font-style: italic; }
.extras .btn { flex: none; }
.extras a:hover .btn { box-shadow: inset 0 0 0 1.5px var(--ink); }

/* ── services of a party ── */
.svc-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px 6px 9px; border-radius: 999px; background: var(--terra-50); border: 1.5px solid var(--terra-100); font-weight: 650; font-size: 14px; }
.svc-chip .i { color: var(--terra); width: 16px; height: 16px; }
.chips.planned .svc-chip { background: transparent; border-style: dashed; color: var(--muted); }
.cl-txt small.wrap { white-space: normal; }
.cl-chips { margin-top: 8px; gap: 6px; }
.cl-chips .svc-chip { font-size: 13px; padding: 4px 10px 4px 7px; }
.cl-chips .svc-chip .i { width: 14px; height: 14px; }
.svc-chip.more { color: var(--muted); }
.team-svc > .card, .team-svc > .tiles { margin-bottom: 16px; }
.svc-tiles .tile.hot { background: var(--terra-50); box-shadow: inset 0 0 0 1.5px var(--terra-300); }
.svc-list { display: grid; }
.svc-list > li + li { border-top: 1px solid var(--line); }
.svc-li { display: flex; align-items: center; gap: 12px; padding: 10px 2px; }
.svc-li > .grow, .svc-row-btn > .grow { display: grid; gap: 1px; min-width: 0; }
.svc-li small, .svc-row-btn small { color: var(--muted); font-size: 13px; }
.svc-li .svc-ic, .svc-row-btn .svc-ic { flex: none; }
.svc-row-btn { width: 100%; display: flex; align-items: center; gap: 12px; padding: 0; border: 0; background: transparent; text-align: left; font: inherit; border-radius: 10px; }
.svc-row-btn:hover { background: var(--paper); }
.svc-empty { display: grid; gap: 8px; justify-items: start; }
.svc-avail + .svc-avail { margin-top: 14px; }
.svc-avail > small { display: block; margin-bottom: 6px; color: var(--muted); font-weight: 700; font-size: 12px; text-transform: uppercase; letter-spacing: .06em; }
.pick-price { color: var(--muted); font-weight: 500; margin-left: 2px; }
.tag.info { background: var(--info-bg); color: var(--info); text-decoration: none; }

/* ── preparation questionnaire ── */
.prep > .card { margin-bottom: 16px; }
.prep-prog { display: flex; align-items: center; gap: 18px; }
.prep-prog-n { font-size: 15px; color: var(--muted); white-space: nowrap; }
.prep-prog-n b { font-size: 32px; font-weight: 850; font-stretch: 70%; color: var(--ink); margin-right: 2px; }
.prep-prog .grow { flex: 1; display: grid; gap: 6px; min-width: 0; }
.prep-prog small { color: var(--muted); font-size: 13.5px; }
.prep-prog .bar { margin-top: 0; }
.prep-prog.done .bar i { background: var(--ok); }
.prep-sec .card-t { display: flex; align-items: center; gap: 10px; }
.prep-n { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; background: var(--terra-50); color: var(--terra); font-size: 14px; font-weight: 800; flex: none; }
.prep .form { max-width: 760px; }
.fld-l .opt { color: var(--muted); font-weight: 500; font-size: .92em; }
.inp.short { max-width: 220px; }

/* ── the farm: a booking's choices, the services editor's second list ── */
.rq-total { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--line); font-weight: 650; }
.rq-total b { font-size: 26px; font-weight: 850; font-stretch: 70%; }
.svc-sec-h { margin-top: 30px; }
.svc-sec-h .muted { max-width: 680px; }
.prep .seg { border-radius: 18px; }
.prep .seg button { border-radius: 14px; text-align: left; }
.price-where { display: grid; gap: 22px; }
@media (min-width: 900px) { .price-where { grid-template-columns: 1fr 1fr; gap: 32px; } }
.price-where .sub-t { margin-bottom: 4px; }

/* ── Site › Aparência ── */
.ap-grid { display: grid; gap: 18px; align-items: start; }
@media (min-width: 1100px) { .ap-grid { grid-template-columns: minmax(0, 1fr) 380px; gap: 24px; } }
.ap-controls > .card { margin-bottom: 16px; }
.ap-colors { display: grid; gap: 4px; }
.ap-color { display: flex; align-items: center; gap: 14px; padding: 10px 2px; border-bottom: 1px solid var(--line); }
.ap-color:last-child { border-bottom: 0; }
.ap-color input[type=color] { width: 46px; height: 46px; padding: 0; border: 1.5px solid var(--line); border-radius: 12px; background: none; cursor: pointer; flex: none; }
.ap-color input[type=color]::-webkit-color-swatch-wrapper { padding: 3px; }
.ap-color input[type=color]::-webkit-color-swatch { border: 0; border-radius: 8px; }
.ap-color .grow { display: grid; gap: 2px; min-width: 0; }
.ap-color small { color: var(--muted); font-size: 13px; line-height: 1.35; }
.ap-hex { width: 104px; flex: none; font-family: ui-monospace, monospace; font-size: 14px; text-transform: lowercase; }
.ap-orig, .ap-color .link { width: 56px; flex: none; text-align: center; }
@media (max-width: 560px) { .ap-color { flex-wrap: wrap; } .ap-color .grow { flex: 1 1 60%; } .ap-hex { margin-left: 60px; } }
.ap-warn { display: flex; gap: 12px; margin-top: 14px; padding: 14px; border-radius: 12px; background: var(--warn-bg, #fdf1df); color: #7a4b12; font-size: 14px; }
.ap-warn ul { margin: 6px 0 0; padding-left: 18px; display: grid; gap: 4px; }
.ap-ok { display: flex; align-items: center; gap: 8px; margin-top: 12px; color: var(--ok); font-size: 14px; font-weight: 600; }
.ap-fonts { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; }
.ap-font { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1.5px solid var(--line); border-radius: 12px; background: var(--card); text-align: left; color: var(--ink); }
.ap-font:hover { border-color: var(--ink); }
.ap-font.on { border-color: var(--terra); background: var(--terra-50); box-shadow: inset 0 0 0 1px var(--terra); }
.ap-font > .i { margin-left: auto; color: var(--terra); flex: none; }
.ap-aa { font-size: 28px; line-height: 1; width: 44px; text-align: center; flex: none; }
.ap-fname { display: grid; gap: 1px; min-width: 0; }
.ap-fname b { font-size: 15px; font-weight: 600; line-height: 1.2; overflow-wrap: anywhere; }
.appear .fld + .fld { margin-top: 20px; }
.ap-fname small { font-size: 12px; color: var(--muted); line-height: 1.3; }
.ap-custom { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); display: grid; gap: 10px; justify-items: start; }
.ap-custom > div { display: grid; gap: 2px; }
.ap-custom-list { display: grid; gap: 6px; width: 100%; }
.ap-custom-list li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 10px; background: var(--paper); }
.ap-custom-list li > span { font-size: 18px; flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.ap-size + .ap-size { margin-top: 20px; }
.ap-size { display: grid; gap: 6px; }
.ap-size-h { display: flex; align-items: baseline; gap: 10px; }
.ap-size-v { font-size: 14px; color: var(--muted); }
.ap-size-v.changed { color: var(--terra); font-weight: 700; }
.ap-size input[type=range] { width: 100%; accent-color: var(--terra); height: 30px; }
.ap-size-ends { display: flex; justify-content: space-between; color: var(--muted); }
.ap-reset { display: flex; justify-content: flex-end; }
.ap-sticky { position: sticky; top: 84px; display: grid; gap: 10px; justify-items: start; }
.ap-sample { width: 100%; border-radius: 14px; overflow: hidden; box-shadow: var(--shadow); border: 1px solid var(--line); }
.ap-s-dark, .ap-s-light { padding: 20px 20px 22px; }
.ap-s-dark p, .ap-s-light p { overflow-wrap: anywhere; }
.ap-s-btn { display: inline-block; padding: 9px 16px; border-radius: 999px; font-weight: 700; font-size: 13px; }
@media (max-width: 1099px) { .ap-side { order: -1; } .ap-sticky { position: static; } }

/* ── a party at the farm: what to prepare, and its printed sheet ── */
.farm-prep { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.farm-prep .sub-t { display: flex; align-items: center; gap: 8px; margin-bottom: 4px; }
.farm-prep .sub-t .i { color: var(--terra); }
.fp-item { display: grid; gap: 2px; }
.fp-item + .fp-item { margin-top: 8px; }
.fp-item small { color: var(--muted); font-size: 13px; font-weight: 400; line-height: 1.4; }
.fp-pending { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-top: 12px; font-size: 14px; color: #7a4b12; }
@media print {
  .ws-body > .ov.has-sheet { display: block !important; }
  .ov.has-sheet > *:not(.print-sheet) { display: none !important; }
  .farm-sheet .pt { width: 120px; }
  .farm-sheet td > div + div { margin-top: 6px; }
}
@media print { .print-sheet .pt.wide { width: 170px; white-space: normal; } }
.svc-price s { opacity: .55; font-weight: 500; margin-right: 3px; }
.svc-price small { display: block; font-size: 11.5px; font-weight: 600; color: var(--terra); }

/* ── farm: times and rules; a service on promotion ── */
.farm-rules { margin-bottom: 16px; }
.fr-slots { display: grid; gap: 10px; }
.fr-slot { display: grid; grid-template-columns: minmax(140px, 1fr) 130px 130px auto; gap: 12px; align-items: end; padding: 12px; border-radius: 12px; background: var(--paper); }
.fr-slot.off { opacity: .7; }
.fr-slot .switch { padding-bottom: 8px; }
.fr-preview { grid-column: 1 / -1; }
@media (max-width: 760px) { .fr-slot { grid-template-columns: 1fr 1fr; } .fr-slot .grow { grid-column: 1 / -1; } }
.fr-rules { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; margin-top: 16px; }
.fr-foot { display: flex; justify-content: flex-end; margin-top: 14px; }
.promo-box { margin: 10px 0 12px; padding: 12px; border-radius: 12px; background: var(--terra-50); display: grid; gap: 10px; }
.promo-preview { font-size: 14px; }
.promo-preview s { opacity: .6; }

/* ── Site › Textos: parts of the home page that can be hidden ── */
.sec-show { padding: 4px 0 14px; margin-bottom: 12px; border-bottom: 1px solid var(--line); }
.sec-ed.is-hidden-sec > summary b { color: var(--muted); }
.sec-ed.is-hidden-sec > summary .tag { margin-left: 8px; vertical-align: middle; }

/* ── Site › Textos › Menu do site ── */
.menu-order { list-style: none; margin: 4px 0 10px; padding: 0; display: grid; gap: 6px; }
.menu-order li { display: flex; align-items: center; gap: 10px; padding: 8px 8px 8px 12px; border-radius: 12px; background: var(--cream); }
.menu-order li b { flex: 1; }
.menu-order .mo-n { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--card); font-size: 12.5px; font-weight: 700; color: var(--muted); flex: none; }
.menu-order .icon-btn:disabled { opacity: .3; cursor: default; }

/* ── Definições › Momentos musicais ── */
.mm .seg { flex-wrap: wrap; }
.mm-hint { display: flex; align-items: center; gap: 6px; margin: 10px 0 0; }
.mm-list { list-style: none; margin: 14px 0 12px; padding: 0; display: grid; gap: 8px; }
.mm-list li { display: flex; align-items: flex-start; gap: 10px; padding: 10px; border-radius: 14px; background: var(--cream); }
.mm-list .mo-n { margin-top: 10px; }
.mm-fields { flex: 1; min-width: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 6px; }
.mm-fields .inp.sm { font-size: 13.5px; padding-top: 7px; padding-bottom: 7px; }
.mm-tags { display: flex; flex-wrap: wrap; gap: 6px; }
.mm-list .row-btns { flex-wrap: nowrap; margin-top: 4px; }
.mm-list .icon-btn:disabled { opacity: .3; cursor: default; }
.mm-off { margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); }
.mm-off .li-chip { cursor: pointer; border: 0; font: inherit; }
.mm-foot { justify-content: flex-end; margin-top: 16px; }
@media (max-width: 599px) { .mm-list li { flex-wrap: wrap; } .mm-list .mm-fields { flex-basis: calc(100% - 44px); } .mm-list .row-btns { margin-left: 34px; } .mm-part .mm-list li { flex-wrap: nowrap; } .mm-part .mm-list .mm-fields { flex-basis: auto; } .mm-part .mm-list .row-btns { margin-left: 0; } .mm-sides button { padding: 10px 12px; gap: 8px; } }
.mo-n { width: 24px; height: 24px; border-radius: 50%; display: grid; place-items: center; background: var(--card); font-size: 12.5px; font-weight: 700; color: var(--muted); flex: none; }
/* Música: a moment only for this party */
.extra-song { display: grid; gap: 6px; padding: 10px; border-radius: 14px; background: var(--cream); }
.extra-h { display: flex; gap: 6px; align-items: center; }
.extra-h .inp { font-weight: 650; }
.add-moment { justify-self: start; }

/* Pedidos: the services chosen on the site, by group */
.rq-groups { display: grid; gap: 12px; margin: 4px 0 10px; }
.rq-group { display: grid; gap: 6px; }
.rq-gl { display: inline-flex; align-items: center; gap: 6px; font-size: 12.5px; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; color: var(--muted); }
.rq-gl .i { width: 15px; height: 15px; color: var(--terra); }

/* Site › Textos: a group of fields inside a card */
.fld-group { margin-top: 10px; padding-top: 14px; border-top: 1px solid var(--line); }
.fld-group h4 { margin: 0 0 4px; font-size: 15px; }
.fld-group p { margin: 0; }

/* ── Site › Formulário ── */
.form-ed { display: grid; gap: 12px; }
.fe-top { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; }
.fe-top .seg { flex-wrap: wrap; }
.fe-reset { margin-left: 8px; font-size: 12.5px; font-weight: 600; }
.fe-note { margin: 4px 0 0; }
.fe-fields { display: grid; gap: 8px; margin-top: 14px; }
.fe-field { padding: 12px; border-radius: 14px; background: var(--cream); display: grid; gap: 8px; }
.fe-field.is-off { opacity: .75; }
.fe-field-h { display: flex; align-items: center; gap: 10px; justify-content: space-between; flex-wrap: wrap; }
.fe-field .form.cols { gap: 8px 12px; }
.fe-qs { display: grid; gap: 10px; margin-top: 16px; padding-top: 14px; border-top: 1px solid var(--line); justify-items: start; }
.fe-qs > * { width: 100%; }
.fe-qs > .btn { width: auto; }
.fe-q { padding: 12px; border-radius: 14px; border: 1.5px solid var(--line); display: grid; gap: 8px; background: var(--card); }
.fe-q-h { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.fe-q-h .sel { width: auto; min-width: 190px; }
.fe-q-h .row-btns { margin-left: auto; flex-wrap: nowrap; }
.fe-q .icon-btn:disabled { opacity: .3; cursor: default; }
.fe-warn { display: flex; gap: 6px; align-items: center; margin: 0; font-size: 13px; font-weight: 600; color: var(--terra); }
.fe-warn .i { width: 16px; height: 16px; }

/* Choosing the font of event names */
.nf-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 8px; margin-top: 6px; }
.nf-tile { position: relative; display: grid; gap: 6px; align-content: center; min-height: 92px; padding: 12px 14px; border: 1.5px solid var(--line); border-radius: 14px; background: var(--card); text-align: left; font: inherit; cursor: pointer; color: var(--ink); }
.nf-tile:hover { border-color: var(--terra-300); }
.nf-tile.on { border: 2px solid var(--terra); background: var(--terra-50); }
.nf-tile > .i { position: absolute; top: 10px; right: 10px; width: 18px; height: 18px; color: var(--terra); }
.nf-sample { font-size: 30px; line-height: 1.1; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nf-sample.plain-t { font-size: 22px; }
.nf-tile small { color: var(--muted); font-size: 12.5px; font-weight: 600; }
.name-serif { line-height: 1.05; }

/* ── Contrato ── */
.contract-wrap { display: grid; gap: 16px; }
.ct-start { display: grid; gap: 14px; justify-items: start; }
.ct-label { margin: 6px 0 -6px; font-size: 12.5px; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
/* The preview stays in view next to the editor and scrolls on its own, so the whole contract can be read. */
@media (min-width: 1240px) { .ct-draft { grid-template-columns: minmax(0, 1fr) minmax(0, 1.05fr); align-items: start; } .ct-draft .ct-preview { position: sticky; top: 16px; max-height: calc(100vh - 32px); overflow: auto; border-radius: 16px; overscroll-behavior: contain; } }
.ct-edit { display: grid; gap: 16px; }
.ct-bar { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; }
.ct-bar > .i { color: var(--terra); width: 22px; height: 22px; flex: none; }
.ct-bar > span:nth-child(2) { flex: 1; display: grid; gap: 2px; min-width: 200px; }
.ct-bar small { color: var(--muted); }
.ct-bar.ok > .i { color: #2f7a46; }
.contract-doc { background: #fff; color: #1d140e; border-radius: 16px; box-shadow: var(--shadow); padding: 36px 40px; max-width: 820px; width: 100%; margin: 0 auto; font-size: 14.5px; line-height: 1.55; }
.cd-head { display: flex; gap: 16px; align-items: center; border-bottom: 2px solid #9b5e41; padding-bottom: 14px; margin-bottom: 18px; }
.cd-logo { width: 54px; height: 50px; color: #9b5e41; flex: none; }
.cd-head div { display: grid; }
.cd-head small { color: #6b5a50; font-size: 12.5px; }
.cd-title { font-size: 22px; font-weight: 850; margin: 0 0 8px; line-height: 1.2; }
.cd-intro { color: #4a3a30; margin: 0 0 6px; }
.contract-doc h2 { font-size: 12.5px; letter-spacing: .08em; text-transform: uppercase; color: #9b5e41; margin: 20px 0 8px; }
.cd-dl { display: grid; gap: 6px; margin: 0; }
.cd-dl > div { display: grid; grid-template-columns: 150px 1fr; gap: 12px; }
.cd-dl dt { font-weight: 700; }
.cd-dl dd { margin: 0; }
.cd-table { width: 100%; border-collapse: collapse; }
.cd-table td, .cd-table th { padding: 7px 0; border-bottom: 1px solid #eadfd5; text-align: left; vertical-align: top; font-weight: 400; }
.cd-table .n { text-align: right; white-space: nowrap; padding-left: 12px; }
.cd-table small { display: block; color: #6b5a50; font-size: 12.5px; }
.cd-table tfoot th { font-weight: 600; }
.cd-table .cd-sub th, .cd-table .cd-sub td { color: #6b5a50; font-size: .95em; }
.cd-clauses { margin: 0; padding-left: 22px; display: grid; gap: 8px; }
.cd-clauses:not(.m-nada) { padding-left: 0; }
.cd-clauses:not(.m-nada) > li { display: grid; grid-template-columns: 2.1em 1fr; align-items: start; }
.cd-mark { font-weight: 700; color: #9b5e41; }
.m-pontos .cd-mark { text-align: center; }
.cd-clauses li > b { display: block; }
.cd-clauses p { margin: 0 0 3px; }
.cd-clauses ul { margin: 2px 0 6px; padding-left: 18px; }
.cd-accept { margin-top: 22px; padding-top: 14px; border-top: 1px solid #eadfd5; }
.cd-accept p { margin: 0 0 8px; }
.cd-ok { display: flex; gap: 8px; align-items: flex-start; color: #2f7a46; }
.cd-ok .i { width: 18px; height: 18px; flex: none; margin-top: 3px; }
.cd-wait { color: #6b5a50; font-style: italic; }
@media (max-width: 599px) { .contract-doc { padding: 22px 18px; font-size: 14px; } .cd-dl > div { grid-template-columns: 1fr; gap: 0; } }
.ct-accept { display: grid; gap: 12px; justify-items: start; }
.ct-accept > .fld { width: 100%; max-width: 420px; }
.ct-top { justify-content: flex-end; }
.cl-ed { display: grid; gap: 10px; justify-items: start; }
.cl-ed > * { width: 100%; }
.cl-ed > .btn { width: auto; }
.cl-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.cl-list li { display: flex; gap: 10px; align-items: flex-start; padding: 10px; border-radius: 14px; background: var(--cream); }
.cl-list .mo-n { margin-top: 8px; }
.cl-fields { flex: 1; min-width: 0; display: grid; gap: 6px; }
.cl-list .row-btns { flex-wrap: nowrap; }
.cl-list .icon-btn:disabled { opacity: .3; cursor: default; }
@media (max-width: 599px) { .cl-list li { flex-wrap: wrap; } .cl-list .row-btns { margin-left: 34px; } }
.ct-settings { display: grid; gap: 16px; }
.ct-sub { font-size: 14px; margin: 16px 0 8px; }
.ct-world { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; margin-bottom: 12px; }
.ct-world .seg { flex-wrap: wrap; }
.ct-old { display: grid; gap: 10px; margin-top: 12px; justify-items: start; }
.ct-old .contract-doc { box-shadow: none; border: 1px solid var(--line); }
/* Budget proposals: their number and validity under the title, and the list of those issued. */
.ct-vat { display: grid; gap: 6px; }
.lines .line.subtotal { color: var(--muted); padding-top: 6px; padding-bottom: 6px; }
.cd-meta { margin: -2px 0 8px; color: #6b5a50; font-size: .95em; font-weight: 600; }
.cd-valid { margin: 0 0 12px; padding: 10px 14px; border-left: 3px solid #9b5e41; background: #f8efe8; font-weight: 600; }
.prop-list ul { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 6px; }
.prop-row { width: 100%; display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 0; border-radius: 14px; background: var(--cream); text-align: left; font: inherit; color: inherit; cursor: pointer; }
.prop-row:hover { background: var(--terra-50); }
.pr-main { flex: 1; display: grid; gap: 2px; min-width: 0; }
.pr-main small { color: var(--muted); }
.pr-total { font-weight: 700; white-space: nowrap; }
.prop-row .tag.pr-valida { background: var(--ok-bg); color: var(--ok); }
.prop-row .tag.pr-expirada, .prop-row .tag.pr-anulada { background: var(--bad-bg); color: var(--bad); }
@media (max-width: 599px) { .prop-row { flex-wrap: wrap; } .pr-main { flex-basis: 100%; } }

.page-order li.fixed { background: transparent; border: 1.5px dashed var(--line-2); color: var(--muted); }
.page-order li.fixed .mo-n .i { width: 13px; height: 13px; }
.page-order li.fixed small { font-size: 12.5px; }
.po-note { display: flex; gap: 8px; align-items: flex-start; margin: 0 0 8px; padding: 10px 12px; border-radius: 12px; background: var(--terra-50); font-size: 13.5px; }
.po-note .i { width: 16px; height: 16px; color: var(--terra); flex: none; margin-top: 2px; }
.mm-sides { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 16px; }
.mm-sides button { display: flex; align-items: center; gap: 12px; padding: 12px 16px; border: 1.5px solid var(--line-2); border-radius: var(--r); background: var(--card); color: var(--muted); font: inherit; text-align: left; cursor: pointer; }
.mm-sides button > svg { flex: none; width: 22px; height: 22px; }
.mm-sides button span { display: grid; }
.mm-sides button b { color: var(--ink); font-size: 15px; }
.mm-sides button small { font-size: 13px; }
.mm-sides button.on { border-color: var(--terra); background: var(--terra-50); color: var(--terra); box-shadow: inset 0 0 0 1px var(--terra); }
.mm-two { margin: 8px 0 0; }
.mm > .btn.ghost { max-width: 100%; white-space: normal; text-align: left; }
.mm-parts { display: grid; gap: 4px; margin: 14px 0 12px; }
.mm-part .mm-list { margin: 6px 0 10px; }
.mm-off .li-chip small { margin-left: 6px; color: var(--muted); font-size: 12px; }

/* A client account with more than one event: which one the area shows */
.ev-switch { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; margin: 0 0 16px; padding-bottom: 2px; }
.ev-switch::-webkit-scrollbar { display: none; }
.ev-switch button { flex: none; display: grid; gap: 1px; text-align: left; padding: 9px 14px; border-radius: var(--r); border: 1.5px solid var(--line-2); background: var(--card); color: var(--ink); font: inherit; cursor: pointer; }
.ev-switch button b { font-size: 14px; } .ev-switch button small { font-size: 12.5px; color: var(--muted); }
.ev-switch button.on { border-color: var(--terra); background: var(--terra-50); box-shadow: inset 0 0 0 1px var(--terra); }