@font-face{font-family:KoPub Batang;src:url(/fonts/KoPubWorldBatang-Light.ttf)format("truetype");font-weight:300;font-display:swap}@font-face{font-family:KoPub Batang;src:url(/fonts/KoPubWorldBatang-Medium.ttf)format("truetype");font-weight:500;font-display:swap}@font-face{font-family:KoPub Batang;src:url(/fonts/KoPubWorldBatang-Bold.ttf)format("truetype");font-weight:700;font-display:swap}@font-face{font-family:Pretendard;src:url(/fonts/Pretendard-Regular.woff2)format("woff2");font-weight:400;font-display:swap}@font-face{font-family:Pretendard;src:url(/fonts/Pretendard-Medium.woff2)format("woff2");font-weight:500;font-display:swap}@font-face{font-family:Pretendard;src:url(/fonts/Pretendard-SemiBold.woff2)format("woff2");font-weight:600;font-display:swap}@font-face{font-family:Pretendard;src:url(/fonts/Pretendard-Bold.woff2)format("woff2");font-weight:700;font-display:swap}:root{--ink:#1f1c20;--ink2:#2a262b;--ink3:#36313a;--line:#3a3338;--paper:#e9e6dc;--paper2:#ddd8c8;--cream:#f6f1e6;--mute:#645c58;--mute2:#8e867e;--gold:#a18c6b;--gold2:#dccfa9;--foil:linear-gradient(135deg, #f3e6bd 0%, #c9b07a 30%, #8d7449 55%, #e8d7a6 80%, #b49a68 100%);--walnut:#592e24;--leather:#957057;--crimson:#7a1f1f;--royal:#2b3a8c;--honey:#e8c25a;--rose:#d9a5b3;--rose2:#f3e3e7;--sea:#2f7fa7;--serif:"KoPub Batang", "RIDIBatang", "Noto Serif KR", serif;--sans:"Pretendard", "Noto Sans KR", "Apple SD Gothic Neo", sans-serif;--sat:env(safe-area-inset-top,0px);--sab:env(safe-area-inset-bottom,0px)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{color:var(--paper);font-family:var(--sans);-webkit-font-smoothing:antialiased;background:#0f0d10;margin:0;padding:0}body{min-height:100dvh}button{color:inherit;cursor:pointer;background:0 0;border:none;padding:0;font-family:inherit}input,textarea{font-family:inherit}::selection{background:#a18c6b59}.shell{background:radial-gradient(at 50% 30%,#1c171e 0,#0f0d10 70%);justify-content:center;align-items:center;height:100dvh;display:flex;overflow:hidden}.device{width:390px;height:844px;transform:scale(var(--scale,1));transform-origin:50%;background:var(--ink);box-shadow:0 36px 70px #000000a6, 0 0 0 1px var(--line), inset 0 0 0 7px #0a090b;border-radius:46px;position:relative;overflow:hidden}.device .inner{background:var(--ink);border-radius:40px;position:absolute;inset:7px;overflow:hidden}.statusbar{z-index:20;pointer-events:none;justify-content:space-between;align-items:flex-end;height:54px;padding:0 30px 8px;font-size:13px;font-weight:600;display:flex;position:absolute;top:0;left:0;right:0}.island{background:#0a090b;border-radius:20px;width:118px;height:34px;position:absolute;top:12px;left:50%;transform:translate(-50%)}.homebar{z-index:20;pointer-events:none;background:#e9e6dc73;border-radius:3px;width:130px;height:5px;position:absolute;bottom:8px;left:50%;transform:translate(-50%)}@media (max-width:600px){.shell{background:var(--ink);display:block}.device{width:100%;height:100dvh;box-shadow:none;border-radius:0}.device .inner{border-radius:0;inset:0}.statusbar,.island,.homebar{display:none}.demo-badge{right:12px;top:calc(var(--sat) + 8px)!important}.screen{top:var(--sat)!important}}.screen{position:absolute;inset:54px 0 0;overflow:hidden}.scroll{overscroll-behavior:contain;scrollbar-width:none;position:absolute;inset:56px 0 0;overflow-y:auto}.scroll::-webkit-scrollbar{display:none}.appbar{z-index:10;justify-content:space-between;align-items:center;height:56px;padding:0 20px;display:flex;position:absolute;top:0;left:0;right:0}.appbar .t{font-family:var(--serif);color:var(--paper);letter-spacing:.01em;font-size:19px;font-weight:500}.appbar .t small{font-family:var(--sans);color:var(--mute2);letter-spacing:.08em;margin-top:2px;font-size:11px;font-weight:400;display:block}.appbar .t.center{text-align:center}.ic{border:1px solid var(--line);width:34px;height:34px;color:var(--gold2);background:#2a262b99;border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:14px;display:flex}.ic:active{background:#a18c6b40}.foil{background:var(--foil);color:#0000;-webkit-background-clip:text;background-clip:text}.frame{background:var(--foil);border-radius:6px;padding:7px;position:relative;box-shadow:0 12px 28px #0000008c}.frame:after{content:"";pointer-events:none;border:1px solid #00000073;border-radius:2px;position:absolute;inset:7px}.frame .in{background-position:50%;background-size:cover;border-radius:2px;transition:background-image .6s;position:relative;overflow:hidden}.frame .in:after{content:"";position:absolute;inset:0;box-shadow:inset 0 0 50px #0000008c}.frame .cap{z-index:1;color:var(--gold2);letter-spacing:.06em;text-shadow:0 1px 2px #0009;font-size:10.5px;position:absolute;bottom:10px;left:12px}.frame .pins{z-index:1;gap:4px;display:flex;position:absolute;top:8px;right:10px}.frame .pins i{background:var(--honey);border-radius:50%;width:8px;height:8px;box-shadow:0 0 8px #e8c25acc}.paper{background:var(--cream) url(/art/04-paper-texture.jpg) center/cover;color:var(--ink);font-family:var(--serif);border-radius:14px;padding:22px 22px 20px;font-size:14.5px;font-weight:300;line-height:1.95;position:relative;box-shadow:0 14px 30px #00000073}.paper.kraft{background-color:#e9e0ce}.paper.white{outline:1.5px solid var(--gold2);outline-offset:-6px;background-color:#fbf8f1}.paper.black{background-blend-mode:multiply;color:var(--gold2);background:#1a1416 url(/art/04-paper-texture.jpg) 50%/cover}.paper.black .meta,.paper.black .narr{color:#a89778}.paper.pink{outline:1.5px solid var(--rose);outline-offset:-6px;background-color:#f3e3e7}.paper.fog{background-color:#e3e2e6}.paper .meta{font-family:var(--sans);color:var(--mute);letter-spacing:.06em;justify-content:space-between;margin-bottom:10px;font-size:10.5px;font-weight:500;display:flex}.paper p{white-space:pre-wrap;margin:0 0 11px}.paper .sign{text-align:right;color:var(--walnut);margin-top:4px;padding-right:50px;font-size:14px}.paper.black .sign{color:var(--gold2)}.seal{color:#f3d9c6;width:34px;height:34px;font-size:12px;font-family:var(--serif);background:radial-gradient(circle at 35% 35%,#a63a3a,#5e1414);border-radius:50%;justify-content:center;align-items:center;transition:transform .5s cubic-bezier(.2,.8,.2,1);display:flex;position:absolute;bottom:16px;right:18px;box-shadow:0 2px 6px #00000059}.seal.open{opacity:.85;transform:rotate(-18deg)translate(6px,6px)scale(.9)}.narr{color:var(--mute)}.btnrow{gap:10px;display:flex}.btn{border:1px solid var(--line);height:50px;color:var(--paper);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#2a262bb3;border-radius:16px;flex:1;justify-content:center;align-items:center;font-size:14px;font-weight:600;transition:transform .12s,filter .12s;display:flex}.btn:active{filter:brightness(1.1);transform:scale(.98)}.btn.pri{background:var(--foil);color:#241c12;border:none;box-shadow:0 8px 20px #c9b07a40}.btn.soft{background:var(--cream);color:var(--ink);border:none}.btn:disabled{opacity:.5}.pill{border:1px solid var(--gold);color:var(--gold2);background:#a18c6b14;border-radius:999px;align-items:center;gap:5px;padding:4px 10px;font-size:11px;display:inline-flex}.pill.rose{border-color:var(--rose);color:var(--rose)}.prog{background:#2d282e;border-radius:3px;height:6px;overflow:hidden}.prog i{background:var(--foil);border-radius:3px;height:100%;transition:width .6s;display:block}.tabbar{height:calc(84px + var(--sab));padding:18px 14px calc(0px + var(--sab));z-index:10;background:linear-gradient(#0000,#120f12f5 30%);justify-content:space-around;align-items:flex-start;display:flex;position:absolute;bottom:0;left:0;right:0}.tab{color:var(--mute2);flex-direction:column;align-items:center;gap:4px;width:62px;font-size:10.5px;display:flex}.tab .g{border:1.5px solid var(--line);border-radius:9px;justify-content:center;align-items:center;width:26px;height:26px;font-size:13px;transition:all .2s;display:flex}.tab.on{color:var(--gold2)}.tab.on .g{border-color:var(--gold);background:#a18c6b26}.chatpad{left:0;right:0;bottom:calc(84px + var(--sab));background:linear-gradient(transparent, var(--ink) 18%);z-index:10;padding:0 16px 8px;position:absolute}.input{background:var(--ink2);border:1px solid var(--line);min-height:52px;color:var(--mute2);border-radius:18px;align-items:center;gap:10px;padding:0 8px 0 10px;font-size:13.5px;display:flex}.input input{color:var(--paper);background:0 0;border:none;outline:none;flex:1;min-width:0;height:50px;font-size:14px}.input input::placeholder{color:var(--mute2)}.input .send{background:var(--foil);color:#241c12;border-radius:13px;flex:none;justify-content:center;align-items:center;width:38px;height:38px;font-weight:700;display:flex}.input .send:disabled{opacity:.4}.to{color:var(--gold2);border:1px solid var(--gold);white-space:nowrap;border-radius:999px;padding:4px 8px;font-size:11px}.quick{scrollbar-width:none;gap:8px;margin-bottom:10px;display:flex;overflow-x:auto}.quick::-webkit-scrollbar{display:none}.quick button{white-space:nowrap;border:1px solid var(--line);color:var(--paper);background:#2a262bcc;border-radius:999px;padding:8px 12px;font-size:12px}.quick button.draw{border-color:var(--gold);color:var(--gold2)}.me{justify-content:flex-end;margin:10px 16px 0;display:flex}.me span{background:var(--ink3);max-width:76%;color:var(--paper);border-radius:18px 18px 4px;padding:11px 14px;font-size:14px;line-height:1.6}.them{align-items:flex-end;gap:10px;margin:12px 16px 0;animation:.35s ease-out rise;display:flex}@keyframes rise{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}.them .av{background:var(--foil);border-radius:50%;flex:none;width:30px;height:30px;padding:2px}.them .av i{background-position:50%;background-size:cover;border-radius:50%;width:100%;height:100%;display:block}.them .bub{background:var(--cream) url(/art/04-paper-texture.jpg) center/cover;max-width:82%;color:var(--ink);font-family:var(--serif);white-space:pre-wrap;border-radius:18px 18px 18px 4px;padding:13px 16px;font-size:14.5px;font-weight:300;line-height:1.85;box-shadow:0 8px 18px #00000059}.them .bub .n{color:var(--mute);font-size:13px}.them .bub.black{background-blend-mode:multiply;color:var(--gold2);background:#1a1416 url(/art/04-paper-texture.jpg) 50%/cover}.them .bub.black .n{color:#a89778}.them .bub.white{outline:1.5px solid var(--gold2);outline-offset:-5px;background-color:#fbf8f1}.them .bub.pink{outline:1.5px solid var(--rose);outline-offset:-5px;background-color:#f3e3e7}.them .bub.fog{background-color:#e3e2e6}.them .name{font-family:var(--sans);letter-spacing:.08em;color:var(--mute2);margin:0 0 4px 42px;font-size:10px}.typing{font-family:var(--sans);color:var(--mute);align-items:center;gap:8px;font-size:12.5px;display:flex}.typing i{background:var(--gold);width:8px;height:8px;box-shadow:0 0 10px var(--honey);border-radius:50%;animation:1.6s infinite breathe}@keyframes breathe{0%,to{opacity:.6;transform:scale(.8)}50%{opacity:1;transform:scale(1.15)}}.time{color:var(--mute2);text-align:center;letter-spacing:.06em;margin-top:14px;font-size:10px}.narration{font-family:var(--serif);color:var(--mute2);text-align:center;margin:14px 28px 0;font-size:13px;font-weight:300;line-height:1.9}.card{background:#1c181d;border:1px solid #2f2a31;border-radius:16px;padding:14px 16px}.card h5{font-family:var(--serif);color:var(--paper);margin:0 0 6px;font-size:15px;font-weight:500}.card p{color:var(--mute2);margin:0;font-size:12px;line-height:1.6}.row2{gap:10px;display:flex}.sticker{background:#1c181d;border:1px solid #2f2a31;border-radius:18px;flex:none;width:64px;height:64px;position:relative;overflow:hidden}.sticker img{object-fit:cover;width:100%;height:100%;display:block}.sticker.lock{filter:grayscale()brightness(.45)}.sticker .new{background:var(--rose);color:#3a1a24;border-radius:999px;padding:1px 5px;font-size:8px;font-weight:700;position:absolute;top:4px;right:4px}.toggle{background:var(--gold);border-radius:13px;flex:none;width:44px;height:26px;transition:background .2s;position:relative}.toggle:after{content:"";background:#241c12;border-radius:50%;width:20px;height:20px;transition:all .2s;position:absolute;top:3px;right:3px}.toggle.off{background:var(--line)}.toggle.off:after{background:var(--mute2);left:3px;right:auto}.line{border-bottom:1px solid #2a252b;justify-content:space-between;align-items:center;padding:14px 0;font-size:14px;display:flex}.line small{color:var(--mute2);margin-top:3px;font-size:11.5px;display:block}.line .v{color:var(--gold2);font-size:13px}.sec{color:var(--mute2);letter-spacing:.1em;margin:22px 0 4px;font-size:11px}.sync{z-index:30;background-position:50%;background-size:cover;animation:.5s fade;position:absolute;inset:0}@keyframes fade{0%{opacity:0}to{opacity:1}}.sync .veil{background:linear-gradient(#120f1240,#120f12e0 45%,#120f12 70%);position:absolute;inset:0}.sync .portrait{background:var(--foil);border-radius:50%;width:150px;height:150px;margin:0 auto;padding:5px;animation:.9s cubic-bezier(.2,.8,.2,1) bloom;box-shadow:0 20px 50px #e8c25a40}@keyframes bloom{0%{opacity:0;filter:blur(6px);transform:scale(.7)}to{opacity:1;filter:none;transform:none}}.sync .portrait i{background-position:50%;background-size:cover;border-radius:50%;width:100%;height:100%;display:block}.avatars{justify-content:center;gap:10px;display:flex}.avatars button{text-align:center;width:70px}.avatars .c{border:2px solid var(--line);background-position:50%;background-size:cover;border-radius:50%;width:58px;height:58px;margin:0 auto;transition:all .2s}.avatars button.on .c{border-color:var(--gold);box-shadow:0 0 0 4px #a18c6b40}.avatars small{color:var(--mute2);margin-top:6px;font-size:11px;display:block}.avatars button.on small{color:var(--gold2)}.ob{background:linear-gradient(#120f1226,#120f128c 40%,#120f12f7 62%),url(/art/02-onboarding-bench.jpg) top/cover;position:absolute;inset:0}.ob .txt{font-family:var(--serif);color:var(--paper);text-align:center;font-size:17px;font-weight:300;line-height:2.05;animation:.8s fade}.ob .eyebrow{letter-spacing:.3em;color:var(--gold2);text-align:center;margin-bottom:14px;font-size:11px}.dots{justify-content:center;gap:6px;margin-top:18px;display:flex}.dots i{background:var(--line);border-radius:3px;width:5px;height:5px;transition:width .3s}.dots i.on{background:var(--gold);width:18px}.opts{gap:6px;display:flex}.opts button{text-align:center;border:1px solid var(--line);color:var(--mute2);border-radius:10px;flex:1;padding:11px 0;font-size:12px}.opts button.on{border-color:var(--gold);color:var(--gold2);background:#a18c6b14}.nameinput{border:1px solid var(--gold);width:100%;height:52px;color:var(--paper);text-align:center;font-size:16px;font-family:var(--serif);background:#2a262bb3;border-radius:16px;outline:none}.toast{background:var(--cream);color:var(--ink);z-index:40;font-size:12px;font-family:var(--serif);border-radius:999px;padding:8px 14px;animation:.3s fade;position:absolute;bottom:110px;left:50%;transform:translate(-50%);box-shadow:0 8px 20px #0006}.demo-badge{letter-spacing:.1em;color:var(--mute2);border:1px solid var(--line);z-index:11;border-radius:999px;padding:2px 7px;font-size:9px;position:absolute;top:60px;right:14px}
