:root{--bg: #e7e6f0;--far: #cbd3df;--floor: #eadac5;--floor-side: #c2afc1;--receive: #89afae;--send: #c9969f;--paper: #fbf8f1;--ink: #34313d;--muted: #5c5869;--focus: #3f6e8c;--error: #8a3b4a;--btn: #45405a;--reveal-ms: .6s;--assemble-ms: 1.2s;font-family:Pretendard,Apple SD Gothic Neo,Malgun Gothic,Noto Sans KR,system-ui,sans-serif;color:var(--ink);line-height:1.6}*,*:before,*:after{box-sizing:border-box}html,body{margin:0}body{min-height:100dvh;background:radial-gradient(120% 90% at 50% 25%,#f3f2f8 0%,var(--bg) 45%,var(--far) 100%) fixed;overflow-x:hidden}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}[hidden]{display:none!important}.topbar{display:flex;flex-wrap:wrap;align-items:center;gap:8px 14px;max-width:1200px;margin:0 auto;padding:12px 16px 4px}.title{margin:0;font-size:1.05rem;font-weight:600;letter-spacing:.24em}.demo-badge{margin:0;padding:3px 10px;border-radius:999px;font-size:.8rem;background:#ffffffb8;border:1px solid rgba(52,49,61,.18)}.top-actions{display:flex;gap:8px;margin-left:auto}.layout{display:grid;grid-template-columns:minmax(0,1fr);gap:8px 24px;max-width:1200px;margin:0 auto;padding:0 16px 32px}@media(min-width:960px){.layout{grid-template-columns:minmax(0,1.4fr) minmax(320px,1fr);align-items:center;min-height:calc(100dvh - 64px)}}.room-svg{display:block;width:100%;height:auto;max-height:80dvh;overflow:hidden;-webkit-mask-image:linear-gradient(to bottom,transparent 0,#000 7%,#000 84%,transparent 100%),linear-gradient(to right,transparent 0,#000 5%,#000 95%,transparent 100%);-webkit-mask-composite:source-in;mask-image:linear-gradient(to bottom,transparent 0,#000 7%,#000 84%,transparent 100%),linear-gradient(to right,transparent 0,#000 5%,#000 95%,transparent 100%);mask-composite:intersect}.panel{display:flex;flex-direction:column;gap:14px;min-width:0}.status{margin:0;min-height:1.6em;font-size:1.08rem}.received{padding:14px 18px;border-radius:4px;background:#fbf8f1eb;box-shadow:0 1px 3px #34313d1f;animation:reveal var(--reveal-ms) ease-out both}.provenance{margin:0 0 6px;font-size:.8rem;color:var(--muted)}.received-text,.letter-text{margin:0;white-space:pre-wrap;overflow-wrap:anywhere;word-break:keep-all;font-size:1.05rem;line-height:1.75}.letter-wrap{display:flex;justify-content:center}.letter{display:grid;grid-template-rows:1fr 1fr;width:min(100%,24em);min-height:340px;padding:28px;background:var(--paper);border-radius:2px;box-shadow:0 1px 2px #34313d1a,0 8px 24px #34313d14}.letter-half{display:flex;flex-direction:column;justify-content:center;gap:4px;min-width:0}.letter-half--bottom{padding-top:16px}.letter-label{margin:0;font-size:.72rem;color:var(--muted)}.letter:not(.is-composing) .letter-label{display:none}.letter.is-assembling .letter-own{animation:settle var(--assemble-ms) cubic-bezier(.25,.6,.3,1) both}.composer textarea{width:100%;min-height:5.4em;padding:6px 2px;border:0;border-bottom:1px solid rgba(52,49,61,.28);background:transparent;color:var(--ink);font:inherit;font-size:1.05rem;line-height:1.75;resize:vertical}.composer textarea:focus{outline:none;border-bottom-color:var(--focus)}.composer textarea[aria-invalid=true]{border-bottom-color:var(--error)}.notes{display:flex;flex-direction:column;gap:4px;font-size:.9rem}.notes p{margin:0}.counter{color:var(--muted);font-variant-numeric:tabular-nums}.counter.is-over{color:var(--error);font-weight:600}.pre-notice{margin-top:4px!important}.muted{color:var(--muted)}.small{font-size:.85rem}.error{color:var(--error);min-height:1.4em}.actions{display:flex;flex-wrap:wrap;gap:10px}.btn{min-height:44px;padding:10px 20px;border-radius:999px;border:1px solid rgba(52,49,61,.35);background:#fff9;color:var(--ink);font:inherit;cursor:pointer;touch-action:manipulation}.btn-primary{background:var(--btn);border-color:var(--btn);color:#fbf8f1}.btn-primary:disabled{background:#8c879b;border-color:#8c879b;cursor:default}.btn-ghost{background:transparent}.btn-small{min-height:36px;padding:6px 14px;font-size:.85rem}.btn[aria-pressed=true]{background:var(--btn);color:#fbf8f1}:focus-visible{outline:3px solid var(--focus);outline-offset:2px}.walker{transition-property:transform;transition-timing-function:cubic-bezier(.42,0,.32,1)}.walker.is-walking .walker-body{animation:bob .48s ease-in-out infinite alternate}.incoming-slip{opacity:0;transform:translateY(-520px);transition:opacity .5s ease,transform 2.2s cubic-bezier(.15,.6,.25,1)}.incoming-slip.is-taken{transform:none}.sky-beam{opacity:0;transition:opacity 1.2s ease}.sky-beam.is-on{opacity:1;animation:breathe 3.6s ease-in-out infinite}.bell{transform-box:fill-box;transform-origin:50% 0%}.has-arrival .bell{animation:ring 4s ease-in-out infinite}.guide-path,.beacon{opacity:0;transition:opacity .7s ease}.has-arrival .guide-path{opacity:.95;animation:guide 1.1s linear infinite}.has-arrival .beacon{opacity:1;animation:float-big 2.4s ease-in-out infinite alternate}.desk-lamp,.room-warm{opacity:.15;transition:opacity .9s ease}.desk-lamp.is-on{opacity:.95}.room-warm.is-on{opacity:.55}.tower-beacon{opacity:.25;transition:opacity .5s ease}.tower-beacon.is-on{opacity:1}.shelf-letters .is-new{animation:settle-in 1.4s ease-out}.fall{stroke-dasharray:6 18;animation:fall 1.6s linear infinite}.bird-wings{transform-box:fill-box;transform-origin:50% 70%;animation:flap .42s ease-in-out infinite alternate}.place-label{font-size:17px;letter-spacing:.3em;fill:#5c5869;opacity:.7;pointer-events:none}.incoming-slip.is-present{opacity:1;transform:none}.incoming-slip-float{animation:float 3.4s ease-in-out infinite alternate}.arrival-glow{opacity:0;transition:opacity .9s ease}.arrival-glow.is-on{opacity:.9;animation:breathe 3s ease-in-out infinite}.has-arrival .left-room-hit{cursor:pointer}.tap-mark{opacity:0;pointer-events:none;transform-box:fill-box;transform-origin:center}.tap-mark.is-on{animation:tap .7s ease-out}.next-door{animation:breathe-soft 5s ease-in-out infinite}.lantern-glow{animation:breathe-soft 4.2s ease-in-out infinite}.shafts{animation:breathe-soft 9s ease-in-out infinite}.ripple{stroke-dasharray:10 14;animation:ripple 6s linear infinite}.mote{animation-name:mote;animation-timing-function:ease-in-out;animation-iteration-count:infinite}.drift-a{animation:drift 16s ease-in-out infinite alternate}.drift-b{animation:drift 21s ease-in-out infinite alternate-reverse}.chip{opacity:0;pointer-events:none}.chip-text{font-family:inherit}.dialog{max-width:min(92vw,30em);padding:0;border:0;border-radius:6px;background:#f3f2f7;color:var(--ink)}.dialog::backdrop{background:#34313d59}.dialog-inner{display:flex;flex-direction:column;align-items:center;gap:14px;padding:20px}.dialog-title{margin:0;font-size:1.05rem;font-weight:600;letter-spacing:.08em}.archive-list{display:flex;flex-direction:column;gap:14px;width:100%;max-height:60dvh;margin:0;padding:0 2px;overflow-y:auto;list-style:none}.letter--mini{width:100%;min-height:0;padding:16px 18px;gap:10px}.letter--mini .letter-text{font-size:.95rem}@keyframes reveal{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}@keyframes settle{0%{opacity:0;transform:translateY(28px)}to{opacity:1;transform:none}}@keyframes bob{0%{transform:translateY(0)}to{transform:translateY(-2.5px)}}@keyframes float{0%{transform:translateY(0)}to{transform:translateY(-4px)}}@keyframes breathe{0%,to{opacity:.55}50%{opacity:1}}@keyframes breathe-soft{0%,to{opacity:.85}50%{opacity:1}}@keyframes ring{0%,40%,to{transform:rotate(0)}5%{transform:rotate(14deg)}12%{transform:rotate(-11deg)}19%{transform:rotate(7deg)}26%{transform:rotate(-4deg)}33%{transform:rotate(2deg)}}@keyframes guide{to{stroke-dashoffset:-22}}@keyframes float-big{0%{transform:translateY(0)}to{transform:translateY(-7px)}}@keyframes settle-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}@keyframes fall{to{stroke-dashoffset:-48}}@keyframes flap{0%{transform:scaleY(1)}to{transform:scaleY(.45)}}@keyframes tap{0%{opacity:.95;transform:scale(.4)}to{opacity:0;transform:scale(1.5)}}@keyframes ripple{to{stroke-dashoffset:-96}}@keyframes mote{0%{transform:translate(0);opacity:0}20%{opacity:.8}80%{opacity:.6}to{transform:translate(14px,-46px);opacity:0}}@keyframes drift{0%{transform:translate(-16px)}to{transform:translate(16px)}}.reduced-motion .walker.is-walking .walker-body,.reduced-motion .incoming-slip-float,.reduced-motion .arrival-glow.is-on,.reduced-motion .next-door,.reduced-motion .lantern-glow,.reduced-motion .shafts,.reduced-motion .ripple,.reduced-motion .mote,.reduced-motion .drift-a,.reduced-motion .drift-b,.reduced-motion .sky-beam.is-on,.reduced-motion .has-arrival .bell,.reduced-motion .has-arrival .guide-path,.reduced-motion .has-arrival .beacon,.reduced-motion .fall,.reduced-motion .bird-wings,.reduced-motion .shelf-letters .is-new{animation:none}.reduced-motion .mote{opacity:.5}.reduced-motion .incoming-slip{transition-duration:.15s}@media(max-width:700px){.room-svg{height:50dvh;max-height:none}.place-label{font-size:28px;letter-spacing:.24em}}@media(max-width:420px){.letter{min-height:300px;padding:22px 20px}.top-actions{margin-left:0}}.topbar{max-width:1400px;padding:19px 28px 8px}.title{font-size:17px}.top-actions{flex-wrap:wrap;gap:6px}.btn-small{min-height:44px}.layout{max-width:1400px;gap:25px;padding:0 28px 40px}.demo-badge{font-size:11px;background:#fff9eb}.connection-note{margin:6px auto;padding:10px 20px;max-width:1300px;background:#f8edda;border-radius:8px;color:#705338;font-size:13px}.scene-caption{font-size:11px;text-align:center;color:#716f7e;letter-spacing:.04em;margin:-15px 0 20px}.status{font-weight:600;font-size:21px;letter-spacing:-.035em;line-height:1.5}.status-detail{font-size:13px;color:var(--muted);margin:-6px 0 0;line-height:1.8}.record-meta{font-size:11px;color:#68616b;margin:12px 0 0;line-height:1.7}.letter-wrap+.record-meta{align-self:center;max-width:380px}.notes{font-size:12px;line-height:1.8}.pre-notice{color:#675d68}.panel{gap:14px}.letter{border:1px solid #fff9ef}.letter-text{font-size:17px}.actions{align-items:center}.app-footer{max-width:1344px;margin:0 auto;padding:12px 24px 24px;display:flex;justify-content:space-between;gap:15px;color:#756d7c;font-size:11px}.waiting-panel{padding:20px 24px 23px;background:#f7f4ecd9;border:1px solid #fff8ef;border-radius:14px;box-shadow:0 12px 32px #4d49610a;text-align:center}.waiting-art{max-width:300px;margin:0 auto -5px}.waiting-art svg{display:block;width:100%}.waiting-panel h2,.image-heading h2{font-size:18px;letter-spacing:-.03em;font-weight:600;margin:6px 0 10px}.waiting-panel p{font-size:13px;color:#625b68;margin:7px 0;line-height:1.8}.waiting-panel .state-line{font-size:12px;padding:8px 12px;border-radius:7px;background:#e8e7eb;margin:16px 0 10px}.waiting-panel .motion-caption{font-size:10px;color:#79717d;margin-top:15px}.waiting-actions{display:flex;justify-content:center;gap:8px;flex-wrap:wrap;margin-top:15px}.wait-paper{transform-origin:160px 90px;animation:wait-paper 7s ease-in-out infinite}.wait-halo{animation:wait-halo 6s ease-in-out infinite}.wait-star{animation:wait-star 8s ease-in-out infinite;transform-box:fill-box;transform-origin:center}.s2{animation-delay:-2s}.s3{animation-delay:-4s}.s4{animation-delay:-6s}.wait-thread{animation:wait-thread 12s linear infinite}.waiting-panel[data-problem=true] .waiting-art{opacity:.55}.waiting-panel[data-problem=true] .waiting-art *{animation-play-state:paused}.image-panel{background:#f8f5ee;border:1px solid #fffaf0;padding:19px;border-radius:12px}.image-heading{display:flex;align-items:start;justify-content:space-between;gap:10px;margin-bottom:14px}.image-heading h2{font-size:16px;margin:0}.source-badge{display:inline-block;border:1px solid #c8bdc9;background:#eee8ef;color:#65546d;padding:3px 7px;font-size:10px;border-radius:5px;line-height:1.5;flex-shrink:0}.image-card{position:relative;isolation:isolate;aspect-ratio:3/4;background:radial-gradient(ellipse at 40% 40%,#f6e9d9,#d6d9dd);overflow:hidden;border-radius:3px}.image-card>img{position:absolute;width:100%;height:100%;object-fit:cover;z-index:-1;opacity:.7}.image-words{position:absolute;inset:0;display:flex;flex-direction:column;justify-content:space-between;padding:12% 9%;background:linear-gradient(#fcf9f0c9,transparent 34%,transparent 62%,#fcf9f0d9)}.image-words p{white-space:pre-wrap;overflow-wrap:anywhere;margin:0;font-size:clamp(14px,1.3vw,18px);font-family:Apple SD Gothic Neo,sans-serif;line-height:1.85;color:#42383e;text-shadow:0 1px 5px #fff9ee}.dialog{width:min(92vw,560px);max-height:88dvh;border-radius:13px}.dialog-inner{align-items:stretch;padding:25px}.dialog-heading{display:flex;justify-content:space-between;align-items:center;gap:15px;width:100%}.dialog-heading h2{font-size:19px;letter-spacing:-.02em;margin:0}.archive-dialog{width:min(94vw,690px);max-width:690px}.archive-list{max-height:60dvh;gap:20px}.archive-item{padding:20px;border-radius:10px;background:#fffaf0;border:1px solid #e6e1db}.archive-item h3{font-size:13px;font-weight:500;margin:0 0 15px;color:#6e6373}.archive-item .letter--mini{box-shadow:none;background:transparent;padding:0;gap:20px}.archive-item .record-meta{border-top:1px solid #e1dadd;padding-top:12px}.archive-item .image-card{max-width:340px;margin:18px auto 0}.archive-state{font-size:12px;background:#eae5ed;border-radius:5px;padding:7px 10px;margin:12px 0 0}.archive-state[data-state=blocked],.archive-state[data-state=failed]{background:#f0e0dc;color:#803f48}.recovery-inner{gap:13px}.recovery-inner>p{font-size:14px;margin:0}.recovery-inner h3{font-size:15px;margin:3px 0}.recovery-inner hr{width:100%;border:0;border-top:1px solid #d8d2db;margin:14px 0}.full-input,.code-result input{font:inherit;width:100%;padding:11px 13px;border:1px solid #b7adbd;border-radius:6px;background:#fffbf5;color:#3b3441;min-width:0}.code-result{background:#ebe5ed;border-radius:8px;padding:16px}.code-result>label{display:block;font-size:12px;font-weight:600;margin-bottom:9px}.code-result input{font:15px/1.7 ui-monospace,monospace;margin-bottom:10px}.code-result .small{font-size:11px;margin-bottom:0}.check-label{font-size:12px;display:flex;align-items:start;gap:8px;line-height:1.7}.check-label input{width:18px;height:18px;flex-shrink:0;margin-top:2px;accent-color:#655471}button:disabled{opacity:.55;cursor:default}#recovery-message,#report-message{min-height:1.4em;color:#764557}#restore-code{letter-spacing:.07em}body[data-stage=waiting_image] .tower-beacon{opacity:1}.image-panel .small{font-size:11px}.source-line{font-size:11px;color:#7c697c}.demo-badge[data-mode=demo]{background:#f5dfcf;color:#784b36}.received{padding:23px}.received-text{font-size:20px}.reduced-motion .waiting-art *{animation:none!important}.reduced-motion .wait-star{opacity:.8}.reduced-motion .wait-thread{stroke-dasharray:none;opacity:.4}.reduced-motion .wait-halo{opacity:.6}@keyframes wait-paper{0%,to{transform:translateY(0) rotate(-1deg)}50%{transform:translateY(-5px) rotate(1deg)}}@keyframes wait-halo{0%,to{opacity:.45;transform:scale(.98);transform-origin:center}50%{opacity:.95;transform:scale(1.03);transform-origin:center}}@keyframes wait-star{0%,to{opacity:.2;transform:translateY(2px)}50%{opacity:1;transform:translateY(-4px)}}@keyframes wait-thread{to{stroke-dashoffset:-96}}@media(min-width:960px){.layout{grid-template-columns:minmax(0,1.5fr) minmax(350px,1fr)}.panel{max-width:450px;padding:25px 0}.stage{position:sticky;top:0}.image-card{max-height:55dvh}.image-panel{max-width:360px;width:100%;align-self:center}}@media(max-width:959px){.topbar{padding:15px 18px 8px;gap:8px}.top-actions{margin:3px 0 0;width:100%;gap:5px}.top-actions .btn{padding:7px 11px;font-size:11px}.layout{padding:0 18px 30px;gap:10px}.panel{width:min(100%,560px);margin:auto}.room-svg{max-height:48dvh;height:48dvh}.scene-caption{font-size:10px;margin:-10px 0 8px}.status{font-size:19px}.letter{width:100%;max-width:440px;min-height:290px}.app-footer{flex-direction:column;gap:5px;font-size:10px;padding:14px 18px 22px}.image-card{max-width:360px;margin:auto;max-height:62dvh}.image-words p{font-size:16px}.waiting-panel{padding:12px 18px 19px}.waiting-art{max-width:240px}.connection-note{margin:4px 18px;font-size:11px}.dialog-inner{padding:19px}.dialog{max-height:90dvh}.archive-list{max-height:62dvh}}@media(max-width:390px){.topbar,.layout{padding-left:14px;padding-right:14px}.demo-badge{font-size:10px;padding:3px 7px}.top-actions .btn{padding:7px 9px;font-size:10px}.room-svg{height:42dvh;max-height:42dvh}.letter-text,.composer textarea{font-size:16px}.received-text{font-size:18px}.waiting-panel h2{font-size:17px}}@media(prefers-reduced-motion:reduce){.waiting-art *{animation:none!important}html{scroll-behavior:auto}}.image-card{aspect-ratio:auto;min-height:420px;max-height:none}.image-words{position:relative;inset:auto;min-height:420px;gap:110px;padding:38px 28px}.record-meta{white-space:pre-line}.archive-item .image-card,.archive-item .image-words{min-height:400px}@media(max-width:959px){.image-card{max-height:none}.image-words{padding:32px 24px;gap:90px}}.archive-item .letter--mini{min-height:0;grid-template-rows:auto auto}.walker.is-walking .walker-body{animation:none}.walking-trail{pointer-events:none}.reduced-motion .walking-trail{display:none}.image-card.image-card--planned{container-type:inline-size;aspect-ratio:9/16;min-height:0}.image-card--planned>img{opacity:1;object-fit:contain}.image-card--planned .image-words{position:absolute;inset:0;min-height:0;padding:0;display:block;background:none}.image-card--planned .image-words>p{position:absolute;margin:0;font-weight:400;line-height:1.45;letter-spacing:.015em;text-align:center;text-shadow:none;overflow-wrap:anywhere}.image-card--planned .image-words>p[data-tone=dark]{color:#403c36;background:#fffaf0eb}.image-card--planned .image-words>p[data-tone=light]{color:#fffbf0;background:#292630d9}.image-card.image-card--full-text{min-height:0;background:#f8f5ee}.image-card--full-text>img{position:relative;display:block;width:100%;height:auto;aspect-ratio:9/16;object-fit:contain;opacity:1}.image-card--full-text .image-words{position:relative;min-height:0;padding:24px;gap:28px;background:none}.image-card--full-text .image-words>p{font-size:16px}.letter{grid-template-rows:auto minmax(100px,auto) minmax(135px,auto) auto;min-height:420px;gap:12px;padding:22px 26px}.card-meta{font-size:10.5px;line-height:1.6;color:#746d77;white-space:pre-line;overflow-wrap:anywhere;letter-spacing:0;margin:0;font-weight:400}.card-meta-top{text-align:right;justify-self:end;width:100%;margin:0 0 6px}.card-meta-bottom{text-align:left;margin:0;min-width:0}.letter-card-footer{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-top:10px}.letter-card-footer .counter{flex-shrink:0;align-self:flex-end;text-align:right;font-size:11px;line-height:1.6;margin:0;color:#746d77}.letter-card-footer .counter.is-over{color:#8a3f4d}.received{display:flex;flex-direction:column;gap:17px;width:min(100%,440px);min-height:240px}.received .received-text{flex:1;margin:0;padding:15px 0}.received .provenance{font-size:10px;color:#746d77;margin:0}.archive-item .letter--mini{grid-template-rows:auto auto auto auto;gap:20px}.image-meta-top,.image-meta-bottom{position:absolute;z-index:2;max-width:85%;padding:2px 4px;background:#fffaf0eb;border-radius:3px}.image-meta-top{right:12px;top:12px;text-align:right}.image-meta-bottom{left:12px;bottom:12px;text-align:left}.image-words{padding-top:85px;padding-bottom:85px}.image-card--planned .image-words{padding:0}.image-card--full-text .image-words{padding-bottom:85px}.display-settings{position:relative}.display-settings>summary{cursor:pointer;list-style:none}.display-settings>summary::-webkit-details-marker{display:none}.display-settings>summary:after{content:"⌄";margin-left:7px;color:#847a8b}.display-settings[open]>summary:after{content:"⌃"}.display-settings-panel{position:absolute;z-index:20;right:0;top:calc(100% + 8px);width:260px;padding:17px;background:#fffaf3;border:1px solid #d5cddc;border-radius:10px;box-shadow:0 12px 30px #3c304b1a}.display-settings-panel .small{font-size:11px;line-height:1.6;margin:8px 0 14px}.display-settings-panel label{display:block;font-size:12px;margin:15px 0 6px}.display-settings-panel select{width:100%;min-height:40px;border:1px solid #bcb2c5;border-radius:6px;background:#fffdf7;padding:7px 10px;color:#4e4359;font:inherit;font-size:13px}@media(max-width:390px){.letter{padding:20px;min-height:410px}.card-meta{font-size:10px}.letter-card-footer{gap:10px}.letter-card-footer .counter{font-size:10.5px}.image-meta-top{right:9px}.image-meta-bottom{left:9px}.top-actions{gap:4px}.top-actions .btn{padding-left:8px;padding-right:8px}}.room-svg[data-background-theme]:not([data-background-theme=original]) .background-original{display:none}.room-svg[data-background-theme=original] .background-variant{display:none}.background-variant{pointer-events:none}.room-svg[data-background-theme=night] .place-label{fill:#596985}.room-svg[data-background-theme=rain] .place-label{fill:#627586}.room-svg .card-arrival{pointer-events:none;opacity:0}
