.skip-link { position: fixed; z-index: 1000; top: 8px; left: 8px; transform: translateY(-150%); padding: 10px 14px; border-radius: var(--radius-sm); background: var(--charcoal); color: white; }
.skip-link:focus { transform: none; }
.sr-only { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }
.app-root, .app-frame { min-height: 100vh; min-height: 100dvh; }
.app-shell {
  width: min(100%, var(--content-max));
  min-height: 100vh;
  min-height: 100dvh;
  margin: 0 auto;
  padding: calc(var(--safe-top) + 14px) max(16px, var(--safe-right)) calc(var(--nav-height) + var(--safe-bottom) + 34px) max(16px, var(--safe-left));
}
.app-main, .screen-section { min-width: 0; }
.screen-stack { display: grid; gap: var(--space-6); }
.top-bar { display: flex; align-items: center; justify-content: space-between; gap: 16px; min-height: 56px; margin-bottom: 22px; }
.brand-lockup { width: 118px; height: auto; }
.top-actions { display: flex; align-items: center; gap: 8px; }
.avatar-button { display: grid; place-items: center; width: 46px; height: 46px; overflow: hidden; border: 1px solid rgb(123 63 92 / 0.16); border-radius: 50%; background: var(--rose-soft); color: var(--wine-strong); font-weight: 800; text-decoration: none; }
.avatar-button img { width: 100%; height: 100%; object-fit: cover; }
.screen-heading { display: grid; gap: 7px; margin: 0 0 20px; }
.eyebrow { margin: 0; color: var(--wine); font-size: 0.72rem; font-weight: 800; letter-spacing: 0.12em; text-transform: uppercase; }
h1, h2, h3, p { overflow-wrap: anywhere; }
h1, h2, h3 { font-family: Georgia, "Times New Roman", serif; }
h1 { margin: 0; font-size: clamp(2rem, 8vw, 3.2rem); line-height: 0.98; letter-spacing: -0.035em; }
h2 { margin: 0; font-size: clamp(1.45rem, 5vw, 2rem); line-height: 1.08; }
h3 { margin: 0; font-size: 1.15rem; line-height: 1.18; }
p { line-height: 1.55; }
.lead { margin: 0; color: var(--ink-soft); font-size: 1.02rem; }
.muted { color: var(--ink-soft); }
.caption { margin: 0; color: var(--ink-soft); font-size: 0.82rem; line-height: 1.4; }
.status-line { display: inline-flex; align-items: center; gap: 7px; margin: 0; color: var(--ink-soft); font-size: 0.86rem; }
.status-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--success); }
.status-dot.offline { background: var(--warning); }

.button, button.button { display: inline-flex; min-height: var(--touch); align-items: center; justify-content: center; gap: 9px; padding: 11px 18px; border: 1px solid transparent; border-radius: var(--radius-pill); background: var(--wine); color: white; font-weight: 750; line-height: 1.2; text-align: center; text-decoration: none; cursor: pointer; transition: transform 160ms ease, background 160ms ease, box-shadow 160ms ease; }
.button:hover { background: var(--wine-strong); }
.button:active { transform: translateY(1px); }
.button.secondary { border-color: rgb(123 63 92 / 0.24); background: transparent; color: var(--wine); }
.button.secondary:hover { background: rgb(123 63 92 / 0.07); }
.button.ghost { background: transparent; color: var(--charcoal); }
.button.danger { border-color: rgb(155 62 80 / 0.25); background: transparent; color: var(--danger); }
.button.compact { min-height: 40px; padding: 8px 14px; font-size: 0.9rem; }
.button.full { width: 100%; }
.button[disabled], .button[aria-disabled="true"] { opacity: 0.48; cursor: not-allowed; transform: none; }
.icon-button { display: inline-grid; width: var(--touch); height: var(--touch); flex: 0 0 var(--touch); place-items: center; border: 1px solid rgb(123 63 92 / 0.14); border-radius: 50%; background: rgb(255 252 249 / 0.9); cursor: pointer; }
.button svg, .icon-button svg, .nav-icon svg { width: 20px; height: 20px; }
.actions { display: flex; flex-wrap: wrap; gap: 10px; }
.actions.stack { flex-direction: column; }

