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