.mobile-wizard { display: none; }
.wizard-intro-hint { display: none; }
.wizard-welcome { display: none; }
.mobile-logo-choices { display: none; }
.save-design-dialog { width: min(440px, calc(100% - 32px)); max-height: 90dvh; overflow: auto; padding: 26px; border: 1px solid #ead8e1; border-radius: 20px; color: #292329; background: #fff; font-family: 'DM Sans', sans-serif; }
.save-design-dialog::backdrop { background: #29232980; }
.save-design-dialog h2 { margin: 0 0 8px; font-size: 24px; }
.save-design-dialog p { font-size: 13px; color: #79626e; }
.save-design-dialog label { display: block; margin: 14px 0; font-size: 14px; }
.save-design-dialog input:not([type=checkbox]):not([type=hidden]) { display: block; width: 100%; padding: 12px; margin-top: 5px; border: 1px solid #d8c7d0; border-radius: 8px; font: inherit; font-size: 16px; }
.save-design-dialog .marketing-choice { display: flex; gap: 10px; align-items: flex-start; line-height: 1.5; font-size: 12px; }
.save-design-dialog .marketing-choice input { flex: 0 0 auto; margin-top: 3px; }
.save-dialog-actions { display: flex; gap: 12px; align-items: center; }
.save-dialog-actions button { padding: 12px 16px; border: 1px solid #d8c7d0; border-radius: 10px; background: #fff; cursor: pointer; }
.save-dialog-actions button[type=submit] { background: #ffe9f2; border-color: #a44e77; }
.save-design-dialog [role=status] { margin-top: 12px; font-size: 13px; }
@media (max-width: 767px) {
  body.mobile-design-flow { overflow: hidden; }
  .mobile-design-flow footer { display: none; }
  .mobile-design-flow .section-4 { position: fixed; inset: var(--wizard-top, 88px) 0 0; width: 100%; max-width: none; z-index: 20; background: #fff; }
  .mobile-design-flow .section-4 > .div-block-22 { display: flex; flex-direction: column; height: 100%; padding: 0; }
  .mobile-design-flow .div-block-22 > .div-block-23 { flex: 1; min-height: 0; width: 100%; padding: 8px 16px 4px; position: relative; display: flex; flex-direction: column; }
  .mobile-design-flow .boardpreview { flex: 1; min-height: 0; width: 100%; margin: 0 0 21px; display: flex; flex-direction: row; justify-content: center; gap: 24px; }
  .mobile-design-flow .boardpreview .frontholder, .mobile-design-flow .boardpreview .backholder { width: auto; height: 100%; margin: 0; display: flex !important; }
  .mobile-design-flow .boardpreview .bgcolorfront { height: 100%; }
  .mobile-design-flow .boardpreview .frontimg, .mobile-design-flow .boardpreview .backimg { height: 100%; width: auto; max-width: none; }
  .mobile-design-flow[data-design-side=deck] .boardpreview .backholder, .mobile-design-flow[data-design-side=bottom] .boardpreview .frontholder { display: none !important; }
  .mobile-design-flow .boardpreview .div-block-27 { display: none; }
  .mobile-design-flow .board-preview-caption { bottom: -18px; font-size: 10px; }
  .mobile-design-flow .floating-price { position: static; flex-shrink: 0; margin: 0; padding: 0; border: 0; background: none; font-size: 13px; align-items: center; }
  .mobile-design-flow .price-whatsapp, .mobile-design-flow .price-handmade { display: none; }
  .mobile-design-flow .div-block-22 > .div-block-21 { flex: 0 0 max(250px, 25dvh); min-height: 0; width: 100%; border: 0; margin: 0; padding: 0; transition: flex-basis .45s ease; }
  .mobile-design-flow .div-block-21 > :not(.mobile-wizard) { display: none !important; }
  .mobile-design-flow .mobile-wizard { height: 100%; display: flex; flex-direction: column; background: #faf7f8; border-radius: 22px 22px 0 0; }
  .wizard-heading { padding: 7px 16px 4px; flex-shrink: 0; }
  .wizard-progress { display: grid; grid-template-columns: repeat(10, minmax(0, 1fr)); gap: 4px; }
  .wizard-progress-step { min-width: 0; height: 26px; padding: 10px 0; border: 0; background: transparent; cursor: pointer; }
  .wizard-progress-step::after { content: ''; display: block; height: 6px; border-radius: 4px; background: #e2d5dc; }
  .wizard-progress-step.is-past::after { background: #ce9bb2; }
  .wizard-progress-step[aria-current=step]::after { background: #95416a; }
  .wizard-progress-step:focus-visible { outline: 2px solid #95416a; outline-offset: 1px; border-radius: 4px; }
  .wizard-heading h2 { margin: 0; font-size: 17px; line-height: 1.2; }
  .wizard-panel { padding: 5px 16px 6px; overflow: auto; min-height: 0; flex: 1; overscroll-behavior: contain; }
  .wizard-panel .board-choice-column { background: none; padding: 0; border: 0; }
  .wizard-panel .board-choice-column h4 { display: none; }
  .wizard-panel .modelSelect { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .wizard-panel .stringerSelect { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .wizard-panel .modelSelect img { height: 28px; }
  .wizard-panel .modelSelect .board-option-card { min-height: 60px; padding: 5px; gap: 3px; }
  .wizard-panel .stringerSelect .board-option-card { min-height: 60px; padding: 5px; }
  .wizard-panel .stringerSelect .board-option-label { font-size: 10px; }
  .mobile-design-flow .div-block-22 > .div-block-21:has(.wizard-panel .white-stringer-width:not([hidden])) { flex-basis: max(340px, 25dvh); }
  .wizard-panel .stringerSelect small { font-size: 10px; }
  .wizard-panel .style-option { padding: 3px; }
  .wizard-panel .style-option img { width: 38px; height: 38px; }
  .wizard-panel .brand-color-options { flex-wrap: nowrap; width: max-content; }
  .wizard-panel .brand-color-option { white-space: nowrap; }
  .wizard-panel .board-size-select { width: 100%; font-size: 16px; }
  .wizard-panel .side-color-panel { margin: 0; }
  .wizard-panel .side-color-label { display: none; }
  .wizard-panel .side-color-panel[hidden] { display: none !important; }
  .wizard-panel .logo-control-container { margin: 0 0 8px; }
  .wizard-panel .mobile-logo-choices { display: flex; gap: 8px; }
  .mobile-logo-choices button { flex: 1; min-height: 44px; padding: 9px; border: 1px solid #d8c7d0; border-radius: 10px; background: #fff; color: #49363f; font: inherit; cursor: pointer; }
  .mobile-logo-choices button[aria-pressed=true] { background: #ffe9f2; border-color: #95416a; box-shadow: 0 0 0 1px #95416a; }
  .wizard-panel .logo-control-container { display: none; }
  .wizard-panel .logo-control-container.mobile-logo-custom { display: block; margin-top: 10px; font-size: 0; }
  .wizard-panel .mobile-logo-custom .toggle-logo-controls { display: none; }
  .wizard-panel .mobile-logo-custom .logo-controls { display: block; font-size: 13px; }
  .wizard-panel #shareDesignButton { margin-top: 8px; width: 100%; }
  .wizard-note, .wizard-summary { font-size: 13px; line-height: 1.6; color: #79626e; }
  .wizard-navigation { display: flex; align-items: center; justify-content: space-between; padding: 5px 16px; gap: 12px; border-top: 1px solid #eadde3; background: #fff; flex-shrink: 0; }
  .wizard-navigation button { flex: 1; border: 2px solid #95416a; border-radius: 12px; min-height: 48px; padding: 10px 12px; background: #fff; color: #743052; font: inherit; font-size: 15px; font-weight: 700; cursor: pointer; }
  .wizard-navigation button:disabled { opacity: .3; }
  .wizard-navigation .wizard-next { background: #95416a; border-color: #95416a; color: #fff; }
  .wizard-side { display: none; }
  .wizard-details { display: flex; justify-content: center; background: #fff; padding: 0 16px calc(4px + env(safe-area-inset-bottom)); flex-shrink: 0; }
  .mobile-shape-intro .div-block-22 > .div-block-23 { padding: 0; overflow: hidden; }
  .mobile-shape-intro .div-block-22 > .div-block-21 { flex-basis: 100%; }
  .mobile-shape-intro .mobile-wizard { border-radius: 0; }
  .mobile-shape-intro .wizard-progress, .mobile-shape-intro .wizard-back { display: none; }
  .mobile-shape-intro .wizard-navigation { padding: 10px 16px; }
  .mobile-shape-intro .wizard-heading { padding: 32px 20px 16px; text-align: center; }
  .mobile-shape-intro .wizard-heading h2 { font-size: 26px; }
  .mobile-shape-intro .wizard-intro-hint { display: block; margin: 10px 0 0; font-size: 14px; color: #79626e; }
  .mobile-shape-intro .wizard-panel { display: block; padding: 12px 16px 20px; }
  .mobile-shape-intro .wizard-panel .board-choice-column { width: 100%; }
  .mobile-shape-intro .modelSelect .board-option-card { padding: 16px 5px; gap: 16px; }
  .mobile-shape-intro .modelSelect { grid-auto-flow: row; gap: 10px; }
  .mobile-shape-intro .modelSelect img { height: clamp(110px, 24dvh, 200px); width: 100%; object-fit: contain; }
  .mobile-shape-intro .modelSelect .board-option-label { font-size: 15px; }
  .wizard-model-details { padding: 20px 4px 0; color: #49363f; }
  .wizard-model-details h3 { margin: 0 0 8px; font-size: 20px; }
  .wizard-model-details p { margin: 6px 0 0; font-size: 14px; line-height: 1.6; }
  .wizard-model-details .wizard-model-sizes { color: #79626e; font-size: 13px; }
  .mobile-design-welcome .mobile-wizard > :not(.wizard-welcome) { display: none; }
  .mobile-design-welcome .wizard-welcome { display: flex; flex: 1; flex-direction: column; justify-content: center; align-items: center; padding: 32px 24px; text-align: center; }
  .wizard-welcome h1 { margin: 0 0 18px; color: #49363f; font-size: 34px; line-height: 1.15; }
  .wizard-welcome p { margin: 0 0 30px; color: #79626e; font-size: 16px; line-height: 1.9; }
  .wizard-start { width: 100%; max-width: 280px; min-height: 54px; border: 0; border-radius: 12px; background: #95416a; color: #fff; font: inherit; font-size: 18px; font-weight: 700; cursor: pointer; }
  @media (prefers-reduced-motion: reduce) {
    .mobile-design-flow .div-block-22 > .div-block-21 { transition: none; }
  }
}