@import "https://fonts.googleapis.com/css2?family=Newsreader:opsz,wght@6..72,500;6..72,650&family=Nanum+Gothic+Coding:wght@400;700&display=swap";@import "https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css";:root{--paper:#dcded9;--paper-soft:#f4f4ef;--paper-quiet:#e8e9e4;--photo-paper:#f0f0ea;--ink-main:#161716;--ink-muted:#5c625d;--ink-faint:#16171675;--bg-surface:#111211;--bg-elevated:#252722;--text-main:#f3f3ee;--text-muted:#a3a69e;--accent:#8b2724;--accent-deep:#5c1c1b;--accent-soft:#8b27241f;--danger:#96302d;--success:#3d574d;--border-subtle:#16171629;--border-focus:#8b2724;--serif:"Newsreader", Georgia, "Times New Roman", serif;--sans:"Pretendard", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;--mono:"Nanum Gothic Coding", ui-monospace, SFMono-Regular, Menlo, Consolas, monospace}*{box-sizing:border-box}html,body{background:var(--paper);min-width:320px;color:var(--ink-main);font-family:var(--sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin:0;font-size:13px;line-height:1.5}::selection{color:#111211;background:#c4c6c0}.app-shell{background:repeating-linear-gradient(88deg, #1f211f0b 0 1px, transparent 1px 88px), repeating-linear-gradient(0deg, #1f211f08 0 1px, transparent 1px 56px), linear-gradient(128deg, #f0f0eb 0%, var(--paper) 42%, #c9ccc7 100%);flex-direction:column;min-height:100svh;padding:clamp(14px,4vw,34px);display:flex;position:relative;overflow-x:hidden}.app-shell:before{content:"";pointer-events:none;mix-blend-mode:multiply;background:repeating-linear-gradient(105deg,#1617160a 0 1px,#0000 1px 13px),linear-gradient(90deg,#f6f6f157,#0000 24%,#1617160f);position:fixed;inset:0}.topbar,.workspace{z-index:1;position:relative}.topbar{gap:12px;width:min(1040px,100%);margin:0 auto clamp(16px,4vw,30px);display:grid}.brand-container{color:var(--ink-main);align-items:center;display:flex}.brand{font-family:var(--serif);letter-spacing:5px;text-transform:uppercase;margin:0;font-size:14px;font-weight:650}button,a,input,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible,textarea:focus-visible{outline:2px solid var(--border-focus);outline-offset:3px}.mode-switch{grid-template-columns:1fr 1fr;gap:8px;width:100%;display:grid}.mode-switch button{min-height:44px;color:var(--ink-muted);cursor:pointer;background:#f4f4ef70;border:1px solid #1617162e;border-radius:2px;justify-content:center;align-items:center;gap:8px;transition:color .18s,background .18s,border-color .18s;display:flex;position:relative}.mode-switch button:after{content:"";opacity:0;background:currentColor;height:1px;transition:opacity .18s,transform .18s;position:absolute;bottom:6px;left:12px;right:12px;transform:scaleX(.65)}.mode-switch span{letter-spacing:1.5px;text-transform:uppercase;font-size:11px;font-weight:800}.mode-switch button.is-active{color:var(--paper-soft);background:var(--ink-main);border-color:var(--ink-main)}.mode-switch button.is-active:after{opacity:.28;transform:scaleX(1)}.mode-switch button:hover:not(.is-active){color:var(--ink-main);background:#f4f4efc7;border-color:#16171657}.pin-dots{justify-content:center;gap:8px;margin-bottom:14px;display:flex}.pin-dots span{background:var(--accent);border-radius:50%;width:8px;height:8px}.workspace{flex-direction:column;gap:14px;width:min(1040px,100%);margin:0 auto;display:flex}.seal-workspace.has-image{display:flex}.seal-workspace.has-image .preview-stage,.seal-workspace.has-image .control-panel{grid-area:auto}.seal-workspace.has-image .control-panel{place-self:stretch stretch;width:auto;max-height:none;overflow:visible}.preview-stage{background:linear-gradient(180deg, #ffffff80, transparent 44%), var(--photo-paper);transform-origin:54% 20%;border:1px solid #16171633;border-radius:3px;order:1;padding:8px 8px 32px;transition:border-color .18s,box-shadow .18s,transform .18s;position:relative;overflow:visible;transform:rotate(-.38deg);box-shadow:inset 0 1px #ffffff8a,0 18px 34px #14161424}.preview-stage:before{content:"";pointer-events:none;background:#1617162e;height:1px;position:absolute;bottom:13px;left:18px;right:18px}.preview-stage:after{content:"";z-index:11;pointer-events:none;background:linear-gradient(90deg,#ffffff29,#0000 20% 80%,#2122200d),#bbbeb8bd;border:1px solid #585a5433;width:86px;height:25px;position:absolute;top:-13px;left:50%;transform:translate(-50%)rotate(1.4deg)}.preview-stage.is-dragging{border-color:var(--accent);transform:rotate(0)translateY(-2px);box-shadow:inset 0 1px #ffffff8a,0 22px 42px #1416142b}.file-input{opacity:0;pointer-events:none;width:1px;height:1px;position:absolute}.file-pick-button{z-index:12;width:38px;height:38px;color:var(--paper-soft);cursor:pointer;background:#111211d6;border:1px solid #f4f4ef38;border-radius:2px;place-items:center;display:grid;position:absolute;top:16px;right:16px}.file-pick-button:hover{background:var(--accent-deep)}.file-pick-button.is-hidden{display:none}.preview-label{cursor:pointer;-webkit-tap-highlight-color:transparent;width:100%;display:block}.image-frame{width:100%;aspect-ratio:var(--preview-aspect-ratio,4 / 3);background:var(--bg-surface);place-items:center;display:grid;position:relative;overflow:hidden;container-type:inline-size}.image-frame:before,.image-frame:after{content:"";z-index:3;pointer-events:none;border-color:#f4f4efad;width:clamp(22px,7cqw,44px);height:clamp(22px,7cqw,44px);position:absolute}.image-frame:before{border-top:1px solid;border-left:1px solid;top:clamp(12px,2.6cqw,24px);left:clamp(12px,2.6cqw,24px)}.image-frame:after{border-bottom:1px solid;border-right:1px solid;bottom:clamp(12px,2.6cqw,24px);right:clamp(12px,2.6cqw,24px)}.image-frame img{object-fit:contain;filter:none;mix-blend-mode:normal;width:100%;height:100%;transition:filter .3s;display:block}.visible-watermark{z-index:1;pointer-events:none;font-family:var(--serif);color:#f4f4efe0;text-shadow:0 1px 5px #000000db;justify-content:space-between;gap:16px;font-weight:650;display:flex;position:absolute;bottom:clamp(18px,3cqw,42px);left:clamp(18px,3cqw,42px);right:clamp(18px,3cqw,42px)}.visible-watermark span{text-overflow:ellipsis;white-space:nowrap;min-width:0;overflow:hidden}.visible-hint{font-size:clamp(15px,3.1cqw,32px)}.visible-domain{flex:none;font-size:clamp(20px,3.8cqw,40px);font-weight:650}.empty-preview{aspect-ratio:4/3;width:100%;color:var(--paper-soft);background:var(--bg-surface);transition:color .18s;position:relative;overflow:hidden;container-type:inline-size}.empty-preview:after{content:"";z-index:3;pointer-events:none;background:linear-gradient(#1112110d,#0000 36%),linear-gradient(#0000 58%,#1112116b);position:absolute;inset:0}.empty-preview-image{object-fit:cover;filter:saturate(.78)contrast(.94)brightness(.84);width:100%;height:100%;display:block}.empty-preview-open-half{z-index:4;clip-path:inset(0 0 0 50%);background:linear-gradient(90deg,#1112110a,#11121138),linear-gradient(#0000 44%,#1112112e);place-items:center;display:grid;position:absolute;inset:0;overflow:hidden;container-type:inline-size}.empty-preview-divider{z-index:5;pointer-events:none;background:#f4f4efb8;width:1px;position:absolute;top:0;bottom:0;left:50%;box-shadow:-1px 0 #11121138,1px 0 #1112112e}.empty-preview-label{z-index:6;color:#f4f4efe6;font-family:var(--mono);letter-spacing:.5px;text-transform:uppercase;background:#11121170;border:1px solid #f4f4ef33;padding:5px 7px 4px;font-size:clamp(8px,2.6cqw,11px);font-weight:700;line-height:1;position:absolute;top:clamp(12px,3cqw,18px)}.empty-preview-label-before{left:clamp(10px,3cqw,18px)}.empty-preview-label-after{right:clamp(10px,3cqw,18px)}.empty-letter-peek{z-index:4;width:min(54%,300px);color:var(--ink-main);background:linear-gradient(#ffffff47,#0000 46%),#f4f4efdb;border:1px solid #1617161f;padding:clamp(10px,2.9cqw,15px) clamp(11px,3.2cqw,18px) clamp(12px,3.2cqw,17px);position:absolute;top:49%;left:68%;transform:translate(-50%,-50%)rotate(-1.2deg);box-shadow:0 12px 24px #0c0d0c2e}.empty-letter-peek p{font-family:var(--serif);text-align:center;margin:0;font-size:clamp(18px,7cqw,30px);font-weight:650;line-height:1.08}.empty-letter-peek .pin-dots{gap:clamp(5px,1.5cqw,8px);margin-bottom:clamp(8px,2.4cqw,14px)}.empty-letter-peek .pin-dots span{width:clamp(6px,1.8cqw,8px);height:clamp(6px,1.8cqw,8px)}.preview-label:hover .empty-preview{color:var(--text-main)}@keyframes revealOverlay{0%{opacity:0;-webkit-backdrop-filter:blur()}to{opacity:1;-webkit-backdrop-filter:blur(7px)}}.letter-sheet{z-index:2;background:#11121161;justify-content:center;align-items:center;padding:32px;animation:1.2s cubic-bezier(.22,1,.36,1) forwards revealOverlay;display:flex;position:absolute;inset:-10px}.letter-sheet span{width:min(92%,390px);font-family:var(--serif);text-align:center;color:var(--ink-main);letter-spacing:0;white-space:pre-wrap;word-break:break-word;background:#f4f4eff0;border:1px solid #16171621;border-radius:2px;padding:25px 23px 27px;font-size:clamp(23px,6cqw,33px);font-weight:650;line-height:1.28;display:block}.letter-actions{z-index:10;gap:8px;display:flex;position:absolute;bottom:16px;right:16px}.letter-action-button{width:44px;height:44px;color:var(--ink-main);cursor:pointer;background:#f4f4efed;border:1px solid #1617162e;border-radius:2px;place-items:center;transition:background .18s,color .18s,transform .18s;display:grid}.letter-action-button:hover{background:var(--ink-main);color:var(--paper-soft);transform:translateY(-1px)}.letter-action-button:disabled{cursor:progress;opacity:.78}.control-panel{color:var(--ink-main);transform-origin:30% 0;background:linear-gradient(90deg,#1617160f 0 1px,#0000 1px 100%) 0 0/18px 100%,linear-gradient(#ffffff75,#0000 34%),#f4f4efe0;border:1px solid #1617162e;border-radius:3px;flex-direction:column;order:2;gap:13px;padding:14px;display:flex;position:relative;transform:rotate(.18deg)}.control-panel:before{content:"";pointer-events:none;background:#8b272438;width:1px;position:absolute;top:12px;bottom:12px;left:10px}.control-panel:after{content:"";pointer-events:none;background:linear-gradient(135deg,#4a524a29 0 49%,#1617161f 50%,#0000 51%),linear-gradient(135deg,#0000 0 50%,#f4f4efdb 51%);width:30px;height:30px;position:absolute;top:-1px;right:-1px}.field{z-index:1;flex-direction:column;gap:6px;display:flex;position:relative}.field>span{color:var(--ink-muted);justify-content:space-between;align-items:center;display:flex}.field-label{align-items:center;gap:6px;font-size:13px;font-weight:650;display:inline-flex}.field em{font-family:var(--mono);color:var(--ink-main);font-size:13px;font-style:normal}textarea,input{width:100%;color:var(--ink-main);text-align:left;font-family:var(--sans);background:#f8f8f399;border:1px solid #16171624;border-radius:2px;outline:none;transition:border-color .18s,background .18s}textarea{resize:vertical;min-height:92px;padding:13px 14px;line-height:1.48}input{letter-spacing:0;height:46px;padding:0 14px;font-size:16px}input[type=password]{text-align:center;font-family:var(--mono);letter-spacing:4px;font-size:20px}textarea:focus,input:focus{border-color:var(--accent);background:#f8f8f3e0}textarea::placeholder,input::placeholder{color:#5c625d6b}.warning{color:var(--ink-muted);letter-spacing:0;text-align:center;justify-content:center;align-items:center;gap:6px;min-height:18px;margin:0;font-size:11px;display:flex}.warning.is-error{color:var(--danger)}.action-row{z-index:1;flex-direction:column;gap:10px;margin-top:2px;display:flex;position:relative}.action-row-first{margin:0 0 1px}.primary-action,.secondary-action{cursor:pointer;text-transform:uppercase;letter-spacing:1.45px;border-radius:2px;justify-content:center;align-items:center;min-height:48px;padding:0 14px;font-size:12px;font-weight:800;text-decoration:none;transition:background .18s,border-color .18s,color .18s,transform .18s;display:flex}.primary-action{color:var(--paper-soft);background:linear-gradient(180deg, #f4f4ef14, transparent 44%), var(--accent-deep);border:1px solid var(--accent-deep);box-shadow:inset 0 -2px #1617162e}.primary-action:hover:not(:disabled){background:var(--ink-main);border-color:var(--ink-main);transform:translateY(-1px)}.primary-action:disabled{opacity:.28;cursor:not-allowed;color:var(--ink-muted);background:#16171626;border-color:#0000}.secondary-action{color:var(--ink-main);background:#1617160a;border:1px solid #16171633}.secondary-action:hover{background:#f4f4efc7;border-color:#16171666}.action-with-label{gap:8px}.action-with-label span,.make-action span{line-height:1}.make-action{gap:8px}.privacy-note{z-index:1;color:var(--ink-muted);letter-spacing:0;text-align:center;justify-content:center;align-items:center;gap:7px;margin:0;font-size:11px;line-height:1.45;display:flex;position:relative}.privacy-note span{min-width:0}.open-panel{height:56px;color:var(--ink-main);cursor:pointer;background:#f8f8f399;border:1px solid #16171629;border-radius:2px;justify-content:center;align-items:center;gap:10px;transition:background .18s,border-color .18s,transform .18s;display:flex}.open-panel:hover{background:#f8f8f3d6;border-color:#1617166b;transform:translateY(-1px)}.modal-backdrop{z-index:50;-webkit-backdrop-filter:blur(8px);background:#16171680;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.unlock-modal{width:min(322px,100%);color:var(--ink-main);background:#f4f4eff5;border:1px solid #16171629;border-radius:3px;flex-direction:column;gap:18px;padding:30px 24px 24px;display:flex;position:relative;box-shadow:0 24px 54px #1617163d}.unlock-modal .primary-action{width:100%}.field.compact{gap:8px}.unlock-hint{font-family:var(--mono);text-align:center;color:var(--ink-muted);word-break:break-word;margin:-4px 0 0;font-size:13px;line-height:1.5}.icon-button{width:32px;height:32px;color:var(--ink-muted);cursor:pointer;background:0 0;border:0;border-radius:2px;place-items:center;display:grid;position:absolute;top:12px;right:12px}.icon-button:hover{color:var(--ink-main)}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.spinner{animation:1s linear infinite spin}@media (width>=720px){.app-shell{padding-block:42px}}@media (width>=900px){.topbar{grid-template-columns:220px minmax(420px,520px);justify-content:space-between;align-items:end}.brand-container{padding-bottom:7px}.workspace{grid-template-columns:minmax(0,1.16fr) minmax(330px,.84fr);align-items:start;gap:24px;display:grid}.seal-workspace.has-image{grid-template-columns:minmax(0,1.16fr) minmax(330px,.84fr);display:grid}.seal-workspace.has-image .preview-stage,.seal-workspace.has-image .control-panel{grid-area:auto}.seal-workspace.has-image .control-panel{place-self:start stretch;width:auto;max-height:none;overflow:visible}.preview-stage{padding:10px 10px 38px}.control-panel{margin-top:14px;padding:16px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}