@import "https://fonts.googleapis.com/css2?family=Gowun+Dodum&family=Gaegu:wght@400;700&family=Caveat:wght@400;700&display=swap";@import "https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.css";:root{--bg:#faf4f7;--bg-2:#f4e9f3;--surface:#fff;--surface-soft:#fbf5f8;--line:#4a2f5c14;--line-strong:#4a2f5c24;--lavender:#c5a8e6;--lavender-soft:#ece0fa;--lavender-deep:#8b6fb8;--peach:#ffb89e;--peach-soft:#ffe2d2;--peach-deep:#e58a6a;--mint:#a8e0cb;--mint-soft:#ddf2ea;--cream:#ffe9b8;--cream-soft:#fff4d9;--pink:#ffb5c8;--pink-soft:#ffdde6;--sky:#bbd4f7;--sky-soft:#e2edfa;--ink:#3d2c5c;--ink-2:#5b4878;--muted:#8e7fa6;--muted-2:#b6abc5;--gold:#d4a551;--primary:#9b7bd4;--primary-ink:#fff;--accent:#ff8e73;--r-sm:12px;--r-md:20px;--r-lg:28px;--r-xl:36px;--r-pill:999px;--shadow-sm:0 1px 2px #4a2f5c0a, 0 2px 8px #4a2f5c0f;--shadow-md:0 4px 12px #9b7bd41a, 0 12px 30px #9b7bd41a;--shadow-lg:0 12px 30px #9b7bd42e, 0 30px 60px #9b7bd429;--shadow-card:0 8px 20px #4a2f5c1a;--font-display:"Gowun Dodum", "Pretendard", system-ui, sans-serif;--font-body:"Pretendard", system-ui, sans-serif;--font-hand:"Gaegu", "Gowun Dodum", cursive;--font-script:"Caveat", cursive}[data-theme=light]{--bg:#fffcf7;--bg-2:#fff6eb;--surface:#fff;--surface-soft:#fff9f0;--line:#4a2f1a14;--line-strong:#4a2f1a24;--ink:#2f2418;--ink-2:#4a3d2c;--muted:#8a7d6b;--muted-2:#bfb29c;--primary:#e58a6a;--primary-ink:#fff;--accent:#9b7bd4}[data-theme=dark]{--bg:#14102a;--bg-2:#1c1638;--surface:#221a3f;--surface-soft:#2a2150;--line:#ffffff12;--line-strong:#ffffff24;--lavender-soft:#3a2e5c;--peach-soft:#4a2e36;--mint-soft:#1e3a36;--cream-soft:#3a2f1c;--pink-soft:#4a2a3e;--sky-soft:#1e2e50;--ink:#f2ebff;--ink-2:#c9bee0;--muted:#948aac;--muted-2:#6b6182;--primary:#c5a8e6;--primary-ink:#1a1230;--accent:#ffb89e;--gold:#e8c375;--shadow-card:0 8px 24px #00000073;--shadow-md:0 4px 16px #00000059, 0 14px 30px #0000004d;--shadow-lg:0 14px 36px #00000073, 0 30px 60px #0006}*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:var(--font-body);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;text-rendering:optimizelegibility;letter-spacing:-.01em;word-break:keep-all}h1,h2,h3,h4,p,div,span,button{word-break:keep-all}button{cursor:pointer;font-family:inherit}.stage{background:radial-gradient(900px 600px at 15% 10%, var(--lavender-soft), transparent 60%), radial-gradient(700px 500px at 85% 90%, var(--peach-soft), transparent 55%), radial-gradient(600px 400px at 50% 50%, var(--mint-soft), transparent 70%), var(--bg);place-items:center;min-height:100vh;padding:32px 16px;display:grid}[data-theme=dark] .stage{background:radial-gradient(900px 600px at 15% 10%, #9b7bd42e, transparent 60%), radial-gradient(700px 500px at 85% 90%, #ff8e731a, transparent 55%), radial-gradient(600px 400px at 50% 50%, #00000040, transparent 70%), var(--bg)}.stage-inner{transform-origin:50%}.app-screen{background:var(--bg);width:100%;min-height:100%;color:var(--ink);font-family:var(--font-body);padding-top:54px}.h-display{font-family:var(--font-display);letter-spacing:-.02em;font-weight:400}.h-hand{font-family:var(--font-hand);font-weight:700}.h-script{font-family:var(--font-script);font-weight:700}.text-muted{color:var(--muted)}.text-ink-2{color:var(--ink-2)}.card{background:var(--surface);border-radius:var(--r-lg);box-shadow:var(--shadow-card)}.chip{background:var(--lavender-soft);color:var(--lavender-deep);white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:6px 12px;font-size:12px;font-weight:600;display:inline-flex}[data-theme=dark] .chip{color:var(--lavender)}.btn{border-radius:var(--r-pill);font-family:var(--font-body);background:var(--primary);color:var(--primary-ink);box-shadow:var(--shadow-md);border:0;justify-content:center;align-items:center;gap:8px;padding:16px 24px;font-size:16px;font-weight:700;transition:transform .16s,box-shadow .16s,background .16s;display:inline-flex}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(0)}.btn--ghost{color:var(--ink);box-shadow:none;border:1.5px solid var(--line-strong);background:0 0}.btn--soft{background:var(--lavender-soft);color:var(--lavender-deep);box-shadow:none}[data-theme=dark] .btn--soft{color:var(--lavender)}.app-screen::-webkit-scrollbar{width:0;height:0}.card-3d{perspective:1200px}.card-flip{width:100%;height:100%;transform-style:preserve-3d;transition:transform .7s cubic-bezier(.2,.7,.2,1);position:relative}.card-flipped{transform:rotateY(180deg)}.card-face{backface-visibility:hidden;border-radius:14px;position:absolute;inset:0;overflow:hidden}.card-face--back{transform:rotateY(180deg)}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes float-slow{0%,to{transform:translateY(0)rotate(-2deg)}50%{transform:translateY(-10px)rotate(2deg)}}@keyframes spin-slow{to{transform:rotate(360deg)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 #9b7bd466}50%{box-shadow:0 0 0 14px #9b7bd400}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes blink{0%,30%,36%,60%,66%,to{transform:scaleY(1)}33%,63%{transform:scaleY(.08)}}@keyframes sparkle-twinkle{0%,to{opacity:.25;transform:scale(.7)rotate(0)}50%{opacity:1;transform:scale(1.15)rotate(20deg)}}.float{animation:3s ease-in-out infinite float}.float-slow{animation:5s ease-in-out infinite float-slow}.spin-slow{animation:28s linear infinite spin-slow}.pulse-glow{animation:2.4s ease-out infinite pulse-glow}.m-idle{transform-box:fill-box;transform-origin:50% 100%;will-change:transform;animation:2.6s ease-in-out infinite mascot-breathe}@keyframes mascot-breathe{0%{transform:translateY(0)scale(1)}30%{transform:translateY(-3px)scale(1.02,.985)rotate(-1.2deg)}50%{transform:translateY(-4px)scale(1.025,.98)}70%{transform:translateY(-3px)scale(1.02,.985)rotate(1.2deg)}to{transform:translateY(0)scale(1)}}.m-blink{transform-box:fill-box;transform-origin:50%;animation:3.6s ease-in-out infinite blink}.m-ear-l,.m-ear-r{transform-box:fill-box;transform-origin:bottom}.m-ear-l{animation:2.8s ease-in-out infinite ear-sway}.m-ear-r{animation:2.8s ease-in-out infinite reverse ear-sway}@keyframes ear-sway{0%{transform:rotate(-3.5deg)}25%{transform:rotate(3.5deg)}50%{transform:rotate(-2deg)}68%{transform:rotate(2.5deg)}74%{transform:rotate(-8deg)}80%{transform:rotate(3deg)}to{transform:rotate(-3.5deg)}}.m-tail{transform-box:fill-box;transform-origin:0 100%;animation:2.2s ease-in-out infinite tail-sway}@keyframes tail-sway{0%,to{transform:rotate(-7deg)}50%{transform:rotate(11deg)}}.m-tw{transform-box:fill-box;transform-origin:50%;animation:2.3s ease-in-out infinite sparkle-twinkle}@media (prefers-reduced-motion:reduce){.m-idle,.m-blink,.m-ear-l,.m-ear-r,.m-tail,.m-tw{animation:none!important}}.starfield{pointer-events:none;position:absolute;inset:0;overflow:hidden}.starfield .star{background:var(--ink);border-radius:50%;width:4px;height:4px;animation:2.4s ease-in-out infinite sparkle-twinkle;position:absolute}.seg{background:var(--lavender-soft);border-radius:999px;gap:2px;padding:4px;display:inline-flex}.seg button{color:var(--muted);background:0 0;border:0;border-radius:999px;padding:8px 16px;font-size:13px;font-weight:600}.seg button[data-on=true]{background:var(--surface);color:var(--ink);box-shadow:0 2px 8px #4a2f5c1a}.tabbar{background:color-mix(in srgb, var(--surface) 80%, transparent);-webkit-backdrop-filter:blur(20px)saturate(180%);border:1px solid var(--line);height:64px;box-shadow:var(--shadow-md);z-index:40;border-radius:28px;grid-template-columns:repeat(4,1fr);align-items:center;display:grid;position:absolute;bottom:12px;left:12px;right:12px}.tabbar button{color:var(--muted);background:0 0;border:0;flex-direction:column;align-items:center;gap:4px;padding:6px 0;font-size:11px;font-weight:600;display:flex}.tabbar button[data-on=true]{color:var(--primary)}.tabbar button svg{transition:transform .16s}.tabbar button:active svg{transform:scale(.9)}#root{min-height:100dvh}.phone{background:var(--bg);width:100%;max-width:430px;height:100dvh;margin:0 auto;position:relative;overflow:hidden}.phone-screen{-webkit-overflow-scrolling:touch;position:absolute;inset:0;overflow-y:auto}@media (width>=480px){.phone{height:min(920px,96dvh);box-shadow:var(--shadow-lg);border:1px solid var(--line);border-radius:40px}}
