@import "https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css";:root{--bg:#f7f8fa;--bg-outer:#eceef2;--surface:#fff;--surface-alt:#f1f2f5;--border:#e3e6eb;--text:#14161a;--text-muted:#6b7280;--text-faint:var(--text-faint);--primary:#4c6fff;--primary-dark:#3a56d9;--primary-tint:#eef1ff;--danger:#f87171;--danger-tint:#fdecec;--success:#34d399;--success-tint:#e6f9f1;--warning:#fbbf24;--warning-tint:#fff6df;--kakao:#fee500;--kakao-text:#191600;--radius-lg:12px;--radius-md:10px;--radius-sm:8px;--font-family:-apple-system, BlinkMacSystemFont, "Apple SD Gothic Neo", "Pretendard", "Malgun Gothic", "Segoe UI", sans-serif;--font-mono:ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, monospace;--stamp-image:url("data:image/svg+xml;utf8,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%22220%22 height=%22220%22><g transform=%22rotate(-18 110 110) translate(95,100)%22 opacity=%220.05%22><rect x=%220%22 y=%220%22 width=%226%22 height=%2222%22 rx=%223%22 fill=%22%2314161A%22/><rect x=%2210%22 y=%220%22 width=%226%22 height=%2222%22 rx=%223%22 fill=%22%2314161A%22/><rect x=%2220%22 y=%220%22 width=%226%22 height=%2222%22 rx=%223%22 fill=%22%2314161A%22/><rect x=%22-2.5%22 y=%2226%22 width=%2231%22 height=%222.5%22 rx=%221.2%22 fill=%22%2314161A%22/></g></svg>"), url("data:image/svg+xml;utf8,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%22280%22 height=%22280%22><g transform=%22rotate(14 140 140) translate(120,150)%22 opacity=%220.04%22><rect x=%220%22 y=%220%22 width=%225%22 height=%2218%22 rx=%222.5%22 fill=%22%2314161A%22/><rect x=%228%22 y=%220%22 width=%225%22 height=%2218%22 rx=%222.5%22 fill=%22%2314161A%22/><rect x=%2216%22 y=%220%22 width=%225%22 height=%2218%22 rx=%222.5%22 fill=%22%2314161A%22/><rect x=%22-2%22 y=%2221%22 width=%2225%22 height=%222%22 rx=%221%22 fill=%22%2314161A%22/></g></svg>");--bg-main:var(--bg);--bg-card:var(--surface);--border-color:var(--border);--text-main:var(--text);--text-sub:var(--text-muted);--glass-bg:var(--surface);--glass-border:var(--border);--primary-blue:var(--primary);--text-main-inverse:var(--text)}body{font-family:var(--font-family);background:var(--bg-outer);color:var(--text);justify-content:center;align-items:center;min-height:100vh;margin:0;display:flex}.app-container{box-sizing:border-box;width:100%}.num{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.num-lg{font-family:var(--font-mono);font-size:24px;font-weight:800}.num-md{font-family:var(--font-mono);font-size:16px;font-weight:700}.btn-arrow{font-family:var(--font-mono);margin-right:6px;font-weight:700}.glass-panel{background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:4px var(--radius-lg) var(--radius-lg) 4px;box-sizing:border-box;width:100%;max-width:600px;box-shadow:none;margin:0 auto;padding:40px}.header{flex-direction:column;align-items:center;margin-bottom:30px;display:flex}.logo-text{font-family:var(--font-mono);color:var(--text-muted);margin-bottom:5px;font-size:1.2rem;font-weight:700}.title{text-align:center;color:var(--text);font-size:1.8rem;font-weight:800}.input-group{flex-direction:column;margin-bottom:20px;display:flex}.input-group label{margin-bottom:8px;font-size:.95rem;font-weight:600}.input-group input,.input-group textarea{background:var(--surface-alt);border-radius:var(--radius-sm);color:var(--text);font-family:var(--font-family);box-sizing:border-box;border:none;width:100%;padding:14px;font-size:1rem}input::placeholder,textarea::placeholder{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}input::-webkit-input-placeholder{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}textarea::-webkit-input-placeholder{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}input::-moz-placeholder{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}textarea::-moz-placeholder{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}input:-ms-placeholder-shown{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}textarea:-ms-placeholder-shown{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}.input-group input::placeholder,.input-group textarea::placeholder{color:#99a3b0!important}.input-group input:focus,.input-group textarea:focus{background:var(--surface-alt);outline:none}.btn-primary{box-sizing:border-box;background:var(--primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;justify-content:center;align-items:center;width:100%;margin-top:10px;padding:16px;font-size:1.1rem;font-weight:700;transition:all .2s;display:flex}.btn-primary:hover{background:var(--primary-dark);transform:translateY(-1px)}.btn-secondary{box-sizing:border-box;background:var(--surface);width:100%;color:var(--primary);border:1.5px solid var(--primary);border-radius:var(--radius-sm);cursor:pointer;justify-content:center;align-items:center;margin-top:10px;padding:16px;font-size:1rem;font-weight:700;transition:all .2s;display:flex}.btn-secondary:hover{background:var(--primary-tint)}.btn-danger{box-sizing:border-box;background:var(--surface);width:100%;color:var(--danger);border:1.5px solid var(--danger);border-radius:var(--radius-sm);cursor:pointer;justify-content:center;align-items:center;margin-top:10px;padding:16px;font-size:1rem;font-weight:700;transition:all .2s;display:flex}.btn-danger:hover{background:var(--danger-tint)}.back-btn{cursor:pointer;color:var(--text);border-radius:var(--radius-sm);background:0 0;border:none;justify-content:center;align-items:center;padding:8px;transition:background .15s;display:flex}.back-btn:hover{background:var(--surface-alt)}.toggle-group{background:var(--surface-alt);border-radius:var(--radius-sm);padding:3px;display:flex;overflow:hidden}.toggle-btn{text-align:center;border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;opacity:1;background:0 0;border:none;flex:1;padding:14px;font-size:1rem;transition:all .2s}.toggle-btn.active{background:var(--surface);color:var(--text);opacity:1;font-weight:700}.info-text{text-align:center;color:var(--text-muted);margin-top:20px;font-size:.85rem}.dashboard-card{background-color:var(--surface-alt);border-radius:var(--radius-md);flex-direction:column;margin-bottom:12px;padding:16px;display:flex}.points-text{color:var(--text);margin:10px 0;font-size:2.5rem;font-weight:800}.modal-overlay{z-index:1000;background:#00000073;justify-content:center;align-items:center;width:100vw;height:100vh;display:flex;position:fixed;top:0;left:0}.modal-content{box-sizing:border-box;background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:4px var(--radius-lg) var(--radius-lg) 4px;width:100%;max-width:500px;padding:20px;animation:.3s cubic-bezier(.16,1,.3,1) modalPop}@keyframes modalPop{0%{opacity:0;transform:scale(.95)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}.loading-spinner{border:3px solid var(--surface-alt);border-top-color:var(--primary);border-radius:50%;width:32px;height:32px;animation:.8s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.landing-container{flex-direction:column;align-items:center;width:100%;max-width:1200px;margin:0 auto;display:flex}@keyframes fadeIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.phone-outer{box-sizing:border-box;justify-content:center;width:100%;min-height:100vh;padding:32px 16px 64px;display:flex}.phone-frame{border:1px solid var(--border);background-color:var(--bg);background-image:var(--stamp-image);background-position:0 0,110px 140px;background-size:220px 220px,280px 280px;border-radius:20px;flex-direction:column;width:100%;max-width:428px;min-height:calc(100vh - 96px);display:flex;overflow:hidden}.phone-content{flex:1;padding:0 0 32px}@media (width<=480px){.phone-outer{padding:0}.phone-frame{border:none;border-radius:0;min-height:100vh}}.highlight{color:var(--text);background:linear-gradient(180deg, transparent 62%, var(--kakao) 62%);padding:0 2px}.landing-card{background:var(--surface);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:4px var(--radius-lg) var(--radius-lg) 4px;cursor:pointer;padding:20px;transition:background .2s}.landing-card.expanded{background:var(--primary-tint)}.landing-footer{text-align:center;color:var(--text-muted);border-top:1px solid var(--border);width:100%;padding:2rem 0;font-size:.85rem}@media (width<=768px){.glass-panel{padding:24px}}.kakao-container{background-color:var(--bg);background-image:var(--stamp-image);width:100vw;min-height:100vh;color:var(--text);font-family:var(--font-family);z-index:9999;background-position:0 0,110px 140px;background-size:220px 220px,280px 280px;flex-direction:column;display:flex;position:absolute;top:0;left:0}.kakao-appbar{background-color:var(--surface);border-bottom:1px solid var(--border);z-index:10;justify-content:center;align-items:center;height:56px;display:flex;position:sticky;top:0}.kakao-appbar h1{color:var(--text);margin:0;font-size:1.1rem;font-weight:800}.kakao-form{flex-direction:column;gap:12px;width:100%;max-width:600px;margin:0 auto;padding-bottom:24px;display:flex}.kakao-section{background-color:var(--surface);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:4px var(--radius-lg) var(--radius-lg) 4px;flex-direction:column;gap:16px;margin:0 16px;padding:24px 20px;display:flex}.toss-card{background-color:var(--surface);border:1px solid var(--border);border-left:4px solid var(--primary);border-radius:4px var(--radius-lg) var(--radius-lg) 4px;padding:16px}.toss-card-flat{background-color:var(--surface-alt);border-radius:var(--radius-sm)}.kakao-section-title{color:var(--text);margin:0 0 4px;font-size:1.05rem;font-weight:700}.kakao-toggle-group{background:var(--surface-alt);border-radius:var(--radius-sm);padding:3px;display:flex;overflow:hidden}.kakao-toggle-btn{text-align:center;border-radius:var(--radius-sm);color:var(--text-muted);cursor:pointer;background:0 0;border:none;flex:1;padding:12px;font-size:.95rem;font-weight:500;transition:all .2s}.kakao-toggle-btn.active{background:var(--surface);color:var(--text);font-weight:700}.kakao-input,.kakao-textarea{box-sizing:border-box;border:none;border-bottom:1px solid var(--border);background:var(--surface);width:100%;color:var(--text);border-radius:0;padding:16px 0;font-family:inherit;font-size:1.05rem;transition:border-color .2s}.kakao-input::placeholder,.kakao-textarea::placeholder{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}.kakao-input::-webkit-input-placeholder{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}.kakao-textarea::-webkit-input-placeholder{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}.kakao-input::-moz-placeholder{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}.kakao-textarea::-moz-placeholder{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}.kakao-input:-ms-placeholder-shown{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}.kakao-textarea:-ms-placeholder-shown{color:#99a3b0!important;-webkit-text-fill-color:#99a3b0!important;opacity:1!important;font-weight:400!important}.kakao-input:focus,.kakao-textarea:focus{border-bottom-color:var(--primary);outline:none}.kakao-textarea{border:1px solid var(--border);border-radius:var(--radius-sm);resize:none;background-color:var(--surface-alt);padding:16px}.kakao-textarea:focus{border-color:var(--primary)}.kakao-help-text{color:var(--text-muted);margin:0;font-size:.85rem;line-height:1.4}.kakao-input-with-btn{align-items:flex-end;gap:12px;display:flex}.kakao-sub-btn{white-space:nowrap;background:var(--surface-alt);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);cursor:pointer;height:42px;margin-bottom:5px;padding:10px 16px;font-size:.9rem;font-weight:500}.kakao-friend-picker-btn{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);width:100%;color:var(--text);cursor:pointer;justify-content:center;align-items:center;gap:8px;padding:16px;font-size:1rem;font-weight:500;display:flex}.kakao-icon-yellow{background-color:var(--primary-tint);width:24px;height:24px;color:var(--primary);border-radius:50%;justify-content:center;align-items:center;font-size:.8rem;display:inline-flex}.kakao-submit-btn{background:var(--primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;width:100%;max-width:600px;padding:16px;font-size:1.1rem;font-weight:700;transition:all .2s}.kakao-submit-btn:disabled{background:var(--surface-alt);color:var(--text-faint);cursor:not-allowed}.kakao-submit-btn:not(:disabled):hover{background:var(--primary-dark)}.kakao-success-container{background:var(--surface);text-align:center;flex-direction:column;flex:1;justify-content:center;align-items:center;padding:40px 20px;display:flex}.success-icon{margin-bottom:20px;font-size:4rem}.kakao-success-container h2{color:var(--text);margin-bottom:12px;font-size:1.4rem}.kakao-success-container p{color:var(--text-muted);margin-bottom:40px;font-size:.95rem;line-height:1.5}.kakao-success-btn{background:var(--primary);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;padding:16px 40px;font-size:1rem;font-weight:600}.kakao-success-btn:hover{background:var(--primary-dark)}
