:root{color:#393630;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;--ink:#393630;--muted:#777268;--red:#a8312b;--line:#453a2b29;--serif:"Nanum Myeongjo","AppleMyungjo","Batang",Georgia,serif;background:#f3f0e9;font-family:Apple SD Gothic Neo,Malgun Gothic,sans-serif}*{box-sizing:border-box}html,body,#root{width:100%;height:100%;margin:0}body{overflow:hidden}button,textarea{font:inherit}button{color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none}button:disabled{cursor:default}button,a,textarea{touch-action:manipulation}button:focus-visible,a:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--red);outline-offset:5px}button svg{stroke:currentColor;stroke-width:1.4px;flex:none;width:18px;height:18px}::selection{color:#572824;background:#e8c8bd}.app{background:#f3f0e9;width:100%;height:100dvh;position:fixed;inset:0;overflow:hidden}.scene{z-index:0;position:absolute;inset:0}.scene canvas{outline:none;width:100%;height:100%;display:block}.site-header{z-index:2;inset:max(32px,env(safe-area-inset-top)) 42px auto;pointer-events:none;justify-content:space-between;align-items:center;gap:24px;transition:opacity .25s;display:flex;position:absolute}.brand-lockup{align-items:center;gap:12px;display:flex}.brand-mark{width:39px;height:39px;color:var(--red);place-items:center;display:grid}.brand-mark svg{stroke:currentColor;stroke-width:1.3px;width:33px;height:33px;display:block}.brand{letter-spacing:-.025em;font-size:15px;font-weight:600;line-height:1.4}.brand-en{letter-spacing:.17em;color:#857e70;margin-top:3px;font-size:8px;font-weight:500;line-height:1.2;display:block}.top-note{letter-spacing:.025em;color:var(--muted);margin:0;font-size:11px;font-weight:400}.bottom-bar{z-index:2;left:44px;right:44px;bottom:max(34px,env(safe-area-inset-bottom));justify-content:space-between;align-items:center;gap:22px;transition:opacity .25s;display:flex;position:absolute}.local-note{color:#827b6e;letter-spacing:-.015em;align-items:center;gap:9px;margin:0;font-size:11px;display:flex}.local-note>span{background:#a89a7e;border-radius:50%;flex:none;width:4px;height:4px}.actions{align-items:center;gap:10px;display:flex}.archive-button,.write-button{border-radius:3px;justify-content:center;align-items:center;gap:12px;min-height:46px;font-size:12px;font-weight:500;transition:background .18s,color .18s,border-color .18s,transform .18s;display:inline-flex}.archive-button{border:1px solid var(--line);color:#665e51;background:#faf8f25c;padding:0 17px}.archive-button .count{font-variant-numeric:tabular-nums;color:#8b7b62;place-items:center;min-width:18px;height:18px;font-size:10px;display:inline-grid}.write-button{color:#fff8ef;background:var(--red);border:1px solid var(--red);padding:0 21px;box-shadow:0 3px 9px #5f2d2114}.write-button svg{stroke-width:1.5px;width:17px;height:17px}.write-button:disabled{opacity:.4}.archive-button:hover{background:#faf8f2bf;border-color:#453a2b59}.write-button:hover:not(:disabled){background:#912823;border-color:#912823}.write-button:active,.archive-button:active{transform:translateY(1px)}.scene-caption{z-index:1;color:#797264;text-align:center;width:max-content;max-width:80%;font-family:var(--serif);letter-spacing:-.025em;pointer-events:none;font-size:13px;line-height:1.9;position:absolute;top:77.5%;left:50%;transform:translate(-50%)}.caption-line{background:#b5a78c;width:20px;height:1px;margin:0 auto 15px;display:block}.app[data-composing=true] .site-header,.app[data-composing=true] .bottom-bar,.app[data-busy=true] .site-header,.app[data-busy=true] .bottom-bar{opacity:0;pointer-events:none}.editor{z-index:5;color:#55473b;overscroll-behavior:contain;background:0 0;flex-direction:column;padding:40px 42px 30px;transition:opacity .1s;animation:.21s both ink-appear;display:flex;position:absolute}.editor[data-saving=true]{opacity:0;pointer-events:none;animation:none}.paper-meta{color:#9c8c73;letter-spacing:.08em;flex:none;justify-content:space-between;align-items:baseline;gap:16px;margin-bottom:24px;font-size:9px;font-weight:400;line-height:1.5;display:flex}.paper-meta>:first-child{letter-spacing:.14em}.paper-meta>:last-child{font-variant-numeric:tabular-nums;white-space:nowrap;font-size:9px}.letter-input{resize:none;color:#56493b;width:100%;min-height:0;caret-color:var(--red);font-family:var(--serif);letter-spacing:0;word-break:break-all;overflow-wrap:anywhere;scrollbar-width:thin;scrollbar-color:#8f77534d transparent;-webkit-overflow-scrolling:touch;overscroll-behavior:contain;touch-action:pan-y;background:0 0;border:0;border-radius:0;flex:auto;margin:0;padding:0 5px 5px 0;font-size:16px;font-weight:400;line-height:1.9;display:block;overflow:hidden auto}.letter-input:focus,.letter-input:focus-visible{outline:none}.letter-input::placeholder{color:#ab9e89;opacity:1}.letter-input::-webkit-scrollbar{width:3px}.letter-input::-webkit-scrollbar-thumb{background:#8f77534d;border-radius:2px}.editor-footer{border-top:1px solid #967e5933;flex:none;justify-content:space-between;align-items:center;gap:10px;margin-top:21px;padding-top:14px;display:flex}.cancel-button,.send-button{border:0;border-radius:2px;min-height:40px;font-family:Apple SD Gothic Neo,Malgun Gothic,sans-serif;font-size:12px;line-height:1;transition:background .16s,opacity .16s}.cancel-button{color:#897d68;background:0 0;padding:0 4px}.cancel-button:hover{color:#4e4437}.send-button{background:var(--red);color:#fff9f0;justify-content:center;align-items:center;gap:9px;padding:0 15px;display:inline-flex}.send-button:hover:not(:disabled){background:#912823}.send-button:disabled{opacity:.36}.draft-note{color:#9f937c;letter-spacing:-.02em;flex:none;font-size:9px;line-height:1.5}.editor-footer .draft-note{margin:0 auto 0 7px}.editor-error{color:#a0312b;flex:none;margin:9px 0 0;font-size:11px;line-height:1.55}.motion-status{z-index:10;bottom:max(43px,calc(env(safe-area-inset-bottom) + 24px));text-align:center;max-width:calc(100% - 40px);font-family:var(--serif);color:#756a58;pointer-events:none;font-size:13px;line-height:1.6;position:absolute;left:50%;transform:translate(-50%)}.motion-status:has(.success-message){bottom:17%}.success-message{white-space:nowrap;color:#6c5d48;align-items:center;gap:9px;font-size:15px;animation:.22s both ink-appear;display:inline-flex}.success-message>span{color:var(--red);font-family:sans-serif}.overlay-backdrop{z-index:20;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);background:#473a2824;animation:.2s both ink-appear;position:absolute;inset:0}.archive-panel{top:max(22px,env(safe-area-inset-top));right:22px;bottom:max(22px,env(safe-area-inset-bottom));background:#fbf8f0;border:1px solid #faf6ecd9;border-radius:3px;flex-direction:column;width:420px;max-width:calc(100vw - 44px);padding:29px 30px;animation:.28s cubic-bezier(.2,.7,.3,1) both archive-appear;display:flex;position:absolute;box-shadow:-12px 5px 70px #3626121a}.archive-header{border-bottom:1px solid var(--line);flex:none;justify-content:space-between;align-items:center;gap:16px;padding-bottom:22px;display:flex}.eyebrow{color:#9b8e78;letter-spacing:.15em;margin-bottom:10px;font-size:8px;display:block}.archive-header h2{font-family:var(--serif);letter-spacing:-.06em;margin:0;font-size:21px;font-weight:400}.archive-header h2 span{color:#a39174;margin-left:6px;font-family:sans-serif;font-size:12px}.archive-header>button{color:#8d7e69;background:0 0;border:0;border-radius:2px;place-items:center;width:40px;height:40px;margin-right:-7px;font-size:26px;display:grid}.archive-header>button:hover{color:#4b4033;background:#f0eade}.archive-list{overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d6cbb7 transparent;flex:1;min-height:0;padding:4px 0;overflow-y:auto}.letter-row{text-align:left;color:#584b3a;background:0 0;border:0;border-bottom:1px solid #88735126;grid-template-columns:24px 1fr 38px 12px;align-items:center;gap:10px;width:100%;padding:23px 2px;transition:background .15s;display:grid}.letter-row:hover{background:#c9b6971a}.letter-row time,.letter-number{font-variant-numeric:tabular-nums;color:#9a8b75;letter-spacing:.025em;font-size:10px}.letter-preview{-webkit-line-clamp:2;font-family:var(--serif);letter-spacing:-.03em;white-space:pre-wrap;overflow-wrap:anywhere;-webkit-box-orient:vertical;font-size:14px;line-height:1.9;display:-webkit-box;overflow:hidden}.reader{flex-direction:column;flex:auto;min-height:0;padding-top:21px;display:flex}.back-button{color:#8b7e68;background:0 0;border:0;align-self:flex-start;align-items:center;gap:6px;min-height:40px;margin:0 0 15px -4px;padding:0 4px;font-size:11px;display:flex}.back-button:hover{color:#493f30}.reader-date{color:#9b8b71;font-variant-numeric:tabular-nums;letter-spacing:.055em;margin:0 0 24px;font-size:10px}.reader-body{min-height:0;font-family:var(--serif);letter-spacing:-.025em;color:#5c4c37;white-space:pre-wrap;overflow-wrap:anywhere;overscroll-behavior:contain;scrollbar-width:thin;scrollbar-color:#d6cbb7 transparent;flex:1;margin:0;padding-right:7px;font-size:16px;line-height:2.05;overflow-y:auto}.reader-signoff{color:#9b8b71;margin-top:24px;font-size:10px}.archive-footnote{color:#9b8b71;border-top:1px solid var(--line);flex:none;margin:22px 0 0;padding-top:15px;font-size:10px;line-height:1.8}.empty-state{color:#a0927c;text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:36px 16px 70px;font-size:12px;line-height:1.9;display:flex}.empty-state svg{stroke:currentColor;stroke-width:1px;color:#baab92;width:34px;height:34px;margin-bottom:15px}.empty-state p{font-family:var(--serif);color:#756751;margin:4px 0;font-size:16px}.error-banner{z-index:30;top:max(98px,calc(env(safe-area-inset-top) + 72px));color:#7d3b30;background:#fbf2e8;border:1px solid #dfc4b5;border-radius:3px;width:max-content;max-width:calc(100% - 40px);padding:14px 18px;font-size:12px;line-height:1.6;position:absolute;left:50%;transform:translate(-50%)}.retry-button{color:var(--red);text-underline-offset:3px;background:0 0;border:0;margin-left:12px;padding:6px 8px;font-size:11px;text-decoration:underline}.scene-error{z-index:12;border:1px solid var(--line);text-align:center;background:#fbf8f0;border-radius:3px;width:360px;max-width:calc(100% - 40px);padding:25px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.scene-error p{color:#827460;margin:0 0 9px;font-size:12px;line-height:1.65}.scene-error p:first-child{font-family:var(--serif);color:#584734;font-size:18px}.scene-error .retry-button{min-height:40px;margin:10px 0 0}.loading-note{font-family:var(--serif);letter-spacing:.02em;color:#9b8c76;pointer-events:none;justify-content:center;align-items:center;font-size:13px;display:flex;position:absolute;inset:0}.sr-only{clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important;width:1px!important;height:1px!important;margin:-1px!important;padding:0!important;position:absolute!important;overflow:hidden!important}@keyframes ink-appear{0%{opacity:0}to{opacity:1}}@keyframes archive-appear{0%{opacity:0;transform:translate(14px)}to{opacity:1;transform:translate(0)}}.scene-caption{top:80%}@media (width>=1500px){.site-header{top:40px;left:54px;right:54px}.bottom-bar{bottom:42px;left:56px;right:56px}}@media (width<=640px){.site-header{inset:max(23px,calc(env(safe-area-inset-top) + 12px)) 21px auto;gap:10px}.brand-lockup{gap:8px}.brand-mark{width:29px;height:34px}.brand-mark svg{width:27px;height:27px}.brand{font-size:13px}.brand-en{letter-spacing:.12em;font-size:7px}.top-note{display:none}.bottom-bar{left:21px;right:21px;bottom:max(24px,calc(env(safe-area-inset-bottom) + 15px));flex-wrap:wrap;justify-content:center;row-gap:16px}.actions{order:0;justify-content:center;gap:9px;width:100%}.write-button{flex:1;max-width:230px;min-height:48px;padding:0 20px}.archive-button{min-height:48px;padding:0 16px}.local-note{order:1;gap:6px;font-size:9px}.scene-caption{font-size:12px;line-height:1.9;top:72%}.editor{padding:29px 27px 22px}.paper-meta{margin-bottom:17px;font-size:8px}.paper-meta>:last-child{font-size:8px}.editor-footer{gap:8px;margin-top:15px;padding-top:12px}.cancel-button,.send-button{min-height:44px;font-size:12px}.draft-note{font-size:8px}.editor-footer .draft-note{max-width:90px;margin-left:2px}.archive-panel{inset:max(12px,env(safe-area-inset-top)) 12px max(12px,env(safe-area-inset-bottom));width:auto;max-width:none;padding:24px}.archive-header h2{font-size:20px}.archive-header{padding-bottom:19px}.reader-body{font-size:16px}.motion-status{bottom:max(33px,calc(env(safe-area-inset-bottom) + 18px));font-size:12px}.error-banner{top:max(84px,calc(env(safe-area-inset-top) + 65px));font-size:11px}}@media (height<=600px){.editor{padding-top:20px;padding-bottom:17px}.paper-meta{margin-bottom:11px}.editor-footer{margin-top:9px;padding-top:8px}.scene-caption{display:none}.site-header{top:max(18px,env(safe-area-inset-top))}.bottom-bar{bottom:max(18px,env(safe-area-inset-bottom))}}@media (height<=360px){.editor{padding:12px 22px}.paper-meta{margin-bottom:6px}.editor-footer{margin-top:4px;padding-top:4px}.draft-note{display:none}.paper-meta{font-size:8px}.motion-status{display:none}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}