.card { border: 1px solid rgb(123 63 92 / 0.10); border-radius: var(--radius-lg); background: rgb(255 252 249 / 0.86); box-shadow: var(--shadow-soft); }
.card-pad { padding: 20px; }
.card-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; }
.chip, button.chip { display: inline-flex; min-height: 40px; align-items: center; justify-content: center; padding: 8px 15px; border: 1px solid rgb(123 63 92 / 0.18); border-radius: var(--radius-pill); background: rgb(255 252 249 / 0.78); color: var(--charcoal); font-weight: 650; white-space: nowrap; cursor: pointer; }
.chip[aria-pressed="true"], .chip.selected { border-color: var(--wine); background: var(--wine); color: white; }
.chip[disabled] { opacity: 0.48; cursor: not-allowed; }
.filter-rail, .carousel-rail { scrollbar-width: none; overscroll-behavior-inline: contain; -webkit-overflow-scrolling: touch; }
.filter-rail::-webkit-scrollbar, .carousel-rail::-webkit-scrollbar { display: none; }
.filter-rail { display: flex; gap: 8px; max-width: 100%; overflow-x: auto; padding: 3px 1px 8px; }
.carousel-wrap { min-width: 0; }
.carousel-heading { display: flex; align-items: end; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.carousel-controls { display: none; gap: 6px; }
.carousel-rail { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(248px, 86%); gap: 14px; max-width: 100%; overflow-x: auto; padding: 4px 2px 18px; scroll-padding-inline: 2px; scroll-snap-type: inline mandatory; }
.carousel-item { min-width: 0; scroll-snap-align: start; }

.bottom-nav { position: fixed; z-index: 30; right: 0; bottom: 0; left: 0; display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); min-height: calc(var(--nav-height) + var(--safe-bottom)); padding: 7px max(8px, var(--safe-right)) calc(7px + var(--safe-bottom)) max(8px, var(--safe-left)); border-top: 1px solid rgb(123 63 92 / 0.11); background: rgb(255 252 249 / 0.92); box-shadow: 0 -12px 32px rgb(81 48 57 / 0.08); backdrop-filter: blur(18px); }
.nav-link { display: grid; min-width: 0; min-height: 54px; place-items: center; align-content: center; gap: 3px; border: 0; background: transparent; color: var(--ink-soft); font-size: 0.7rem; font-weight: 650; text-decoration: none; cursor: pointer; }
.nav-link[aria-current="page"] { color: var(--wine); }
.nav-icon { display: grid; place-items: center; width: 24px; height: 24px; }
.nav-plus { width: 54px; height: 54px; margin-top: -23px; border: 5px solid var(--ivory); border-radius: 50%; background: var(--wine); color: white; box-shadow: 0 8px 22px rgb(123 63 92 / 0.28); }
.nav-plus .nav-icon svg { width: 25px; height: 25px; }

