.compact-compose{width:auto!important;align-self:flex-start!important;padding:9px 13px!important;font-size:13px!important;box-shadow:none!important}.compact-compose span{font-weight:800}

/* NeoGian mailbox shell: one navigation column plus one active work area. */
.mail-layout{grid-template-columns:226px minmax(0,1fr)!important}
.mail-content{grid-column:2;min-width:0;min-height:0;position:relative;display:block}
.mail-content>.message-pane,.mail-content>.reader{width:100%;height:100%;min-width:0;min-height:0}
.mail-content>.reader{overflow:auto}
body:not(:has(.compose)):not(:has(.message)) .mail-content>.reader{display:none}
body:has(.message) .mail-content>.message-pane{display:none}
body:has(.compose) .mail-content>.reader{position:absolute;inset:0;z-index:5;padding:0;background:transparent;overflow:visible;pointer-events:none}
body:has(.compose) .compose-modern{pointer-events:auto}
body{overflow:hidden}.mail-app{height:100vh;min-height:0!important;overflow:hidden}.mail-layout{height:calc(100vh - 78px);overflow:hidden}.sidebar{min-height:0;overflow-y:auto}.mail-content,.message-pane{height:100%;overflow:hidden}.message-list{overflow-y:auto!important}.reader{height:100%;overflow-y:auto!important}
.brand-logo{display:block;object-fit:contain;object-position:center}
.brand-lockup .brand-logo{width:178px;height:42px}
.login .brand-logo{width:min(100%,260px);height:70px;object-position:left center;margin-bottom:10px}
.brand-logo-light,.brand-logo-dark{content:url('/assets/neogian-logo-light-transparent.png')}
.brand-lockup>span{display:none}
.compose-btn{display:inline-flex!important;align-items:center;justify-content:center;gap:5px;background:linear-gradient(135deg,#00a894,#087f8c)!important;color:#fff!important;text-decoration:none!important;box-shadow:0 8px 18px rgba(0,137,125,.22)!important;transform:none!important;transition:background-color .15s ease,box-shadow .15s ease!important}
.compose-btn:visited,.compose-btn:hover,.compose-btn:focus{color:#fff!important}
.compose-btn .compose-icon{font-size:16px;line-height:1}
.labels-section .label-item{cursor:pointer;text-decoration:none}
.label-action{display:flex;align-items:center;gap:6px}.label-action select{width:auto;padding:8px;font-size:12px}.label-action button{padding:8px 11px;font-size:12px}
.compose-modern{width:min(620px,calc(100% - 40px));max-height:calc(100vh - 125px);margin:0!important;position:absolute!important;right:20px;bottom:20px;border-radius:14px!important}
.compose-modern .recipient-row{min-height:43px}
.compose-modern .recipient-placeholder{display:block;width:100%;flex:1;border:0;background:transparent!important;color:var(--muted);text-align:left;padding:0!important;font:inherit;box-shadow:none!important}.compose-modern .recipient-row:not(.is-expanded)>label,.compose-modern .recipient-row:not(.is-expanded)>.inline-toggle{display:none!important}.compose-modern .recipient-row.is-expanded>.recipient-placeholder{display:none!important}.compose-modern .recipient-row.is-expanded{display:flex;align-items:center}.compose-modern .recipient-row.is-expanded>label{display:grid!important;flex:1}.compose-modern .recipient-row .inline-toggle{margin-left:8px}
.compose-modern .recipient-row>label{display:grid;grid-template-columns:24px minmax(0,1fr);align-items:center;gap:4px}
.compose-modern .recipient-row>label:before{content:'To';font-weight:700;color:var(--text);font-size:13px;line-height:1;text-align:left}
.compose-modern .recipient-row>label input{flex:1}
.compose-modern .recipient-row input,.compose-modern .optional-field input,.compose-modern>label input{border:0!important;outline:0!important;box-shadow:none!important;background:transparent!important}
.compose-modern .recipient-row input:focus,.compose-modern .optional-field input:focus,.compose-modern>label input:focus{border:0!important;outline:0!important;box-shadow:none!important}
.compose-modern .optional-field{padding:0 18px!important}
.compose-modern .optional-field label{display:flex;align-items:center;gap:10px}
.compose-modern .optional-field:before{content:attr(data-field);text-transform:capitalize;font-weight:700;color:var(--text);font-size:13px;margin-right:10px}.compose-modern .optional-field{display:none;align-items:center}.compose-modern .optional-field.is-visible{display:flex}.compose-modern .optional-field input{min-width:0}
.compose-modern .optional-field input{flex:1}
.compose-modern .editor-toolbar{min-height:42px}
.editor-menu-wrap,.emoji-wrap,.send-split{position:relative;display:inline-flex}.editor-menu-trigger{min-width:74px;display:inline-flex!important;align-items:center;justify-content:flex-start;gap:5px;background:transparent!important;color:var(--text)!important;box-shadow:none!important}.menu-caret{font-size:10px;line-height:1;color:var(--muted)}.editor-popover,.schedule-popover{display:none;position:absolute;z-index:80;bottom:calc(100% + 7px);left:0;padding:6px;border:1px solid var(--line);border-radius:10px;background:var(--surface);box-shadow:0 12px 34px rgba(15,23,42,.22)}.editor-popover.is-open,.schedule-popover.is-open{display:flex;flex-direction:column}.editor-popover button,.schedule-popover button{border:0;background:transparent;color:var(--text);box-shadow:none;text-align:left;white-space:nowrap;padding:8px 12px}.editor-popover button:hover,.schedule-popover button:hover{background:var(--soft)}.size-picker .size-small{font-size:11px}.size-picker .size-normal{font-size:14px}.size-picker .size-large{font-size:18px}.size-picker .size-huge{font-size:24px}
.emoji-picker{width:286px;max-height:238px;overflow-y:auto;display:none!important;grid-template-columns:repeat(8,1fr);gap:2px}.emoji-picker.is-open{display:grid!important}.emoji-picker button{padding:6px;text-align:center;font-size:20px;line-height:1.2}.print-button{font-size:17px}.send-split>button:first-child{border-radius:9px 0 0 9px!important}.schedule-trigger{min-width:34px;padding:8px;border-left:1px solid rgba(255,255,255,.4)!important;border-radius:0 9px 9px 0!important}.schedule-popover{left:0;min-width:145px}.label-item.on{background:var(--soft);color:var(--brand);font-weight:800;border-radius:10px}
.compose-modern .editor-toolbar select:focus,.compose-modern .editor-toolbar button:focus{outline:2px solid color-mix(in srgb,var(--brand) 35%,transparent);outline-offset:-2px}
.compose-modern .body-field{padding:0!important}.compose-modern .editor{padding:15px 18px!important}
.compose-modern .compose-actions{gap:6px}
.compose-modern .compose-actions .schedule-button{display:none!important}
.compose-more-wrap{position:relative;display:inline-flex}.compose-menu{left:0!important;right:auto!important;bottom:44px!important}.compose-menu button{width:100%}
.ng-modal-backdrop{position:fixed;inset:0;z-index:1000;display:grid;place-items:center;padding:18px;background:rgba(10,18,33,.5);backdrop-filter:blur(2px)}
.ng-modal{width:min(430px,100%);border:1px solid var(--line);border-radius:16px;background:var(--surface);box-shadow:0 24px 70px rgba(0,0,0,.3);overflow:hidden}.ng-modal header,.ng-modal footer{display:flex;align-items:center;padding:14px 16px}.ng-modal header{justify-content:space-between;border-bottom:1px solid var(--line)}.ng-modal footer{justify-content:flex-end;gap:8px;border-top:1px solid var(--line)}.ng-modal-close{width:32px;height:32px;padding:0;border-radius:50%;background:transparent;color:var(--text);box-shadow:none}.ng-modal-body{padding:18px}.ng-modal-body label{display:flex;flex-direction:column;gap:7px;font-size:12px;font-weight:700}.ng-dialog-input{width:100%;height:42px;padding:9px 11px;border:1px solid var(--line);border-radius:9px;background:var(--surface);color:var(--text)}.schedule-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.bulk-toolbar{display:none;align-items:center;gap:7px;padding:9px 16px;border-bottom:1px solid var(--line);background:var(--soft);overflow-x:auto}.bulk-toolbar.is-visible{display:flex}.bulk-toolbar label{display:flex;align-items:center;gap:5px;white-space:nowrap;font-size:12px}.bulk-toolbar button,.bulk-toolbar select{width:auto;padding:7px 9px;font-size:12px;white-space:nowrap}.message-selector{width:15px;height:15px;accent-color:var(--brand);cursor:pointer}
@media(prefers-color-scheme:dark){.brand-logo-light,.brand-logo-dark{content:url('/assets/neogian-logo-dark-transparent.png')}}
@media(max-width:820px){
  body{overflow:auto}.mail-app{height:auto;min-height:100vh!important;overflow:visible}.mail-layout{height:auto;overflow:visible}
  .mail-layout{display:block!important;min-height:0!important}.mail-content{width:100%;min-height:0}
  .brand-lockup .brand-logo{width:145px;height:36px}
  .sidebar{display:grid!important;grid-template-columns:auto minmax(0,1fr);grid-auto-rows:max-content;align-content:start;align-items:center;height:auto!important;min-height:0!important;gap:8px!important;padding:10px!important;overflow:visible!important}
  .sidebar>.compose-btn{width:auto!important;margin:0!important;justify-self:start;white-space:nowrap}
  .sidebar>.nav-section:first-of-type{display:grid!important;grid-template-columns:repeat(5,minmax(0,1fr));min-width:0;width:100%;gap:2px!important}
  .sidebar .folder-link{justify-content:center;min-width:0;padding:0 6px!important;font-size:12px;white-space:nowrap}
  body:has(.compose) .mail-content>.reader{position:fixed!important;inset:0!important;z-index:50!important;padding:0!important;background:var(--bg)!important;overflow:auto!important;pointer-events:auto}
  .compose-modern{position:relative!important;inset:auto!important;width:calc(100% - 24px)!important;max-height:none;margin:12px auto!important}
  .compose-modern .editor-toolbar{max-width:100%;overflow-x:auto!important;overflow-y:hidden!important;scrollbar-width:thin}
  .compose-modern .compose-actions{max-width:100%;overflow-x:auto!important}
}
@media(max-width:480px){
  .topbar{padding:10px 12px!important;gap:8px!important}.brand-lockup .brand-logo{width:132px;height:32px}.search input{height:42px}
  .sidebar>.compose-btn{padding:8px 9px!important;font-size:12px!important}
  .sidebar>.nav-section:first-of-type{grid-template-columns:repeat(5,minmax(0,1fr))}
  .sidebar .folder-link{font-size:11px;padding:0 2px!important;min-height:34px!important}
  .compose-modern{width:calc(100% - 16px)!important;margin:8px auto!important;border-radius:11px!important}
  .compose-modern .reader-top{padding:10px 12px}.compose-modern>label,.compose-modern .recipient-row,.compose-modern .optional-field{padding-left:12px!important;padding-right:12px!important}
  .compose-modern .editor{min-height:210px!important;padding:12px!important}.compose-modern .editor-toolbar{padding:5px 8px!important;flex-wrap:wrap!important;overflow:visible!important}
  .compose-modern .compose-actions{padding:8px!important}.compose-modern .compose-actions button,.compose-modern .compose-actions .button{flex:0 0 auto!important}
}

/* r8 compact Gmail-style composer controls */
.compose-modern .editor-toolbar{display:flex!important;align-items:center!important;gap:2px!important;padding:4px 10px!important;min-height:36px!important}
.compose-modern .editor-toolbar>button,.compose-modern .editor-toolbar>.emoji-wrap>button,.compose-modern .editor-menu-trigger{width:28px!important;height:28px!important;min-width:28px!important;padding:0!important;margin:0!important;display:inline-flex!important;align-items:center!important;justify-content:center!important;border:0!important;border-radius:4px!important;background:transparent!important;box-shadow:none!important;font-size:14px!important;line-height:1!important}
.compose-modern .editor-menu-trigger{width:auto!important;min-width:68px!important;padding:0 4px!important;justify-content:flex-start!important}
.compose-modern .editor-toolbar input[type=color]{width:28px!important;height:28px!important;min-width:28px!important;padding:4px!important;margin:0!important;border:0!important;background:transparent!important}
.compose-modern .emoji-button{font-size:19px!important}.compose-modern .attachment-button{font-size:17px!important}.compose-modern .plain-button{font-size:12px!important;font-weight:700!important}
.compose-modern .compact-attachment{display:none!important}
.compose-modern .recipient-row.is-expanded>label{grid-template-columns:24px minmax(0,1fr)!important;align-items:center!important}
.compose-modern .recipient-row.is-expanded>label:before,.compose-modern .recipient-row.is-expanded>label input{align-self:center!important;margin:0!important;line-height:20px!important;height:20px!important;padding-top:0!important;padding-bottom:0!important}
.font-picker [data-v="Arial"]{font-family:Arial,sans-serif!important}.font-picker [data-v="Georgia"]{font-family:Georgia,serif!important}.font-picker [data-v="Verdana"]{font-family:Verdana,sans-serif!important}.font-picker [data-v="Tahoma"]{font-family:Tahoma,sans-serif!important}
.compose-modern .schedule-popover{min-width:116px!important;padding:3px!important}.compose-modern .schedule-popover button{padding:6px 8px!important;font-size:11px!important}
