:root{--bg-1: #120003;--bg-2: #330008;--bg-3: #6f0012;--velvet: #51000d;--velvet-2: #7c0d1e;--text: #f8efe8;--muted: #d8bdb9;--accent: #f2d2b0;--accent-2: #b8745d;--border: rgba(255, 240, 230, .14);--shadow: 0 24px 70px rgba(0, 0, 0, .38);--shadow-soft: 0 12px 34px rgba(0, 0, 0, .26);--radius-xl: 30px;--radius-lg: 24px;--radius-md: 18px}*{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;width:100%}body{font-family:Georgia,Times New Roman,serif;color:var(--text);background:radial-gradient(circle at top,rgba(140,0,25,.22),transparent 30%),linear-gradient(135deg,var(--bg-1) 0%,var(--bg-2) 45%,var(--bg-3) 100%);overflow-x:hidden}button,input{font:inherit}button{cursor:pointer;border:none}img{max-width:100%;display:block}.app-shell{min-height:100vh;width:100%;padding:28px 20px;display:flex;align-items:center;justify-content:center}.status-screen{width:min(900px,100%);padding:44px 30px;border-radius:var(--radius-xl);text-align:center;background:#160005c2;border:1px solid var(--border);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.status-screen h1{margin:0 0 12px;font-size:clamp(2.2rem,4vw,3.3rem)}.status-screen p{margin:8px 0;color:var(--muted);font-size:1.05rem}.gate-screen{position:relative;width:min(1300px,100%);min-height:calc(100vh - 56px);border-radius:34px;overflow:hidden;border:1px solid rgba(255,229,221,.14);box-shadow:var(--shadow);background:radial-gradient(circle at center,rgba(255,213,191,.08),transparent 28%),linear-gradient(180deg,#160005b8,#0c0003eb)}.gate-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at center,rgba(255,220,180,.08),transparent 25%),linear-gradient(180deg,#09000233,#090002a6)}.curtain{position:absolute;top:0;width:52%;height:100%;z-index:2;transition:transform 1.15s ease-in-out;background:linear-gradient(90deg,rgba(255,255,255,.06),transparent 10%,transparent 90%,rgba(0,0,0,.15)),repeating-linear-gradient(90deg,#4a000a 0,#4a000a 24px,#5b000d 24px,#5b000d 48px,#700012 48px,#700012 72px);box-shadow:inset -12px 0 26px #0003}.curtain:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,rgba(255,255,255,.12),transparent 18%),linear-gradient(0deg,rgba(0,0,0,.22),transparent 20%);pointer-events:none}.curtain-left{left:0;border-right:1px solid rgba(255,224,224,.06)}.curtain-right{right:0;border-left:1px solid rgba(255,224,224,.06)}.gate-screen.is-unlocking .curtain-left{transform:translate(-100%)}.gate-screen.is-unlocking .curtain-right{transform:translate(100%)}.gate-center{position:relative;z-index:3;min-height:calc(100vh - 56px);display:flex;align-items:center;justify-content:center;padding:28px}.gate-card{width:min(620px,100%);border-radius:28px;padding:42px 30px;text-align:center;background:#100004ad;border:1px solid rgba(255,232,223,.14);box-shadow:0 18px 50px #00000057;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.gate-kicker{margin:0 0 10px;color:var(--accent);letter-spacing:.12em;text-transform:uppercase;font-size:.82rem}.gate-card h1{margin:0 0 16px;font-size:clamp(2.4rem,5vw,4.8rem);line-height:.95}.gate-copy{margin:0 auto 24px;max-width:440px;color:var(--muted);font-size:1.08rem;line-height:1.7}.gate-form{display:flex;flex-direction:column;gap:14px;align-items:center}.gate-input{width:min(420px,100%);padding:14px 18px;border-radius:999px;border:1px solid rgba(255,226,211,.14);background:#ffffff0f;color:var(--text);text-align:center;outline:none}.gate-input::placeholder{color:#f8efe894}.gate-input:focus{border-color:#f2d2b080;box-shadow:0 0 0 3px #f2d2b01f}.gate-button{padding:12px 28px;border-radius:999px;color:#2a0a05;font-weight:700;background:linear-gradient(135deg,#f3d7b8,#b7745c);transition:transform .18s ease,filter .18s ease}.gate-button:hover{transform:translateY(-1px);filter:brightness(1.04)}.gate-error{margin:14px 0 0;color:#ffd3d3}.desk-screen{width:min(1380px,100%);min-height:calc(100vh - 56px);border-radius:34px;padding:34px 28px 36px;background:#160005c2;border:1px solid rgba(255,232,223,.12);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);overflow:hidden}.desk-header{display:flex;flex-direction:column;gap:18px;margin-bottom:24px}.desk-kicker{margin:0 0 8px;color:var(--accent);text-transform:uppercase;letter-spacing:.14em;font-size:.8rem}.desk-header h1{margin:0;font-size:clamp(2.7rem,5vw,5rem);line-height:.95}.filter-switcher,.tag-row{display:flex;flex-wrap:wrap;gap:10px}.filter-mode,.tag{padding:10px 16px;border-radius:999px;color:var(--text);border:1px solid rgba(255,226,211,.14);background:#ffffff0f;transition:transform .18s ease,background .18s ease,border-color .18s ease}.filter-mode:hover,.tag:hover{transform:translateY(-1px);background:#ffffff17}.filter-mode.active,.tag.active{color:var(--accent);border-color:#f2d2b059;background:linear-gradient(135deg,#f2d2b02e,#b8745d33)}.empty-state{padding:34px 24px;border-radius:24px;text-align:center;border:1px solid var(--border);background:#ffffff0a}.empty-state h2{margin:0 0 10px}.empty-state p{margin:0;color:var(--muted)}.carousel-shell{position:relative;min-height:620px;display:flex;align-items:center;justify-content:center}.carousel-stage{position:relative;width:100%;height:520px;display:flex;align-items:center;justify-content:center;overflow:visible}.nav-btn{position:absolute;top:50%;transform:translateY(-50%);z-index:12;width:62px;height:62px;border-radius:999px;background:#ffffff0f;color:var(--text);border:1px solid rgba(255,226,211,.14);font-size:2rem;line-height:1;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-soft);transition:transform .18s ease,background .18s ease}.nav-btn:hover{transform:translateY(-50%) scale(1.05);background:#ffffff1a}.nav-btn-left{left:12px}.nav-btn-right{right:12px}.envelope-card{position:absolute;width:min(520px,44vw);min-height:310px;border-radius:26px;cursor:pointer;-webkit-user-select:none;user-select:none;overflow:hidden;border:1px solid rgba(255,227,213,.15);box-shadow:0 22px 52px #00000047;background:linear-gradient(180deg,#ffffff0f,#ffffff05),linear-gradient(135deg,#6d0a18,#9d1027 48%,#471018);transition:transform .42s ease,opacity .42s ease,filter .42s ease,box-shadow .42s ease}.envelope-card:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(145deg,transparent 49.3%,rgba(255,226,205,.14) 50%,transparent 50.7%),linear-gradient(-145deg,transparent 49.3%,rgba(255,226,205,.14) 50%,transparent 50.7%);pointer-events:none}.envelope-card:after{content:"";position:absolute;width:130px;height:130px;right:-24px;bottom:-34px;border-radius:999px;background:radial-gradient(circle,rgba(242,210,176,.15),transparent 70%);pointer-events:none}.envelope-inner{position:relative;z-index:1;min-height:310px;padding:36px 28px;display:flex;flex-direction:column;justify-content:center;text-align:center}.envelope-meta{margin:0 0 10px;color:#f8efe8bf;text-transform:uppercase;letter-spacing:.12em;font-size:.78rem}.envelope-card h2{margin:0 0 10px;font-size:clamp(1.8rem,2.8vw,3rem);line-height:1.05}.envelope-date{margin:0 0 10px;color:#e4c9c2;font-size:1rem}.envelope-preview{margin:0;color:#efd9d2;font-size:1.05rem;line-height:1.6}.envelope-hint{margin-top:18px;color:var(--accent);font-size:.95rem}.is-center{transform:translate(0) scale(1);opacity:1;z-index:10}.is-left-1{transform:translate(-300px) scale(.82);opacity:.72;z-index:8;filter:blur(.2px)}.is-right-1{transform:translate(300px) scale(.82);opacity:.72;z-index:8;filter:blur(.2px)}.is-left-2{transform:translate(-520px) scale(.64);opacity:.34;z-index:6;filter:blur(.6px)}.is-right-2{transform:translate(520px) scale(.64);opacity:.34;z-index:6;filter:blur(.6px)}.letter-screen{width:min(1200px,100%);padding:0}.letter-toolbar{margin-bottom:16px}.back-btn{display:inline-flex;align-items:center;justify-content:center;padding:11px 16px;border-radius:999px;color:var(--text);border:1px solid rgba(255,226,211,.14);background:#ffffff12}.letter-paper{width:min(920px,100%);margin:0 auto;border-radius:28px;padding:18px;background:linear-gradient(180deg,#fff7eefa,#f4e9dff5);box-shadow:var(--shadow);color:#341712}.letter-paper-inner{border-radius:20px;padding:26px 22px;border:1px solid rgba(99,55,44,.1);background:linear-gradient(180deg,#ffffff61,#ffffff1f)}.letter-top-meta{margin:0 0 12px;color:#926e67;text-transform:uppercase;letter-spacing:.12em;font-size:.78rem}.letter-paper h1{margin:0 0 10px;font-size:clamp(2rem,4vw,3.2rem);line-height:1.02}.letter-date{margin:0 0 22px;color:#7f605a}.letter-cover-image{margin:0 auto 20px;border-radius:18px;box-shadow:0 10px 24px #00000024}.letter-audio-wrap{margin:0 0 22px}.letter-audio{width:100%}.letter-body{line-height:1.85;font-size:1.08rem}.letter-body p,.letter-body ul,.letter-body ol,.letter-body blockquote{margin-top:0;margin-bottom:1.1em}.letter-body img{margin:18px auto;border-radius:16px}.letter-body audio{width:100%;margin:16px 0}@media(max-width:1024px){.desk-screen{padding:26px 18px 28px}.carousel-shell{min-height:500px}.carousel-stage{height:430px}.envelope-card{width:min(420px,62vw);min-height:280px}.envelope-inner{min-height:280px;padding:28px 22px}.is-left-1{transform:translate(-210px) scale(.82)}.is-right-1{transform:translate(210px) scale(.82)}.is-left-2{transform:translate(-360px) scale(.64)}.is-right-2{transform:translate(360px) scale(.64)}}@media(max-width:768px){.app-shell{padding:12px;align-items:stretch}.gate-screen,.desk-screen{min-height:calc(100vh - 24px);border-radius:24px}.gate-center{min-height:calc(100vh - 24px);padding:18px}.gate-card{padding:30px 18px}.gate-card h1{font-size:clamp(2.1rem,9vw,3.3rem)}.desk-header h1{font-size:clamp(2.2rem,10vw,3.3rem)}.carousel-shell{min-height:380px;padding:0 42px}.carousel-stage{height:320px}.nav-btn{width:46px;height:46px;font-size:1.6rem}.nav-btn-left{left:0}.nav-btn-right{right:0}.envelope-card{width:min(100%,320px);min-height:220px}.envelope-inner{min-height:220px;padding:22px 16px}.envelope-card h2{font-size:1.8rem}.is-center{transform:translate(0) scale(1);opacity:1}.is-left-1{transform:translate(-78%) scale(.8);opacity:.22}.is-right-1{transform:translate(78%) scale(.8);opacity:.22}.is-left-2,.is-right-2{opacity:0;pointer-events:none}.letter-paper{padding:12px;border-radius:20px}.letter-paper-inner{padding:18px 14px}.letter-body{font-size:1rem;line-height:1.78}}
