:root {
  color-scheme: light;
  --vb-bg: #f6f2eb;
  --vb-surface: #fffdf9;
  --vb-surface-soft: #eee7dd;
  --vb-text: #201d1a;
  --vb-text-muted: #706a63;
  --vb-border: #ded6cc;
  --vb-brand: #6c5545;
  --vb-brand-strong: #3c2f27;
  --vb-focus: #315c92;
  --vb-success: #367259;
  --vb-warning: #9a681d;
  --vb-error: #a33c3c;
  --vb-info: #315c92;
  --vb-space-1: .25rem;
  --vb-space-2: .5rem;
  --vb-space-3: .75rem;
  --vb-space-4: 1rem;
  --vb-space-5: 1.5rem;
  --vb-space-6: 2rem;
  --vb-space-7: 3rem;
  --vb-space-8: 4.5rem;
  --vb-radius-sm: .75rem;
  --vb-radius-md: 1rem;
  --vb-radius-lg: 1.125rem;
  --vb-shadow: 0 18px 50px rgba(53, 42, 34, .07);
  --vb-motion-fast: 160ms;
  --vb-motion-base: 260ms;
  --vb-font-ui: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --vb-font-editorial: "Iowan Old Style", "Palatino Linotype", Georgia, serif;
  font-family: var(--vb-font-ui);
  background: var(--vb-bg);
  color: var(--vb-text);
}

* { box-sizing: border-box; }
html { min-height: 100%; scroll-behavior: smooth; }
body { min-height: 100vh; margin: 0; background: var(--vb-bg); color: var(--vb-text); line-height: 1.55; }
button, input, select, textarea { font: inherit; }
button, a { -webkit-tap-highlight-color: transparent; }
a { color: inherit; text-decoration: none; }
:focus-visible { outline: 3px solid var(--vb-focus); outline-offset: 3px; }
h1, h2, h3, p { margin-top: 0; }
h1, .vb-hero__statement { font-family: var(--vb-font-editorial); font-weight: 500; letter-spacing: -.035em; }
.vb-sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0; }
.vb-skip { position: fixed; top: 1rem; left: 1rem; z-index: 100; transform: translateY(-200%); padding: .75rem 1rem; background: var(--vb-text); color: white; border-radius: var(--vb-radius-sm); }
.vb-skip:focus { transform: translateY(0); }

.vb-app { display: grid; grid-template-columns: 16rem minmax(0, 1fr); min-height: 100vh; }
.vb-sidebar { position: sticky; top: 0; height: 100vh; display: flex; flex-direction: column; padding: 2rem 1.5rem; border-right: 1px solid var(--vb-border); background: rgba(255,253,249,.76); backdrop-filter: blur(18px); }
.vb-brand { display: inline-flex; align-items: center; gap: .8rem; font-size: .77rem; font-weight: 600; letter-spacing: .16em; }
.vb-brand__mark { display: grid; place-items: center; width: 2.35rem; height: 2.35rem; border: 1px solid var(--vb-brand); border-radius: 50%; font-family: var(--vb-font-editorial); font-size: 1.1rem; letter-spacing: 0; color: var(--vb-brand-strong); }
.vb-nav-list { display: grid; gap: .35rem; margin-top: 4rem; }
.vb-nav-list a, .vb-nav-list > span { display: flex; align-items: center; gap: .8rem; min-height: 2.85rem; padding: .65rem .8rem; border-radius: var(--vb-radius-sm); color: var(--vb-text-muted); }
.vb-nav-list .is-current { background: var(--vb-surface-soft); color: var(--vb-text); font-weight: 600; }
.vb-nav-list .is-disabled { opacity: .5; }
.vb-sidebar__footer { display: flex; align-items: center; gap: .75rem; margin-top: auto; padding-top: 1.5rem; border-top: 1px solid var(--vb-border); }
.vb-sidebar__footer span:last-child { display: grid; }
.vb-sidebar__footer small { color: var(--vb-text-muted); }
.vb-avatar { display: grid; place-items: center; width: 2.5rem; height: 2.5rem; flex: 0 0 auto; border-radius: 50%; background: var(--vb-brand-strong); color: white; font-size: .82rem; }

