#mail396-entry,#invite396-entry{background:linear-gradient(135deg,#8b3e45,#632c38);color:#fff4dc;border-color:#d4ad74;white-space:nowrap;position:relative;font-weight:inherit;letter-spacing:normal}
.m396-badge{position:absolute;top:-6px;right:-4px;min-width:15px;padding:0 3px;border-radius:9px;background:#f1ce6d;color:#59271e;font:10px/16px sans-serif;pointer-events:none}
.m396-mooncake{display:inline-block;flex:none;width:100px;height:100px;background:url('festival-v390/assets/mooncakes-v406.webp') 50% 100% / 300% 300% no-repeat}
.m396 nav button[data-tab="invite"]{background:linear-gradient(135deg,#af413d,#7c2831);color:#fff4d1;border:1px solid #d7ae59;box-shadow:0 3px 9px #75273035,inset 0 1px #ffdd8e55;font-weight:bold;letter-spacing:1px}.m396 nav button[data-tab="invite"]:hover{background:#a63739}.m396 nav button[data-tab="invite"][aria-pressed="true"]{box-shadow:0 0 0 2px #e2c47b,0 4px 12px #75273040}.m396-steps{padding-left:23px;line-height:1.9}.m396-steps li{padding-bottom:8px}.m396-friends ol{list-style:none;padding:0;margin:0}.m396-friends li{padding:15px 0;border-top:1px solid #e5d6bd}.m396-friends li p{margin:6px 0 0}.m396-success{color:#386653;background:#e8efdd;border-radius:4px;padding:3px 7px;font-size:12px}.m396 details summary{cursor:pointer;color:#7c4034;font-weight:bold}
.m396{position:fixed;inset:0;z-index:24000;background:#20191091;display:grid;place-items:center;padding:18px}.m396-window{width:min(800px,100%);max-height:92dvh;overflow:auto;background:#faf4e7;color:#594837;border:1px solid #bca27a;border-radius:14px;box-shadow:0 22px 80px #0007;font-family:inherit}.m396 header{position:sticky;top:0;background:#f5ecd9;z-index:1;display:flex;justify-content:space-between;align-items:center;padding:18px 24px;border-bottom:1px solid #dcc9a7}.m396 h2{margin:3px 0;color:#714134;letter-spacing:3px}.m396 small{color:#8d7964}.m396 button,.m396-use{font:inherit;cursor:pointer;border:1px solid #bca27a;border-radius:7px;background:#fffaf0;color:#6f4836;padding:9px 15px}.m396 button:disabled{opacity:.5;cursor:not-allowed}.m396 button.primary,.m396-use{background:#865446;color:#fff8e7}.m396-content{padding:22px}.m396 nav{display:flex;gap:10px;margin-bottom:18px}.m396-card{padding:18px;margin:12px 0;background:#fffaf1;border:1px solid #e0ceb1;border-radius:10px}.m396-card h3{color:#75483c;margin:0 0 9px}.m396-card p{white-space:pre-wrap;line-height:1.8;font-size:14px}.m396-art{display:flex;gap:12px;flex-wrap:wrap}.m396-art figure{margin:0;width:115px;text-align:center;font-size:12px}.m396-art img{height:100px;width:100%;object-fit:contain}.m396 input{font:inherit;width:min(290px,100%);padding:10px;border:1px solid #bda984;border-radius:6px;background:white;box-sizing:border-box}.m396-code{font-size:23px;letter-spacing:3px;color:#7e453e;overflow-wrap:anywhere}.m396-note{background:#f0e5cf;padding:12px;border-radius:8px;font-size:13px;line-height:1.8}.m396-inventory{display:flex;gap:16px;align-items:center}.m396-inventory img{width:100px;height:100px;object-fit:contain}.m396-inventory div{flex:1}.m396-inventory p{font-size:13px}.m396-status{color:#8d423a;min-height:24px;white-space:pre-wrap}.m396 button:focus-visible{outline:3px solid #ab7547;outline-offset:2px}@media(max-width:500px){.m396{padding:5px}.m396 header{padding:12px}.m396-content{padding:12px}.m396-inventory{flex-wrap:wrap}.m396-art figure{width:90px}.m396-window{max-height:97dvh}}
.m396-mail{padding:0;overflow:hidden}.m396-mail h3{margin:0}.m396 button.m396-mail-title{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;border:0;border-radius:9px;background:transparent;padding:17px 18px;text-align:left;color:#75483c;font-weight:bold;line-height:1.6;overflow-wrap:anywhere}.m396-mail-title::after{content:'›';flex:none;font-size:22px;font-weight:normal;transition:transform .15s}.m396-mail-title[aria-expanded="true"]::after{transform:rotate(90deg)}.m396-mail-title:hover{background:#f4ead7!important}.m396 .m396-mail-title:focus-visible{outline-offset:-4px}.m396-mail-body{padding:0 18px 18px}.m396-mail-body[hidden]{display:none!important}.m396-mail-actions{display:flex;gap:10px;flex-wrap:wrap}

/* v491: one bounded content scroller, with the return button outside it. No dvh dependency. */
.m396{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;height:var(--m396-viewport-height,100%);max-height:100%;overflow:hidden;padding:18px}
.m396-window{box-sizing:border-box;display:flex;flex-direction:column;flex:0 1 auto;min-width:0;min-height:0;max-height:100%;overflow:hidden}
.m396 header{position:relative;top:auto;flex:0 0 auto;gap:12px;min-width:0}
.m396 header>div{min-width:0}.m396 header h2{overflow-wrap:break-word}
.m396 header [data-do="close"]{flex:none;min-height:44px;touch-action:manipulation}
.m396-content{flex:1 1 auto;min-width:0;min-height:0;overflow-x:hidden;overflow-y:auto;-webkit-overflow-scrolling:touch;overscroll-behavior-y:contain;touch-action:pan-y}
.m396 nav{flex-wrap:wrap}.m396 .m396-mail{overflow:visible}
.m396-mail-body,.m396-status,.m396-note{overflow-wrap:break-word;word-wrap:break-word}
@media(max-width:500px){.m396{padding:5px}.m396 header h2{font-size:1.1em;letter-spacing:2px}}
@supports(padding:max(0px,env(safe-area-inset-top))){.m396{padding-top:max(18px,env(safe-area-inset-top));padding-right:max(18px,env(safe-area-inset-right));padding-bottom:max(18px,env(safe-area-inset-bottom));padding-left:max(18px,env(safe-area-inset-left))}@media(max-width:500px){.m396{padding-top:max(5px,env(safe-area-inset-top));padding-right:max(5px,env(safe-area-inset-right));padding-bottom:max(5px,env(safe-area-inset-bottom));padding-left:max(5px,env(safe-area-inset-left))}}}