html { scrollbar-gutter:stable; }
body { height:auto; min-height:100dvh; padding:24px; background:var(--aster-sunk); }
main { max-width:1600px; margin:auto; min-width:0; }
.mail-intro { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-block:20px; }
.mail-intro h1 { margin:0; font-size:2rem; letter-spacing:-.04em; }.mail-intro p { margin-block:8px; color:var(--aster-text-2); }
.mail-eyebrow { font-size:.72rem; letter-spacing:.12em; }.mail-appearance,.mail-demo-controls { display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.mail-demo-controls { margin-block:20px; font-size:.84rem; }.mail-demo-controls > span { margin-inline-end:auto; color:var(--aster-text-2); }
.mail-top { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:18px; padding:18px 22px; background:var(--aster-accent); color:var(--aster-on-accent,white); border-radius:var(--aster-r-card) var(--aster-r-card) 0 0; }
.mail-top strong { display:flex; align-items:center; gap:10px; font-size:1.2rem; }.mail-top small { display:block; opacity:.9; }
.mail-search { display:grid; gap:5px; min-width:min(320px,100%); font-size:.8rem; }.mail-search input { width:100%; padding:8px 12px; border:1px solid var(--aster-rule); border-radius:var(--aster-r-ctl); background:var(--aster-surface); color:var(--aster-text); }
.mail-layout { display:grid; grid-template-columns:175px minmax(280px,1fr) minmax(300px,1fr); grid-template-rows:auto minmax(440px,58dvh); min-width:0; border:1px solid var(--aster-rule); background:var(--aster-surface); border-radius:0 0 var(--aster-r-card) var(--aster-r-card); overflow:clip; }
.mail-folders { grid-row:1 / 3; padding:16px 8px; background:var(--aster-sunk); border-inline-end:1px solid var(--aster-rule); }.mail-folders h2 { font-size:.8rem; padding-inline:12px; color:var(--aster-text-2); }
.mail-actions { grid-column:2 / 4; padding:10px; border-block-end:1px solid var(--aster-rule); }.mail-actions .aster-command-bar { flex-wrap:wrap; }
.mail-list,.mail-reader { min-width:0; min-height:0; overflow:hidden; }.mail-list { border-inline-end:1px solid var(--aster-rule); display:flex; flex-direction:column; }.mail-list > .aster-composite-child { display:flex; flex:1; min-height:0; }
.mail-list h2 { font-size:1rem; margin:16px; }.mail-list aster-grid { flex:1; min-height:0; }
.mail-reader { padding:12px 18px; overflow:auto; }.mail-reader aster-tabs { display:block; min-width:0; }.mail-reader [role="tabpanel"] { padding:20px 0; }
.mail-welcome { padding:35px 12px; }.mail-welcome h2 { font-size:1.6rem; letter-spacing:-.03em; }.mail-welcome p,.mail-meta { color:var(--aster-text-2); line-height:1.7; }
.mail-message h2 { line-height:1.3; font-size:1.35rem; }.mail-body { white-space:pre-wrap; line-height:1.8; overflow-wrap:anywhere; }
.mail-draft { display:grid; gap:16px; }.mail-draft label { display:grid; gap:6px; }.mail-draft input,.mail-draft textarea { width:100%; min-width:0; padding:10px 12px; border:1px solid var(--aster-rule); border-radius:var(--aster-r-ctl); background:var(--aster-sunk); color:var(--aster-text); font:inherit; }.mail-draft textarea { min-height:220px; resize:vertical; }
#notice { min-height:1.5em; color:var(--aster-text-2); }.mail-error { color:var(--aster-negative); }
#login .aster-dialog-panel { padding:0; max-width:740px; width:min(740px,calc(100vw - 36px)); } .mail-auth { display:grid; grid-template-columns:230px minmax(0,1fr); }
.mail-auth-brand { padding:32px 24px; background:#143e2c; color:#f8f5ee; border-radius:var(--aster-r-card) 0 0 var(--aster-r-card); display:flex; flex-direction:column; gap:28px; }.mail-auth-brand strong { font-size:2rem; line-height:1.15; font-weight:500; }.mail-auth-brand p { line-height:1.7; font-size:.9rem; opacity:.85; }
.mail-auth-form { padding:32px; min-width:0; }.mail-auth-form h2 { margin-block:0 12px; font-size:1.7rem; letter-spacing:-.03em; }.mail-auth-form > p { color:var(--aster-text-2); line-height:1.6; }.mail-auth-options { display:grid; gap:10px; margin-block:24px 16px; }.mail-auth-options button { display:flex; align-items:center; gap:12px; text-align:start; padding:12px 14px; }.mail-auth-options svg { width:20px; height:20px; fill:none; stroke:currentColor; stroke-width:1.8; flex:none; }.mail-auth-preview { padding:12px; background:var(--aster-sunk); border-radius:var(--aster-r-ctl); font-size:.85rem; }.mail-auth-links { display:flex; flex-wrap:wrap; gap:10px; margin-block-start:16px; }.mail-auth-links button { font-size:.8rem; }
@media(max-width:1050px) { .mail-layout { grid-template-columns:150px minmax(0,1fr); grid-template-rows:auto 350px minmax(330px,auto); }.mail-actions { grid-column:2; }.mail-folders { grid-row:1 / 4; }.mail-reader { grid-column:2; border-block-start:1px solid var(--aster-rule); }.mail-list { border:0; } }
@media(max-width:600px) { body { padding:12px; }.mail-intro { display:block; }.mail-appearance { margin-block-start:18px; }.mail-layout { display:flex; flex-direction:column; }.mail-folders { border:0; padding:6px; }.mail-folders h2 { display:none; }.mail-folders .aster-sidebar ul { display:flex; flex-wrap:wrap; }.mail-folders .aster-sidebar-label { display:inline; }.mail-list { height:340px; }.mail-reader { min-height:350px; }.mail-top { padding:14px; }.mail-top > span { font-size:.8rem; }.mail-search { order:3; width:100%; }.mail-auth { grid-template-columns:minmax(0,1fr); }.mail-auth-brand { display:none; }.mail-auth-form { padding:24px; } }
.mail-lab { margin-block:16px; border:1px solid var(--aster-rule); border-radius:var(--aster-r-ctl); background:var(--aster-surface); }
.mail-lab > summary { cursor:pointer; padding:12px 16px; font-weight:600; color:var(--aster-text-2); }.mail-lab .mail-demo-controls { margin:0; padding:4px 16px 16px; }
.mail-feedback,.mail-draft-error { border:1px solid var(--aster-rule); border-inline-start:3px solid var(--aster-negative); background:var(--aster-surface); padding:16px 20px; display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:16px; }
.mail-feedback[hidden] { display:none; }.mail-feedback h2,.mail-draft-error h3 { font-size:1rem; margin:0 0 6px; }.mail-feedback p,.mail-draft-error p { margin:0; color:var(--aster-text-2); line-height:1.6; }.mail-feedback-actions { display:flex; flex-wrap:wrap; gap:8px; }
.mail-draft-error { border-radius:var(--aster-r-ctl); background:var(--aster-sunk); }.mail-message > header { display:flex; gap:14px; align-items:flex-start; padding-block:12px 20px; border-block-end:1px solid var(--aster-rule); }.mail-message h2 { margin-block:0 12px; }.mail-message .mail-meta { margin:0; }
.mail-avatar { display:grid; place-items:center; flex:none; width:42px; height:42px; border-radius:50%; background:var(--aster-sunk); color:var(--aster-accent); border:1px solid var(--aster-rule); font-weight:600; }.mail-body { padding-block:12px; }

.mail-unread { font-weight:650; }.mail-unread-dot { display:inline-block; width:6px; height:6px; border-radius:50%; background:var(--aster-accent); margin-inline-end:7px; }.mail-subject { display:grid; gap:3px; min-width:0; }.mail-subject > span,.mail-subject small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.mail-subject small { color:var(--aster-text-2); font-size:.8rem; font-weight:400; }

.mail-sender { display:block; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }.mail-validation { color:var(--aster-negative); }
#discard .aster-dialog-panel { width:min(420px,calc(100vw - 32px)); padding:24px; box-sizing:border-box; }
#discard h2 { margin:0; font-size:1.3rem; line-height:1.35; letter-spacing:-.02em; }
#discard p { margin:12px 0 24px; color:var(--aster-text-2); line-height:1.6; }
.mail-confirm-actions { display:flex; justify-content:flex-end; flex-wrap:wrap; gap:10px; }