.vb-main { width: min(100%, 90rem); margin-inline: auto; padding: 2rem clamp(1.5rem, 5vw, 5rem) 4rem; }
.vb-topbar { display: flex; justify-content: flex-end; align-items: center; min-height: 3rem; }
.vb-brand--mobile { display: none; }
.vb-topbar__profile { display: flex; align-items: center; gap: .75rem; font-size: .9rem; }
.vb-hero { padding: clamp(3rem, 8vh, 7rem) 0 clamp(2.5rem, 6vh, 5rem); }
.vb-eyebrow { margin-bottom: .75rem; color: var(--vb-brand); font-size: .72rem; font-weight: 600; letter-spacing: .16em; text-transform: uppercase; }
.vb-hero h1 { margin-bottom: 1rem; font-size: clamp(2.2rem, 5vw, 4.75rem); line-height: 1; }
.vb-hero__statement { max-width: 18ch; margin-bottom: 0; color: var(--vb-text-muted); font-size: clamp(1.4rem, 2.6vw, 2.35rem); line-height: 1.18; }

.vb-action-card { position: relative; display: grid; grid-template-columns: auto minmax(0,1fr) auto; align-items: end; gap: 1.5rem; min-height: 14rem; padding: clamp(1.5rem,4vw,3rem); overflow: hidden; border: 1px solid rgba(108,85,69,.25); border-radius: var(--vb-radius-lg); background: linear-gradient(135deg, #fffdfa 0%, #eee4d7 100%); box-shadow: var(--vb-shadow); }
.vb-action-card::after { content: ""; position: absolute; width: 22rem; height: 22rem; right: -8rem; top: -12rem; border: 1px solid rgba(108,85,69,.16); border-radius: 50%; }
.vb-action-card__spark { align-self: start; font-size: 2rem; color: var(--vb-brand); }
.vb-action-card h2 { margin-bottom: .5rem; font-family: var(--vb-font-editorial); font-size: clamp(1.8rem,3vw,3rem); font-weight: 500; }
.vb-action-card p:last-child { max-width: 36rem; margin-bottom: 0; color: var(--vb-text-muted); }
.vb-action-card button { position: relative; z-index: 1; display: flex; align-items: center; gap: 1rem; padding: .8rem 0; border: 0; border-bottom: 1px solid var(--vb-brand); background: transparent; color: var(--vb-brand-strong); cursor: not-allowed; opacity: .65; }
.vb-section { padding-top: var(--vb-space-8); }
.vb-section__header { display: flex; justify-content: space-between; align-items: end; gap: 1rem; margin-bottom: 1.5rem; }
.vb-section__header h2, .vb-page-header h1 { margin-bottom: 0; font-family: var(--vb-font-editorial); font-weight: 500; font-size: clamp(1.75rem,3vw,2.7rem); }
.vb-muted { color: var(--vb-text-muted); font-size: .85rem; }
.vb-empty { display: grid; grid-template-columns: minmax(13rem, 32%) 1fr; align-items: center; gap: clamp(1.5rem,4vw,4rem); padding: 1rem; border-top: 1px solid var(--vb-border); border-bottom: 1px solid var(--vb-border); }
.vb-empty__visual { aspect-ratio: 4/3; overflow: hidden; border-radius: var(--vb-radius-md); }
.vb-empty h3 { font-family: var(--vb-font-editorial); font-size: 1.55rem; font-weight: 500; }
.vb-empty p { max-width: 34rem; margin-bottom: 0; color: var(--vb-text-muted); }
.vb-powered { padding-top: 5rem; color: var(--vb-text-muted); font-size: .76rem; letter-spacing: .08em; text-align: center; }

.vb-login-page { overflow-x: hidden; }
.vb-login { display: grid; grid-template-columns: minmax(0,1.18fr) minmax(28rem,.82fr); min-height: 100vh; }
.vb-login__visual { position: relative; display: flex; flex-direction: column; justify-content: space-between; min-height: 100vh; padding: clamp(2rem,5vw,5rem); overflow: hidden; background: radial-gradient(circle at 70% 20%,rgba(255,255,255,.38),transparent 24%),linear-gradient(145deg,#c8b5a5 0%,#786458 48%,#2d2825 100%); color: white; }
.vb-login__visual::before { content: ""; position: absolute; inset: 12% 15% auto auto; width: min(32vw,32rem); aspect-ratio: 1; border: 1px solid rgba(255,255,255,.35); border-radius: 50%; }
.vb-login__visual span { position: relative; z-index: 1; align-self: end; margin-top: auto; margin-bottom: auto; font-family: var(--vb-font-editorial); font-size: clamp(3rem,8vw,8rem); line-height: .82; letter-spacing: -.06em; text-align: right; opacity: .78; }
.vb-login__visual small { position: relative; z-index: 1; font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; }
.vb-login__panel { display: grid; place-items: center; padding: clamp(2rem,5vw,5rem); background: var(--vb-surface); }
.vb-login__content { width: min(100%,29rem); }
.vb-login__heading { margin: clamp(4rem,10vh,8rem) 0 3rem; }
.vb-login__heading h1 { font-size: clamp(2.2rem,4vw,3.8rem); line-height: 1.08; }
.vb-login__form { display: grid; gap: .7rem; }
.vb-login__form label { margin-top: .65rem; font-size: .78rem; font-weight: 600; }
.vb-login__form input { min-height: 3.25rem; padding: .75rem 1rem; border: 1px solid var(--vb-border); border-radius: var(--vb-radius-sm); background: #fbf8f3; color: var(--vb-text); }
.vb-login__form .vb-button { margin-top: 1rem; }
.vb-form-note { color: var(--vb-text-muted); font-size: .74rem; }
.vb-login__powered { margin: 3rem 0 0; color: var(--vb-text-muted); font-size: .75rem; text-align: center; }

.vb-button { min-height: 2.9rem; padding: .7rem 1.1rem; border: 1px solid transparent; border-radius: var(--vb-radius-sm); transition: transform var(--vb-motion-fast), background var(--vb-motion-fast); cursor: pointer; }
.vb-button:not(:disabled):active { transform: translateY(1px); }
.vb-button--primary { background: var(--vb-brand-strong); color: white; }
.vb-button--secondary { border-color: var(--vb-border); background: var(--vb-surface); color: var(--vb-text); }
.vb-button:disabled { opacity: .45; cursor: not-allowed; }
.vb-card, .vb-image-card { border: 1px solid var(--vb-border); border-radius: var(--vb-radius-md); background: var(--vb-surface); box-shadow: 0 10px 30px rgba(53,42,34,.035); }
.vb-card { padding: 1.4rem; }
.vb-card h3, .vb-image-card h3 { margin-bottom: .4rem; font-family: var(--vb-font-editorial); font-weight: 500; }
.vb-card p, .vb-image-card p { margin-bottom: 0; color: var(--vb-text-muted); }
.vb-image-card { overflow: hidden; }
.vb-image-card__media { aspect-ratio: 4/3; }
.vb-image-card__copy { padding: 1.15rem; }
.vb-photo-placeholder { background: radial-gradient(circle at 35% 28%, rgba(255,255,255,.82) 0 8%, transparent 9%), linear-gradient(145deg,#d9cec1,#9b8879); }
.vb-tabs { display: flex; gap: 1.4rem; overflow-x: auto; border-bottom: 1px solid var(--vb-border); }
.vb-tabs button { min-height: 2.8rem; padding: .4rem 0; border: 0; border-bottom: 2px solid transparent; background: transparent; color: var(--vb-text-muted); white-space: nowrap; cursor: pointer; }
.vb-tabs button[aria-selected="true"] { border-color: var(--vb-brand); color: var(--vb-text); }
.vb-swatch-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; margin-top: 1.25rem; }
.vb-swatch { min-width: 0; overflow: hidden; padding: 0 0 .9rem; border: 1px solid var(--vb-border); border-radius: var(--vb-radius-md); background: var(--vb-surface); text-align: left; cursor: pointer; }
.vb-swatch.is-selected { border-color: var(--vb-brand-strong); box-shadow: 0 0 0 2px var(--vb-bg),0 0 0 4px var(--vb-brand); }
.vb-swatch__color { display: block; height: 6rem; margin-bottom: .8rem; background: var(--swatch); }
.vb-swatch > span:last-child { padding-inline: .85rem; }
.vb-meter { margin-block: 1.25rem; }
.vb-meter__header { display: flex; justify-content: space-between; margin-bottom: .55rem; font-size: .86rem; }
.vb-meter__track { height: .5rem; overflow: hidden; border-radius: 1rem; background: var(--vb-surface-soft); }
.vb-meter__track span { display: block; height: 100%; border-radius: inherit; background: var(--vb-brand); }
.vb-health { display: inline-flex; align-items: center; gap: .45rem; padding: .4rem .7rem; border: 1px solid var(--vb-border); border-radius: 2rem; background: var(--vb-surface); font-size: .78rem; }
.vb-health > span { width: .5rem; height: .5rem; border-radius: 50%; background: var(--vb-success); }
.vb-health--warning > span { background: var(--vb-warning); }
.vb-health--error > span { background: var(--vb-error); }
.vb-skeleton { width: 100%; height: 100%; min-height: 5rem; background: linear-gradient(100deg,#e8e1d8 20%,#f5f1eb 40%,#e8e1d8 60%); background-size: 220% 100%; animation: vb-shimmer 1.8s infinite linear; }
@keyframes vb-shimmer { to { background-position-x: -220%; } }

.vb-page-header { padding: 3rem 0; max-width: 45rem; }
.vb-page-header > p:last-child { color: var(--vb-text-muted); }
.vb-showcase { display: grid; gap: 1.5rem; }
.vb-showcase > section { padding: 1.5rem; border: 1px solid var(--vb-border); border-radius: var(--vb-radius-lg); background: rgba(255,253,249,.7); }
.vb-showcase h2 { font-family: var(--vb-font-editorial); font-weight: 500; }
.vb-row { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.vb-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 1rem; }
.vb-mobile-nav { display: none; }
.vb-sheet-backdrop { position: fixed; inset: 0; z-index: 70; background: rgba(32,29,26,.32); backdrop-filter: blur(2px); }
.vb-sheet { position: fixed; right: 1rem; bottom: 1rem; z-index: 80; width: min(28rem,calc(100% - 2rem)); padding: 1.25rem; border: 1px solid var(--vb-border); border-radius: var(--vb-radius-lg); background: var(--vb-surface); box-shadow: var(--vb-shadow); }
.vb-sheet__handle { display: none; width: 2.5rem; height: .25rem; margin: 0 auto 1rem; border-radius: 1rem; background: var(--vb-border); }
.vb-sheet__header { display: flex; justify-content: space-between; align-items: center; }
.vb-sheet__header h2 { margin-bottom: 0; font-family: var(--vb-font-editorial); font-weight: 500; }
.vb-sheet__header button { width: 2.75rem; height: 2.75rem; border: 0; background: transparent; font-size: 1.5rem; cursor: pointer; }
.vb-toast { position: fixed; right: 1.25rem; bottom: 1.25rem; z-index: 90; max-width: 24rem; padding: .9rem 1.1rem; border-radius: var(--vb-radius-sm); background: var(--vb-text); color: white; box-shadow: var(--vb-shadow); }

@media (max-width: 1100px) {
  .vb-app { grid-template-columns: 5rem minmax(0,1fr); }
  .vb-sidebar { align-items: center; padding-inline: .75rem; }
  .vb-brand > span:last-child, .vb-nav-list span:last-child, .vb-sidebar__footer span:last-child { display: none; }
  .vb-nav-list a, .vb-nav-list > span { justify-content: center; width: 3rem; }
  .vb-action-card { grid-template-columns: auto 1fr; }
  .vb-action-card button { grid-column: 2; justify-self: start; }
  .vb-login { grid-template-columns: minmax(0,.85fr) minmax(27rem,1.15fr); }
}

@media (max-width: 640px) {
  body { padding-bottom: calc(5.1rem + env(safe-area-inset-bottom)); }
  .vb-app { display: block; }
  .vb-sidebar { display: none; }
  .vb-main { padding: 1rem 1rem 3rem; }
  .vb-topbar { justify-content: space-between; }
  .vb-brand--mobile { display: inline-flex; }
  .vb-brand--mobile > span:last-child { display: inline; }
  .vb-topbar__profile > span:first-child { display: none; }
  .vb-hero { padding: 3.5rem 0 2.5rem; }
  .vb-hero h1 { font-size: clamp(2.55rem,13vw,3.8rem); }
  .vb-hero__statement { font-size: 1.45rem; }
  .vb-action-card { display: grid; grid-template-columns: 1fr auto; align-items: start; min-height: 17rem; padding: 1.35rem; }
  .vb-action-card__spark { grid-column: 1/-1; }
  .vb-action-card > div { align-self: end; }
  .vb-action-card button { grid-column: 2; align-self: end; width: 2.75rem; height: 2.75rem; justify-content: center; padding: 0; border: 1px solid var(--vb-brand); border-radius: 50%; }
  .vb-action-card button span:first-child { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0,0,0,0); }
  .vb-section { padding-top: 3.5rem; }
  .vb-section__header { align-items: start; }
  .vb-section__header .vb-muted { display: none; }
  .vb-empty { grid-template-columns: 1fr; padding: 0 0 1.5rem; }
  .vb-empty__visual { aspect-ratio: 16/9; }
  .vb-grid { grid-template-columns: 1fr; }
  .vb-swatch-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .vb-mobile-nav { position: fixed; inset: auto 0 0; z-index: 60; display: grid; grid-template-columns: repeat(4,1fr); align-items: end; min-height: calc(4.6rem + env(safe-area-inset-bottom)); padding: .45rem .5rem calc(.45rem + env(safe-area-inset-bottom)); border-top: 1px solid var(--vb-border); background: rgba(255,253,249,.94); backdrop-filter: blur(18px); }
  .vb-mobile-nav > * { display: grid; place-items: center; gap: .15rem; min-height: 3.5rem; border: 0; background: transparent; color: var(--vb-text-muted); }
  .vb-mobile-nav .is-current { color: var(--vb-text); }
  .vb-mobile-nav small { font-size: .67rem; }
  .vb-mobile-action span { display: grid; place-items: center; width: 2.55rem; height: 2.55rem; margin-top: -1.15rem; border-radius: 50%; background: var(--vb-brand-strong); color: white; font-size: 1.1rem; }
  .vb-mobile-action:disabled { opacity: .55; }
  .vb-sheet { inset: auto 0 0; width: 100%; padding-bottom: calc(1.25rem + env(safe-area-inset-bottom)); border-radius: var(--vb-radius-lg) var(--vb-radius-lg) 0 0; }
  .vb-sheet__handle { display: block; }
  .vb-toast { right: 1rem; bottom: calc(5.5rem + env(safe-area-inset-bottom)); left: 1rem; }
  .vb-login { display: block; }
  .vb-login__visual { display: none; }
  .vb-login__panel { min-height: 100vh; padding: 1.5rem; }
  .vb-login__heading { margin: 5rem 0 2.5rem; }
  .vb-login__heading h1 { font-size: 2.65rem; }
}

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

.vb-form-error{padding:1rem;border:1px solid #b85c5c;background:#fff3f1;color:#7d2929;border-radius:12px}.vb-flow-header{display:flex;justify-content:space-between;align-items:center}.vb-flow{max-width:1080px;margin:2rem auto}.vb-flow__steps{display:flex;gap:.6rem;margin-bottom:2.5rem}.vb-flow__steps span{padding:.55rem .8rem;border:1px solid var(--vb-border);border-radius:99px;color:var(--vb-text-muted)}.vb-flow__steps .is-active{color:var(--vb-text);border-color:var(--vb-brand)}.vb-upload,.vb-choice,.vb-complete{max-width:760px;margin:4rem auto;text-align:center}.vb-upload h1,.vb-choice h1,.vb-confirm h1,.vb-complete h1{font-family:var(--vb-font-display);font-size:clamp(2.4rem,6vw,5rem);font-weight:400}.vb-upload form{display:grid;gap:1rem;max-width:440px;margin:2rem auto}.vb-file{display:grid;place-items:center;min-height:14rem;border:1px dashed var(--vb-brand);border-radius:20px;background:var(--vb-surface)}.vb-file input,.vb-link-button input{position:absolute;width:1px;height:1px;overflow:hidden}.vb-photo-preview{display:grid;grid-template-columns:minmax(240px,420px) 1fr;gap:1.5rem;align-items:start}.vb-photo-preview img,.vb-confirm img{width:100%;max-height:620px;object-fit:cover;border-radius:24px}.vb-photo-preview form{display:grid;gap:.8rem}.vb-link-button{cursor:pointer;text-decoration:underline}.vb-choice-types{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:2rem 0}.vb-choice-types a,.vb-catalog__item{padding:1.4rem;border:1px solid var(--vb-border);border-radius:16px;background:var(--vb-surface)}.vb-catalog{display:grid;grid-template-columns:repeat(3,1fr);gap:.8rem;text-align:left}.vb-catalog__item{display:grid;gap:.25rem;cursor:pointer}.vb-catalog__item:has(input:checked){border-color:var(--vb-brand-strong);box-shadow:0 0 0 2px var(--vb-brand)}.vb-catalog .vb-button{grid-column:1/-1}.vb-confirm{display:grid;grid-template-columns:1fr 1fr;gap:3rem;align-items:center}.vb-complete>span{display:grid;place-items:center;width:4rem;height:4rem;margin:auto;border-radius:50%;background:var(--vb-brand);font-size:2rem}.vb-complete .vb-button{display:inline-flex;margin-top:1rem}
@media(max-width:720px){.vb-flow{margin-top:1rem}.vb-photo-preview,.vb-confirm{grid-template-columns:1fr}.vb-choice-types{grid-template-columns:1fr}.vb-catalog{grid-template-columns:1fr 1fr}.vb-upload,.vb-choice,.vb-complete{margin:2rem auto}.vb-flow__steps{overflow:auto}.vb-photo-preview img{max-height:55vh}}
.vb-upload__requirements{color:var(--vb-text-muted)}.vb-file{position:relative;overflow:hidden;padding:1rem;transition:border-color var(--vb-motion-base),background var(--vb-motion-base)}.vb-file:hover,.vb-file:focus-within{border-color:var(--vb-brand-strong);background:#fff}.vb-file.has-photo{border-style:solid}.vb-file__empty,.vb-file__selected{width:100%}.vb-file__empty{display:grid;gap:.5rem}.vb-file__selected{position:relative;display:grid;gap:.45rem}.vb-file__selected[hidden]{display:none}.vb-file__selected img{width:100%;height:min(46vh,22rem);object-fit:cover;border-radius:14px;background:var(--vb-border)}.vb-file__selected strong{font-size:1.05rem}.vb-file small{color:var(--vb-text-muted)}.vb-photo-actions{display:grid;width:100%;gap:.65rem;margin-top:1rem}.vb-photo-source{display:flex;justify-content:center;align-items:center;min-height:3rem;padding:.75rem 1rem;border:1px solid var(--vb-brand-strong);border-radius:999px;background:var(--vb-brand-strong);color:#fff;cursor:pointer;font-weight:700}.vb-photo-source--camera{background:transparent;color:var(--vb-text)}.vb-photo-source:focus-within{outline:3px solid color-mix(in srgb,var(--vb-brand-strong) 35%,transparent);outline-offset:2px}.vb-file--compact{min-height:0}.vb-file--compact .vb-file__selected img{height:min(32vh,16rem)}.vb-upload [data-photo-submit]:disabled,.vb-photo-preview [data-photo-submit]:disabled{cursor:not-allowed;opacity:.45;filter:saturate(.35)}
