/* A lightweight, game-native mailbox. All illustration is CSS; no image download or blur layer. */
body[data-page="account"]:has([data-tab="mail"].active) .account-heading{display:none}
.account-content:has(.mail-screen){gap:0}
.mail-screen{--mail-ink:#233e43;--mail-muted:#718783;--mail-line:#dce7de;display:grid;gap:18px;min-width:0;color:var(--mail-ink)}
.mail-hero{position:relative;display:flex;justify-content:space-between;align-items:center;min-height:226px;overflow:hidden;padding:28px 38px;border:1px solid #547677;border-radius:17px;background:radial-gradient(circle at 78% 30%,#77a49785,transparent 34%),linear-gradient(113deg,#173c45,#2e6067 65%,#7d9488);box-shadow:0 17px 35px #284d4b25;color:#fffdf3}
.mail-hero:before{content:"";position:absolute;inset:9px;border:1px solid #e7e5c653;border-radius:9px;pointer-events:none}
.mail-hero:after{content:"";position:absolute;right:0;bottom:0;width:47%;height:100%;opacity:.16;background:linear-gradient(90deg,#f8f1cf 1px,transparent 1px),linear-gradient(#f8f1cf 1px,transparent 1px);background-size:29px 29px;mask-image:linear-gradient(90deg,transparent,#000)}
.mail-hero-copy{position:relative;z-index:2;min-width:0}
.mail-kicker{display:inline-flex;gap:8px;align-items:center;color:#e7d9ac;font-size:11px;font-weight:850;letter-spacing:.14em}
.mail-kicker:before{content:"";width:8px;height:8px;background:#e8bf79;transform:rotate(45deg)}
.mail-hero h2{margin:12px 0 4px;color:#fffdf4;font-size:clamp(30px,3vw,43px);font-weight:900;letter-spacing:-.055em}
.mail-hero p{margin:0;color:#e4eee6;font-size:13px;font-weight:600}
.mail-hero-stats{display:flex;gap:29px;margin-top:20px}
.mail-stat{display:flex;align-items:baseline;gap:7px}
.mail-stat strong{color:#f7e4b5;font-size:25px;line-height:1;font-variant-numeric:tabular-nums}
.mail-stat span{color:#d8e4dc;font-size:11px;font-weight:750}
.mail-hero-art{position:relative;z-index:1;flex:none;width:240px;height:174px;margin-right:35px;transform:rotate(-7deg)}
.mail-art-shadow{position:absolute;left:12px;right:0;bottom:0;height:23px;border-radius:50%;background:#09292a55;filter:blur(8px)}
.mail-art-envelope{position:absolute;inset:35px 10px 14px;background:#f9ead1;border:7px solid #e0cba5;box-shadow:9px 12px 0 #163e4766,inset 0 -17px 0 #f0dbb9}
.mail-art-envelope:before,.mail-art-envelope:after{content:"";position:absolute;bottom:-2px;width:50%;height:76%;background:#f0ddb9;clip-path:polygon(0 100%,100% 100%,0 0)}
.mail-art-envelope:before{left:0}.mail-art-envelope:after{right:0;transform:scaleX(-1)}
.mail-art-flap{position:absolute;top:42px;left:18px;right:18px;height:81px;background:#fff5dc;clip-path:polygon(0 0,100% 0,50% 85%);filter:drop-shadow(0 5px 0 #c2aa87)}
.mail-art-seal{position:absolute;top:88px;left:calc(50% - 22px);display:grid;place-items:center;width:44px;height:44px;border:4px solid #f1dcb3;border-radius:7px;background:#bd7959;box-shadow:3px 4px 0 #8c503e;transform:rotate(45deg)}
.mail-art-seal:after{content:"◆";color:#ffecc9;font-size:19px;transform:rotate(-45deg)}
.mail-art-spark{position:absolute;width:10px;height:10px;background:#e9d49d;transform:rotate(45deg)}
.mail-art-spark-a{top:5px;right:12px}.mail-art-spark-b{top:25px;left:0;width:6px;height:6px}
.mail-shell{display:grid;grid-template-columns:minmax(280px,37%) minmax(0,1fr);min-height:580px;overflow:hidden;border:1px solid var(--mail-line);border-radius:16px;background:#fffdf8;box-shadow:0 12px 30px #315b4a14}
.mail-sidebar{display:flex;flex-direction:column;min-width:0;border-right:1px solid var(--mail-line);background:#f7f9f3}
.mail-toolbar{padding:23px 23px 12px}.mail-toolbar-title{display:flex;align-items:baseline;justify-content:space-between;gap:12px}
.mail-toolbar-title strong{font-size:20px;font-weight:900}.mail-toolbar-title span{color:var(--mail-muted);font-size:11px;font-weight:750;white-space:nowrap}
.mail-filters{display:flex;gap:4px;margin:0 18px;padding:4px;border:1px solid #e1e9df;border-radius:8px;background:#ecf2eb}
.account-content .mail-filters button{flex:1;min-width:0;padding:7px 2px;border:0;border-radius:6px;background:transparent;color:#70847b;font-size:11px;font-weight:850;white-space:nowrap}
.account-content .mail-filters button.is-active{background:#fffefa;color:#245b57;box-shadow:0 2px 7px #234b3f17}
.account-content .mail-search{width:calc(100% - 36px);height:38px;margin:13px 18px 11px;padding:0 12px;border:1px solid #d8e3da;border-radius:7px;background:#fffdf8;color:var(--mail-ink);font-size:12px}
.mail-list{display:grid;align-content:start;gap:5px;flex:1;min-height:150px;padding:0 10px 13px}
.account-content .mail-list-item{position:relative;display:grid;gap:7px;width:100%;padding:14px 14px 13px;border:1px solid transparent;border-radius:9px;background:transparent;color:var(--mail-ink);text-align:left;transition:background .16s,border-color .16s,box-shadow .16s}
.account-content .mail-list-item:hover{border-color:#d5e6da;background:#fffdf9;box-shadow:0 3px 10px #26473e0d}
.account-content .mail-list-item.is-selected{border-color:#9ec5b4;background:#fffefa;box-shadow:inset 3px 0 #418679,0 3px 11px #26473e12}
.mail-list-top,.mail-list-foot{display:flex;justify-content:space-between;align-items:baseline;gap:8px;min-width:0}
.mail-list-top strong{overflow:hidden;font-size:13px;font-weight:750;text-overflow:ellipsis;white-space:nowrap}
.mail-list-item.is-unread .mail-list-top strong{font-weight:900}
.mail-list-item.is-unread .mail-list-top strong:before{content:"";display:inline-block;width:6px;height:6px;margin:0 7px 2px 0;border-radius:50%;background:#bd7653}
.mail-list-top time{flex:none;color:#8da097;font-size:10px;font-variant-numeric:tabular-nums;white-space:nowrap}
.mail-list-preview{display:block;overflow:hidden;color:#778a81;font-size:11px;line-height:1.5;text-overflow:ellipsis;white-space:nowrap}
.mail-badge{display:inline-flex;align-items:center;width:fit-content;padding:4px 7px;border:1px solid #dce7db;border-radius:5px;background:#f2f6ef;color:#71857b;font-size:10px;font-weight:850;line-height:1}
.mail-badge-claimable{border-color:#e9d5ab;background:#fff3d9;color:#956c30}.mail-badge-expired{border-color:#eadcdb;background:#f8eeee;color:#a16e6c}
.mail-attachment-count{color:#82958c;font-size:10px;font-weight:750}
.mail-paging{display:flex;justify-content:center;align-items:center;gap:14px;margin-top:auto;padding:13px;border-top:1px solid var(--mail-line);color:#687e76;font-size:12px;font-weight:800}
.account-content .mail-paging button{padding:6px 11px;border:1px solid #d4e3d9;border-radius:6px;background:#fffefa;color:#32645d;font-size:11px;font-weight:800}
.account-content .mail-paging button:disabled{opacity:.4;cursor:default}
.mail-list-empty{display:grid;justify-items:center;align-content:center;gap:5px;min-height:210px;padding:22px;text-align:center}.mail-empty-glyph{color:#a9c5b4;font-size:46px;line-height:1}.mail-list-empty strong{font-size:14px}.mail-list-empty p{margin:0;color:var(--mail-muted);font-size:11px}
.mail-reader{display:flex;flex-direction:column;min-width:0;padding:31px clamp(23px,4vw,48px) 25px;background:radial-gradient(circle at 95% 0,#f2f6eb 0,transparent 39%),#fffdf8}
.mail-reader-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.mail-reader-kicker{color:#a18456;font-size:10px;font-weight:900;letter-spacing:.16em}
.mail-reader h3{margin:19px 0 12px;color:#223f41;font-size:clamp(23px,2.4vw,31px);font-weight:900;letter-spacing:-.045em;overflow-wrap:anywhere}
.mail-reader-meta{display:flex;justify-content:space-between;gap:12px;padding-bottom:18px;border-bottom:1px solid #e6e9dd;color:#85928a;font-size:11px;font-weight:700}
.mail-letter-body{min-height:113px;margin:24px 0 25px;color:#344b47;font-size:14px;line-height:1.95;white-space:pre-wrap;overflow-wrap:anywhere}
.mail-attachments{margin-top:auto;padding:17px;border:1px solid #e9e3d1;border-radius:10px;background:linear-gradient(135deg,#faf8ed,#fffdf6)}
.mail-attachments h4{margin:0 0 13px;color:#6f674c;font-size:12px;font-weight:900;letter-spacing:.03em}
.mail-attachment-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(155px,1fr));gap:9px}
.mail-attachment{display:flex;align-items:center;gap:10px;min-width:0;padding:11px;border:1px solid #e7e4d6;border-radius:8px;background:#fffefa}
.mail-attachment-icon{display:grid;place-items:center;flex:none;width:38px;height:38px;border:1px solid #dfd3a8;border-radius:7px;background:#f5e8c8;color:#987442;font-size:22px}.mail-attachment-dino{border-color:#bacfc1;background:#e5f1e8;color:#48785e}.mail-attachment-item{border-color:#bfced2;background:#e6f0f1;color:#4d7a80}
.mail-attachment-copy{display:grid;gap:3px;min-width:0}.mail-attachment-copy strong{overflow-wrap:anywhere;font-size:12px;font-weight:850}.mail-attachment-copy small{color:#89958b;font-size:10px}
.mail-claim{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-top:14px;padding:13px 15px;border:1px dashed #b9d3be;border-radius:9px;background:#f2f8ed}
.mail-claim-label{width:100%;color:#607e63;font-size:10px;font-weight:850}
.account-content .mail-claim code{padding:7px 11px;border-color:#cadfcc;background:#fffefa;color:#235e4d;font-size:15px;font-weight:900;letter-spacing:.05em}
.account-content .mail-claim button{padding:7px 11px;border:1px solid #a7c9b1;border-radius:6px;background:#e0eee1;color:#215e49;font-size:11px;font-weight:850}
.mail-claim p{width:100%;margin:2px 0 0;color:#617b6b;font-size:11px}
.mail-expiry{margin:15px 0 0;color:#977447;font-size:11px;font-weight:800}.mail-expiry.is-expired{color:#a86a6a}
.mail-reader-actions{display:flex;align-items:center;gap:9px;min-height:56px;margin-top:18px;padding-top:15px;border-top:1px solid #e6e9df}
.account-content .mail-reader-actions button{padding:8px 12px;border:1px solid #9fc7b4;border-radius:7px;background:#deeee4;color:#266253;font-size:11px;font-weight:850}
.account-content .mail-reader-actions .mail-action-delete{border-color:#e1d9d1;background:#fffaf7;color:#8d6762}.account-content .mail-reader-actions button:disabled{opacity:.5}
.mail-action-note{color:#8b958b;font-size:11px}.mail-reader-empty{display:grid;justify-items:center;align-content:center;flex:1;min-height:340px;text-align:center}.mail-reader-empty-icon{display:grid;place-items:center;width:94px;height:94px;border:1px dashed #bad0bd;border-radius:13px;background:#f1f6ee;color:#95b89d;font-size:54px}.mail-reader-empty h3{margin:19px 0 3px;font-size:19px}.mail-reader-empty p{margin:0;color:var(--mail-muted);font-size:12px}
@media(max-width:1100px){.mail-hero-art{margin-right:0}.mail-shell{grid-template-columns:minmax(260px,40%) minmax(0,1fr)}.mail-reader{padding:26px 25px}}
@media(max-width:760px){.mail-hero{min-height:190px;padding:24px}.mail-hero-art{width:175px;height:140px;opacity:.7;transform:rotate(-7deg) scale(.77);transform-origin:center right}.mail-shell{grid-template-columns:1fr}.mail-sidebar{border-right:0;border-bottom:1px solid var(--mail-line)}.mail-list{max-height:305px;overflow:auto}.mail-reader{min-height:360px}.mail-hero-stats{gap:17px}}
@media(max-width:480px){.mail-hero{padding:22px;min-height:175px}.mail-hero-art{position:absolute;right:-8px;top:17px;opacity:.32}.mail-hero-copy{max-width:100%}.mail-hero p{max-width:230px;font-size:11px}.mail-hero-stats{margin-top:16px}.mail-stat strong{font-size:21px}.mail-toolbar{padding:18px}.mail-filters{margin:0 12px}.account-content .mail-filters button{font-size:10px}.mail-list{padding:0 7px 10px}.mail-reader{padding:23px 19px}.mail-reader-meta{flex-wrap:wrap}.mail-attachment-grid{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.account-content .mail-list-item{transition:none}}