:root{--paper:#fbf9f5;--ink:#222220;--muted:#77756f;--line:#deddd8;--lavender:#edeaf7;--peach:#fcf0eb;--sage:#ecf3ef;--shadow:0 18px 40px rgba(32,31,29,.08)}*{box-sizing:border-box}body{margin:0;background:#eae8e3;color:var(--ink);font-family:'Noto Sans KR',sans-serif}button,input,textarea{font:inherit}.app-shell{position:relative;width:min(100%,480px);min-height:100dvh;margin:auto;padding:0 24px 104px;background:var(--paper);overflow:hidden}.app-shell:before{content:"";pointer-events:none;position:absolute;inset:0;opacity:.2;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='180' height='180'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.19'/%3E%3C/svg%3E");z-index:0}.topbar,.screen,.bottom-nav{position:relative;z-index:1}.topbar{height:82px;margin:0 -24px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 24px}.wordmark{font-family:'DM Serif Display','Noto Serif KR',serif;font-size:37px;letter-spacing:.055em;color:var(--ink);text-decoration:none}.calendar-icon{font-size:28px;line-height:1;transform:translateY(-3px)}.quiet-button,.back-button{border:0;background:transparent;color:var(--ink);font-size:23px;cursor:pointer}.screen{display:none;padding:52px 0 16px;animation:appear .35s ease}.screen.active{display:block}@keyframes appear{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}h1,h2,p{margin-top:0}.eyebrow{font-size:11px;letter-spacing:.13em;color:var(--muted);font-weight:500}.date-pill{display:table;margin:0 auto 38px;padding:9px 22px;border:1px solid var(--line);border-radius:100px;font-size:15px;letter-spacing:.04em}.letter-composer{min-height:368px;padding:54px 30px 20px;border:1px solid var(--line);border-radius:27px;background:rgba(255,255,255,.61);box-shadow:var(--shadow);text-align:center}.letter-composer h1,.delivery-intro h1,.inbox-heading h1,.profile-hero h1{font-family:'Noto Serif KR',serif;font-size:37px;line-height:1.42;font-weight:400;letter-spacing:-.08em}.letter-composer textarea{width:100%;height:118px;resize:none;border:0;border-bottom:1px solid #bbb9b3;outline:0;background:transparent;padding:18px 4px 8px;color:var(--ink);font-size:17px;line-height:1.9;text-align:center}.letter-composer textarea::placeholder{color:#b4b1ac}.composer-foot{display:flex;justify-content:space-between;margin-top:8px;color:#aaa7a2;font-size:11px}.mood-section{margin:43px 0 34px;text-align:center}.mood-section h2{font-family:'Noto Serif KR',serif;font-size:16px;font-weight:400;color:#625f59}.moods{display:flex;flex-wrap:wrap;gap:10px;justify-content:center}.mood{padding:10px 15px;border:1px solid #e3e0db;border-radius:99px;background:#f7f5f1;box-shadow:0 3px 8px rgba(0,0,0,.03);cursor:pointer}.mood:nth-child(1).selected{background:#f3f0fb}.mood:nth-child(2).selected{background:#eef3f5}.mood:nth-child(3).selected{background:var(--peach)}.mood:nth-child(4).selected{background:var(--sage)}.primary-button{width:100%;min-height:64px;border:0;border-radius:15px;background:#292929;color:white;font-size:17px;letter-spacing:-.04em;box-shadow:0 12px 19px rgba(0,0,0,.13);cursor:pointer}.primary-button span{margin-left:8px}.back-button{margin:-30px 0 40px;padding:0;font-size:35px}.delivery-intro{text-align:center}.delivery-intro h1{margin:24px 0 22px;font-size:42px}.delivery-intro>p:last-child{color:var(--muted);font-family:'Noto Serif KR',serif;line-height:1.8}.delivery-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:64px 0 16px}.delivery-option{height:166px;border:1px solid #cbc9c3;border-radius:20px;background:rgba(255,255,255,.4);color:var(--ink);cursor:pointer}.delivery-option.selected{border:2px solid #696275;background:#f5f2fb}.delivery-option b{display:block;margin-bottom:24px;color:#5d5b77;font-size:33px;font-weight:400}.delivery-option span{font-family:'Noto Serif KR',serif;font-size:21px}.custom-date-wrap{display:none;margin:18px 0;padding:14px;border:1px solid var(--line);border-radius:12px;justify-content:space-between}.custom-date-wrap.visible{display:flex}.custom-date-wrap input{border:0;background:transparent;color:var(--ink)}.delivery-send{margin-top:68px}.inbox-heading h1{margin:16px 0 10px;font-size:37px}.inbox-heading>p:last-child{color:var(--muted);font-family:'Noto Serif KR',serif}.letter-card{margin-top:42px;padding:27px 26px 20px;border:1px solid #d5d2ca;border-radius:24px;background:linear-gradient(135deg,#fffefd,#faf7f0);box-shadow:var(--shadow)}.letter-card .tag{display:inline-block;padding:6px 11px;border-radius:20px;background:var(--lavender);color:#5d5b77;font-size:11px}.letter-card h3{margin:25px 0 12px;font-family:'Noto Serif KR',serif;font-size:22px;font-weight:400}.letter-card p{font-family:'Noto Serif KR',serif;font-size:17px;line-height:1.8}.open-letter{width:100%;padding:15px 0 0;border:0;border-top:1px solid var(--line);background:transparent;text-align:left;color:#57544e;cursor:pointer}.upcoming{margin-top:55px}.upcoming h2{padding-bottom:18px;border-bottom:1px solid var(--line);font-family:'Noto Serif KR',serif;font-size:24px;font-weight:400}.upcoming-item{display:flex;gap:14px;align-items:center;margin:18px 0}.lock{width:33px;height:33px;border:1px solid #d3d1cb;border-radius:50%;display:grid;place-items:center;color:#96938c}.upcoming-item .due{display:block;font-size:13px}.upcoming-item .title{display:block;margin-top:5px;color:#68655e;font-family:'Noto Serif KR',serif}.archive-header{display:flex;justify-content:space-between;align-items:center}.archive-header h1{font-family:'DM Serif Display','Noto Serif KR',serif;font-size:29px;font-weight:400}.archive-header button{border:0;background:transparent;font-size:36px;color:#555;cursor:pointer}.calendar-weekdays,.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);text-align:center}.calendar-weekdays{margin:34px 0 14px;color:#696760;font-size:13px}.calendar-grid{gap:10px 4px}.day{height:42px;border:0;border-radius:50%;background:transparent;cursor:pointer;color:var(--ink)}.day.has-entry:after{content:"";display:block;width:7px;height:7px;margin:3px auto;background:#b8b5d3;border-radius:50%}.day.today{outline:1px solid #c8c6c1}.memory-card{margin-top:50px;padding:27px;border:1px solid var(--line);border-radius:20px;background:rgba(255,255,255,.45);font-family:'Noto Serif KR',serif;line-height:1.9}.profile-hero h1{margin:18px 0;font-size:42px}.profile-hero>p:last-child{color:var(--muted);font-family:'Noto Serif KR',serif}.profile-card{margin:46px 0 18px;padding:30px;border:1px solid var(--line);border-radius:24px;background:linear-gradient(140deg,var(--lavender),#fff)}.profile-card span,.profile-card small{display:block;color:var(--muted)}.profile-card strong{display:block;margin:12px 0;font-family:'DM Serif Display',serif;font-size:55px;font-weight:400}.secondary-button{width:100%;margin-top:12px;padding:17px;border:1px solid var(--line);border-radius:14px;background:rgba(255,255,255,.45);color:var(--ink);cursor:pointer}.danger{margin-top:45px;color:#9a5550}.bottom-nav{position:fixed;left:50%;bottom:0;transform:translateX(-50%);width:min(100%,480px);height:86px;border-top:1px solid var(--line);background:rgba(251,249,245,.91);backdrop-filter:blur(14px);display:flex;justify-content:space-around;padding:7px 10px env(safe-area-inset-bottom)}.nav-item{min-width:66px;border:0;border-radius:16px;background:transparent;color:#4a4945;cursor:pointer}.nav-item.active{background:#f0edf9}.nav-item b,.nav-item span{display:block}.nav-item b{font-size:25px;font-weight:400;line-height:30px}.nav-item span{font-family:'Noto Serif KR',serif;font-size:13px}.toast{position:fixed;z-index:5;left:50%;bottom:106px;transform:translate(-50%,20px);padding:13px 18px;border-radius:99px;background:#292929;color:white;font-size:13px;opacity:0;pointer-events:none;transition:.25s}.toast.show{opacity:1;transform:translate(-50%,0)}dialog{width:min(calc(100% - 48px),430px);border:1px solid var(--line);border-radius:25px;padding:42px 28px;background:var(--paper);box-shadow:var(--shadow)}dialog::backdrop{background:rgba(25,25,24,.32);backdrop-filter:blur(3px)}.dialog-close{position:absolute;right:17px;top:10px;border:0;background:transparent;font-size:30px;cursor:pointer}.dialog-letter{font-family:'Noto Serif KR',serif;font-size:24px;line-height:1.8}.dialog-mood{color:var(--muted)}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}@media(min-width:600px){body{padding:30px}.app-shell{min-height:calc(100dvh - 60px);border-radius:28px;box-shadow:0 30px 80px rgba(0,0,0,.16)}.bottom-nav{bottom:30px;border-radius:0 0 28px 28px}}