@font-face { font-family: SomiLora; src: url('/assets/crm-lora-500.ttf') format('truetype'); font-weight: 500; font-display: swap; }
@font-face { font-family: SomiManrope; src: url('/assets/crm-manrope-500.ttf') format('truetype'); font-weight: 500; font-display: swap; }
.somi-crm { font-family: var(--somi-customer-font); color: #292d28; letter-spacing: 0; }
.crm-compact-host { position: absolute; top: 154px; left: 20px; right: 20px; display: flex; justify-content: center; }
.somi-crm .membership-card { --card-text: #544830; --card-soft: #776a51; --card-border: #cebea5; position: absolute; left: 20px; top: calc(22px + env(safe-area-inset-top,0px)); width: calc(100% - 40px); aspect-ratio: 1.586; padding: 0; overflow: hidden; border: 1px solid var(--card-border); border-radius: 8px; background: linear-gradient(115deg,#ddccb0,#ece1cd 42%,#f2e9d8 53%,#d1bea0); color: var(--card-text); box-shadow: inset 0 1px 0 #fffa,0 3px 9px #58462714; text-align: center; transition: width 520ms cubic-bezier(.22,1,.36,1),height 520ms cubic-bezier(.22,1,.36,1),top 520ms cubic-bezier(.22,1,.36,1),left 520ms cubic-bezier(.22,1,.36,1),box-shadow 520ms; }
.somi-crm .membership-card.silver, .somi-crm .benefit-card.silver { --card-text:#3d4b53; --card-soft:#626f79; --card-border:#b0bdc5; background:linear-gradient(115deg,#b7c1c7,#d9e1e5 36%,#f2f5f6 54%,#b4bfc6 77%,#c7d0d5); }
.somi-crm .membership-card.gold, .somi-crm .benefit-card.gold { --card-text:#564016; --card-soft:#82662d; --card-border:#b99b53; background:linear-gradient(115deg,#c2a05b,#ddc183 32%,#f4dfa1 53%,#c6a353 77%,#dec183); }
.somi-crm .membership-card.diamond, .somi-crm .benefit-card.diamond { --card-text:#234146; --card-soft:#456269; --card-border:#95b2b8; background:linear-gradient(118deg,#a2bcc0,#e2f0ef 22%,#fbffff 40%,#bddee0 58%,#eefafa 74%,#90b2b7); }
.somi-crm .membership-card::before, .somi-crm .benefit-card::before { content:''; position:absolute; inset:0; background:repeating-linear-gradient(110deg,#fff1 0 1px,transparent 1px 4px); pointer-events:none; }
.somi-crm .membership-card.diamond::before { background:linear-gradient(32deg,transparent 55%,#fff4 55.2%,transparent 70%),linear-gradient(147deg,transparent 39%,#fff4 39.2%,transparent 55%),repeating-linear-gradient(110deg,#fff1 0 1px,transparent 1px 4px); }
.somi-crm .membership-card.crm-compact { position:relative; top:auto; left:auto; width:210px; max-width:100%; height:46px; aspect-ratio:auto; pointer-events:auto; transition:none; box-shadow:inset 0 1px 0 #fffa,0 3px 9px #58462714; }
.somi-crm .membership-card:disabled { opacity: .75; }
.somi-crm .membership-card { outline:none; -webkit-tap-highlight-color:transparent; }
.somi-crm .membership-card:focus-visible { outline:2px solid var(--card-soft); outline-offset:3px; }
.somi-crm .membership-compact-window { position:absolute; top:50%; left:14px; right:14px; height:28px; transform:translateY(-50%); overflow:hidden; }
.somi-crm .membership-compact-track { display:block; animation:crm-label-scroll 12s infinite; }
.somi-crm .membership-compact-slide { display:block; height:28px; line-height:28px; text-align:center; font-family:SomiLora,Georgia,serif; font-size:19px; font-weight:500; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
@keyframes crm-label-scroll { 0%,38% { transform:translateY(0); } 46%,88% { transform:translateY(-28px); } 96%,100% { transform:translateY(-56px); } }
.crm-card-placeholder { display:block; flex-shrink:0; }
.crm-layer { position:fixed; inset:0; z-index:110; display:flex; justify-content:center; align-items:flex-start; }
body.crm-membership-open #modal-root { position:relative; z-index:120; }
body.crm-membership-open { overflow:hidden; }
body.crm-membership-open .crm-compact-host { visibility:hidden; }
.crm-scrim { position:absolute; inset:0; background:#262a351f; -webkit-backdrop-filter:blur(6px); backdrop-filter:blur(6px); opacity:0; transition:opacity 420ms; }
.crm-layer.is-open .crm-scrim { opacity:1; }
.crm-surface { position:relative; width:min(430px,100%); height:min(844px,100vh); height:min(844px,100svh); }
.crm-layer .membership-card { height:calc((min(430px,100vw) - 40px) / 1.586); }
.crm-layer.is-open .membership-card { box-shadow:inset 0 1px 0 #fff6,0 16px 34px #3f342e2e; }
.crm-layer .membership-compact-window { opacity:1; transition:opacity 120ms; }
.crm-layer.is-open .membership-compact-window { opacity:0; }
.crm-layer .membership-compact-track { animation:none; transform:var(--crm-frozen-label); }
.crm-layer .membership-card::after { content:''; position:absolute; inset:-100% -50%; background:linear-gradient(110deg,transparent 38%,#fff4 47%,#fff6 50%,transparent 60%); transform:translateX(-60%); pointer-events:none; }
.crm-layer.is-open .membership-card::after { animation:crm-card-shine 1250ms ease-in-out; }
@keyframes crm-card-shine { to { transform:translateX(60%); } }
.somi-crm .membership-expanded-title { position:absolute; top:24px; left:117px; right:23px; font-family:SomiLora,Georgia,serif; font-size:24px; line-height:1.3; font-weight:500; text-align:right; opacity:0; visibility:hidden; transition:opacity 180ms,visibility 180ms; }
.somi-crm .membership-details { position:absolute; inset:0; display:block; opacity:0; visibility:hidden; transition:opacity 180ms,visibility 180ms; }
.crm-layer.is-open .membership-expanded-title, .crm-layer.is-open .membership-details { opacity:1; visibility:visible; transition-delay:140ms; }
.somi-crm .card-logo { position:absolute; left:21px; top:20px; width:72px; height:72px; filter:drop-shadow(1px 1.2px .4px #fffc) drop-shadow(-.8px -1px .6px #2c22146b); }
.somi-crm .card-logo::before { content:''; position:absolute; inset:0; background:linear-gradient(155deg,var(--card-text),var(--card-border) 70%,var(--card-text)); background:linear-gradient(155deg,color-mix(in srgb,var(--card-text),#000 22%),color-mix(in srgb,var(--card-border),#fff 15%) 70%,var(--card-text)); -webkit-mask-image:url('/assets/crm-monogram-mask.svg'); mask-image:url('/assets/crm-monogram-mask.svg'); mask-mode:alpha; -webkit-mask-size:100% 100%; mask-size:100% 100%; -webkit-mask-position:center; mask-position:center; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; }
.somi-crm .diamond .card-logo { height:77px; background:url('/assets/crm-diamond-monogram.png') center / 190% auto no-repeat; filter:drop-shadow(0 1px 1px #25484e42); }
.somi-crm .diamond .card-logo::before { display:none; }
.somi-crm .card-holder { position:absolute; left:23px; bottom:31px; display:grid; gap:6px; max-width:calc(100% - 152px); text-align:left; }
.somi-crm .card-holder small { font-size:10px; color:var(--card-soft); white-space:nowrap; }
.somi-crm .card-holder strong { display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; font-family:SomiLora,Georgia,serif; font-weight:500; font-size:17px; line-height:1.3; overflow-wrap:anywhere; }
.somi-crm .card-count { position:absolute; right:23px; bottom:29px; display:grid; justify-items:center; width:88px; text-align:center; gap:5px; }
.somi-crm .card-count strong { width:100%; font-family:SomiManrope,Nunito,sans-serif; font-weight:500; font-size:36px; font-variant-numeric:lining-nums tabular-nums; line-height:1; text-align:center; }
.somi-crm .card-count small { font-size:9px; color:var(--card-soft); white-space:nowrap; text-align:center; }
.somi-crm .card-bottom-rule { position:absolute; left:23px; right:23px; bottom:15px; border-top:1px solid var(--card-border); opacity:.65; }
.somi-crm .membership-content { position:absolute; top:calc(var(--crm-expanded-top,22px) + var(--crm-expanded-height,246px) + 10px); bottom:0; left:0; right:0; overflow-y:auto; overscroll-behavior:contain; scrollbar-width:none; padding:8px 20px calc(26px + env(safe-area-inset-bottom,0px)); opacity:0; visibility:hidden; transition:opacity 180ms,visibility 180ms; }
.somi-crm.is-open .membership-content { opacity:1; visibility:visible; transition-delay:240ms; }
.somi-crm .membership-content::-webkit-scrollbar { display:none; }
.somi-crm .membership-progress { width:100%; color:#3d3e34; }
.somi-crm .progress-heading { display:flex; align-items:center; justify-content:center; gap:5px; margin:0 0 21px; font-size:15px; font-weight:600; line-height:1.4; text-align:center; }
.somi-crm .progress-heading strong { font-family:SomiManrope,sans-serif; font-size:17px; font-weight:500; }
.somi-crm .progress-rail { --tier-spectrum:linear-gradient(90deg,#fffdf6,#efe8d8 18%,#bfcbd0 29%,#f5f8fa 36%,#b6c1c7 44%,#b7984c 56%,#ffe1a0 66%,#d6b362 74%,#92c2df 86%,#d9f3ff); position:relative; height:10px; margin:0 28px; border-radius:8px; background:#e9e7e1; box-shadow:inset 0 1px 3px #393b2e26,0 0 8px #fff8; }
.somi-crm .membership-progress.silver .progress-rail { --tier-spectrum:linear-gradient(90deg,#c2cdd3,#f5f8fa 18%,#b8c4cb 30%,#d3b263 46%,#ffe1a0 57%,#d6b362 66%,#92c2df 85%,#d9f3ff); }
.somi-crm .membership-progress.gold .progress-rail { --tier-spectrum:linear-gradient(90deg,#d3b263,#ffe1a0 20%,#d6b362 38%,#a3cddd 65%,#d9f3ff 86%,#92c2df); --diamond-start:55%; }
.somi-crm .membership-progress.diamond .progress-rail { --tier-spectrum:linear-gradient(90deg,#92c2df,#e5f7ff 35%,#addce9 65%,#d9f3ff); --diamond-start:0%; }
.somi-crm .progress-rail::before { content:''; position:absolute; inset:0; border-radius:inherit; background:var(--tier-spectrum); opacity:.25; }
.somi-crm .progress-fill { position:absolute; inset:0; height:10px; width:100%; border-radius:inherit; background:var(--tier-spectrum); box-shadow:inset 0 1px 0 #fffc,inset 0 -1px 0 #767d7522; clip-path:inset(0 calc(100% - var(--progress)) 0 0 round 8px); overflow:hidden; }
.somi-crm .progress-fill::before { content:''; position:absolute; top:0; bottom:0; left:var(--diamond-start,75%); right:0; background-image:radial-gradient(1px 1px at 3px 3px,#fff 75%,transparent),radial-gradient(.7px .7px at 8px 6px,#e1f8ff 75%,transparent); background-size:11px 9px,13px 8px; opacity:.8; }
.somi-crm .progress-fill::after { content:''; position:absolute; inset:0; background:linear-gradient(105deg,transparent 25%,#fff9 45%,transparent 65%); transform:translateX(-100%); animation:crm-progress-shine 3.2s ease-in-out infinite; }
@keyframes crm-progress-shine { 70%,100% { transform:translateX(100%); } }
.somi-crm .progress-stop { position:absolute; top:50%; width:10px; height:10px; border-radius:50%; border:1.5px solid #f7f6ef; background:#bec0b7; transform:translate(-50%,-50%); box-shadow:0 1px 3px #0002; }
.somi-crm .progress-stop.is-reached { background:#f7f6ef; box-shadow:0 0 7px #fff9; }
.somi-crm .progress-tiers { position:relative; height:42px; margin:13px 28px 0; }
.somi-crm .progress-tier { position:absolute; top:0; display:flex; flex-direction:column; align-items:center; gap:4px; transform:translateX(-50%); text-align:center; color:#6f7165; white-space:nowrap; }
.somi-crm .progress-tier strong, .somi-crm .progress-tier small { font-size:11px; }
.somi-crm .progress-tier.is-current { color:#343d2e; }
.somi-crm .membership-benefits { margin-top:27px; }
.somi-crm .membership-benefits h2 { margin:0 0 13px; font-size:13px; font-weight:700; color:#3a3e32; }
.somi-crm .benefit-carousel { display:flex; gap:12px; margin:0 -20px; padding:0 20px 12px; overflow-x:auto; scroll-snap-type:x mandatory; scroll-padding-inline:20px; scrollbar-width:none; }
.somi-crm .benefit-carousel::-webkit-scrollbar { display:none; }
.somi-crm .membership-offer { flex:0 0 254px; min-width:0; scroll-snap-align:start; }
.somi-crm .benefit-card { display:block; position:relative; width:100%; height:182px; padding:17px; overflow:hidden; border:1px solid var(--card-border,#c8b89b); border-radius:8px; background:linear-gradient(120deg,#d8c6a7,#f2e8d4 58%,#d6c3a1); color:var(--card-text,#544830); text-align:left; }
.somi-crm .benefit-top { position:relative; display:flex; justify-content:space-between; gap:8px; align-items:center; font-size:9px; }
.somi-crm .benefit-top strong { font-family:SomiManrope,sans-serif; font-size:11px; font-weight:500; }
.somi-crm .discount-badge { display:inline-flex; align-items:center; justify-content:center; min-height:23px; padding:3px 9px; border-radius:20px; border:1px solid color-mix(in srgb,var(--card-text,#49623d),transparent 65%); background:#fff7; font-weight:500; font-size:11px; line-height:1.2; white-space:nowrap; }
.somi-crm .benefit-name { position:relative; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2; overflow:hidden; overflow-wrap:anywhere; height:47px; margin:11px 0 4px; font-family:SomiLora,Georgia,serif; font-size:18px; line-height:1.3; font-weight:500; }
.somi-crm .benefit-meta { position:relative; display:block; margin:0; font-size:11px; line-height:1.6; }
.somi-crm .benefit-meta > span { color:var(--card-soft,#736449); }
.somi-crm .benefit-price { position:relative; display:flex; align-items:baseline; gap:10px; margin-top:13px; }
.somi-crm .benefit-price > strong { font-family:SomiManrope,sans-serif; font-weight:500; font-size:22px; line-height:1.2; }
.somi-crm .benefit-price small { font-size:9px; }
.somi-crm .benefit-price s { font-size:10px; opacity:.6; }
.somi-crm .is-locked .benefit-card { filter:saturate(.6); opacity:.8; }
.somi-crm .benefit-lock { position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); opacity:.46; filter:drop-shadow(0 1px 1px #fff9); pointer-events:none; }
.somi-crm .benefit-lock svg { display:block; width:48px; height:48px; stroke-width:1.7; fill:#fff5; }
.somi-crm .benefit-access { margin:9px 0 0; font-size:11px; text-align:center; color:#515749; font-weight:600; }
.somi-crm .no-membership-offers { font-size:12px; color:#53594c; }
.crm-setting { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:14px 0; border-bottom:1px solid #e4ded5; font-size:13px; }
.crm-setting > span { display:grid; gap:6px; color:#78756d; font-size:11px; }
.crm-setting input { width:100px; min-width:0; text-align:right; padding:8px; }
.crm-targeting { margin:16px 0; border:0; border-top:1px solid #ded8cf; padding:12px 0; }
.crm-targeting legend { padding-right:8px; color:#64765b; font-size:13px; }
.crm-targeting label { display:flex; align-items:center; gap:10px; min-height:44px; border-bottom:1px solid #e4ded5; font-size:13px; }
.crm-targeting input { width:16px; height:16px; accent-color:#738267; }
.promotion-settings-box .promotion-branches .popup-ad-audience-option:first-of-type { grid-column:auto; }
.promotion-settings-box .field, .promotion-settings-box .field-row { min-width:0; }
.promotion-settings-box .promotion-period-row input { display:block; min-width:0; max-width:100%; width:100%; box-sizing:border-box; overflow:hidden; padding-inline:8px; }
.promotion-settings-box .promotion-period-row input::-webkit-date-and-time-value { min-width:0; text-align:left; }
.promotion-settings-box .promotion-period-row input::-webkit-datetime-edit { min-width:0; padding:0; }
.crm-purchase-card { min-height:145px; color:var(--card-text); }
.crm-purchase-card .benefit-meta { margin-bottom:12px; }
.somi-crm .benefit-card.crm-private-privilege { display:flex; flex-direction:column; align-items:stretch; gap:0; height:182px; min-height:182px; padding:17px; }
.somi-crm .benefit-private-heading { position:relative; display:flex; align-items:baseline; justify-content:space-between; gap:8px; width:100%; min-width:0; font-size:22px; line-height:1.25; }
.somi-crm .benefit-tier-name { display:block; min-width:0; margin:0; font-family:var(--somi-display-font,SomiLora,Georgia,serif); font-size:inherit; font-weight:500; line-height:inherit; overflow-wrap:anywhere; }
.somi-crm .benefit-privilege-name { position:relative; display:block; margin:8px 0 0; font-size:14px; line-height:1.3; }
.somi-crm .benefit-privilege-prices { position:relative; display:grid; gap:4px; margin-top:auto; }
.somi-crm .benefit-privilege-prices > s, .somi-crm .benefit-privilege-prices > strong { font-family:var(--somi-customer-font); font-size:18px; font-weight:500; line-height:1.3; overflow-wrap:anywhere; }
.somi-crm .benefit-privilege-prices > s { color:var(--card-soft); }
.somi-crm .benefit-privilege-prices > strong { color:#cf3f4d; }
.app-shell .customer-package-carousel-group-p .customer-package-carousel { grid-auto-columns:254px; align-items:stretch; }
.app-shell .customer-package-carousel-group-p .purchase-checkout-package-card.customer-purchase-package-card { display:flex; flex-direction:column; align-items:stretch; height:182px; min-height:182px; padding:17px; border-radius:8px; gap:8px; }
.app-shell .customer-package-carousel-group-p .customer-private-carousel-card { font-family:var(--somi-customer-font); }
.app-shell .customer-private-carousel-card .purchase-checkout-card-heading { display:flex; align-items:baseline; justify-content:space-between; gap:8px; width:100%; min-width:0; font-family:var(--somi-customer-font); font-size:22px; line-height:1.25; }
.app-shell .customer-private-carousel-card .purchase-checkout-card-heading > strong { display:block; min-width:0; font-family:inherit; font-size:inherit; font-weight:500; line-height:inherit; overflow-wrap:anywhere; }
.somi-crm .benefit-private-heading .discount-badge, .app-shell .customer-private-carousel-card .purchase-checkout-card-heading .purchase-checkout-discount { position:static; display:inline-flex; flex:none; min-height:20px; margin:0 0 0 auto; padding:2px 6px; border:1px solid #efc1c5; border-radius:20px; background:#fff5f5; color:#cf3f4d; font-family:var(--somi-customer-font); font-size:12px; font-weight:500; line-height:1.15; white-space:nowrap; }
.app-shell .customer-package-carousel-group-p .customer-purchase-package-card .purchase-checkout-card-price { gap:4px; margin-top:auto; }
.app-shell .customer-package-carousel-group-p .customer-purchase-package-card .purchase-checkout-card-price del, .app-shell .customer-package-carousel-group-p .customer-purchase-package-card .purchase-checkout-card-price b { font-size:18px; font-weight:500; line-height:1.3; white-space:normal; overflow-wrap:anywhere; }
.app-shell .customer-package-carousel.has-crm-offers { grid-auto-columns:254px; }
.customer-package-carousel > .somi-crm { container-type:inline-size; }
@container (max-width:200px) {
  .somi-crm .crm-purchase-card { height:auto; min-height:214px; }
  .somi-crm .crm-purchase-card .benefit-price { flex-wrap:wrap; }
  .somi-crm .crm-purchase-card .benefit-price > strong { font-size:18px; }
  .somi-crm .crm-purchase-card .benefit-price small { display:block; }
}
.crm-checkout-picker { display:grid; grid-auto-flow:column; grid-auto-columns:100%; gap:10px; overflow-x:auto; scroll-snap-type:x mandatory; overscroll-behavior-x:contain; scrollbar-width:none; }
.crm-checkout-picker::-webkit-scrollbar { display:none; }
.crm-checkout-picker > .purchase-option-details { min-width:0; scroll-snap-align:start; scroll-snap-stop:always; }
.crm-checkout-picker .purchase-checkout-detail-card { min-height:138px; }
.crm-checkout-pagination { display:flex; align-items:center; justify-content:center; gap:14px; height:26px; }
.crm-checkout-pagination button { display:grid; place-items:center; width:28px; height:26px; border:0; background:none; color:#64765b; }
.crm-checkout-pagination svg { width:16px; height:16px; }
.crm-checkout-dots { display:flex; gap:6px; }
.crm-checkout-dots i { width:5px; height:5px; border-radius:50%; background:#d6d3ce; }
.crm-checkout-dots i.is-selected { background:#738267; }
.crm-checkout-rate { font-size:10px; color:#817d75; }
@media (min-width:900px) and (hover:hover) and (pointer:fine) { .app-shell .crm-compact-host { top:92px; right:0; left:auto; width:400px; justify-content:flex-end; } .crm-layer { align-items:center; } }
@media (max-width:350px) { .somi-crm .membership-expanded-title { left:95px; right:18px; top:21px; font-size:20px; } .somi-crm .card-logo { width:60px; height:60px; top:17px; left:18px; } .somi-crm .card-count strong { font-size:32px; } .somi-crm .card-holder strong { font-size:15px; } }
@media (prefers-reduced-motion:reduce) { .somi-crm *, .somi-crm *::before, .somi-crm *::after { animation:none!important; transition:none!important; } }
.customer-cancel-sheet .customer-action-message { justify-items: stretch; }
.customer-cancel-sheet .customer-action-message p { max-width: none; width: 100%; }
.customer-cancel-sheet .customer-action-message p + strong { margin-top: 11px; }
.customer-cancel-sheet .customer-action-message p + strong + p { margin-top: 11px; }
.customer-cancel-sheet .customer-action-buttons.single { grid-template-columns: minmax(0, 1fr); }
#cancellation-checkout-title { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; min-width: 0; font-size: 24px; line-height: 1.25; }
#cancellation-checkout-title small { font-size: 12px; line-height: 1.4; white-space: normal; }
#cancellation-checkout-title + .purchase-checkout-close { flex-shrink: 0; }
.cancellation-checkout-total { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 20px 0; border-block: 1px solid #ded8cf; margin-top: 20px; }
.cancellation-checkout-total strong { font-size: 26px; white-space: nowrap; }
.cancellation-deadline { display: grid; gap: 4px; margin: 16px 0; color: #817e76; font-size: 12px; line-height: 1.5; text-align: center; overflow-wrap: anywhere; }
.cancellation-deadline strong { color: #514d44; font-weight: 600; }
.cancellation-deadline small { font-size: 12px; }
.owner-manual-credit-form .owner-overview-list > label { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 6px 0; }
.owner-manual-credit-form .owner-overview-list > label > span { color: #817e76; font-size: 12px; }
.owner-manual-credit-form .owner-overview-list > label > input,
.owner-manual-credit-form .owner-overview-list > label > select { box-sizing: border-box; width: 100%; min-width: 0; min-height: 40px; padding: 8px 10px; border: 1px solid #d8d3c9; border-radius: 6px; background: #fff; color: #25241f; font: inherit; }
.owner-manual-credit-form .owner-overview-list > label > input[readonly] { background: #f4f3ef; }