@font-face {
  font-family:Inter;
  src:url('/assets/finados/fonts/inter-variable-latin.woff2') format('woff2');
  font-display:swap;
  font-weight:100 900
}
@font-face {
  font-family:Anton;
  src:url('/assets/finados/fonts/anton-latin.woff2') format('woff2');
  font-display:swap;
  font-weight:400
}
:root {
  --ink:#241146;
  --canvas:#f4eada;
  --accent:#6e2ce0;
  --line:#c4b7ce;
  --muted:#5c4b6d;
  --cyan:#00d2d6
}
* {
  box-sizing:border-box
}
body {
  margin:0;
  background:var(--canvas);
  color:var(--ink);
  font-family:Inter,Arial,sans-serif;
  font-size:1rem;
  line-height:1.6
}
button,input,select {
  font:inherit
}
button,a,input,select {
  -webkit-tap-highlight-color:transparent
}
a {
  min-height:44px;
  display:inline-flex;
  align-items:center;
  color:var(--accent);
  text-underline-offset:.25em
}
button {
  cursor:pointer
}
button:disabled {
  cursor:wait;
  opacity:.65
}
[hidden] {
  display:none!important
}
fieldset {
  padding:0;
  margin:0;
  border:0;
  min-width:0
}
fieldset:disabled input,fieldset:disabled select {
  opacity:1;
  color:var(--muted)
}
:focus-visible {
  outline:3px solid var(--accent);
  outline-offset:4px
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap
}
.skip-link {
  position:fixed;
  z-index:10;
  top:-100px;
  left:1rem;
  background:var(--ink);
  color:white;
  padding:1rem
}
.skip-link:focus {
  top:1rem
}
.vocero-chumbi {
  height:8px;
  background:repeating-linear-gradient(90deg,#ff2e8a 0 14px,#ffc42e 14px 28px,#00d2d6 28px 42px,#6e2ce0 42px 56px,#e01b24 56px 70px,#f4eada 70px 84px)
}
.vocero-header {
  background:var(--ink);
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:1rem max(1.25rem,calc((100vw - 1200px)/2));
  color:var(--canvas)
}
.vocero-header img {
  display:block;
  width:120px;
  height:70px;
  object-fit:contain
}
.vocero-header>a:last-child {
  color:var(--canvas);
  font-size:.875rem;
  padding:.75rem 0
}
.vocero-header a:focus-visible {
  outline-color:var(--cyan)
}
.vocero-workspace {
  width:min(1200px,calc(100% - 3rem));
  margin:0 auto;
  padding:3rem 0 5rem;
  min-height:calc(100svh - 220px)
}
.vocero-workspace--access,.vocero-workspace--reset {
  max-width:520px
}
.vocero-eyebrow {
  text-transform:uppercase;
  letter-spacing:.13em;
  font-size:.75rem;
  font-weight:750;
  color:var(--accent);
  margin:0 0 .5rem
}
h1 {
  font-family:Anton,'Arial Narrow',sans-serif;
  font-size:clamp(2.4rem,5vw,3.5rem);
  font-weight:400;
  line-height:1.12;
  letter-spacing:.005em;
  margin:0 0 1rem
}
h2 {
  font-size:1.3rem;
  line-height:1.3;
  margin:0 0 1.25rem;
  letter-spacing:-.02em
}
p {
  margin:0 0 1rem
}
.vocero-access-intro {
  margin-bottom:1.75rem
}
.vocero-access-intro>p:last-child {
  color:var(--muted);
  max-width:45ch
}
.vocero-modes {
  display:flex;
  border-bottom:1px solid var(--line);
  margin-bottom:1.75rem;
  gap:1.5rem
}
.vocero-modes button {
  border:0;
  background:transparent;
  min-height:48px;
  padding:.5rem 0;
  color:var(--muted);
  border-bottom:3px solid transparent;
  font-weight:700;
  transition:color .18s,border-color .18s
}
.vocero-modes button[aria-pressed=true] {
  color:var(--accent);
  border-color:var(--accent)
}
.vocero-field {
  display:flex;
  flex-direction:column;
  gap:.45rem;
  margin:0 0 1.2rem;
  font-weight:600;
  font-size:.875rem;
  min-width:0
}
.vocero-field small {
  font-weight:400;
  color:var(--muted)
}
input,select {
  width:100%;
  min-width:0;
  min-height:48px;
  border:1px solid #95829f;
  border-radius:4px;
  padding:.7rem .8rem;
  background:#fffcf7;
  color:var(--ink);
  transition:border-color .18s,box-shadow .18s
}
input:focus,select:focus {
  border-color:var(--accent)
}
input[readonly] {
  background:#e7ddcd;
  color:var(--muted)
}
input[aria-invalid=true] {
  border-color:#a41b2b
}
input[type=file] {
  font-size:.8rem;
  padding:.6rem
}
input[type=file]::file-selector-button {
  border:0;
  border-radius:2px;
  background:var(--ink);
  color:white;
  padding:.6rem;
  margin-right:.7rem;
  font:inherit;
  cursor:pointer
}
.vocero-field-help {
  font-size:.8rem;
  color:var(--muted);
  margin-top:-.7rem
}
.vocero-primary,.vocero-quiet {
  min-height:48px;
  border-radius:4px;
  padding:.7rem 1.25rem;
  font-weight:700
}
.vocero-primary {
  background:var(--accent);
  color:white;
  border:1px solid var(--accent);
  transition:background .18s,transform .18s
}
.vocero-primary:hover {
  background:#50209f;
  transform:translateY(-1px)
}
.vocero-quiet {
  background:transparent;
  color:var(--ink);
  border:1px solid var(--ink)
}
.vocero-quiet:hover {
  background:#e5d7f0
}
.vocero-workspace--access form>.vocero-primary,.vocero-workspace--access fieldset>.vocero-primary,.vocero-workspace--reset fieldset>.vocero-primary {
  display:block;
  width:100%;
  margin:1.5rem 0
}
.vocero-check {
  min-height:44px;
  display:flex;
  gap:.8rem;
  align-items:flex-start;
  font-size:.875rem;
  line-height:1.65;
  margin:1.5rem 0;
  cursor:pointer
}
.vocero-check input {
  appearance:auto;
  width:20px;
  min-height:20px;
  height:20px;
  flex:0 0 20px;
  margin:4px 0 0;
  accent-color:var(--accent)
}
.vocero-help {
  border-top:1px solid var(--line);
  padding-top:1rem;
  font-size:.875rem
}
.vocero-help summary {
  cursor:pointer;
  min-height:44px;
  font-weight:600
}
.vocero-feedback {
  font-size:.95rem;
  border-left:3px solid var(--accent);
  background:#e9dff4;
  padding:1rem 1.25rem;
  margin-bottom:1.5rem;
  overflow-wrap:anywhere
}
.vocero-feedback:empty {
  display:none
}
.vocero-feedback[data-error=true] {
  border-color:#9d2430;
  background:#f9e3df;
  color:#761d26
}
.vocero-feedback:focus {
  outline:2px solid var(--accent);
  outline-offset:3px
}
[data-session-retry],[data-session-login] {
  margin-bottom:1.5rem
}
.vocero-workspace-heading {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:2rem;
  border-bottom:1px solid var(--line);
  padding-bottom:1.75rem;
  margin-bottom:2.5rem
}
[data-profile-status] {
  font-weight:600;
  color:var(--muted);
  margin:0
}
.vocero-profile-layout {
  display:grid;
  grid-template-columns:minmax(230px,320px) minmax(0,1fr);
  gap:clamp(2rem,5vw,5rem)
}
.vocero-photo h2 {
  max-width:22ch
}
.vocero-photo-frame {
  aspect-ratio:3/4;
  background:#e7ddcd;
  border:1px solid var(--line);
  display:grid;
  place-items:center;
  overflow:hidden;
  margin:1.25rem 0
}
.vocero-photo-frame img {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain
}
.vocero-photo-frame>span {
  color:var(--muted);
  text-align:center;
  font-size:1.1rem
}
.vocero-photo-frame small {
  font-size:.75rem;
  letter-spacing:.05em
}
#photo-help {
  font-size:.875rem;
  color:var(--muted)
}
.vocero-photo [data-photo-replace] {
  width:100%
}
.vocero-profile-details section+section {
  border-top:1px solid var(--line);
  padding-top:2rem;
  margin-top:1.25rem
}
.vocero-profile-details section>p:not(.vocero-eyebrow) {
  font-size:.875rem;
  color:var(--muted)
}
.vocero-fields {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  column-gap:1.3rem
}
.vocero-legal-links {
  display:flex;
  flex-wrap:wrap;
  gap:.5rem 1.25rem;
  font-size:.8rem
}
.vocero-legal-links a {
  padding:.5rem 0
}
.vocero-save {
  border-top:1px solid var(--line);
  padding-top:2rem;
  margin-top:2rem;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:1.5rem
}
.vocero-save p {
  font-size:.875rem;
  color:var(--muted);
  max-width:40ch;
  margin:0
}
.vocero-save-status {
  min-height:1.25em;
  margin-top:.35rem !important;
  color:var(--accent) !important;
  font-size:.75rem !important;
  font-weight:700;
}
.vocero-save-status[data-error=true] {
  color:#b12652 !important;
}
.vocero-save button {
  flex-shrink:0
}
.vocero-progress-panel,.vocero-badge-panel,.vocero-videos-panel {
  border:1px solid var(--line);
  background:rgba(255,252,247,.72);
  padding:clamp(1.25rem,3vw,2.25rem);
  margin:0 0 2rem
}
.vocero-section-heading {
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:2rem
}
.vocero-section-heading h2 { margin-bottom:.5rem }
.vocero-section-heading p:not(.vocero-eyebrow) { color:var(--muted); max-width:60ch; font-size:.9rem }
.vocero-progress-summary { min-width:180px; text-align:right; display:grid; justify-items:end; gap:.2rem }
.vocero-progress-summary strong { font-size:1.05rem }
.vocero-progress-summary small,.vocero-progress-meta dt { color:var(--muted); font-size:.78rem }
.vocero-traffic-light { display:flex; gap:.35rem; padding:.35rem; border:1px solid var(--line); border-radius:99px; background:#fff }
.vocero-traffic-light span { width:18px; height:18px; border-radius:50%; opacity:.28; box-shadow:inset 0 0 0 2px rgba(36,17,70,.2) }
.vocero-traffic-light span[data-vocero-light=red] { background:#d93d4a }
.vocero-traffic-light span[data-vocero-light=yellow] { background:#f5c84b }
.vocero-traffic-light span[data-vocero-light=green] { background:#35a86b }
.vocero-traffic-light span.is-active { opacity:1; box-shadow:0 0 0 3px #fff,0 0 0 5px currentColor }
.vocero-levels { display:grid; grid-template-columns:repeat(7,minmax(0,1fr)); list-style:none; padding:0; margin:1.5rem 0 1rem; gap:.5rem }
.vocero-levels li { min-height:88px; display:flex; flex-direction:column; justify-content:space-between; gap:.4rem; border-top:4px solid var(--line); padding:.65rem .6rem; background:#fff }
.vocero-levels li span { font-size:.7rem; color:var(--muted); font-weight:700 }
.vocero-levels li strong { font-size:.78rem; line-height:1.25 }
.vocero-levels li.is-current { border-color:var(--accent); background:#eadff7; box-shadow:inset 0 -3px 0 var(--cyan) }
.vocero-progress-meta { display:flex; gap:2rem; border-top:1px solid var(--line); padding-top:1rem; margin:0 }
.vocero-progress-meta div { display:grid; gap:.1rem }
.vocero-progress-meta dd { margin:0; font-weight:700 }
.vocero-badge-panel { display:grid; grid-template-columns:minmax(0,1fr) 260px; align-items:center; gap:2rem; background:var(--ink); color:var(--canvas); border-color:var(--ink) }
.vocero-badge-panel .vocero-eyebrow { color:var(--cyan) }
.vocero-badge-panel h2 { color:#fff }
.vocero-badge-panel p:not(.vocero-eyebrow),.vocero-badge-status { color:#e7dded }
.vocero-badge-format { color:#f5c84b!important; font-size:.78rem!important; font-weight:700; letter-spacing:.04em; text-transform:uppercase }
.vocero-badge-preview { background:#160a2e; padding:.75rem; min-height:300px; display:grid; place-items:center }
.vocero-badge-preview img { display:block; width:100%; aspect-ratio:9/16; height:auto; object-fit:contain; box-shadow:0 8px 24px rgba(0,0,0,.28) }
.vocero-badge-actions { display:flex; flex-wrap:wrap; gap:.75rem }
.vocero-badge-panel .vocero-quiet { color:#fff; border-color:#fff }
.vocero-badge-panel .vocero-quiet:hover { background:#3b2362 }
.vocero-video-counter { color:var(--accent); font-size:.85rem; font-weight:700; white-space:nowrap }
.vocero-videos-panel summary { display:flex; justify-content:space-between; align-items:flex-start; gap:1.5rem; cursor:pointer; list-style:none }
.vocero-videos-panel summary::-webkit-details-marker { display:none }
.vocero-videos-panel summary > span:first-child { display:grid; gap:.35rem }
.vocero-videos-panel summary .vocero-eyebrow { margin:0 }
.vocero-videos-panel summary strong { font-size:1.25rem; color:var(--ink) }
.vocero-videos-panel summary small { color:var(--muted); max-width:60ch; font-size:.9rem; line-height:1.45 }
.vocero-videos-panel summary::after { content:'+'; color:var(--accent); font-size:1.5rem; font-weight:800; line-height:1; }
.vocero-videos-panel[open] summary::after { content:'−' }
.vocero-videos-panel[open] .vocero-video-grid { margin-top:1rem }
.vocero-video-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:1rem; margin-top:1rem }
.vocero-video-slot { border:1px solid var(--line); padding:1rem; background:#fff; display:grid; gap:.25rem }
.vocero-video-slot[data-locked=true] { background:#eee9e2 }
.vocero-video-slot__heading { display:flex; align-items:center; gap:.75rem; margin-bottom:.25rem }
.vocero-video-slot__heading h3 { margin:0; font-size:1rem }
.vocero-video-slot__heading p { margin:0; color:var(--muted); font-size:.78rem }
.vocero-video-number { color:var(--accent); font-family:Anton,Arial,sans-serif; font-size:1.8rem; line-height:1 }
.vocero-video-slot .vocero-field { margin:.5rem 0 }
.vocero-video-save { justify-self:start; min-height:42px; padding:.5rem .9rem; font-size:.85rem }
.vocero-footer {
  display:flex;
  justify-content:space-between;
  gap:1rem;
  padding:1.5rem max(1.5rem,calc((100vw - 1200px)/2));
  border-top:1px solid var(--line);
  font-size:.75rem;
  color:var(--muted)
}
.vocero-portal noscript {
  display:block;
  padding:1.5rem;
  background:#f9e3df
}
.vocero-portal form:not([hidden]) {
  animation:enter .22s ease-out
}
@keyframes enter {
  from {
    opacity:.4;
    transform:translateY(5px)
  }
  to {
    opacity:1;
    transform:none
  }
}
[aria-busy=true] {
  cursor:progress
}
@media(max-width:760px) {
  .vocero-workspace {
    width:calc(100% - 2.5rem);
    padding-top:2rem
  }
  .vocero-profile-layout {
    grid-template-columns:1fr;
    gap:2.5rem
  }
  .vocero-photo {
    display:grid;
    grid-template-columns:minmax(100px,180px) minmax(0,1fr);
    gap:0 1.5rem
  }
  .vocero-photo>.vocero-eyebrow,.vocero-photo>h2 {
    grid-column:1/-1
  }
  .vocero-photo-frame {
    grid-column:1;
    grid-row:3/6;
    margin-top:0;
    align-self:start
  }
  #photo-help,.vocero-photo>.vocero-field,.vocero-photo>[data-photo-replace] {
    grid-column:2
  }
  .vocero-workspace-heading {
    gap:1rem
  }
  .vocero-workspace-heading h1 {
    font-size:2.5rem
  }
  .vocero-workspace-heading>.vocero-quiet {
    font-size:.8rem;
    padding:.6rem
  }
  .vocero-save {
    align-items:stretch;
    flex-direction:column
  }
  .vocero-footer {
    flex-wrap:wrap
  }
  .vocero-section-heading { flex-direction:column; gap:1rem }
  .vocero-progress-summary { text-align:left; justify-items:start }
  .vocero-levels { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .vocero-levels li:last-child { grid-column:span 2 }
  .vocero-progress-meta { flex-wrap:wrap; gap:1rem 2rem }
  .vocero-badge-panel { grid-template-columns:1fr; }
  .vocero-badge-preview { max-width:280px; justify-self:center }
  .vocero-video-grid { grid-template-columns:1fr; }
}
@media(max-width:480px) {
  .vocero-fields {
    grid-template-columns:1fr
  }
  .vocero-photo {
    display:block
  }
  .vocero-photo-frame {
    max-width:240px;
    margin:1.25rem auto
  }
  .vocero-header img {
    width:96px;
    height:58px
  }
  .vocero-header>a:last-child {
    font-size:.75rem
  }
  .vocero-photo h2 {
    max-width:none
  }
  .vocero-workspace-heading {
    flex-wrap:wrap
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important
  }
  .vocero-primary:hover {
    transform:none
  }
}

/* Public QR validation keeps the same Finados palette while remaining legible
   on a phone held by a visitor who is scanning a badge. */
.vocero-verification-page {
  background:
    radial-gradient(circle at 85% 10%, rgb(110 44 224 / .15), transparent 28rem),
    var(--canvas)
}
.vocero-verification-workspace {
  max-width:720px;
  display:grid;
  align-content:start;
  gap:1.25rem
}
.vocero-verification-workspace .vocero-access-intro {
  margin-bottom:.25rem
}
.vocero-verification-workspace .vocero-access-intro>p:last-child {
  max-width:52ch
}
.vocero-verification-card {
  position:relative;
  overflow:hidden;
  padding:2rem;
  border:1px solid rgb(36 17 70 / .15);
  border-radius:1.25rem;
  background:linear-gradient(145deg,#fffaf2 0%,#f4eada 64%,#ead9f4 100%);
  box-shadow:0 18px 50px rgb(36 17 70 / .12)
}
.vocero-verification-card::after {
  content:"";
  position:absolute;
  width:11rem;
  height:11rem;
  right:-4rem;
  top:-4rem;
  border-radius:50%;
  background:rgb(0 210 214 / .2)
}
.vocero-verification-card__stamp {
  position:absolute;
  top:1.75rem;
  right:1.75rem;
  z-index:1;
  display:grid;
  width:2.75rem;
  height:2.75rem;
  place-items:center;
  border-radius:50%;
  background:#35c277;
  color:#102a29;
  font-size:1.5rem;
  font-weight:900
}
.vocero-verification-card h2 {
  margin-bottom:.5rem;
  font-family:Anton,'Arial Narrow',sans-serif;
  font-size:clamp(2rem,6vw,3rem);
  font-weight:400;
  text-transform:uppercase;
  letter-spacing:.02em
}
.vocero-verification-card__name {
  margin-bottom:1.75rem;
  color:var(--ink);
  font-size:clamp(1.25rem,3vw,1.6rem);
  font-weight:800
}
.vocero-verification-card__details {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:1rem;
  margin-bottom:1.5rem
}
.vocero-verification-card__details>div {
  display:flex;
  min-height:5.5rem;
  flex-direction:column;
  justify-content:center;
  gap:.2rem;
  padding:1rem 1.1rem;
  border-radius:.8rem;
  background:#241146;
  color:#fff
}
.vocero-verification-card__details span {
  color:#bdeff0;
  font-size:.7rem;
  font-weight:750;
  letter-spacing:.12em;
  text-transform:uppercase
}
.vocero-verification-card__details strong {
  font-size:1.05rem
}
.vocero-verification-card__details strong[data-traffic-light="rojo"] { color:#ff8e97 }
.vocero-verification-card__details strong[data-traffic-light="amarillo"] { color:#ffc42e }
.vocero-verification-card__details strong[data-traffic-light="verde"] { color:#74e9ae }
.vocero-verification-card__note {
  max-width:58ch;
  color:var(--muted);
  font-size:.9rem
}
.vocero-verification-card .vocero-primary {
  width:max-content;
  margin-top:.5rem;
  text-decoration:none
}
.vocero-verification-card--error {
  background:linear-gradient(145deg,#fffaf2,#f9e3df)
}
.vocero-verification-card--error h2 {
  max-width:13ch
}
@media(max-width:520px) {
  .vocero-verification-workspace {
    width:calc(100% - 2rem);
    padding-top:2rem
  }
  .vocero-verification-card {
    padding:1.5rem
  }
  .vocero-verification-card__stamp {
    top:1.35rem;
    right:1.35rem
  }
  .vocero-verification-card__details {
    grid-template-columns:1fr
  }
  .vocero-verification-card .vocero-primary {
    width:100%;
    justify-content:center
  }
}