/* V23.1 — correções de navegação, ícones, mídia e modelos */

/* ---------- ícones adicionais ---------- */
.ui-icon-text{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 4h14a1 1 0 1 1 0 2h-5v14a1 1 0 1 1-2 0V6H5a1 1 0 1 1 0-2'/%3E%3C/svg%3E")}
.ui-icon-photo{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4.5 4h15A2.5 2.5 0 0 1 22 6.5v11a2.5 2.5 0 0 1-2.5 2.5h-15A2.5 2.5 0 0 1 2 17.5v-11A2.5 2.5 0 0 1 4.5 4m0 2A.5.5 0 0 0 4 6.5v8.13l3.8-3.8a1.2 1.2 0 0 1 1.7 0l2.4 2.4 2.8-2.8a1.2 1.2 0 0 1 1.7 0L20 14V6.5a.5.5 0 0 0-.5-.5zM8 7.5a1.75 1.75 0 1 1 0 3.5 1.75 1.75 0 0 1 0-3.5'/%3E%3C/svg%3E")}
.ui-icon-title{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 4h16v3h-6.5v13h-3V7H4z'/%3E%3C/svg%3E")}
.ui-icon-scratch{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='m16.9 2.7 4.4 4.4-10.8 10.8-5.7 1.3 1.3-5.7zM4 20h16a1 1 0 1 1 0 2H4a1 1 0 1 1 0-2'/%3E%3C/svg%3E")}
.ui-icon-video{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4.5 5h10A2.5 2.5 0 0 1 17 7.5v1.2l3.3-2.2A1.1 1.1 0 0 1 22 7.4v9.2a1.1 1.1 0 0 1-1.7.9L17 15.3v1.2a2.5 2.5 0 0 1-2.5 2.5h-10A2.5 2.5 0 0 1 2 16.5v-9A2.5 2.5 0 0 1 4.5 5'/%3E%3C/svg%3E")}
.ui-icon-calendar{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 2a1 1 0 0 1 1 1v1h8V3a1 1 0 1 1 2 0v1h1a3 3 0 0 1 3 3v12a3 3 0 0 1-3 3H5a3 3 0 0 1-3-3V7a3 3 0 0 1 3-3h1V3a1 1 0 0 1 1-1m12 8H5v9a1 1 0 0 0 1 1h12a1 1 0 0 0 1-1z'/%3E%3C/svg%3E")}
.ui-icon-puzzle{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 3h7v4.1a2.8 2.8 0 1 1 2 0V3h7a1 1 0 0 1 1 1v7h-4.1a2.8 2.8 0 1 0 0 2H21v7a1 1 0 0 1-1 1h-7v-4.1a2.8 2.8 0 1 0-2 0V21H4a1 1 0 0 1-1-1v-7h4.1a2.8 2.8 0 1 0 0-2H3V4a1 1 0 0 1 1-1'/%3E%3C/svg%3E")}
.ui-icon-game{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7.5 7h9A5.5 5.5 0 0 1 22 12.5v2a4.5 4.5 0 0 1-8.1 2.7L12.7 15h-1.4l-1.2 2.2A4.5 4.5 0 0 1 2 14.5v-2A5.5 5.5 0 0 1 7.5 7M7 10v1.5H5.5a1 1 0 1 0 0 2H7V15a1 1 0 1 0 2 0v-1.5h1.5a1 1 0 1 0 0-2H9V10a1 1 0 1 0-2 0m8.5 1a1 1 0 1 0 0 2 1 1 0 0 0 0-2m2.5 2a1 1 0 1 0 0 2 1 1 0 0 0 0-2'/%3E%3C/svg%3E")}
.ui-icon-map{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='m8 3 8-2 5 2v18l-5-2-8 2-5-2V1zm1 2.1v13.4l6-1.5V3.6zm8-1.3v13.4l2 .8V4.6zM5 3.7v13.9l2 .8V5z'/%3E%3C/svg%3E")}
.ui-icon-palette{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 2a10 10 0 0 0 0 20h1.6a2.6 2.6 0 0 0 0-5.2H12a1.8 1.8 0 0 1 0-3.6h3.1A6.9 6.9 0 0 0 22 6.3 4.3 4.3 0 0 0 17.7 2zM7.2 7.5a1.3 1.3 0 1 1 0-2.6 1.3 1.3 0 0 1 0 2.6m4-2.2a1.3 1.3 0 1 1 2.6 0 1.3 1.3 0 0 1-2.6 0m4.2 3.6a1.3 1.3 0 1 1 2.6 0 1.3 1.3 0 0 1-2.6 0M6 12.3a1.3 1.3 0 1 1 2.6 0 1.3 1.3 0 0 1-2.6 0'/%3E%3C/svg%3E")}
.ui-icon-unlock{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M7 10V7a5 5 0 0 1 9.6-2 1 1 0 1 1-1.84.78A3 3 0 0 0 9 7v3h9a2 2 0 0 1 2 2v8a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-8a2 2 0 0 1 2-2z'/%3E%3C/svg%3E")}
.ui-icon-pointer{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M9 2a2 2 0 0 1 2 2v6.1l.6-.5a2 2 0 0 1 2.6.1l.4.4.6-.3a2 2 0 0 1 2.3.3l.5.5.5-.2a2 2 0 0 1 2.5 1.9V16a6 6 0 0 1-6 6h-2.2a6 6 0 0 1-4.25-1.76L4.1 15.8a2.2 2.2 0 0 1 3.1-3.1L7 12.5V4a2 2 0 0 1 2-2'/%3E%3C/svg%3E")}
.ui-icon-print{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6 3h12v5H6zm-1 7h14a3 3 0 0 1 3 3v5h-4v3H6v-3H2v-5a3 3 0 0 1 3-3m3 9h8v-5H8zm11-6.5a1 1 0 1 0 0 2 1 1 0 0 0 0-2'/%3E%3C/svg%3E")}

/* ---------- cores de ícone ---------- */
.tone-rose{color:#f25991!important}
.tone-pink{color:#ff78b1!important}
.tone-red{color:#ff6e78!important}
.tone-amber{color:#f4b64f!important}
.tone-yellow{color:#ffd54a!important}
.tone-orange{color:#f29755!important}
.tone-green{color:#5fd28b!important}
.tone-teal{color:#45c8b0!important}
.tone-cyan{color:#52c5e8!important}
.tone-blue{color:#6ea8ff!important}
.tone-indigo{color:#8584ff!important}
.tone-violet{color:#b58aff!important}
.tone-lilac{color:#c7a5ff!important}
.tone-wine{color:#b65b7d!important}
.tone-gold{color:#dfb35f!important}

/* ---------- landing: ícones visíveis e fotos únicas ---------- */
.template-icon{display:grid!important;place-items:center!important;background:rgba(20,12,20,.48)!important;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px)}
.template-icon:before{content:"";display:block;width:22px;height:22px;background:var(--icon-color,#fff);-webkit-mask:var(--template-icon) center/contain no-repeat;mask:var(--template-icon) center/contain no-repeat}
.template-icon-heart{--icon-color:#ff6e9d;--template-icon:var(--icon-heart)}
.template-icon-moon{--icon-color:#c7b3ff;--template-icon:var(--icon-moon)}
.template-icon-sun{--icon-color:#ffc758;--template-icon:var(--icon-sun)}
.template-icon-stars{--icon-color:#ceb7ff;--template-icon:var(--icon-stars)}
.template-icon-flower{--icon-color:#ff7184;--template-icon:var(--icon-flower)}
.template-icon-leaf{--icon-color:#69d88f;--template-icon:var(--icon-leaf)}
.template-icon-cake{--icon-color:#ffbf56;--template-icon:var(--icon-cake)}
.template-icon-mail{--icon-color:#ff80b6;--template-icon:var(--icon-mail)}
:root{
  --icon-heart:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M12 21s-7.5-4.62-9.58-8.76C.78 8.96 2.77 5 6.81 5c2.12 0 3.52 1.22 4.2 2.33C11.67 6.22 13.07 5 15.2 5c4.04 0 6.03 3.96 4.39 7.24C19.5 16.38 12 21 12 21'/%3E%3C/svg%3E");
  --icon-moon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M14.8 2.2A8.7 8.7 0 1 0 21.8 15a1 1 0 0 0-1.28-1.22 6.6 6.6 0 0 1-8.3-8.31A1 1 0 0 0 11 4.2a8.7 8.7 0 0 0 3.8-2'/%3E%3C/svg%3E");
  --icon-sun:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='4.5' fill='black'/%3E%3Cpath stroke='black' stroke-width='2' stroke-linecap='round' d='M12 2v3m0 14v3M2 12h3m14 0h3M5 5l2.2 2.2m9.6 9.6L19 19M19 5l-2.2 2.2M7.2 16.8 5 19'/%3E%3C/svg%3E");
  --icon-stars:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='m13 2 1.4 4.6L19 8l-4.6 1.4L13 14l-1.4-4.6L7 8l4.6-1.4zm6.2 8.8.9 2.8 2.8.9-2.8.9-.9 2.8-.9-2.8-2.8-.9 2.8-.9zM6.4 13l1.1 3.4 3.4 1.1-3.4 1.1-1.1 3.4-1.1-3.4L2 17.5l3.4-1.1z'/%3E%3C/svg%3E");
  --icon-flower:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='2.7' fill='black'/%3E%3Cpath fill='black' d='M12 2c2.6 0 4 2.8 2.7 5A4.9 4.9 0 0 1 20 8.1c1.3 2.3-.8 4.9-3.2 4.7A4.9 4.9 0 0 1 15 18c-1.3 2.3-4.7 1.8-5.3-.6A4.9 4.9 0 0 1 4.6 15c-1.3-2.3.8-4.9 3.2-4.7A4.9 4.9 0 0 1 9 5.1C9.6 3.3 10.7 2 12 2' opacity='.88'/%3E%3C/svg%3E");
  --icon-leaf:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M19.5 3C9.7 3 4 8.6 4 16.4c0 2.56 1.95 4.6 4.58 4.6 3.77 0 6.18-2.5 7.68-5.32C17.8 12.75 18.2 9.2 18.2 7.4c-.98 1.16-2.61 2.1-4.59 2.86-2.09.8-4.59 1.42-6.47 1.72a1 1 0 0 0 .31 1.98c1.74-.28 3.88-.8 5.92-1.53-1.78 2.42-3.98 4.43-7.15 6.03A1 1 0 0 0 7.1 20.2c8.38-4.25 12.4-9.75 13.4-16.2'/%3E%3C/svg%3E");
  --icon-cake:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M13 3.5a1.5 1.5 0 0 0-3 0c0 .6.34 1.05.8 1.5-.55.4-.8.91-.8 1.5a1.5 1.5 0 1 0 3 0c0-.6-.34-1.05-.8-1.5.55-.4.8-.91.8-1.5M6 10h12a2 2 0 0 1 2 2v7a2 2 0 0 1-2 2H6a2 2 0 0 1-2-2v-7a2 2 0 0 1 2-2'/%3E%3C/svg%3E");
  --icon-mail:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M3 6.75A2.75 2.75 0 0 1 5.75 4h12.5A2.75 2.75 0 0 1 21 6.75v10.5A2.75 2.75 0 0 1 18.25 20H5.75A2.75 2.75 0 0 1 3 17.25ZM5.2 7.27l6.33 4.5a.8.8 0 0 0 .94 0l6.33-4.5A1.2 1.2 0 0 0 18.25 7H5.75c-.2 0-.38.05-.55.27'/%3E%3C/svg%3E")
}
.template-photo-casal{background-image:url('./demo/casal_praia.png')!important}
.template-photo-noite{background-image:linear-gradient(180deg,rgba(16,18,46,.12),rgba(8,9,26,.6)),url('./demo/casal_por_do_sol.png')!important;background-position:center 38%!important}
.template-photo-amigos{background-image:url('./demo/amigos_rindo.png')!important}
.template-card-premium.t4 .template-media{background-image:linear-gradient(180deg,rgba(12,13,30,.18),rgba(8,9,22,.62)),url('./demo/familia_sala.png')!important}
.template-card-premium.t5 .template-media{background-image:url('./demo/familia_beijos.png')!important}
.template-card-premium.t6 .template-media{background-image:url('./demo/especial_colagem.png')!important}
.template-card-premium.t7 .template-media{background-image:url('./demo/festa_aniversario.png')!important}
.template-card-premium.t8 .template-media{background-image:url('./demo/aniversario_picnic.png')!important}

.feature-btn[data-feature="gallery"] .feature-icon{color:#58cbed!important;background:rgba(88,203,237,.12)!important}
.feature-btn[data-feature="timeline"] .feature-icon{color:#f2a95d!important;background:rgba(242,169,93,.12)!important}
.feature-btn[data-feature="reasons"] .feature-icon{color:#ff6f9e!important;background:rgba(255,111,158,.12)!important}
.feature-btn[data-feature="countdown"] .feature-icon{color:#b18bff!important;background:rgba(177,139,255,.12)!important}
.feature-btn[data-feature="voice"] .feature-icon{color:#74a8ff!important;background:rgba(116,168,255,.12)!important}

/* ---------- menu do criador: não some no passo 3/4 ---------- */
.wizard-sticky-head{position:sticky;top:0;z-index:40;background:rgba(15,10,18,.96);border-bottom:1px solid rgba(255,255,255,.08);backdrop-filter:blur(22px);-webkit-backdrop-filter:blur(22px)}
.wizard-sticky-head .wizard-topbar{position:relative!important;top:auto!important;border-bottom:0!important;background:transparent!important;backdrop-filter:none!important;-webkit-backdrop-filter:none!important}
.wizard-sticky-head .simple-progress{padding-top:8px;padding-bottom:12px}
.wizard-sticky-head .edit-quick-nav{padding-top:4px;padding-bottom:14px;border-top:1px solid rgba(255,255,255,.05);overflow-x:auto;flex-wrap:nowrap;scrollbar-width:none}
.wizard-sticky-head .edit-quick-nav::-webkit-scrollbar{display:none}
.wizard-sticky-head .edit-quick-nav button{white-space:nowrap;flex:0 0 auto}
.creator-fullscreen .wizard-shell{height:100dvh!important;max-height:100dvh!important}
.creator-fullscreen .wizard-body{min-height:0;overflow:auto!important;overscroll-behavior:contain}

/* ---------- criação: ícones coloridos ---------- */
.question-heart{font-size:0!important}
.question-heart .ui-icon{width:28px;height:28px}
.question-icon-rose{background:rgba(242,89,145,.12)!important;border-color:rgba(242,89,145,.22)!important;color:#f25991!important}
.question-icon-pink{background:rgba(255,120,177,.12)!important;border-color:rgba(255,120,177,.22)!important;color:#ff78b1!important}
.question-icon-amber{background:rgba(244,182,79,.12)!important;border-color:rgba(244,182,79,.22)!important;color:#f4b64f!important}
.question-icon-violet{background:rgba(181,138,255,.12)!important;border-color:rgba(181,138,255,.22)!important;color:#b58aff!important}
.moment-packs .pack{display:inline-flex;align-items:center;gap:8px}
.moment-packs .pack .ui-icon{width:16px;height:16px}
.current-letter-icon{display:grid!important;place-items:center;width:42px;height:42px;border-radius:14px;background:rgba(255,118,174,.1);border:1px solid rgba(255,118,174,.16)}
.current-letter-icon .dpv-moment-icon{width:22px!important;height:22px!important}
.current-letter-icon .dpv-moment-icon svg{width:100%;height:100%}
.story-help-action{display:inline-flex;align-items:center;gap:7px}
.story-help-action .ui-icon{width:16px;height:16px}
.story-add-choice>span.story-choice-icon{display:grid!important;place-items:center!important;width:44px!important;height:44px!important;margin:0 auto 9px!important;border-radius:14px;background:color-mix(in srgb,currentColor 12%,transparent);border:1px solid color-mix(in srgb,currentColor 20%,transparent);font-size:0!important}
.story-choice-icon .ui-icon{width:22px;height:22px}
.story-add-choice{min-height:116px!important;align-content:center!important}
.story-add-choice small{margin-top:6px!important}
.panel-head-icon{display:grid!important;place-items:center!important;width:42px!important;height:42px!important;flex:0 0 42px;border-radius:14px;background:color-mix(in srgb,currentColor 10%,transparent);border:1px solid color-mix(in srgb,currentColor 18%,transparent)}
.panel-head-icon .ui-icon{width:20px;height:20px}
.personalize-panel-head{align-items:center!important}
.delivery-card>.panel-head-icon{margin-right:12px}
.memory-tool>div{display:grid!important;grid-template-columns:42px 1fr;column-gap:12px;align-items:center}
.memory-tool>div>.panel-head-icon{grid-row:1/3}
.inline-ui-icon{display:inline-grid;place-items:center;width:28px;height:28px;margin-right:8px;vertical-align:middle;border-radius:9px;background:color-mix(in srgb,currentColor 10%,transparent)}
.inline-ui-icon .ui-icon{width:16px;height:16px}
.upload-icon-label{display:inline-flex!important;align-items:center!important;gap:8px!important;justify-content:center!important}
.upload-icon-label .ui-icon{width:22px;height:22px}
.upload-icon-stack{flex-direction:column!important}
.album-layout-choice{display:inline-flex!important;align-items:center;justify-content:center;gap:7px}
.album-layout-choice .ui-icon{width:16px;height:16px}
.ready-summary span{display:inline-flex!important;align-items:center;gap:8px}
.ready-summary .ui-icon{width:17px;height:17px}

/* ---------- ícones das cartas/amostras ---------- */
.dpv-moment-icon{color:#ce5d87!important}
.dpv-icon-heart{color:#f05f91!important}
.dpv-icon-moon{color:#9478de!important}
.dpv-icon-sun{color:#e3a127!important}
.dpv-icon-spark{color:#b78ce8!important}
.dpv-icon-leaf{color:#4faf78!important}
.dpv-icon-trophy{color:#c89432!important}
.dpv-icon-gift{color:#d67a46!important}
.dpv-icon-plane{color:#5d8ed8!important}
.dpv-icon-hand{color:#c67686!important}
.dpv-icon-photo{color:#578fc9!important}
.dpv-icon-envelope{color:#d75983!important}
.dpv-icon-hug{color:#bd7695!important}
.dpv-icon-laugh{color:#d8942a!important}
.dpv-icon-crystal{color:#856aca!important}
.dpv-icon-star{color:#c79935!important}
.sealed-letter .dpv-moment-icon-sealed{background:rgba(255,255,255,.08)!important;border:1px solid rgba(255,255,255,.08);box-shadow:none!important;padding:5px;width:30px!important;height:30px!important;border-radius:10px!important}
.sealed-letter .dpv-moment-icon-sealed svg{width:100%;height:100%}
.demo-catalog-heading-icon{display:grid;place-items:center;width:58px;height:58px;margin:0 auto 14px;border-radius:18px;background:rgba(255,114,173,.1);border:1px solid rgba(255,114,173,.16)}
.demo-catalog-heading-icon .ui-icon{width:25px;height:25px}

/* ---------- finalização ---------- */
.success-hero-icon{display:grid;place-items:center;width:82px;height:82px;margin:0 auto 12px;border-radius:26px;background:linear-gradient(135deg,rgba(255,105,169,.18),rgba(181,145,255,.14));border:1px solid rgba(255,255,255,.1);color:#ff7eb3}
.success-hero-icon .ui-icon{width:36px;height:36px}
#successModal .btn{display:flex;align-items:center;justify-content:center;gap:8px}
#successModal .btn .ui-icon{width:17px;height:17px}

/* ---------- player global / evita aparência de dois players colados ---------- */
.recipient-music+.story-result-media.reveal-music,
.story-result-media.reveal-music+.recipient-music{margin-top:22px!important}
.recipient-music{position:relative}
.recipient-music:before{content:"trilha da carta";display:block;margin:0 auto 10px;text-align:center;font-size:10px;letter-spacing:.16em;text-transform:uppercase;color:rgba(116,77,96,.66)}

/* ---------- responsivo ---------- */
@media(max-width:760px){
  .wizard-sticky-head{top:0}
  .wizard-sticky-head .wizard-topbar{padding-top:max(12px,env(safe-area-inset-top))!important}
  .wizard-sticky-head .edit-quick-nav{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
  .wizard-sticky-head .simple-progress{padding-left:max(12px,env(safe-area-inset-left));padding-right:max(12px,env(safe-area-inset-right))}
  .wizard-actions-top{display:grid!important;grid-template-columns:1fr 1fr 1fr auto!important;width:100%}
  .wizard-actions-top .btn{padding-inline:8px!important;min-width:0!important;font-size:.8rem!important}
  .wizard-actions-top .easy-mode-btn{white-space:nowrap}
  .story-add-menu-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .story-add-choice{min-height:112px!important}
  .template-card-premium .template-media{height:176px!important}
}
@media(max-width:480px){
  .wizard-actions-top{grid-template-columns:1fr 1fr auto!important}
  .wizard-actions-top .easy-mode-btn{grid-column:1 / -1}
  .edit-quick-nav button{padding:9px 11px!important;font-size:.8rem!important}
}
.ui-icon-save{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M5 3h11l3 3v15H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2m2 2v5h8V5zm5 8a3.5 3.5 0 1 0 0 7 3.5 3.5 0 0 0 0-7'/%3E%3C/svg%3E")}
.ready-bloom{display:grid!important;place-items:center!important;width:76px!important;height:76px!important;margin-inline:auto!important;border-radius:24px!important;background:linear-gradient(135deg,rgba(255,105,169,.17),rgba(181,145,255,.12))!important;border:1px solid rgba(255,255,255,.12)!important;color:#ff79ad!important;font-size:0!important}
.ready-bloom .ui-icon{width:34px;height:34px}
.ready-actions .btn{display:inline-flex;align-items:center;justify-content:center;gap:8px}
.ready-actions .btn .ui-icon{width:17px;height:17px}
.ui-icon-volume{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 9h4l5-4v14l-5-4H4zm12.2-.8a1 1 0 0 1 1.4.1A6 6 0 0 1 19 12a6 6 0 0 1-1.4 3.7 1 1 0 1 1-1.55-1.26A4 4 0 0 0 17 12a4 4 0 0 0-.95-2.44 1 1 0 0 1 .15-1.36m2.9-2.5a1 1 0 0 1 1.4.14A10 10 0 0 1 22 12a10 10 0 0 1-1.5 5.16 1 1 0 1 1-1.7-1.04A8 8 0 0 0 20 12a8 8 0 0 0-1.2-4.12 1 1 0 0 1 .3-1.38'/%3E%3C/svg%3E")}
.ui-icon-volume-off{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M4 9h4l5-4v14l-5-4H4zm12.3.3 4.4 4.4a1 1 0 0 1-1.4 1.4l-4.4-4.4a1 1 0 0 1 1.4-1.4'/%3E%3C/svg%3E")}
.ui-icon-vintage{--icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='black' d='M6 3h12v3h2v15H4V6h2zm2 2v2h8V5zm-1 4v10h10V9zm2 2h6v2H9zm0 4h5v2H9z'/%3E%3C/svg%3E")}
.music-source .ui-icon{width:22px;height:22px;margin:0 auto 6px}
.visual-theme .ui-icon{display:block;width:25px;height:25px;margin-bottom:8px}
.dpv-media-sound-action{display:inline-flex!important;align-items:center;justify-content:center;gap:8px}
.dpv-media-sound-action .ui-icon{width:17px;height:17px}
.dpv-video-render-icon .ui-icon{width:28px;height:28px}
.story-final-preview summary{display:flex;align-items:center;gap:8px}
.story-final-preview summary .ui-icon{width:17px;height:17px}
.reader-section-heading{display:flex;align-items:center;gap:12px}
.reader-section-heading .reader-icon{display:grid;place-items:center;width:40px;height:40px;border-radius:13px;background:rgba(120,80,110,.08);flex:0 0 40px}
.reader-section-heading .reader-icon .ui-icon{width:20px;height:20px}
.story-date-pill{display:inline-flex!important;align-items:center;gap:7px}
.story-date-pill .ui-icon{width:16px;height:16px}
.story-unlock-top>span{display:inline-flex!important;align-items:center;gap:7px}
.story-unlock-top>span .ui-icon{width:16px;height:16px}
.gate-opened-label{display:flex;align-items:center;justify-content:center;gap:8px}
.gate-opened-label .ui-icon{width:16px;height:16px}
.locked-preview-icon{display:grid;place-items:center;width:74px;height:74px;margin:0 auto 16px;border-radius:24px;background:rgba(181,138,255,.1);border:1px solid rgba(181,138,255,.18)}
.locked-preview-icon .ui-icon{width:30px;height:30px}
.themed-audio-player .tap-play .ui-icon,.themed-audio-player .tap-mute .ui-icon{width:18px;height:18px}
.audio-pause-bars{position:relative;display:block;width:14px;height:16px}
.audio-pause-bars:before,.audio-pause-bars:after{content:"";position:absolute;top:1px;bottom:1px;width:4px;border-radius:2px;background:currentColor}
.audio-pause-bars:before{left:1px}.audio-pause-bars:after{right:1px}

/* ===== V23.2 · limpeza visual da landing e amostras ===== */

/* Remove definitivamente o emoji antigo de envelope das cartas de amostra.
   O ícone SVG específico do momento já existe dentro do título. */
.sealed-letter:before{
  content:none!important;
  display:none!important;
}
.sealed-letter{
  padding-left:18px!important;
}
.sealed-letter strong{
  display:flex!important;
  align-items:center!important;
  gap:10px!important;
}
.sealed-letter .dpv-moment-icon-sealed{
  flex:0 0 34px!important;
  width:34px!important;
  height:34px!important;
  padding:7px!important;
  background:rgba(255,255,255,.07)!important;
  border:1px solid rgba(255,255,255,.1)!important;
}

/* Ícones da seção “Pequenas experiências…”:
   o elemento é a própria máscara SVG, então o fundo precisa ser currentColor. */
.feature-btn .feature-icon.ui-icon{
  width:24px!important;
  height:24px!important;
  padding:0!important;
  border:0!important;
  border-radius:0!important;
  background:currentColor!important;
  box-shadow:none!important;
  opacity:1!important;
}
.feature-btn[data-feature="gallery"] .feature-icon{color:#49c9f2!important}
.feature-btn[data-feature="timeline"] .feature-icon{color:#f2aa5d!important}
.feature-btn[data-feature="reasons"] .feature-icon{color:#ff6f9e!important}
.feature-btn[data-feature="countdown"] .feature-icon{color:#b58cff!important}
.feature-btn[data-feature="voice"] .feature-icon{color:#71a7ff!important}
.feature-btn{
  position:relative;
  overflow:hidden;
}
.feature-btn:before{
  content:"";
  position:absolute;
  left:14px;
  top:50%;
  width:46px;
  height:46px;
  transform:translateY(-50%);
  border-radius:15px;
  background:rgba(255,255,255,.055);
  border:1px solid rgba(255,255,255,.075);
  pointer-events:none;
}
.feature-btn .feature-icon{
  position:relative;
  z-index:1;
  margin:0 12px 0 1px!important;
}
.feature-btn[data-feature="gallery"]:before{background:rgba(73,201,242,.10);border-color:rgba(73,201,242,.16)}
.feature-btn[data-feature="timeline"]:before{background:rgba(242,170,93,.10);border-color:rgba(242,170,93,.16)}
.feature-btn[data-feature="reasons"]:before{background:rgba(255,111,158,.10);border-color:rgba(255,111,158,.16)}
.feature-btn[data-feature="countdown"]:before{background:rgba(181,140,255,.10);border-color:rgba(181,140,255,.16)}
.feature-btn[data-feature="voice"]:before{background:rgba(113,167,255,.10);border-color:rgba(113,167,255,.16)}

/* “Feito para ser pessoal...” mais próximo do design do produto. */
.landing-value-grid{
  gap:18px!important;
}
.landing-value article{
  position:relative;
  min-height:230px;
  padding:82px 24px 24px!important;
  border-radius:26px!important;
  background:
    radial-gradient(circle at 15% 8%,var(--value-glow,rgba(255,111,158,.10)),transparent 34%),
    linear-gradient(180deg,rgba(255,255,255,.06),rgba(255,255,255,.025))!important;
  border:1px solid rgba(255,255,255,.10)!important;
  box-shadow:0 18px 46px rgba(0,0,0,.14)!important;
  overflow:hidden;
}
.landing-value article:before{
  content:"";
  position:absolute;
  top:22px;
  left:22px;
  width:48px;
  height:48px;
  border-radius:16px;
  background:var(--value-tile,rgba(255,111,158,.10));
  border:1px solid var(--value-line,rgba(255,111,158,.16));
}
.landing-value article:nth-child(1){--value-glow:rgba(255,101,158,.12);--value-tile:rgba(255,101,158,.11);--value-line:rgba(255,101,158,.18);--value-icon:#ff6fa0}
.landing-value article:nth-child(2){--value-glow:rgba(105,170,255,.11);--value-tile:rgba(105,170,255,.10);--value-line:rgba(105,170,255,.17);--value-icon:#73adff}
.landing-value article:nth-child(3){--value-glow:rgba(181,139,255,.11);--value-tile:rgba(181,139,255,.10);--value-line:rgba(181,139,255,.17);--value-icon:#b58cff}
.landing-value .ui-icon{
  position:absolute!important;
  top:34px!important;
  left:34px!important;
  z-index:1;
  display:block!important;
  width:24px!important;
  height:24px!important;
  padding:0!important;
  margin:0!important;
  border-radius:0!important;
  color:var(--value-icon,#ff6fa0)!important;
  background:currentColor!important;
}
.landing-value strong{
  font-size:1.18rem!important;
  line-height:1.35!important;
  color:#fff!important;
  margin-bottom:10px!important;
}
.landing-value p{
  color:rgba(255,255,255,.69)!important;
  line-height:1.72!important;
}

/* O título do bloco de criação não pode ficar espremido nem parecer cortado. */
.creator-launch .launch-copy{
  min-width:0!important;
  width:100%!important;
}
.creator-launch .launch-copy h3{
  width:min(100%,760px)!important;
  max-width:none!important;
  font-size:clamp(2rem,3.5vw,3.5rem)!important;
  line-height:1.04!important;
  letter-spacing:-.035em!important;
  text-wrap:balance!important;
  overflow:visible!important;
  display:block!important;
  -webkit-line-clamp:unset!important;
  -webkit-box-orient:unset!important;
}
.creator-launch .launch-copy p{
  width:min(100%,720px)!important;
  max-width:none!important;
}

/* Mantém ícones da landing nítidos em vez de “cinza apagado”. */
.landing-story-points .ui-icon,
.microproof .ui-icon,
.home-publish-item .ui-icon,
.landing-final-card .ui-icon{
  background:currentColor!important;
  opacity:1!important;
}
.landing-story-points>div:nth-child(1) .ui-icon{color:#ff75a9!important}
.landing-story-points>div:nth-child(2) .ui-icon{color:#76afff!important}
.landing-story-points>div:nth-child(3) .ui-icon{color:#b58cff!important}

@media(max-width:760px){
  .feature-btn:before{left:12px;width:42px;height:42px;border-radius:14px}
  .feature-btn .feature-icon{margin-right:10px!important}
  .landing-value article{min-height:0;padding:78px 20px 22px!important}
  .creator-launch .launch-copy h3{font-size:clamp(2rem,9vw,3rem)!important;line-height:1.06!important}
}