.product-email-workspace{color: var(--text)}.product-email-hero{display: flex;justify-content: space-between;gap: 24px;align-items: flex-start;margin-bottom: 20px}.product-email-title{display: flex;gap: 14px;align-items: flex-start}.product-email-title .product-favicon{width: 32px;height: 32px}.product-email-title h2{margin: 4px 0 6px;font-size: 24px;letter-spacing: -.5px}.product-email-title p{margin: 0;color: var(--muted, var(--muted));font-size: 13px}.email-editor-note{display: flex;gap: 10px;align-items: center;padding: 12px 14px;border: 1px solid var(--line, var(--line));border-radius: 8px;background: var(--surface-muted);color: var(--muted, var(--muted));font-size: 12px;line-height: 1.6;margin-bottom: 22px}.email-editor-note svg{width: 17px;flex: 0 0 auto}.product-email-layout{display: grid;grid-template-columns: minmax(190px,260px) minmax(0,1fr);gap: 20px;align-items: start}.product-email-list,.product-email-editor{border: 1px solid var(--line, var(--line));border-radius: 10px;background: var(--surface)}.product-email-list{padding: 14px}.product-email-list-head{display: flex;justify-content: space-between;align-items: center;gap: 10px;margin-bottom: 12px}.product-email-list-head h3{margin: 0;font-size: 14px}.product-email-list-head button{font-size: 12px;min-height: 32px;padding: 7px 10px}.product-email-list-item{display: block;width: 100%;text-align: left;border: 1px solid transparent;border-radius: 7px;background: transparent;padding: 11px 10px;margin-top: 4px;color: var(--text)}.product-email-list-item:hover{background: var(--surface-muted)}.product-email-list-item.active{border-color: color-mix(in srgb, var(--badge-info-dot) 35%, transparent);background: var(--badge-accent-bg)}.product-email-list-item strong,.product-email-list-item small,.product-email-list-item .email-event{display: block}.product-email-list-item strong{font-size: 12px;margin: 4px 0}.product-email-list-item small{font-size: 12px;color: var(--faint, var(--muted));overflow-wrap: anywhere}.email-event{font-size: 12px;color: var(--badge-info-fg);text-transform: uppercase;letter-spacing: .04em}.product-email-editor{padding: 22px}.email-template-form{display: grid;gap: 15px}.email-editor-heading{display: flex;justify-content: space-between;align-items: flex-start;border-bottom: 1px solid var(--line, var(--line));padding-bottom: 14px;margin-bottom: 2px}.email-editor-heading h3{margin: 4px 0 0;font-size: 18px}.email-template-form label{display: grid;gap: 6px;font-size: 12px;color: var(--muted, var(--muted))}.email-template-form input,.email-template-form select,.email-template-form textarea{width: 100%;box-sizing: border-box;border: 1px solid var(--line, var(--line-strong));border-radius: 7px;background: var(--surface);color: var(--text);padding: 10px 11px;font: inherit;font-size: 13px}.email-template-form textarea{resize: vertical;line-height: 1.6}.email-template-form :is(input,select,textarea):focus{outline: 2px solid var(--focus-ring);outline-offset: -1px}.email-variables{display: flex;gap: 7px;align-items: center;flex-wrap: wrap}.email-variables>span{font-size: 12px;color: var(--faint, var(--muted));margin-right: 3px}.variable-chip{border: 1px solid color-mix(in srgb, var(--badge-info-dot) 35%, transparent);background: var(--surface-muted);color: var(--badge-info-fg);border-radius: 999px;padding: 5px 8px;font: inherit;font-size: 12px;cursor: pointer}.email-preview{border: 1px solid var(--line, var(--line));border-radius: 8px;background: var(--surface);padding: 16px}.email-preview h4{margin: 5px 0 8px;font-size: 15px}.email-preview p{white-space: pre-wrap;margin: 0;color: var(--muted, var(--muted));font-size: 13px;line-height: 1.65}.email-save-status{font-size: 12px;color: var(--badge-info-fg);min-height: 18px;margin: 0}.product-email-workspace button:focus-visible{outline: 2px solid #6550bb;outline-offset: 2px}@media(max-width:700px){.product-email-hero{flex-direction: column}.product-email-layout{grid-template-columns: 1fr}.product-email-list{order: 2}.product-email-editor{order: 1}.product-email-title h2{font-size: 21px}}
