.email-editor-shell{min-height:calc(100vh - var(--header-height) - 4rem);flex-direction:column;gap:1rem;display:flex}.email-editor-loading{border:1px solid var(--color-gray-200);background:var(--color-white);border-radius:8px;min-height:28rem}.email-editor-meta{border:1px solid var(--color-gray-200);background:var(--color-white);border-radius:8px;grid-template-columns:minmax(14rem,1.2fr) minmax(14rem,1.4fr) auto;align-items:end;gap:.75rem;padding:1rem;display:grid}.email-field{gap:.35rem;min-width:0;display:grid}.email-field span,.output-meta span{color:var(--color-gray-500);text-transform:uppercase;font-size:.75rem;font-weight:600;line-height:1.1}.email-field input{border:1px solid var(--color-gray-200);width:100%;min-height:2.5rem;color:var(--color-gray-900);font:inherit;border-radius:6px;padding:.55rem .7rem}.email-field input:focus,.output-textarea:focus{border-color:var(--color-primary);outline:3px solid #e85d0426}.email-actions,.download-actions,.output-toolbar{align-items:center;gap:.5rem;display:flex}.email-editor-grid{flex:1;grid-template-columns:minmax(0,1fr) minmax(22rem,34%);gap:1rem;min-height:40rem;display:grid}.editor-panel,.output-panel{border:1px solid var(--color-gray-200);background:var(--color-white);border-radius:8px;min-width:0}.editor-panel{overflow:hidden}.react-email-editor{min-height:40rem;padding:2rem}.react-email-editor .ProseMirror{border:1px solid var(--color-gray-200);background:var(--color-white);overflow-wrap:anywhere;border-radius:8px;width:min(100%,42rem);max-width:42rem;min-height:32rem;margin:0 auto;padding:2.5rem;box-shadow:0 10px 30px #11182712}.react-email-editor .ProseMirror:focus{outline:3px solid #e85d041f}.react-email-editor .ProseMirror *{overflow-wrap:anywhere;max-width:100%}.output-panel{flex-direction:column;gap:.85rem;padding:1rem;display:flex}.output-toolbar{justify-content:space-between}.output-tabs{border:1px solid var(--color-gray-200);background:var(--color-gray-50);border-radius:7px;padding:.2rem;display:inline-flex}.output-tabs button{min-height:2rem;color:var(--color-gray-600);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:5px;padding:.25rem .65rem;font-size:.8125rem;font-weight:600}.output-tabs button[aria-selected=true]{background:var(--color-white);color:var(--color-gray-900);box-shadow:0 1px 2px #11182714}.output-meta{background:var(--color-gray-50);border-radius:8px;gap:.6rem;padding:.75rem;display:grid}.output-meta div{gap:.2rem;min-width:0;display:grid}.output-meta strong{overflow-wrap:anywhere;color:var(--color-gray-900);font-size:.875rem;font-weight:600;line-height:1.4}.output-textarea,.email-preview{border:1px solid var(--color-gray-200);background:var(--color-white);border-radius:8px;flex:1;width:100%;min-height:26rem}.output-textarea{resize:none;color:var(--color-gray-800);font-family:var(--font-mono);padding:.75rem;font-size:.75rem;line-height:1.55}.email-preview{display:block}.download-actions{flex-wrap:wrap;justify-content:flex-end}.primary-button,.secondary-button{min-height:2.5rem;font:inherit;cursor:pointer;border-radius:6px;font-size:.875rem;font-weight:600;transition:background .15s,border-color .15s,color .15s}.primary-button{border:1px solid var(--color-primary);background:var(--color-primary);color:var(--color-white);padding:.5rem .9rem}.primary-button:hover{border-color:var(--color-primary-dark);background:var(--color-primary-dark)}.secondary-button{border:1px solid var(--color-gray-200);background:var(--color-white);color:var(--color-gray-700);padding:.5rem .8rem}.secondary-button:hover{border-color:var(--color-gray-300);background:var(--color-gray-50)}.primary-button:disabled,.secondary-button:disabled{cursor:not-allowed;opacity:.55}.compact{min-height:2.1rem;padding:.35rem .65rem;font-size:.8125rem}@media (width<=1100px){.email-editor-meta,.email-editor-grid{grid-template-columns:1fr}.email-actions{justify-content:flex-end}.output-panel{min-height:34rem}}@media (width<=640px){.email-editor-shell{min-height:auto}.email-editor-meta,.output-panel{padding:.75rem}.react-email-editor{min-height:34rem;padding:.75rem}.react-email-editor .ProseMirror{min-height:28rem;padding:1.25rem}.output-toolbar,.download-actions,.email-actions{flex-direction:column;align-items:stretch}.output-tabs,.output-tabs button,.primary-button,.secondary-button{width:100%}}