:root{--bg:#fff;--bg-soft:#f4f5f7;--bg-selected:#e7efff;--fg:#1d2129;--muted:#69707d;--border:#dde1e6;--accent:#2463eb;--accent-fg:#fff;--danger:#c62828;--notice-bg:#fff6db;color:var(--fg);background:var(--bg);font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif;font-size:15px;line-height:1.45}@media (prefers-color-scheme:dark){:root{--bg:#15171c;--bg-soft:#1e2128;--bg-selected:#233154;--fg:#e6e8ec;--muted:#98a0ad;--border:#2f333c;--accent:#5b8cff;--accent-fg:#0b0d12;--danger:#ff6b6b;--notice-bg:#3a3420}}*{box-sizing:border-box}body{background:var(--bg);margin:0}h1,h2,h3{margin:0 0 .6rem;line-height:1.25}button{font:inherit;color:inherit;background:var(--bg-soft);border:1px solid var(--border);cursor:pointer;border-radius:6px;padding:.35rem .8rem}button:disabled{opacity:.6;cursor:default}button.primary{background:var(--accent);border-color:var(--accent);color:var(--accent-fg);font-weight:600}button.danger{color:var(--danger)}button.link{color:var(--accent);background:0 0;border:none;align-self:flex-start;padding:0}input,textarea{font:inherit;color:inherit;background:var(--bg);border:1px solid var(--border);border-radius:6px;width:100%;padding:.45rem .6rem}textarea{resize:vertical;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:.9rem}.muted{color:var(--muted)}.error{color:var(--danger)}.centered{text-align:center;max-width:28rem;margin:4rem auto;padding:0 1rem}.card{border:1px solid var(--border);border-radius:10px;padding:2rem 1.5rem}.layout{grid-template:"top top top""side list detail"1fr/11rem minmax(18rem,26rem) 1fr;height:100vh;display:grid}.topbar{border-bottom:1px solid var(--border);grid-area:top;align-items:center;gap:1rem;padding:.6rem 1rem;display:flex}.topbar .muted{text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.sidebar{border-right:1px solid var(--border);flex-direction:column;grid-area:side;gap:.25rem;padding:.75rem;display:flex}.sidebar .primary{margin-bottom:.75rem}.folder{text-align:left;background:0 0;border-color:#0000}.folder.active{background:var(--bg-selected);font-weight:600}.list{border-right:1px solid var(--border);grid-area:list;overflow-y:auto}.list-header{border-bottom:1px solid var(--border);background:var(--bg);justify-content:space-between;align-items:center;padding:.5rem .75rem;display:flex;position:sticky;top:0}.messages{margin:0;padding:0;list-style:none}.message-row{text-align:left;border:none;border-bottom:1px solid var(--border);background:0 0;border-radius:0;flex-direction:column;gap:.1rem;width:100%;padding:.6rem .75rem;display:flex}.message-row.selected{background:var(--bg-selected)}.message-row.unread .from,.message-row.unread .subject{font-weight:700}.row-top{justify-content:space-between;gap:.5rem;display:flex}.from,.subject,.snippet{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.date,.snippet{color:var(--muted);font-size:.85rem}.date{flex-shrink:0}.empty{padding:1rem .75rem}.load-more{margin:.75rem}.detail{grid-area:detail;padding:1rem 1.25rem;overflow-y:auto}.toolbar{flex-wrap:wrap;gap:.4rem;margin-bottom:1rem;display:flex}.headers{grid-template-columns:max-content 1fr;gap:.15rem .75rem;margin:0 0 1rem;font-size:.9rem;display:grid}.headers dt{color:var(--muted)}.headers dd{word-break:break-word;margin:0}.notice{background:var(--notice-bg);border-radius:6px;padding:.4rem .6rem;font-size:.9rem}.body{white-space:pre-wrap;word-break:break-word;border-top:1px solid var(--border);margin:0;padding-top:1rem;font-family:inherit}.attachments{border-top:1px solid var(--border);margin-top:1.5rem;padding-top:1rem}.compose{flex-direction:column;gap:.6rem;max-width:50rem;display:flex}.compose label{color:var(--muted);flex-direction:column;gap:.2rem;font-size:.85rem;display:flex}.compose label input,.compose label textarea{color:var(--fg);font-size:.95rem}.toast{background:var(--fg);color:var(--bg);border-radius:6px;padding:.5rem 1rem;position:fixed;bottom:1rem;left:50%;transform:translate(-50%)}@media (max-width:760px){.layout{grid-template:"top""side""main"1fr/1fr;height:auto;min-height:100vh}.sidebar{border-right:none;border-bottom:1px solid var(--border);flex-flow:wrap}.sidebar .primary{margin:0 .5rem 0 0}.list,.detail{border-right:none;grid-area:main;overflow:visible}.hidden-narrow{display:none}}
