.main.main-mail{--sky-soft:#e1ebf0;--violet:#6e5a93;--violet-soft:#eae5f1;grid-template-columns:200px 340px 1fr;grid-template-areas:"folders list read";max-width:none;height:100dvh;padding:0;display:grid;position:sticky;top:0;overflow:hidden}.main-mail .tone-accent{background:var(--accent-soft);color:var(--accent)}.main-mail .tone-brick{background:var(--brick-soft);color:var(--brick)}.main-mail .tone-violet{background:var(--violet-soft);color:var(--violet)}.main-mail .tone-sky{background:var(--sky-soft);color:var(--sky)}.main-mail .tone-amber{background:var(--amber-soft);color:var(--amber)}.main-mail .tone-gray{background:var(--paper);color:var(--ink-soft)}.main-mail .av{border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;font-weight:600;display:flex}.main-mail .av.md{width:36px;height:36px;font-size:12px}.main-mail .av.lg{width:42px;height:42px;font-size:13px}.main-mail .btn:disabled{opacity:.5;cursor:not-allowed}.main-mail .btn.ghost{color:var(--ink);background:0 0}.main-mail .folders{background:var(--paper-raised);border-right:1px solid var(--line);flex-direction:column;grid-area:folders;gap:4px;padding:18px 12px;display:flex;overflow-y:auto}.main-mail .compose-btn{justify-content:center;align-items:center;gap:7px;margin:0 4px 12px;display:flex}.main-mail .folder{border-radius:var(--radius-s);width:100%;font:inherit;color:var(--ink-soft);cursor:pointer;text-align:left;background:0 0;border:0;align-items:center;gap:10px;padding:9px 12px;font-size:13px;display:flex}.main-mail .folder svg{flex-shrink:0;width:16px;height:16px}.main-mail .folder:hover{background:var(--paper)}.main-mail .folder.active{background:var(--accent-soft);color:var(--accent);font-weight:600}.main-mail .folder .cnt{color:var(--ink-faint);margin-left:auto;font-size:11.5px}.main-mail .folder.active .cnt{color:var(--accent)}.main-mail .list{border-right:1px solid var(--line);background:var(--paper-raised);flex-direction:column;grid-area:list;min-width:0;min-height:0;display:flex}.main-mail .list-head{padding:18px 16px 10px}.main-mail .list-title{margin-bottom:10px;font-family:Fraunces,serif;font-size:20px;font-weight:500}.main-mail .search{border:1px solid var(--line);color:var(--ink-faint);border-radius:20px;align-items:center;gap:7px;padding:7px 12px;font-size:12.5px;display:flex}.main-mail .search input{min-width:0;font:inherit;color:var(--ink);background:0 0;border:none;outline:none;flex:1}.main-mail .search:focus-within{border-color:var(--accent)}.main-mail .rows{border-top:1px solid var(--line);flex:1;min-height:0;overflow-y:auto}.main-mail .mrow{border:0;border-bottom:1px solid var(--line);width:100%;font:inherit;text-align:left;cursor:pointer;color:inherit;background:0 0;align-items:flex-start;gap:11px;padding:13px 16px;display:flex;position:relative}.main-mail .mrow:hover{background:var(--paper)}.main-mail .mrow.active{background:var(--accent-soft)}.main-mail .mrow.unread:before{content:"";background:var(--accent);width:3px;position:absolute;top:0;bottom:0;left:0}.main-mail .mrow-body{flex:1;min-width:0}.main-mail .mrow-top{justify-content:space-between;gap:8px;display:flex}.main-mail .mrow-from{text-overflow:ellipsis;white-space:nowrap;font-size:13px;overflow:hidden}.main-mail .mrow.unread .mrow-from,.main-mail .mrow.unread .mrow-subj{font-weight:600}.main-mail .mrow-time{color:var(--ink-faint);flex-shrink:0;font-size:11px}.main-mail .mrow-subj{text-overflow:ellipsis;white-space:nowrap;margin-top:1px;font-size:12.5px;overflow:hidden}.main-mail .mrow-prev{color:var(--ink-faint);text-overflow:ellipsis;white-space:nowrap;margin-top:1px;font-size:12px;overflow:hidden}.main-mail .star{cursor:pointer;color:var(--ink-faint);background:0 0;border:0;flex-shrink:0;padding:0;font-size:15px;line-height:1}.main-mail .star.on{color:var(--amber)}.main-mail .clip{margin-left:4px;font-size:11px}.main-mail .empty{text-align:center;color:var(--ink-faint);padding:40px 16px;font-size:13px}.main-mail .reader{flex-direction:column;grid-area:read;min-width:0;min-height:0;display:flex;overflow-y:auto}.main-mail .reader-bar{border-bottom:1px solid var(--line);background:var(--paper-raised);z-index:1;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 28px;display:flex;position:sticky;top:0}.main-mail .back{display:none}.main-mail .reader-bar .spacer{flex:1}.main-mail .btn.small{padding:6px 12px;font-size:12.5px}.main-mail .btn.danger{color:var(--brick)}.main-mail .reader-body{max-width:760px;padding:26px 28px 40px}.main-mail .subject{margin:0 0 18px;font-family:Fraunces,serif;font-size:24px;font-weight:500;line-height:1.25}.main-mail .from-row{border-bottom:1px solid var(--line);align-items:center;gap:12px;margin-bottom:22px;padding-bottom:18px;display:flex}.main-mail .from-name{font-size:14px;font-weight:600}.main-mail .from-meta{color:var(--ink-faint);overflow-wrap:anywhere;font-size:12px}.main-mail .mail-text p{margin:0 0 12px;font-size:14px;line-height:1.6}.main-mail .attach{flex-wrap:wrap;gap:8px;margin-top:20px;display:flex}.main-mail .attach-chip{border:1px solid var(--line);border-radius:var(--radius-s);background:var(--paper-raised);align-items:center;gap:8px;padding:8px 12px;font-size:12.5px;display:flex}.main-mail .attach-chip small{color:var(--ink-faint)}.main-mail .reader-empty{text-align:center;color:var(--ink-faint);margin:auto;padding:20px}.main-mail .reader-empty .t{color:var(--ink);margin-bottom:4px;font-family:Fraunces,serif;font-size:20px}.mail-overlay{z-index:80;background:#1c262266;justify-content:center;align-items:center;padding:16px;display:flex;position:fixed;inset:0}.mail-compose{border:1px solid var(--line);border-radius:var(--radius-m);width:100%;max-width:620px;max-height:100%;color:var(--ink);background:#fff;flex-direction:column;font-family:IBM Plex Sans,sans-serif;display:flex;box-shadow:0 20px 50px #1c262240}.mail-compose header{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:14px 18px;font-size:14px;font-weight:600;display:flex}.mail-compose header button{cursor:pointer;color:var(--ink-faint);background:0 0;border:0;padding:2px 6px;font-size:20px;line-height:1}.mail-compose .f{border-bottom:1px solid var(--line);align-items:center;gap:10px;padding:0 18px;display:flex}.mail-compose .f label{color:var(--ink-faint);flex-shrink:0;width:44px;font-size:12.5px}.mail-compose .f input{min-width:0;font:inherit;color:var(--ink);background:0 0;border:0;outline:0;flex:1;padding:12px 0;font-size:14px}.mail-compose textarea{resize:none;min-height:220px;font:inherit;color:var(--ink);background:0 0;border:0;outline:0;flex:1;padding:14px 18px;font-size:14px;line-height:1.55}.mail-compose footer{border-top:1px solid var(--line);align-items:center;gap:8px;padding:12px 18px;display:flex}.mail-compose footer .sp{flex:1}.mail-compose .err{color:var(--brick);padding:8px 18px 0;font-size:12.5px}@media (max-width:1100px){.main.main-mail{grid-template:"folders folders""list read"1fr/340px 1fr}.main-mail .folders{border-right:0;border-bottom:1px solid var(--line);scrollbar-width:none;flex-direction:row;align-items:center;gap:6px;padding:10px 14px;overflow:auto hidden}.main-mail .folders::-webkit-scrollbar{display:none}.main-mail .compose-btn{flex-shrink:0;margin:0 6px 0 0}.main-mail .folder{border:1px solid var(--line);white-space:nowrap;border-radius:20px;flex-shrink:0;width:auto;padding:6px 12px}.main-mail .folder svg{display:none}.main-mail .folder.active{border-color:var(--accent)}}@media (max-width:767px){.main.main-mail{height:calc(100vh - 64px);height:calc(100dvh - 64px - env(safe-area-inset-bottom,0px));grid-template:"folders""list"1fr/1fr;position:static}.main-mail .reader{display:none}.main-mail.has-active{grid-template-rows:1fr;grid-template-areas:"read"}.main-mail.has-active .folders,.main-mail.has-active .list{display:none}.main-mail.has-active .reader{display:flex}.main-mail .back{display:inline-flex}.main-mail .list{border-right:0}.main-mail .reader-bar{padding:10px 14px}.main-mail .reader-body{padding:18px 16px 32px}.main-mail .subject{font-size:21px}.main-mail .search input{font-size:16px}.mail-overlay{align-items:stretch;padding:0}.mail-compose{border:0;border-radius:0;max-width:none}.mail-compose .f input,.mail-compose textarea{font-size:16px}}