.sheet-backdrop, .modal-backdrop { position: fixed; z-index: 60; inset: 0; display: grid; align-items: end; padding-top: var(--safe-top); background: rgb(44 44 44 / 0.34); backdrop-filter: blur(4px); }
.bottom-sheet { width: min(100%, 560px); max-height: min(86dvh, 760px); margin: 0 auto; overflow-y: auto; padding: 10px max(20px, var(--safe-right)) calc(22px + var(--safe-bottom)) max(20px, var(--safe-left)); border-radius: 30px 30px 0 0; background: var(--ivory); box-shadow: var(--shadow-raised); }
.sheet-handle { width: 42px; height: 5px; margin: 0 auto 16px; border-radius: 10px; background: var(--sand); }
.sheet-title { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 16px; }
.action-list { display: grid; gap: 9px; }
.action-row { display: grid; grid-template-columns: 44px 1fr auto; align-items: center; gap: 13px; min-height: 66px; padding: 10px; border: 1px solid rgb(123 63 92 / 0.10); border-radius: var(--radius-md); background: var(--white); color: inherit; text-align: left; cursor: pointer; }
.action-row[disabled] { opacity: 0.55; cursor: not-allowed; }
.action-row-icon { display: grid; width: 44px; height: 44px; place-items: center; border-radius: 50%; background: var(--rose-soft); color: var(--wine); }
.action-row strong, .action-row small { display: block; }
.action-row small { margin-top: 3px; color: var(--ink-soft); }
.modal-backdrop { align-items: center; padding: max(16px, var(--safe-top)) max(16px, var(--safe-right)) max(16px, var(--safe-bottom)) max(16px, var(--safe-left)); }
.modal { width: min(100%, 620px); max-height: 90dvh; margin: auto; overflow: auto; padding: 22px; border-radius: var(--radius-lg); background: var(--ivory); box-shadow: var(--shadow-raised); }
.toast-region { position: fixed; z-index: 100; right: 16px; bottom: calc(var(--nav-height) + var(--safe-bottom) + 16px); left: 16px; display: grid; justify-items: center; pointer-events: none; }
.toast { width: min(100%, 480px); padding: 13px 16px; border-radius: var(--radius-md); background: var(--charcoal); color: white; box-shadow: var(--shadow-raised); }

.form-field { display: grid; gap: 7px; }
.form-field > label, .field-label { color: var(--charcoal); font-size: 0.9rem; font-weight: 700; }
.input, .select, .textarea { width: 100%; min-height: var(--touch); padding: 11px 14px; border: 1px solid rgb(123 63 92 / 0.22); border-radius: var(--radius-md); background: var(--white); color: var(--charcoal); }
.textarea { min-height: 100px; resize: vertical; }
.field-hint, .field-error { margin: 0; font-size: 0.8rem; }
.field-hint { color: var(--ink-soft); }
.field-error { color: var(--danger); }
.error-summary { padding: 14px; border: 1px solid rgb(155 62 80 / 0.25); border-radius: var(--radius-md); background: rgb(155 62 80 / 0.07); color: var(--danger); }
.boot-screen { display: grid; min-height: 100vh; min-height: 100dvh; place-items: center; align-content: center; gap: 20px; padding: 24px; text-align: center; }
.loader { width: 30px; height: 30px; border: 3px solid var(--sand); border-top-color: var(--wine); border-radius: 50%; animation: spin 900ms linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
.skeleton { overflow: hidden; border-radius: var(--radius-md); background: linear-gradient(90deg, var(--sand-soft), var(--white), var(--sand-soft)); background-size: 200% 100%; animation: shimmer 1.2s linear infinite; }
@keyframes shimmer { to { background-position: -200% 0; } }

.owner-test-banner{padding:8px 14px;background:#5f2638;color:#fff;text-align:center;font:500 12px/1.4 system-ui;position:relative;z-index:100}
.shop-coverage{padding:14px 18px;background:var(--surface-soft,#f3eae7);border-radius:14px;font-size:14px;line-height:1.6;margin-bottom:20px}
.shop-forms,.shop-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;margin:20px 0}
.shop-product{overflow:hidden}.shop-product>img{display:block;width:100%;height:360px;object-fit:contain;background:#eee9e5}
.shop-product h2{font-size:22px;line-height:1.25}.shop-price{font-size:26px;font-weight:650;margin:0}
.shop-product .caption{font-size:14px;line-height:1.5}.shop-product .button{width:100%}
.shop-selection>img{width:180px;max-height:240px;object-fit:contain}.shop-selection{scroll-margin-top:25px}
.shop-tryons{margin:24px 0}.shop-tryon{max-width:760px}.shop-tryon-result{display:block;width:100%;max-width:384px;max-height:690px;object-fit:contain;align-self:center;border-radius:14px}.shop-tryon h3{font-size:22px;line-height:1.3;margin:0}.shop-tryon p{overflow-wrap:anywhere}
@media(max-width:600px){.shop-forms,.shop-grid{grid-template-columns:1fr}.shop-product>img{height:380px}.shop-forms .input{font-size:16px}.shop-grid{gap:24px}}