/* Reference artwork is kept separate from live controls and private letter contents. */
@media(min-width:701px){#timeMail{min-height:0!important;background-size:cover!important;background-position:center!important;overflow:hidden!important}#timeMail .mail-stage{position:absolute;transform-origin:top left;background-image:inherit;background-size:100% 100%;--u:1px}#timeMail .mail-stage .mail-paper>input{left:26%;width:28%;text-align:center}#timeMail .mail-stage .mail-back{max-width:185px}#timeMail .mail-stage .mail-paper>textarea:focus-visible,#timeMail .mail-stage .mail-paper>input:focus-visible{outline:0;box-shadow:inset 0 -1px #ac8a5e55}#timeMail .mail-stage .mail-encouragement{text-wrap:pretty}}
@media(max-width:700px){.mail-stage{display:contents}}
#timeMail .mail-heading{display:block!important}#timeMail .mail-heading h2:focus{outline:0}#timeMail,#timeMail .mail-heading h2{font-family:SimSun,serif!important;font-weight:400!important}#timeMail .mail-settings input[type=date]{font-size:calc(25 * var(--u))}
#timeMail{--u:min(.06305vw,.1008dvh);padding:0;background:#e2bb8f;font-family:RoomSerif,SimSun,serif;color:#542c15;min-height:650px;overflow:auto;background-size:100% 100%;background-attachment:local}
#timeMail[data-view=list]{background-image:url('assets/mail-list-art.png')}
#timeMail[data-view=write]{background-image:url('assets/mail-write-art.png')}
#timeMail[data-view=sealed]{background-image:url('assets/mail-sealed-art.png')}
#timeMail[data-view=read]{background-image:url('assets/mail-read-art.png')}
#timeMail .mail-content{position:absolute;inset:0;max-width:none;margin:0;pointer-events:none}#timeMail .mail-content>*{pointer-events:auto}
#timeMail button,#timeMail input,#timeMail textarea{font-family:inherit;color:inherit;box-sizing:border-box}#timeMail button{box-shadow:none}
#timeMail .mail-back{left:2.8%;top:3.5%;width:11.7%;height:5.2%;padding:0;background:none;border:0;font-size:calc(26 * var(--u));z-index:3}
#timeMail .mail-heading{position:absolute;left:25%;top:7.5%;width:50%;margin:0;text-align:center;pointer-events:none;z-index:1}
#timeMail .mail-heading h2{font-family:RoomSerif,SimSun,serif;font-size:calc(76 * var(--u));line-height:1.4;font-weight:400;letter-spacing:.06em;margin:0;white-space:nowrap}
#timeMail .mail-heading p{font-size:calc(25 * var(--u));line-height:1.6;letter-spacing:.06em;margin:calc(26 * var(--u)) 0 0}
#timeMail .mail-toolbar{position:absolute;right:2.9%;top:3.1%;width:14%;height:6.2%;margin:0;display:block}
#timeMail .mail-toolbar button{width:100%;height:100%;padding:0;background:none!important;border:0;color:#542c15!important;font-size:calc(29 * var(--u))}
#timeMail .mail-toolbar button::before{content:'✒';margin-right:8px;color:#9d6035}
#timeMail .mail-filters{position:absolute;left:30.5%;top:27.4%;width:39%;height:5.3%;padding:4px;box-sizing:border-box;max-width:none;margin:0;background:#f7e8d4;border-radius:40px;gap:0}
#timeMail .mail-filters button{font-size:calc(26 * var(--u));padding:0;background:none;line-height:1.4;border-radius:30px;color:#58351f}
#timeMail .mail-filters button[aria-pressed=true]{background:#d6cca4;border-bottom:2px solid #7a7952}
#timeMail .mail-letter-grid{position:absolute;left:9%;top:41.5%;width:83%;height:36%;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:2%;overflow-y:auto;scrollbar-width:thin}
#timeMail .mail-letter-card{position:relative;min-height:100%;padding:0;background:transparent;border:0;border-radius:0;text-align:center;box-shadow:none}
#timeMail .mail-letter-card .letter-envelope{position:absolute;inset:0;padding:0;aspect-ratio:auto;background:url('assets/mail-envelopes.png') 0 50%/300% 122%;border:0;border-radius:0;box-shadow:none;overflow:visible}
#timeMail .mail-letter-card:nth-child(even) .letter-envelope{background-position:50% 50%}
#timeMail .mail-letter-card.ready-card .letter-envelope{background-position:100% 50%}
#timeMail .letter-envelope::before,#timeMail .envelope-seal{display:none}
#timeMail .envelope-title{position:absolute;top:11%;left:7%;width:86%;font-size:calc(28 * var(--u));font-weight:400;line-height:1.5;letter-spacing:.03em}
#timeMail .mail-letter-card .letter-status{position:absolute;top:72%;left:32%;width:36%;font-size:calc(21 * var(--u));line-height:1.5;background:#f8e2c7e8;border:1px solid #caa47d;border-radius:30px;margin:0}
#timeMail .mail-letter-card .letter-date{position:absolute;top:87%;left:4%;width:92%;margin:0;font-size:calc(20 * var(--u));white-space:nowrap}
#timeMail .mail-letter-card:not(.ready-card) .letter-action{display:none}
#timeMail .mail-letter-card.ready-card .letter-action{position:absolute;top:84%;left:24%;width:52%;margin:0;padding:4px 2px;background:#85825a;border:1px solid #b9aa7d;border-radius:35px;color:#fff6df;font-size:calc(24 * var(--u))}
#timeMail .ready-card .letter-date{display:none}
#timeMail .mail-motto{position:absolute;top:81.8%;left:25%;width:50%;font-size:calc(26 * var(--u));letter-spacing:.15em;text-align:center;margin:0}
#timeMail .mail-storage-note{position:absolute;top:96.5%;left:15%;width:70%;margin:0;max-width:none;font-size:11px;line-height:1.5;color:#5c402c;background:#fff2d5aa;border-radius:8px}
#timeMail .mail-empty{padding:20px;align-self:center;max-width:650px;margin:0 auto;background:#fff4e5b5;border:1px solid #dcc5a2}
#timeMail .mail-status{position:absolute;top:92%;left:20%;width:60%;margin:0;font-size:14px;background:#fff4e6dd;border-radius:7px;z-index:5}
#timeMail .mail-status:empty{display:none}
#timeMail[data-view=write] .mail-heading{top:6%;left:25%;width:50%}
#timeMail[data-view=write] .mail-heading h2{font-size:calc(50 * var(--u))}
#timeMail[data-view=write] .mail-heading p{margin:0;font-size:calc(26 * var(--u))}
#timeMail[data-view=write] .mail-back{left:4.8%;top:8.2%;width:11%;height:4.4%;font-size:calc(24 * var(--u))}
#timeMail .mail-brand{position:absolute;left:4.7%;top:1.1%;margin:0;font-size:calc(24 * var(--u));letter-spacing:.08em}
#timeMail .mail-compose{position:absolute;inset:0;display:block;margin:0;pointer-events:none}
#timeMail .mail-paper,#timeMail .mail-settings{position:static;display:block;padding:0;margin:0;background:none;border:0;border-radius:0;box-shadow:none;pointer-events:none}
#timeMail .mail-compose input,#timeMail .mail-compose textarea,#timeMail .mail-compose button{position:absolute;pointer-events:auto;background:transparent;border:0;padding:0;border-radius:0}
#timeMail .mail-paper>input{left:32.6%;top:22.5%;width:30%;height:5.5%;font-size:calc(36 * var(--u));line-height:1.5;text-align:center;border:0}
#timeMail .mail-paper>textarea{left:17.4%;top:31.5%;width:46%;height:48%;min-height:0;resize:none;font-family:KaiTi,STKaiti,SimSun,serif;font-size:calc(29 * var(--u));line-height:1.9;letter-spacing:.05em;padding:0;white-space:pre-wrap;overflow-y:auto}
#timeMail input::placeholder,#timeMail textarea::placeholder{color:#7e5c40;opacity:.85}
#timeMail .mail-draft-status{position:absolute;left:18%;top:84%;margin:0;font-size:11px;color:#7e6e50}
#timeMail .mail-manual-save{left:55.4%;top:84.2%;width:9.5%;height:4.3%;font-size:calc(22 * var(--u))}
#timeMail .mail-settings h3{position:absolute;left:71.4%;top:26.1%;width:19%;margin:0;text-align:center;font-size:calc(30 * var(--u));font-weight:400}
#timeMail .mail-settings input{left:71.6%;top:32.4%;width:18.8%;height:4.9%;font:calc(25 * var(--u))/1.5 KaiTi,SimSun,serif;box-sizing:border-box;padding:0 12px;background:transparent}
#timeMail .mail-settings input[type=time]{top:39.1%}
#timeMail .mail-settings input[type=datetime-local]::-webkit-datetime-edit-hour-field,#timeMail .mail-settings input[type=datetime-local]::-webkit-datetime-edit-minute-field,#timeMail .mail-settings input[type=datetime-local]::-webkit-datetime-edit-ampm-field{display:none}
#timeMail .mail-settings>small{position:absolute;top:44.1%;left:72%;font-size:10px;max-width:18%;line-height:1.4}
#timeMail .mail-settings>.letter-envelope{display:none}
#timeMail .mail-settings .mail-encouragement{position:absolute;left:72%;top:62.4%;width:18%;margin:0;font-size:calc(25 * var(--u));line-height:1.45;font-family:KaiTi,STKaiti,SimSun,serif}
#timeMail .mail-settings .mail-hint{position:absolute;left:71%;top:76.8%;width:20%;margin:0;font:calc(18 * var(--u))/1.5 KaiTi,SimSun,serif}
#timeMail .mail-settings>button{left:71.5%;top:81.4%;width:19%;height:6.2%;margin:0;background:transparent!important;border:0;color:#fff5df!important;font-size:calc(30 * var(--u));border-radius:35px}
#timeMail .mail-settings .mail-status{left:70%;top:89%;width:22%;font-size:13px;pointer-events:auto}
#timeMail[data-view=sealed] .mail-heading{left:25%;top:3.6%;width:50%}
#timeMail[data-view=sealed] .mail-heading h2{font-size:calc(53 * var(--u));letter-spacing:.09em}
#timeMail[data-view=sealed] .mail-heading p{display:none}
#timeMail[data-view=sealed] .mail-back{left:2.2%;top:2.5%;width:9.6%;height:4.4%;font-size:calc(20 * var(--u))}
#timeMail .mail-sealed{position:static;max-width:none;margin:0}
#timeMail .mail-sealed>.letter-envelope{position:absolute;left:28%;top:20%;width:43.4%;height:43%;max-width:none;padding:0;background:none;border:0;box-shadow:none;overflow:visible;pointer-events:none}
#timeMail .mail-sealed .envelope-title{top:10%;font-size:calc(43 * var(--u));line-height:1.6;left:13%;width:74%}
#timeMail .mail-sealed>.letter-status{position:absolute;top:56%;left:37%;width:26%;margin:0;font-size:calc(28 * var(--u));line-height:1.5}
#timeMail .mail-open-date{position:absolute;top:65.9%;left:33.5%;width:33%;margin:0;font-size:calc(27 * var(--u));line-height:1.7;white-space:nowrap}
#timeMail .mail-sealed>.mail-encouragement{position:absolute;left:30%;top:73.2%;width:40%;margin:0;font-family:KaiTi,STKaiti,SimSun,serif;font-size:calc(29 * var(--u));line-height:1.5}
#timeMail .mail-sealed>.mail-hint{position:absolute;left:36%;top:83%;width:28%;margin:0;font-family:KaiTi,SimSun,serif;font-size:calc(24 * var(--u));white-space:nowrap}
#timeMail .mail-sealed>button{position:absolute;left:39.4%;top:88.9%;width:21.2%;height:6.3%;padding:0;margin:0;background:transparent!important;border:0;color:#fff4de!important;font-size:calc(27 * var(--u))}
#timeMail[data-view=read] .mail-heading{left:27%;top:1.5%;width:46%}
#timeMail[data-view=read] .mail-heading h2{font-size:calc(41 * var(--u));line-height:1.6}
#timeMail[data-view=read] .mail-heading p{font-size:calc(23 * var(--u));margin:0;line-height:1.5}
#timeMail[data-view=read] .mail-back{left:1.8%;top:2.8%;width:11.4%;height:4.5%;font-size:calc(21 * var(--u));background:#fff1d9;border:1px solid #bb935f;border-radius:35px}
#timeMail .mail-reading{position:absolute;left:18.7%;top:13%;width:60%;height:73%;max-width:none;padding:0;margin:0;pointer-events:auto;background:none;border:0;box-shadow:none}
#timeMail .mail-reading h3{position:absolute;left:6%;top:10%;width:88%;margin:0;text-align:center;font-size:calc(42 * var(--u));line-height:1.6;font-weight:400}
#timeMail .mail-reading small{position:absolute;left:7%;top:19.7%;width:86%;font-family:KaiTi,SimSun,serif;font-size:calc(22 * var(--u));color:#60422a;line-height:1.6}
#timeMail .mail-body{position:absolute;left:9.6%;top:31%;width:78%;height:49%;font-family:KaiTi,STKaiti,SimSun,serif;font-size:calc(30 * var(--u));line-height:1.7;letter-spacing:.03em;margin:0;padding:0;overflow-y:auto;scrollbar-width:thin}
#timeMail .mail-signature{position:absolute;right:17%;bottom:9%;margin:0;font-size:calc(29 * var(--u));font-family:KaiTi,SimSun,serif}
#timeMail .mail-reading-actions{position:absolute;inset:0;margin:0;display:block;pointer-events:none}
#timeMail .mail-reading-actions button{position:absolute;left:29.3%;top:90.2%;width:15.3%;height:6%;padding:0;background:transparent;border:0;font-size:calc(26 * var(--u));pointer-events:auto}
#timeMail .mail-reading-actions button+button{left:46.8%;width:23.7%;background:transparent!important;border:0;color:#fff6e1!important}
@media(max-width:700px){#timeMail{--u:1px;min-height:100dvh;padding:85px 18px 30px;background-size:auto 100vh;background-attachment:fixed;background-position:center}#timeMail .mail-content{position:relative;inset:auto;pointer-events:auto}#timeMail .mail-heading,#timeMail[data-view] .mail-heading{position:relative;inset:auto;width:auto;margin:0 0 30px;background:#fff2ded9;border-radius:10px;padding:10px}#timeMail[data-view] .mail-heading h2{font-size:27px;white-space:normal}#timeMail[data-view] .mail-heading p{font-size:16px;margin:8px 0}#timeMail[data-view] .mail-back{left:15px;top:18px;width:auto;height:auto;font-size:16px;padding:10px 18px;background:#fff1df;border:1px solid #c7a278;border-radius:30px}#timeMail .mail-toolbar,#timeMail .mail-filters,#timeMail .mail-letter-grid,#timeMail .mail-motto,#timeMail .mail-storage-note{position:relative;inset:auto;width:auto;height:auto}#timeMail .mail-toolbar{text-align:right}#timeMail .mail-toolbar button{width:auto;height:auto;background:#f9eedb!important;border:1px solid #bfa479;border-radius:30px;font-size:20px;padding:8px 22px}#timeMail .mail-filters{margin:20px 0}#timeMail .mail-filters button{font-size:17px;padding:8px}#timeMail .mail-letter-grid{grid-template-columns:1fr;overflow:visible;gap:24px}#timeMail .mail-letter-card{height:300px}#timeMail .envelope-title{font-size:24px}#timeMail .mail-letter-card .letter-status{font-size:19px}#timeMail .mail-letter-card .letter-date{font-size:17px}#timeMail .mail-motto{font-size:18px;margin:25px 0;background:#fff2decc;padding:12px;border-radius:8px}#timeMail .mail-storage-note{font-size:11px}#timeMail .mail-compose,#timeMail .mail-paper,#timeMail .mail-settings,#timeMail .mail-reading,#timeMail .mail-sealed,#timeMail .mail-reading-actions{position:relative;inset:auto;display:block;width:auto;height:auto;pointer-events:auto}#timeMail .mail-paper,#timeMail .mail-settings,#timeMail .mail-reading,#timeMail .mail-sealed{background:#fff5e5f0;border:1px solid #dfc69e;border-radius:10px;padding:22px;margin:20px 0}#timeMail .mail-compose input,#timeMail .mail-compose textarea,#timeMail .mail-compose button,#timeMail .mail-settings h3,#timeMail .mail-settings small,#timeMail .mail-settings .mail-hint,#timeMail .mail-settings .mail-encouragement,#timeMail .mail-reading h3,#timeMail .mail-reading small,#timeMail .mail-body,#timeMail .mail-signature,#timeMail .mail-sealed>p,#timeMail .mail-sealed>button,#timeMail .mail-reading-actions button{position:relative;inset:auto;width:100%;height:auto;white-space:normal;pointer-events:auto}#timeMail .mail-paper input{font-size:23px;text-align:left;border-bottom:1px solid #cfb28a}#timeMail .mail-paper textarea{min-height:350px;font-size:19px;margin-top:20px}#timeMail .mail-settings input{border:1px solid #c0a37d;border-radius:6px;padding:12px;font-size:18px;margin:12px 0}#timeMail .mail-settings h3{font-size:24px}#timeMail .mail-settings .mail-encouragement{font-size:20px;line-height:1.7;margin:20px 0}#timeMail .mail-settings .mail-hint{font-size:15px}#timeMail .mail-settings button,#timeMail .mail-sealed>button,#timeMail .mail-reading-actions button{background:#828054!important;color:#fff6df!important;border-radius:30px;padding:12px;font-size:21px;margin:15px 0}#timeMail .mail-brand{display:none}#timeMail .mail-draft-status{position:static;margin:10px 0}#timeMail .mail-manual-save{padding:10px!important;font-size:18px;border:1px solid #c0a27c!important;border-radius:20px!important}#timeMail .mail-sealed>.letter-envelope{position:relative;inset:auto;width:100%;height:220px;background:url('assets/mail-envelopes.png') 0 50%/300% 122%;margin-bottom:20px}#timeMail .mail-sealed .envelope-title{top:12%;font-size:25px}#timeMail .mail-sealed>.letter-status,#timeMail .mail-open-date{font-size:20px}#timeMail .mail-sealed>.mail-encouragement{font-size:20px;line-height:1.8}#timeMail .mail-sealed>.mail-hint{font-size:16px}#timeMail .mail-reading h3{font-size:27px;margin:10px 0}#timeMail .mail-reading small{font-size:15px}#timeMail .mail-body{font-size:20px;line-height:1.9;margin:25px 0;max-height:none;overflow:visible}#timeMail .mail-signature{font-size:22px}#timeMail .mail-status,#timeMail .mail-settings .mail-status{position:relative;inset:auto;width:auto;font-size:14px}}