@font-face{font-family:"Letter Sans";src:url('fonts/letter-sans.woff2') format('woff2');font-display:swap;unicode-range:U+0-1EFFF}
@font-face{font-family:"Letter Round";src:url('fonts/letter-round.woff2') format('woff2');font-display:swap;unicode-range:U+0-1EFFF}
@font-face{font-family:"Letter Serif";src:url('fonts/letter-serif.woff2') format('woff2');font-display:swap;unicode-range:U+0-1EFFF}
@font-face{font-family:"Letter Pen";src:url('fonts/letter-pen.woff2') format('woff2');font-display:swap;unicode-range:U+0-1EFFF}
/* Let system emoji fonts handle supplementary symbols instead of blank webfont glyphs. */
@font-face{font-family:"Letter Hand";src:url('fonts/gaegu-regular.woff2') format('woff2');font-display:swap;unicode-range:U+0-1EFFF}
@font-face{font-family:"Letter Title";src:url('fonts/jua-regular.woff2') format('woff2');font-display:swap;unicode-range:U+0-1EFFF}
.letter-studio{--bg:#fffbf5;--ink:#2b201a;--muted:#77756f;--coral:#ff6959;--line:#ece5de;--paper:#fffdf9;font-family:'Letter Sans',system-ui,sans-serif}
.letter-studio .shell{max-width:560px;background:var(--bg);padding-bottom:100px;box-shadow:none}
.letter-studio .heading,.letter-studio .grid-title h2,.letter-studio .template-caption strong{font-family:'Gatchi Title','Letter Sans',sans-serif;font-weight:400;letter-spacing:-.6px;overflow-wrap:anywhere}
.letter-studio .brand{font-family:'Gatchi Title','Letter Sans',sans-serif;font-weight:400;letter-spacing:-.6px}
.letter-studio .topbar{height:72px;margin-bottom:14px}
.letter-studio .topbar h1{font-size:15px;font-weight:500}
.letter-studio .steps{gap:45px;margin:0 0 25px;font-size:13px}
.letter-studio .steps li{display:grid;justify-items:center;gap:3px;font-size:13px}
.letter-studio .steps span{width:30px;height:30px;font-size:14px}
.letter-studio .steps li:not(:last-child):after{width:44px;left:calc(50% + 22px);top:15px;height:2px}
.letter-studio .intro{margin:22px 0}.letter-studio .intro .heading{font-size:clamp(29px,7.8vw,39px);max-width:82%;line-height:1.35;margin:8px 0 14px;letter-spacing:-.6px}.letter-studio .studio-intro{display:block}.letter-studio .studio-intro .mini-envelope{width:32%;right:0;top:12px;transform:rotate(9deg)}.letter-studio .studio-intro .lead{position:relative;margin-top:18px}
.letter-studio .primary{background:linear-gradient(110deg,#ff725b,#ff6259);border-radius:19px;font-size:17px;font-weight:700;box-shadow:0 5px 12px #fa6b5410;min-height:54px}
.letter-studio .primary.kakao{background:#fee500;color:#302911}
.letter-studio .secondary,.letter-studio .outline{border-radius:16px;font-size:14px;font-weight:500}
.letter-studio .text-button{color:#b94b3f}.letter-studio .lead{line-height:1.8;font-size:14px;overflow-wrap:anywhere}
.chuseok-hero{position:relative;overflow:hidden;margin:8px 0 22px;padding:25px 23px 21px;border:1px solid #decda4;border-radius:24px;background:radial-gradient(circle at 84% 18%,#f7d77d 0 50px,transparent 51px),linear-gradient(145deg,#fff9e9,#f5ead0 58%,#e5e9dc);box-shadow:0 8px 24px #79602b12}.chuseok-hero[hidden]{display:none}.chuseok-hero:after{content:'추석';position:absolute;right:22px;bottom:12px;font-family:'Gatchi Title','Letter Sans',sans-serif;font-size:54px;color:#866b3820;transform:rotate(-7deg)}.chuseok-hero h3{position:relative;z-index:1;max-width:76%;margin:6px 0 10px;font-family:'Gatchi Title','Letter Sans',sans-serif;font-size:25px;font-weight:400;line-height:1.35;color:#5b4328}.chuseok-hero>p:not(.season-label){position:relative;z-index:1;max-width:84%;margin:0 0 17px;color:#806d50;font-size:13px;line-height:1.7}.season-label{margin:0;color:#9a6f2d;font-size:11px;font-weight:700;letter-spacing:.09em}.chuseok-hero .primary{position:relative;z-index:1;width:100%;background:linear-gradient(110deg,#9b6534,#ba7d3e);box-shadow:none}.chuseok-paper-link{position:relative;z-index:1;display:block;margin:12px auto 0;padding:5px;background:transparent;color:#7d674b;font-size:12px;text-decoration:underline;text-underline-offset:3px}.chuseok-moon{position:absolute;right:25px;top:18px;width:76px;height:76px;border-radius:50%;background:#efd071;color:#79562d;box-shadow:0 0 0 10px #fff8dc66}.chuseok-moon:before,.chuseok-moon:after{content:'';position:absolute;top:25px;width:16px;height:26px;border:2px solid #79562d;border-bottom:0;border-radius:50% 50% 0 0}.chuseok-moon:before{left:22px;transform:rotate(-13deg)}.chuseok-moon:after{right:20px;transform:rotate(13deg)}.chuseok-moon span{position:absolute;left:12px;right:12px;bottom:12px;text-align:center;font-size:9px;font-weight:700}
.chuseok-heading{margin:20px 0 18px}.chuseok-heading .heading{font-size:31px;line-height:1.35;margin:8px 0 10px}.chuseok-filters{position:sticky;z-index:4;top:0;margin:0 -20px 18px!important;padding:10px 20px!important;background:#fffbf5ee;backdrop-filter:blur(8px)}.chuseok-example-grid{display:grid;gap:13px}.chuseok-example{padding:19px;border:1px solid #e5dac1;border-radius:18px;background:#fffdf7;box-shadow:0 4px 13px #5e4c2c08}.chuseok-example h3{margin:8px 0 10px;font-family:'Gatchi Title','Letter Sans',sans-serif;font-size:19px;font-weight:400;color:#5a4330}.chuseok-example .example-preview,.chuseok-example details p{color:#665b4d;font-family:'Letter Serif','Letter Sans',sans-serif;font-size:14px;line-height:1.8;white-space:pre-line}.chuseok-example .example-preview{display:-webkit-box;margin:0 0 8px;overflow:hidden;-webkit-box-orient:vertical;-webkit-line-clamp:2}.chuseok-example details{margin:0 0 14px;color:#8b6a3c;font-size:12px}.chuseok-example details summary{cursor:pointer;padding:4px 0;text-decoration:underline;text-underline-offset:3px}.chuseok-example details p{margin:9px 0 3px;padding:12px;border-radius:10px;background:#faf5e9}.chuseok-example .secondary{width:100%;border-color:#dec9a0;background:#fbf2df;color:#77572f}.example-meta{display:flex;gap:6px}.example-meta span{padding:4px 8px;border-radius:999px;background:#efe7d5;color:#806847;font-size:10px}.example-meta span+span{background:#f5e8e0;color:#96644c}
.library-actions{display:flex;gap:12px;align-items:center;margin:16px 0 20px}.library-actions .primary{width:auto;padding:12px 25px}.library-actions a{font-size:13px;color:#89766c;text-decoration:underline;text-underline-offset:4px}
.library-occasion{font-size:12px;color:#87796d}.library-occasion summary{padding:8px 0;cursor:pointer}.letter-studio .library-occasion .filters{margin:4px 0 14px}
.draft-banner{border:1px solid #f3d5ca;background:#fff0ea;border-radius:12px;padding:15px 17px;margin:14px 0;display:flex;align-items:center;gap:12px;flex-wrap:wrap;overflow-wrap:anywhere}
.draft-banner div{flex:1;min-width:150px}.draft-banner strong{display:block;font-size:14px}.draft-banner p{font-size:12px;color:#957365;margin:4px 0 0}.draft-banner button{background:#fff;padding:10px 14px;border:1px solid #f0d8ca;border-radius:9px;font-size:13px}
.letter-studio .filters{display:flex;flex-wrap:wrap;gap:6px;overflow:visible;margin:8px 0;padding:0}.letter-studio .chip{padding:10px 15px;border:1px solid transparent;background:#f0ede7;color:#80786f;font-size:13px;min-height:42px;border-radius:999px}
.letter-studio .chip[aria-pressed=true]{background:#ff6959;border-color:#ff6959;color:#fff}
.letter-studio .grid-title{margin-top:28px}.letter-studio .grid-title h2{font-size:22px;letter-spacing:-.5px}.letter-studio .grid-title button{font-size:12px;background:none;color:#80786f;padding:8px;border-radius:6px}
.letter-studio .template-grid{gap:14px 12px}.letter-studio .template-card{background:var(--tint);border-radius:21px;border:2px solid transparent;box-shadow:0 3px 10px #49302a06;overflow:hidden}.letter-studio .template-card[aria-pressed=true]{border-color:var(--coral)}
.letter-studio .template-card .paper-art{position:relative;aspect-ratio:1.05;margin:8px 8px 0;border-radius:13px;box-shadow:0 2px 8px #62462512;border:0;padding:20% 10% 10%;display:flex;align-items:center}
.letter-studio .template-card[aria-pressed=true] .paper-art{outline:none}.letter-studio .template-card[aria-pressed=true]:after{background:#ff6959;top:8px;right:8px;font-size:11px;width:23px;height:23px}
.letter-studio .template-caption{padding:12px 12px 15px;background:linear-gradient(0deg,#fff9,transparent)}.letter-studio .template-caption strong{font-size:17px;letter-spacing:-.4px}.letter-studio .template-caption small{font-size:12px;margin-top:4px}
.mini-copy{white-space:pre-line;font-family:var(--letter-font);font-size:clamp(11px,2.8vw,14px);line-height:1.9;color:var(--paper-ink);position:relative}
.mini-copy small{display:block;font-size:9px;letter-spacing:.02em;margin-bottom:7px;color:var(--paper-accent);font-family:'Letter Sans',sans-serif}
.paper-art[data-legacy=false]{background-color:var(--paper-color);background-image:var(--art-top),var(--art-bottom);background-size:100% auto,100% auto;background-position:center top,center bottom;background-repeat:no-repeat;color:var(--paper-ink)}
.paper-art[data-style=다이어리]{background-image:var(--art-top),var(--art-bottom),linear-gradient(#adb9a51c 1px,transparent 1px),linear-gradient(90deg,#adb9a51c 1px,transparent 1px);background-size:100% auto,100% auto,24px 24px,24px 24px}
.paper-art[data-style=한가위]{background-color:var(--paper-color);background-image:var(--art-top),var(--art-bottom),radial-gradient(circle at 20% 30%,#ffffff90 0 1px,transparent 2px);background-size:100% auto,100% auto,34px 34px;background-position:center top,center bottom,0 0;background-repeat:no-repeat,no-repeat,repeat}
.paper-art[data-legacy=true]{background-image:url('art/stationery-atlas.png');background-size:300% 200%;background-position:var(--px) var(--py)}
.letter-studio .letter-paper{padding:clamp(74px,17vw,135px) 36px clamp(78px,17vw,130px);border-radius:8px;box-shadow:0 5px 22px #62462512;border:1px solid #eadfd855;color:var(--text-color,var(--paper-ink));min-height:480px}
.letter-studio .letter-paper[data-legacy=true]{background-color:#fffaf5}
.letter-studio .sample-copy,.letter-studio .letter-copy{font-family:var(--letter-font);font-size:var(--letter-size,20px);line-height:1.9;color:inherit;background:transparent;border-radius:0}
.letter-studio .sample-copy{padding:0}.letter-studio .letter-copy{margin:26px 0;min-height:150px}
.letter-studio .compose-paper textarea{font-family:var(--letter-font);font-size:var(--letter-size,20px);color:inherit;min-height:290px;line-height:1.9;resize:vertical;background:transparent;padding:8px 0 14px;tab-size:4}
.letter-studio textarea::placeholder{color:#ae9890}.letter-studio .field-row input{font-family:var(--letter-font);font-size:18px;background:#ffffff50;border-bottom:1px solid #c8a99740;border-radius:0;padding:8px;color:inherit}.letter-studio .field-row label{font-size:11px;color:#89746a}
.letter-studio .letter-meter{background:transparent;padding:8px 0;color:#927e73;margin-bottom:18px;font-size:11px}.letter-studio .letter-meter strong{font-size:11px;font-weight:400}.letter-studio .letter-meter:not(.near-limit) span{visibility:hidden}.letter-studio .letter-meter.near-limit{color:#985628}.letter-studio .letter-meter.over-limit{padding:8px;background:#fff0e9}
.compose-header{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:25px 0 16px}.compose-header .heading{font-size:25px;margin:0}.save-status{font-size:11px;color:#a08071;margin:5px 0 0}.save-status[data-error=true]{color:#a23f36}
.letter-studio .toolbar{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}.letter-studio .toolbar button{flex:1;padding:10px 6px;min-height:43px;font-size:12px;white-space:nowrap}.letter-studio .toolbar button[aria-expanded=true]{background:#fff0ea;border-color:#efa797}
.letter-studio .tool-panel{margin:0 0 14px;border-radius:17px;padding:16px}.panel-heading{display:flex;align-items:center;justify-content:space-between;margin:0 0 12px;font-size:13px}.panel-heading button{background:none;color:#a06655;padding:6px;font-size:12px}
.font-options{display:grid;grid-template-columns:1fr 1fr;gap:8px}.font-option{text-align:left;background:#fffaf5;padding:12px 10px;border:1px solid #f0e2d7;border-radius:9px}.font-option[aria-pressed=true]{border:1px solid #ef8f7f;background:#fff0ea}.font-option small{display:block;font:10px 'Letter Sans',sans-serif;color:#967e70;margin-bottom:7px}.font-option span{font-size:20px;line-height:1.5;display:block}
.color-options{display:flex;gap:10px;margin:10px 0 0}.color-option{width:35px;height:35px;background:var(--swatch);border:4px solid #fff;border-radius:50%;outline:1px solid #ddd}.color-option[aria-pressed=true]{outline:2px solid #d76856}
.sticker-options,.emoji-options{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.sticker-option,.emoji-options button{display:grid;place-items:center;aspect-ratio:1;background:#fffaf5;border:1px solid #eee;border-radius:9px;min-height:42px;font-size:24px;padding:5px}.sticker-option[aria-pressed=true]{background:#fff0ea;border-color:#ef9b89}.sticker-option img{width:36px;height:36px}.paper-stickers{display:flex;justify-content:flex-end;gap:10px;position:relative;margin-top:20px;min-height:48px}.paper-stickers img{width:48px;height:48px;transform:rotate(-7deg)}.paper-stickers img:nth-child(2){transform:rotate(7deg)}
.seal-options{display:flex;gap:8px;flex-wrap:wrap}.seal-options button{background:#fff8f2;border:1px solid var(--line);border-radius:50%;padding:8px}.seal-options button[aria-pressed=true]{border-color:#ef8f7f;background:#fff0ea}.seal-options img{width:29px;height:29px}.heart-seal img{width:58px;height:58px}.letter-studio .envelope{border-radius:9px;box-shadow:0 15px 35px #75523f16}.letter-studio .envelope-stage{min-height:300px}.letter-studio .envelope .env-recipient{color:#806251;max-width:80%;overflow-wrap:anywhere}
.letter-studio .help-row{background:transparent;border-top:1px solid var(--line);border-bottom:1px solid var(--line);border-radius:0;padding:10px 0}.letter-studio .help-row button{color:#be6250}.letter-studio .suggestions button{background:#fff8f3}.memory-prompt{padding:14px;border-left:2px solid #eeb7a0;background:#fff6ee;font-size:14px;margin:0 0 14px}.memory-prompt strong{display:block;margin-bottom:5px}.memory-prompt p{margin:0;color:#957161;font-size:13px}
.letter-studio .preview-stage{padding:0 0 20px}.letter-studio .preview-callout{border-radius:12px}.letter-studio .letter-to,.letter-studio .letter-sign{font-family:var(--letter-font);font-size:18px}.letter-studio .letter-date{color:#958376;font-size:11px}.letter-studio .tag{background:#ffe7e6;color:#a85348}
.keepsake-actions{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:22px 0 10px}.quick-replies{display:flex;gap:7px;flex-wrap:wrap;margin:10px 0 16px}.quick-replies button{background:#fff0e9;border:1px solid var(--line);border-radius:24px;padding:10px 13px;font-size:13px}.reader-footnote{font-size:12px;color:#9d8070;margin:26px 0;text-align:center}.reader-footnote a{text-decoration:underline;text-underline-offset:3px}.letter-studio .reader-actions{gap:8px}
.studio-dialog{border:1px solid #f0dfd2;border-radius:16px;max-width:440px;width:calc(100% - 32px);padding:24px;background:#fffdf9;color:#49372b;box-shadow:0 25px 90px #61422d30}.studio-dialog::backdrop{background:#513a2e70}.studio-dialog h2{font-size:20px;margin:0 0 10px}.studio-dialog p{font-size:14px;color:#967c6c}.studio-dialog .secondary{width:100%;margin-top:10px}.studio-dialog .text-button{display:block;margin:12px auto 0}.save-preview{max-width:100%;max-height:50vh;object-fit:contain;margin:12px auto}.export-note{font-size:12px!important}.download-link{text-align:center}
.visually-hidden{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.letter-studio .tool-panel select.visually-hidden{width:1px;min-width:0;height:1px;padding:0;border:0}
.export-pages{display:flex;align-items:center;justify-content:space-between;font-size:12px;margin:10px 0}.letter-studio .letter-limit-status{font-weight:400;font-size:12px}.letter-studio .footer{font-size:11px;color:#a28c7c}
@media(min-width:600px){.letter-studio .template-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.letter-studio .shell{padding-left:34px;padding-right:34px}.mini-copy{font-size:13px}}
@media(max-width:380px){.letter-studio .shell{padding-left:16px;padding-right:16px}.letter-studio .letter-paper{padding-left:24px;padding-right:24px}.letter-studio .toolbar button{font-size:11px}.letter-studio .intro .heading{font-size:28px}.sticker-options,.emoji-options{grid-template-columns:repeat(5,1fr)}}
@media(max-width:380px){.chuseok-hero{padding-left:18px;padding-right:18px}.chuseok-hero h3{font-size:22px}.chuseok-moon{right:17px;width:66px;height:66px}.chuseok-heading .heading{font-size:27px}}
@media(prefers-reduced-motion:reduce){.letter-studio *{scroll-behavior:auto!important}}
@media(max-width:380px){.font-option span{font-size:16px}}

.template-card .paper-art[data-legacy=true] .mini-copy{visibility:hidden}
.letter-studio .toolbar button[aria-expanded=true]{color:#b45443}.letter-studio .template-count{font-family:'Letter Sans',sans-serif;font-weight:400;font-size:12px;color:var(--muted)}

/* Keep decorations beside the writing task, including above a mobile keyboard. */
.letter-editor{position:relative;min-height:290px;padding:8px 0 14px;font-family:var(--letter-font);font-size:var(--letter-size,20px);line-height:1.9;white-space:pre-wrap;overflow-wrap:anywhere;tab-size:4;outline:none;caret-color:#b14c3c;scroll-margin-bottom:260px}
.letter-editor:empty::before,.letter-editor[data-empty=true]::before{content:attr(data-placeholder);position:absolute;inset:8px 0 auto;white-space:pre-wrap;color:#ae9890;pointer-events:none;user-select:none}
.letter-editor:focus::before{content:none}
.letter-editor:focus-visible{outline:1px dashed #d7a899;outline-offset:8px;border-radius:4px}
.inline-letter-sticker{display:inline-block;width:1.55em;height:1.55em;vertical-align:middle;line-height:0;white-space:normal;user-select:all;position:relative;overflow:hidden}
.inline-letter-sticker img{display:block;width:100%;height:100%;max-width:none;pointer-events:none}
#compose{padding-bottom:var(--dock-height,74px)}
.writing-dock{position:fixed;z-index:24;bottom:var(--keyboard-inset,0px);left:50%;transform:translateX(-50%);width:min(560px,100%);background:#fffaf5f5;border:1px solid #eddbce;border-bottom:0;border-radius:20px 20px 0 0;padding:10px 14px max(10px,env(safe-area-inset-bottom));box-shadow:0 -6px 28px #80563712;backdrop-filter:blur(10px)}
.writing-dock-tabs{display:flex;gap:7px}.writing-dock-tabs button{flex:1;min-width:0;min-height:44px;padding:9px 6px;font-size:13px;white-space:nowrap}
.writing-dock-tabs [aria-expanded=true]{background:#ffe5dd;border-color:#ef9b89;color:#a74334}
.writing-dock .tool-panel{margin:8px 0 0;padding:11px 3px 3px;border:0;border-top:1px solid #eeded2;border-radius:0;background:transparent;max-height:min(230px,32dvh);overflow-y:auto;overscroll-behavior:contain}
.writing-dock .panel-heading{font-size:12px;margin:0 0 10px;gap:8px}.writing-dock .panel-heading button{padding:5px;font-size:11px;min-height:32px}
.writing-dock .sticker-options,.writing-dock .emoji-options{grid-template-columns:repeat(8,minmax(0,1fr));gap:5px}
.writing-dock .sticker-option,.writing-dock .emoji-options button{min-height:42px;padding:5px;aspect-ratio:1;font-size:24px;touch-action:manipulation}
.writing-dock .sticker-option img{width:32px;height:32px}.seal-details{font-size:12px;color:#8e6b57;margin-top:13px}.seal-details summary{cursor:pointer;padding:8px 0}.seal-details .seal-options{margin-top:8px}
@media(max-width:400px){.writing-dock .sticker-options,.writing-dock .emoji-options{grid-template-columns:repeat(6,minmax(0,1fr))}.writing-dock{padding-left:10px;padding-right:10px}.writing-dock-tabs button{font-size:12px}}
/* 보내는 사람 칸 — 카톡 버튼 바로 위 (2026-09-17) */
.send-name{display:block;text-align:left;font-size:13px;font-weight:700;color:#7a6a58;margin:0 0 10px}
.send-name b{font-weight:600;color:#a89982}
.send-name input{display:block;width:100%;box-sizing:border-box;margin-top:6px;border:2px solid #efe3cf;border-radius:14px;padding:13px 15px;font:inherit;font-size:17px;font-weight:700;color:#3d3328;background:#fffdf8}
.send-name input:focus{outline:none;border-color:#f0a58a}
.send-name input.need-name{border-color:#e2685a;animation:needName .45s ease}
@keyframes needName{25%{transform:translateX(-4px)}75%{transform:translateX(4px)}}