.room-mailbox{position:absolute;left:var(--mail-left);top:var(--mail-top);width:var(--mail-size);height:var(--mail-size);padding:0;border:0;background:none;overflow:hidden;filter:drop-shadow(2px 5px 3px #60351a44);transition:transform .2s,filter .2s}.room-mailbox img{position:absolute;width:154%;height:154%;max-width:none;left:-24%;top:-23%;object-fit:contain;pointer-events:none}.room-mailbox:hover{transform:translateY(-3px);filter:drop-shadow(0 2px 6px #e6ac49)}.room-mailbox:focus-visible{outline:3px solid #fff0bf;outline-offset:4px;border-radius:12px}
#timeMail{width:100vw;height:100dvh;max-width:none;max-height:none;margin:0;padding:40px clamp(20px,5vw,100px) 60px;border:0;border-radius:0;overflow-y:auto;color:#57341f;background:linear-gradient(#fff0d8e8,#f5dfbee8),url('assets/hub-room-clean.png') center/cover fixed;font-family:RoomSerif,"Songti SC",SimSun,serif}#timeMail::backdrop{background:#422b1d80}#timeMail button{cursor:pointer}#timeMail button:focus-visible,#timeMail input:focus-visible,#timeMail textarea:focus-visible{outline:3px solid #8b7043;outline-offset:4px}#timeMail .mail-back{position:absolute;left:30px;top:25px;padding:10px 20px;border:1px solid #b58759;border-radius:28px;background:#fff3df;color:#57341f;font:16px/1.5 inherit}.mail-heading{text-align:center;margin:22px 0 32px}.mail-heading h2{font-size:clamp(30px,3.2vw,50px);font-weight:600;letter-spacing:.09em;line-height:1.5;margin:0}.mail-heading p{font-size:18px;letter-spacing:.08em;margin:10px 0}.mail-content{max-width:1280px;margin:auto}.mail-toolbar{display:flex;justify-content:flex-end;margin:14px 0}.mail-toolbar button,.mail-sealed>button,.mail-empty button,.mail-reading-actions button{padding:12px 25px;border:1px solid #b58c5f;border-radius:26px;background:#fff5e4;color:#57341f;font:17px/1.5 inherit}#timeMail .room-primary{background:#828453!important;color:#fff9e9!important;border:1px solid #6f7144}.mail-filters{display:flex;justify-content:center;gap:6px;margin:0 auto 38px;max-width:600px;padding:5px;background:#fff9e49e;border-radius:35px}.mail-filters button{flex:1;padding:12px;border:0;border-radius:25px;background:none;font:18px/1.5 inherit;color:#74543a}.mail-filters button[aria-pressed=true]{background:#dad1aa;color:#4e492e}.mail-letter-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px;padding:20px 0}.mail-letter-card{padding:0 0 24px;border:0;border-radius:14px;background:#fff7e793;color:#57341f;text-align:center;transition:transform .2s}.mail-letter-card:hover{transform:translateY(-5px)}.letter-envelope{position:relative;isolation:isolate;width:100%;aspect-ratio:1.48;background:linear-gradient(145deg,#f9ebcd,#fff7e5 55%,#ead7b4);border:1px solid #c5a174;border-radius:7px;box-shadow:0 8px 20px #75462620;overflow:hidden;display:flex;justify-content:center;align-items:flex-start;padding:28px 22px}.letter-envelope::before{content:"";position:absolute;inset:0;z-index:-1;background:linear-gradient(145deg,transparent 49%,#d7ba8a66 50%,transparent 51%),linear-gradient(215deg,transparent 49%,#d7ba8a66 50%,transparent 51%);clip-path:polygon(0 0,100% 0,50% 70%)}.envelope-title{position:relative;font-size:clamp(18px,1.6vw,26px);letter-spacing:.07em;overflow-wrap:anywhere;line-height:1.6}.envelope-seal{position:absolute;top:60%;left:50%;transform:translate(-50%,-50%);height:52px;width:52px;border-radius:50%;border:4px double #d89c6a;background:#a95f3c;color:#ffdeb6;font-size:29px;line-height:43px;box-shadow:0 3px 5px #75402140}.is-ready .envelope-seal{background:#828453;border-color:#b6b684}.letter-status,.letter-date,.letter-action{display:block;margin-top:17px;line-height:1.6}.letter-status{color:#6b633d;font-size:17px}.letter-date{font-size:15px}.letter-action{font-size:17px}.mail-status{font:15px/1.8 system-ui,sans-serif;text-align:center;white-space:pre-wrap}.mail-storage-note{font:13px/1.9 system-ui,sans-serif;color:#795d44;text-align:center;margin:24px auto;max-width:680px}.mail-empty{grid-column:1/-1;text-align:center;background:#fff8ebba;border:1px solid #ddc4a0;border-radius:18px;padding:45px 20px}.mail-empty>span{font-size:65px;color:#a27249}.mail-empty h3{font-size:25px;font-weight:500}.mail-empty p{font-size:17px;line-height:1.8}.mail-compose{display:grid;grid-template-columns:minmax(0,2.2fr) minmax(280px,1fr);gap:30px;margin-top:25px}.mail-paper{background:#fff7e8;border:1px solid #dcc39b;border-radius:7px;padding:35px;box-shadow:0 8px 28px #76503217}.mail-paper input{width:100%;border:0;border-bottom:1px solid #dac39e;background:transparent;padding:6px 4px 18px;color:#57341f;font:26px/1.7 inherit;box-sizing:border-box}.mail-paper textarea{width:100%;min-height:420px;resize:vertical;border:0;background:transparent;box-sizing:border-box;padding:25px 4px 10px;color:#57341f;font:21px/2.2 inherit}.mail-paper input::placeholder,.mail-paper textarea::placeholder{color:#997f63}.mail-draft-status{font:12px/1.6 system-ui,sans-serif;color:#7b7653;margin-bottom:0}.mail-settings{background:#fff4e0e8;border:1px solid #d6b68b;border-radius:10px;padding:25px;display:flex;flex-direction:column;align-items:stretch;gap:14px}.mail-settings h3{font-size:24px;font-weight:500;margin:0 0 5px}.mail-settings input{font:16px/1.6 system-ui,sans-serif;padding:12px 10px;min-width:0;width:100%;border:1px solid #bd966c;background:#fffbf1;color:#57341f;border-radius:8px;box-sizing:border-box}.mail-settings small{font:12px/1.7 system-ui,sans-serif;color:#846a50}.mail-settings .letter-envelope{width:150px;padding:10px;align-self:center;margin:5px 0 10px}.mail-settings .envelope-title{font-size:14px}.mail-settings .envelope-seal{width:30px;height:30px;font-size:18px;line-height:23px}.mail-encouragement{font-size:18px;line-height:2;margin:6px 0;text-align:center}.mail-hint{font:14px/1.8 system-ui,sans-serif;color:#81664d;text-align:center}.mail-settings>button{padding:13px;border-radius:28px;font:21px/1.5 inherit;margin-top:auto}.mail-sealed{max-width:740px;margin:30px auto;text-align:center}.mail-sealed>.letter-envelope{max-width:620px;margin:auto;box-sizing:border-box}.mail-open-date{font-size:21px;line-height:1.7;margin:22px 0}.mail-sealed>button{margin-top:20px}.mail-reading{max-width:850px;margin:20px auto;padding:40px 55px}.mail-reading h3{text-align:center;font-size:30px;font-weight:500;overflow-wrap:anywhere}.mail-reading small{display:block;text-align:center;color:#947858;font:13px/1.8 system-ui,sans-serif}.mail-body{white-space:pre-wrap;overflow-wrap:anywhere;font-size:22px;line-height:2.2;margin:40px 0}.mail-signature{text-align:right;font-size:20px}.mail-reading-actions{display:flex;justify-content:center;flex-wrap:wrap;gap:15px;margin:25px 0}#timeMail input:disabled,#timeMail textarea:disabled{opacity:.75}
@media(max-width:1100px){.room-mailbox{display:none}.mail-letter-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.mail-compose{gap:20px;grid-template-columns:minmax(0,1.8fr) minmax(260px,1fr)}}
@media(max-width:700px){#timeMail{padding:80px 18px 30px}.mail-heading{margin:0 0 20px}.mail-heading p{font-size:15px;line-height:1.8}.mail-heading h2{font-size:29px}.mail-letter-grid{grid-template-columns:1fr;gap:25px;padding:10px}.mail-compose{grid-template-columns:1fr}.mail-paper{padding:22px}.mail-paper textarea{min-height:340px;font-size:18px}.mail-settings{padding:23px}.mail-reading{padding:25px}.mail-body{font-size:18px;line-height:2}.mail-filters{gap:0;margin-bottom:20px}.mail-filters button{font-size:16px;padding:10px 6px}.mail-toolbar{margin:10px 0 20px}.mail-sealed>.letter-envelope{padding:22px 16px}.mail-open-date{font-size:18px}}
@media(prefers-reduced-motion:reduce){.room-mailbox,.mail-letter-card{transition:none}}