:root {
  --wcrv-ink: #18211f;
  --wcrv-muted: #68736f;
  --wcrv-line: #dce2de;
  --wcrv-paper: #f7f8f5;
  --wcrv-accent: #9c6a45;
}

.wcrv-launch {
  align-items: center;
  background: var(--wcrv-ink);
  border: 0;
  border-radius: 13px;
  box-shadow: 0 8px 22px rgba(24,33,31,.16);
  color: #fff;
  cursor: pointer;
  display: inline-grid;
  font: inherit;
  gap: 10px;
  grid-template-columns: auto minmax(0,auto) auto auto;
  margin: 16px 0;
  max-width: 100%;
  min-height: 58px;
  padding: 9px 12px 9px 10px;
  text-align: left;
  transition: background-color .2s, box-shadow .2s, transform .2s;
  width: auto;
}

.wcrv-launch:hover { background: #24302d; box-shadow: 0 11px 28px rgba(24,33,31,.24); transform: translateY(-1px); }
.wcrv-launch:focus-visible { outline: 3px solid rgba(156,106,69,.35); outline-offset: 3px; }
.wcrv-launch.is-ready { background: #fff; border: 1px solid #b9c4be; box-shadow: 0 6px 18px rgba(24,33,31,.1); color: var(--wcrv-ink); }
.wcrv-launch.is-ready:hover { background: #fafbf9; border-color: #87948e; box-shadow: 0 9px 24px rgba(24,33,31,.14); }
.wcrv-launch__icon { align-items: center; background: rgba(255,255,255,.12); border-radius: 10px; display: flex; height: 40px; justify-content: center; width: 40px; }
.wcrv-launch.is-ready .wcrv-launch__icon { background: #e8eee9; color: var(--wcrv-ink); }
.wcrv-launch__icon svg { fill: none; height: 23px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.55; width: 23px; }
.wcrv-launch__icon .wcrv-launch__spark { stroke: #d9a879; }
.wcrv-launch__copy { min-width: 0; }
.wcrv-launch strong, .wcrv-launch small { display: block; }
.wcrv-launch strong { color: inherit; font-size: 14px; font-weight: 720; line-height: 1.25; }
.wcrv-launch small { color: rgba(255,255,255,.68); font-size: 10px; line-height: 1.3; margin-top: 2px; white-space: nowrap; }
.wcrv-launch.is-ready small { color: var(--wcrv-muted); }
.wcrv-launch__meta { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.16); border-radius: 999px; color: rgba(255,255,255,.9); font-size: 9px; font-weight: 750; letter-spacing: .04em; padding: 5px 7px; text-transform: uppercase; }
.wcrv-launch.is-ready .wcrv-launch__meta { background: #edf1ee; border-color: transparent; color: #50605a; }
.wcrv-launch__chevron { fill: none; height: 16px; stroke: currentColor; stroke-linecap: round; stroke-linejoin: round; stroke-width: 1.7; width: 16px; }

.wcrv-modal { color: var(--wcrv-ink); font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; inset: 0; position: fixed; z-index: 999999; }
.wcrv-modal__backdrop { backdrop-filter: blur(4px); background: rgba(11,18,16,.64); border: 0; inset: 0; padding: 0; position: absolute; width: 100%; }
.wcrv-shell { background: var(--wcrv-paper); border: 1px solid rgba(255,255,255,.2); border-radius: 18px; box-shadow: 0 28px 90px rgba(0,0,0,.3); display: grid; grid-template-rows: auto minmax(0,1fr) auto; height: min(760px,calc(100vh - 40px)); left: 50%; overflow: hidden; position: absolute; top: 50%; transform: translate(-50%,-50%); width: min(1240px,calc(100vw - 40px)); }
.wcrv-header { align-items: center; background: #fff; border-bottom: 1px solid var(--wcrv-line); display: flex; justify-content: space-between; min-height: 44px; padding: 11px 16px 11px 18px; }
.wcrv-header h2 { color: var(--wcrv-ink); font-size: clamp(18px,1.6vw,22px); line-height: 1.15; margin: 2px 0 0; }
.wcrv-eyebrow { color: var(--wcrv-accent); font-size: 11px; font-weight: 750; letter-spacing: .13em; text-transform: uppercase; }
.wcrv-close { align-items: center; background: #f1f3f0; border: 0; border-radius: 50%; color: var(--wcrv-ink); cursor: pointer; display: flex; flex: 0 0 auto; font-size: 22px; height: 34px; justify-content: center; line-height: 1; transition: background-color .2s, transform .2s; width: 34px; }
.wcrv-close:hover { background: #e4e8e4; transform: rotate(3deg); }
.wcrv-close:focus-visible { outline: 2px solid var(--wcrv-accent); outline-offset: 2px; }

.wcrv-workspace { display: grid; grid-template-columns: minmax(0,1fr) clamp(330px,29vw,360px); min-height: 0; }
.wcrv-stage { align-items: center; background: radial-gradient(circle at 50% 42%,#f2f3ef 0,#e4e7e2 72%); display: flex; justify-content: center; min-height: 0; overflow: hidden; padding: clamp(12px,1.6vw,20px); }
.wcrv-scene { box-shadow: 0 18px 55px rgba(28,35,32,.18); line-height: 0; max-height: 100%; max-width: 100%; overflow: hidden; position: relative; }
.wcrv-scene img { display: block; height: auto; max-height: min(632px,calc(100vh - 168px)); max-width: 100%; object-fit: contain; width: auto; }
.wcrv-scene__image { transition: filter .35s ease, transform .35s ease; }
.wcrv-scene__image.is-scanning { filter: blur(10px) saturate(.72); transform: scale(1.035); }
.wcrv-scene__overlay { height: 100%; inset: 0; position: absolute; width: 100%; }
.wcrv-scene__editor { height: 100%; inset: 0; position: absolute; touch-action: none; width: 100%; }
.wcrv-scene__editor polygon { fill: rgba(255,255,255,.04); stroke: #fff; stroke-dasharray: 10 8; stroke-width: 3; vector-effect: non-scaling-stroke; }
.wcrv-scene__editor circle { cursor: grab; fill: #fff; stroke: var(--wcrv-accent); stroke-width: 6; vector-effect: non-scaling-stroke; }
.wcrv-scene__editor circle:active { cursor: grabbing; }
.wcrv-blind__cassette { stroke: #ddd8cf; stroke-linecap: round; stroke-width: 11; vector-effect: non-scaling-stroke; }
.wcrv-blind__rail { stroke: rgba(34,39,38,.55); stroke-linecap: round; stroke-width: 5; vector-effect: non-scaling-stroke; }
.wcrv-scene__badge { background: rgba(19,29,26,.78); border-radius: 20px; bottom: 14px; color: #fff; font-size: 11px; left: 14px; line-height: 1; padding: 8px 11px; position: absolute; }
.wcrv-scan { align-items: center; background: rgba(15,29,26,.24); display: flex; inset: 0; justify-content: center; overflow: hidden; position: absolute; z-index: 4; }
.wcrv-scan__grid { background-image: linear-gradient(rgba(255,255,255,.13) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.13) 1px, transparent 1px); background-size: 34px 34px; inset: 0; position: absolute; }
.wcrv-scan__line { animation: wcrv-scan-line 2s ease-in-out infinite; background: linear-gradient(90deg, transparent, rgba(207,255,230,.95), transparent); box-shadow: 0 0 16px rgba(160,255,208,.9); height: 2px; left: 5%; position: absolute; right: 5%; top: 8%; }
.wcrv-scan strong { background: rgba(19,29,26,.84); border: 1px solid rgba(255,255,255,.3); border-radius: 20px; color: #fff; font-size: 12px; line-height: 1; padding: 10px 14px; position: relative; z-index: 1; }

@keyframes wcrv-scan-line {
  0%, 100% { opacity: .55; top: 8%; }
  50% { opacity: 1; top: 92%; }
}

.wcrv-controls { background: #fff; border-left: 1px solid var(--wcrv-line); overflow: auto; padding: 0 18px 18px; scrollbar-color: #a8b0ac transparent; scrollbar-width: thin; }
.wcrv-control-section { border-bottom: 1px solid var(--wcrv-line); display: grid; gap: 10px; grid-template-columns: 24px 1fr; padding: 16px 0; }
.wcrv-control-section:last-child { border-bottom: 0; }
.wcrv-control-section h3 { color: var(--wcrv-ink); font-size: 15px; margin: 0 0 3px; }
.wcrv-control-section p { color: var(--wcrv-muted); font-size: 12px; line-height: 1.45; margin: 0; }
.wcrv-step { color: var(--wcrv-accent); font-size: 10px; font-weight: 800; letter-spacing: .08em; padding-top: 3px; }
.wcrv-room-list, .wcrv-swatches, .wcrv-range { grid-column: 2; }
.wcrv-room-card { align-items: center; background: #fff; border: 1px solid var(--wcrv-line); border-radius: 10px; color: var(--wcrv-ink); cursor: pointer; display: flex; font: inherit; gap: 10px; padding: 7px; width: 100%; }
.wcrv-room-card.is-selected { border-color: var(--wcrv-ink); box-shadow: 0 0 0 1px var(--wcrv-ink); }
.wcrv-room-card img { border-radius: 6px; height: 46px; object-fit: cover; width: 68px; }
.wcrv-room-card span { font-size: 13px; font-weight: 650; }
.wcrv-target-picker { background: var(--wcrv-paper); border-radius: 10px; margin-top: 9px; padding: 9px; }
.wcrv-target-picker > strong { color: var(--wcrv-muted); display: block; font-size: 9px; letter-spacing: .06em; text-transform: uppercase; }
.wcrv-target-list { display: grid; gap: 6px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 7px; }
.wcrv-target-list button { background: #fff; border: 1px solid var(--wcrv-line); border-radius: 8px; color: var(--wcrv-ink); cursor: pointer; display: flex; flex-direction: column; font: inherit; font-size: 11px; font-weight: 700; gap: 2px; padding: 8px; text-align: left; }
.wcrv-target-list button.is-selected { border-color: var(--wcrv-ink); box-shadow: 0 0 0 1px var(--wcrv-ink); }
.wcrv-target-list small { color: var(--wcrv-muted); font-size: 9px; font-weight: 500; }
.wcrv-upload { align-items: center; border: 1px dashed #aab4af; border-radius: 10px; color: var(--wcrv-ink); cursor: pointer; display: grid; gap: 1px 10px; grid-template-columns: 34px 1fr; margin-top: 9px; padding: 10px; }
.wcrv-upload:hover { background: var(--wcrv-paper); border-color: var(--wcrv-ink); }
.wcrv-upload.is-busy { cursor: wait; opacity: .7; }
.wcrv-upload input { height: 1px; opacity: 0; position: absolute; width: 1px; }
.wcrv-upload > span { align-items: center; background: #e8eee9; border-radius: 50%; display: flex; font-size: 20px; grid-row: 1 / 3; height: 34px; justify-content: center; width: 34px; }
.wcrv-upload strong { font-size: 12px; }
.wcrv-upload small { color: var(--wcrv-muted); font-size: 9px; }
.wcrv-secondary { background: #fff; border: 1px solid var(--wcrv-ink); border-radius: 8px; color: var(--wcrv-ink); cursor: pointer; font: inherit; font-size: 11px; font-weight: 700; margin-top: 9px; padding: 9px 12px; width: 100%; }
.wcrv-secondary:disabled { cursor: default; opacity: .58; }
.wcrv-project-actions { margin-top: 9px; }
.wcrv-project-actions .wcrv-secondary { margin-top: 0; }
.wcrv-project-actions small, .wcrv-project-note { color: var(--wcrv-muted); display: block; font-size: 9px; line-height: 1.4; margin: 6px 2px 0; }
.wcrv-swatches { display: grid; gap: 10px 6px; grid-template-columns: repeat(5,1fr); }
.wcrv-swatch:disabled { cursor: not-allowed; opacity: .35; }
.wcrv-variation-attribute { grid-column: 2; }
.wcrv-variation-attribute > strong { display: block; font-size: 11px; margin-bottom: 7px; }
.wcrv-variation-attribute > select { background: #fff; border: 1px solid #cbd2ce; border-radius: 8px; box-sizing: border-box; color: var(--wcrv-ink); min-height: 40px; padding: 8px 10px; width: 100%; }
.wcrv-variation-message { grid-column: 2; }
.wcrv-swatch { background: transparent; border: 0; color: var(--wcrv-muted); cursor: pointer; font: inherit; min-width: 0; padding: 0; text-align: center; }
.wcrv-swatch > span { border: 3px solid #fff; border-radius: 50%; box-shadow: 0 0 0 1px #cfd5d1; display: block; height: 38px; margin: 2px auto 7px; transition: box-shadow .2s, transform .2s; width: 38px; }
.wcrv-swatch > span { background-position: center; background-size: cover; }
.wcrv-swatch.is-selected > span { box-shadow: 0 0 0 2px var(--wcrv-ink); transform: scale(1.06); }
.wcrv-swatch small { display: block; font-size: 9px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wcrv-range-heading { display: flex; gap: 12px; justify-content: space-between; }
.wcrv-range-heading strong { color: var(--wcrv-accent); font-size: 14px; }
.wcrv-range { accent-color: var(--wcrv-ink); cursor: pointer; width: 100%; }
.wcrv-measurements { display: grid; gap: 12px; grid-column: 2; grid-template-columns: 1fr 1fr; }
.wcrv-measurements label { color: var(--wcrv-ink); font-size: 11px; font-weight: 700; position: relative; }
.wcrv-measurements label > span { color: var(--wcrv-muted); float: right; font-weight: 500; }
.wcrv-measurements input,
.wcrv-measurements select { background: #fff; border: 1px solid #cbd2ce; border-radius: 8px; box-sizing: border-box; color: var(--wcrv-ink); display: block; font: inherit; font-size: 13px; margin: 5px 0 3px; min-height: 40px; padding: 8px 10px; width: 100%; }
.wcrv-measurements input:focus,
.wcrv-measurements select:focus { border-color: var(--wcrv-ink); box-shadow: 0 0 0 2px rgba(24,33,31,.12); outline: 0; }
.wcrv-measurements label small { color: var(--wcrv-muted); font-size: 9px; font-weight: 500; }
.wcrv-measurements .wcrv-mounting { grid-column: 1 / -1; }
.wcrv-field-error { color: #842f23 !important; grid-column: 1 / -1; }
.wcrv-detection-note { background: #fff7e8; border: 1px solid #ead2a8; border-radius: 8px; color: #62481f !important; font-size: 11px !important; margin-top: 9px !important; padding: 9px 10px; }
.wcrv-alert { background: #fff3f0; border: 1px solid #f1c7bc; border-radius: 9px; color: #842f23; font-size: 12px; margin-top: 18px; padding: 10px; }

.wcrv-footer { align-items: center; background: #fff; border-top: 1px solid var(--wcrv-line); display: flex; justify-content: flex-end; gap: 18px; padding: 10px 16px 10px 18px; }
.wcrv-footer div { margin-right: auto; }
.wcrv-footer strong, .wcrv-footer span { display: block; }
.wcrv-footer strong { font-size: 14px; }
.wcrv-footer span { color: var(--wcrv-muted); font-size: 11px; margin-top: 2px; }
.wcrv-primary { background: var(--wcrv-ink); border: 0; border-radius: 9px; color: #fff; cursor: pointer; font: inherit; font-size: 12px; font-weight: 700; padding: 10px 16px; }
.wcrv-primary:disabled { cursor: not-allowed; opacity: .45; }
.wcrv-empty { background: #fff; border-radius: 12px; left: 50%; padding: 24px; position: absolute; top: 50%; transform: translate(-50%,-50%); }

@media (max-width: 900px) {
  .wcrv-shell { height: calc(100vh - 24px); width: calc(100vw - 24px); }
  .wcrv-workspace { grid-template-columns: 1fr; overflow-y: auto; }
  .wcrv-stage { flex: 0 0 auto; min-height: min(52vh, 500px); }
  .wcrv-scene img { max-height: min(52vh, 500px); }
  .wcrv-controls { border-left: 0; border-top: 1px solid var(--wcrv-line); overflow: visible; }
}

@media (max-width: 640px) {
  .wcrv-launch { grid-template-columns: auto minmax(0,1fr) auto; width: 100%; }
  .wcrv-launch__meta { display: none; }
  .wcrv-launch small { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .wcrv-shell { border: 0; border-radius: 0; height: 100%; width: 100%; }
  .wcrv-stage { min-height: 45vh; }
  .wcrv-scene img { max-height: none; width: 100%; }
  .wcrv-header { padding: 12px 16px; }
  .wcrv-controls { padding-left: 18px; padding-right: 18px; }
  .wcrv-footer { padding: 12px 16px; }
  .wcrv-footer div { min-width: 0; }
  .wcrv-footer strong, .wcrv-footer span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .wcrv-primary { flex: 0 0 auto; }
}

@media (prefers-reduced-motion: reduce) {
  .wcrv-launch, .wcrv-swatch > span, .wcrv-scene__image { transition: none; }
  .wcrv-scan__line { animation: none; top: 50%; }
}
