:root{--orange:#d96f18;--blue:#0f6f9f;--orange-light:#d96f1814;--blue-light:#0f6f9f14;--text:#17202a;--text-muted:#64748b;--bg:#fff;--bg-section:#f6f8fb;--border:#dce3ea;--shadow-sm:0 1px 2px #0f172a0f;--shadow-md:0 12px 32px #0f172a1a;--shadow-lg:0 24px 70px #0f172a29;--gradient:linear-gradient(135deg, #13324a 0%, #0f6f9f 100%);--gradient-soft:linear-gradient(135deg, #13324a0f 0%, #0f6f9f14 100%);color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Pretendard,Apple SD Gothic Neo,system-ui,-apple-system,sans-serif;font-size:16px;line-height:1.6}*,:before,:after{box-sizing:border-box}body{margin:0;padding:0}#root{width:100%;max-width:100%}h1,h2,h3,h4{margin:0;line-height:1.2}p{margin:0}button{cursor:pointer;border:none;outline:none;font-family:inherit}a{color:inherit;text-decoration:none}input{border:none;outline:none;font-family:inherit}.app-root{min-height:100vh;overflow-x:hidden}.site-header{z-index:100;padding:16px 0;transition:background .3s,box-shadow .3s,padding .3s;position:fixed;top:0;left:0;right:0}.site-header.scrolled{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#ffffffeb;padding:10px 0;box-shadow:0 2px 20px #00000014}.header-inner{justify-content:space-between;align-items:center;max-width:1100px;margin:0 auto;padding:0 24px;display:flex}.header-logo{align-items:center;gap:10px;text-decoration:none;display:flex}.header-logo-text{background:var(--gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-size:18px;font-weight:800}.header-nav{align-items:center;gap:24px;display:flex}.header-nav a{color:var(--text-muted);font-size:14px;font-weight:600;text-decoration:none;transition:color .2s}.hero-section{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:100px 24px 60px;display:flex;position:relative;overflow:hidden}.hero-bg-orb{filter:blur(80px);opacity:.35;pointer-events:none;border-radius:50%;position:absolute}.orb1{background:radial-gradient(circle,#f5841f 0%,#0000 70%);width:500px;height:500px;top:-100px;right:-100px}.orb2{background:radial-gradient(circle,#00adef 0%,#0000 70%);width:400px;height:400px;bottom:0;left:-80px}.orb3{opacity:.2;background:radial-gradient(circle,#f5c01f 0%,#0000 70%);width:300px;height:300px;top:50%;left:40%}.hero-content{z-index:1;align-items:center;gap:60px;width:100%;max-width:1100px;display:flex;position:relative}.hero-text{flex:1;min-width:0}.hero-badge{background:var(--orange-light);color:var(--orange);border:1px solid #f5841f33;border-radius:100px;align-items:center;gap:6px;margin-bottom:20px;padding:6px 16px;font-size:13px;font-weight:700;display:inline-flex}.hero-title{letter-spacing:-.02em;margin-bottom:20px;font-size:clamp(42px,6vw,72px);font-weight:900;line-height:1.1}.gradient-text{background:var(--gradient);-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.hero-sub{color:var(--text-muted);max-width:480px;margin-bottom:36px;font-size:clamp(16px,2vw,20px);line-height:1.7}.hero-cta{flex-wrap:wrap;gap:12px;display:flex}.btn-appstore,.btn-github{border-radius:12px;align-items:center;gap:8px;padding:14px 28px;font-size:15px;font-weight:700;text-decoration:none;transition:all .25s;display:inline-flex}.btn-appstore{background:var(--gradient);color:#fff;box-shadow:0 4px 20px #f5841f59}.btn-appstore:hover{transform:translateY(-2px);box-shadow:0 8px 30px #f5841f73}.btn-github{color:#333;border:2px solid var(--border);box-shadow:var(--shadow-sm);background:#fff}.btn-github:hover{box-shadow:var(--shadow-md);border-color:#333;transform:translateY(-2px)}.hero-phone-wrap{flex-direction:column;flex:none;align-items:center;gap:12px;display:flex}.phone-frame{background:#fff;border:2px solid #e0e0e8;border-radius:40px;width:280px;overflow:hidden;box-shadow:0 30px 80px #0000002e,0 0 0 1px #0000000f}.phone-notch{background:#111;border-radius:0 0 18px 18px;width:100px;height:24px;margin:0 auto}.phone-header{justify-content:space-between;align-items:center;margin-bottom:12px;display:flex}.phone-back{color:var(--blue);font-size:13px;font-weight:600}.phone-title-text{color:#222;font-size:14px;font-weight:700}.phone-input-row{gap:8px;margin-bottom:4px;display:flex}.phone-input-mock{color:#bbb;background:#f5f5f7;border-radius:8px;flex:1;padding:8px 12px;font-size:13px}.phone-add-btn{background:var(--orange);color:#fff;cursor:pointer;border:none;border-radius:8px;padding:8px 14px;font-size:13px;font-weight:700}.phone-hint{color:#bbb;margin-top:2px;margin-bottom:12px;font-size:10px}.phone-todo-list{flex-direction:column;gap:2px;margin:0 0 12px;padding:0;list-style:none;display:flex}.phone-todo-item{cursor:pointer;-webkit-user-select:none;user-select:none;border-bottom:1px solid #f0f0f4;border-radius:8px;align-items:center;gap:10px;padding:10px 8px;transition:background .15s;display:flex}.phone-todo-item:hover{background:#f8f8fc}.phone-todo-item.checked .phone-todo-text{color:#bbb;text-decoration:line-through}.phone-checkbox{color:#fff;border:2px solid #ddd;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;font-size:11px;font-weight:700;transition:all .2s;display:flex}.phone-todo-item.checked .phone-checkbox{background:var(--orange);border-color:var(--orange)}.phone-todo-text{color:#333;flex:1;font-size:13px;transition:all .2s}.phone-delete{color:#ddd;font-size:11px}.phone-progress{align-items:center;gap:10px;display:flex}.phone-progress-bar{background:#f0f0f4;border-radius:3px;flex:1;height:6px;overflow:hidden}.phone-progress-fill{background:var(--gradient);border-radius:3px;height:100%;transition:width .4s}.phone-progress-text{color:var(--orange);white-space:nowrap;font-size:11px;font-weight:700}.hero-interact-hint{color:var(--text-muted);opacity:.7;font-size:13px}.hero-scroll-hint{color:var(--text-muted);opacity:.6;flex-direction:column;align-items:center;gap:6px;font-size:12px;animation:1s 1.5s both fadeInUp;display:flex;position:absolute;bottom:32px;left:50%;transform:translate(-50%)}.scroll-arrow{border-bottom:2px solid;border-right:2px solid;width:8px;height:8px;animation:1.5s infinite bounce;transform:rotate(45deg)}@keyframes bounce{0%,to{transform:rotate(45deg)translateY(0)}50%{transform:rotate(45deg)translateY(4px)}}.section-inner{max-width:1100px;margin:0 auto;padding:0 24px}.section-label{color:var(--orange);text-transform:uppercase;letter-spacing:.1em;margin-bottom:12px;font-size:13px;font-weight:700}.section-title{color:#222;letter-spacing:-.02em;margin-bottom:12px;font-size:clamp(28px,4vw,44px);font-weight:800}.section-sub{color:var(--text-muted);max-width:560px;margin-bottom:48px;font-size:17px}.fade-up{opacity:0;transition:opacity .55s,transform .55s;transform:translateY(28px)}.fade-up.visible{opacity:1;transform:translateY(0)}.features-section{background:var(--bg-section);padding:100px 0}.features-grid{grid-template-columns:repeat(3,1fr);gap:20px;margin-top:48px;display:grid}.feature-card{border:1px solid var(--border);box-shadow:var(--shadow-sm);background:#fff;border-radius:20px;padding:32px 28px;transition:transform .25s,box-shadow .25s}.feature-icon{margin-bottom:16px;font-size:36px}.feature-title{color:#222;margin-bottom:8px;font-size:17px;font-weight:700}.feature-desc{color:var(--text-muted);font-size:14px;line-height:1.65}.share-section{padding:100px 0}.share-demo{align-items:flex-start;gap:16px;margin-top:48px;display:flex}.share-step{background:var(--bg-section);border:1px solid var(--border);border-radius:20px;flex:1;padding:28px 24px}.share-step-num{background:var(--gradient);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;margin-bottom:16px;font-size:16px;font-weight:800;display:flex}.share-step-body h4{color:#222;margin-bottom:6px;font-size:16px;font-weight:700}.share-step-body p{color:var(--text-muted);margin-bottom:16px;font-size:13px;line-height:1.5}.share-folder-mock{border:1px solid var(--border);box-shadow:var(--shadow-sm);background:#fff;border-radius:10px;padding:10px 14px;font-size:13px;font-weight:600}.share-code-box{background:var(--blue-light);border:2px solid var(--blue);cursor:pointer;border-radius:12px;justify-content:space-between;align-items:center;padding:12px 16px;transition:background .2s;display:flex}.share-code-box:hover{background:#00adef2e}.share-code-text{letter-spacing:.1em;color:var(--blue);font-family:monospace;font-size:15px;font-weight:800}.share-copy-btn{color:var(--blue);background:#fff;border-radius:6px;padding:3px 10px;font-size:12px;font-weight:700}.share-join-mock{border:1px solid var(--border);box-shadow:var(--shadow-sm);background:#fff;border-radius:10px;padding:12px 14px}.share-join-folder{color:#333;margin-bottom:2px;font-size:13px;font-weight:700}.share-join-info{color:var(--text-muted);margin-bottom:10px;font-size:11px}.share-join-btn{background:var(--orange);color:#fff;cursor:pointer;border:none;border-radius:8px;width:100%;padding:8px;font-size:13px;font-weight:700}.share-arrow{color:var(--text-muted);opacity:.4;padding-top:56px;font-size:28px}.scenarios-section{background:var(--bg-section);padding:100px 0}.scenario-tabs{flex-wrap:wrap;gap:10px;margin-top:32px;margin-bottom:28px;display:flex}.scenario-tab{border:2px solid var(--border);color:var(--text-muted);cursor:pointer;background:#fff;border-radius:100px;padding:10px 20px;font-size:14px;font-weight:700;transition:all .2s}.scenario-tab:hover{color:#333;border-color:#aaa}.scenario-tab.active{box-shadow:var(--shadow-sm);background:#fff}.scenario-content{border:2px solid var(--border);box-shadow:var(--shadow-sm);background:#fff;border-radius:24px;align-items:center;gap:40px;padding:36px 40px;transition:border-color .3s;display:flex}.scenario-phone{border:1px solid var(--border);background:#f8f9ff;border-radius:16px;flex:0 0 260px;padding:20px}.scenario-phone-title{margin-bottom:14px;font-size:15px;font-weight:800}.scenario-todo-list{flex-direction:column;gap:2px;margin:0 0 14px;padding:0;list-style:none;display:flex}.scenario-todo-item{cursor:pointer;color:#333;-webkit-user-select:none;user-select:none;border-radius:8px;align-items:center;gap:10px;padding:9px 8px;font-size:13px;transition:background .15s;display:flex}.scenario-todo-item:hover{background:#00000008}.scenario-todo-item.checked{color:#bbb;text-decoration:line-through}.scenario-checkbox{color:#fff;border:2px solid #ddd;border-radius:4px;flex-shrink:0;justify-content:center;align-items:center;width:20px;height:20px;font-size:11px;font-weight:700;transition:all .2s;display:flex}.scenario-progress-row{align-items:center;gap:10px;display:flex}.scenario-bar-bg{background:#eee;border-radius:3px;flex:1;height:6px;overflow:hidden}.scenario-bar-fill{border-radius:3px;height:100%;transition:width .4s}.scenario-desc{flex-direction:column;flex:1;gap:20px;display:flex}.scenario-desc p{color:var(--text-muted);font-size:16px;line-height:1.7}.scenario-badge{border-radius:100px;align-self:flex-start;padding:6px 16px;font-size:13px;font-weight:700;display:inline-flex}.download-section{text-align:center;background:var(--gradient);padding:120px 24px;position:relative;overflow:hidden}.download-inner{z-index:1;flex-direction:column;align-items:center;gap:20px;display:flex;position:relative}.download-title{color:#fff;letter-spacing:-.02em;font-size:clamp(32px,5vw,52px);font-weight:900}.download-sub{color:#ffffffd9;max-width:500px;font-size:18px;line-height:1.6}.download-btns{flex-wrap:wrap;justify-content:center;gap:14px;margin-top:12px;display:flex}.download-btn-main{color:var(--orange);background:#fff;border-radius:14px;align-items:center;gap:10px;padding:16px 36px;font-size:16px;font-weight:800;text-decoration:none;transition:all .25s;display:inline-flex;box-shadow:0 8px 32px #0000002e}.download-btn-main:hover{transform:translateY(-3px);box-shadow:0 16px 48px #00000038}.download-btn-ghost{color:#fff;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#ffffff26;border:2px solid #ffffff80;border-radius:14px;align-items:center;gap:10px;padding:16px 36px;font-size:16px;font-weight:800;text-decoration:none;transition:all .25s;display:inline-flex}.download-btn-ghost:hover{background:#ffffff40;transform:translateY(-3px)}.support-section{background:#fff;padding:100px 0}.support-layout{grid-template-columns:1fr 1fr;align-items:start;gap:48px;margin-top:48px;display:grid}.support-sub-title{color:#222;margin-bottom:20px;font-size:18px;font-weight:800}.faq-list{flex-direction:column;gap:10px;display:flex}.faq-item{border:1.5px solid var(--border);background:#fff;border-radius:12px;transition:border-color .2s,box-shadow .2s;overflow:hidden}.faq-q{cursor:pointer;color:#222;text-align:left;background:0 0;border:none;justify-content:space-between;align-items:center;gap:12px;width:100%;padding:16px 20px;font-size:14px;font-weight:700;transition:background .15s;display:flex}.faq-q:hover{background:#faf9ff}.faq-arrow{color:#7c3aed;flex-shrink:0;font-size:11px}.faq-a{color:var(--text-muted);border-top:1px solid #f0eeff;padding:14px 20px 16px;font-size:14px;line-height:1.7}.contact-card{background:linear-gradient(135deg,#f5f0ff 0%,#eef6ff 100%);border:1.5px solid #7c3aed1f;border-radius:20px;flex-direction:column;align-items:flex-start;gap:16px;padding:36px 32px;display:flex}.contact-icon{font-size:40px}.contact-desc{color:var(--text-muted);margin:0;font-size:15px;line-height:1.7}.contact-email-btn{color:#fff;background:#7c3aed;border-radius:12px;align-items:center;gap:10px;padding:14px 28px;font-size:15px;font-weight:700;text-decoration:none;transition:all .25s;display:inline-flex;box-shadow:0 4px 18px #7c3aed4d}.contact-email-btn:hover{background:#6d28d9;transform:translateY(-2px);box-shadow:0 8px 28px #7c3aed66}.contact-note{color:#9b8ec4;margin:0;font-size:13px;line-height:1.6}@media (width<=900px){.support-layout{grid-template-columns:1fr;gap:32px}}.site-footer{text-align:center;background:#111;padding:48px 24px}.footer-inner{flex-direction:column;align-items:center;gap:12px;max-width:600px;margin:0 auto;display:flex}.footer-logo{color:#fff;align-items:center;gap:10px;font-size:18px;font-weight:800;display:flex}.footer-sub{color:#666;font-size:14px}.footer-links{color:#555;align-items:center;gap:12px;font-size:14px;display:flex}.footer-links a{color:#888;text-decoration:none;transition:color .2s}.footer-links a:hover{color:var(--orange)}.footer-copy{color:#444;font-size:12px}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@media (width<=900px){.hero-content{text-align:center;flex-direction:column}.hero-sub{max-width:100%}.hero-cta{justify-content:center}.features-grid{grid-template-columns:repeat(2,1fr)}.share-demo{flex-direction:column}.share-arrow{align-self:center;padding:0;transform:rotate(90deg)}.scenario-content{flex-direction:column;padding:24px}.scenario-phone{flex:unset;width:100%}}@media (width<=600px){.features-grid{grid-template-columns:1fr}.phone-frame{width:240px}.hero-section{padding-top:80px}}.site-header{-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px);background:#ffffffd6;border-bottom:1px solid #dce3eab8;padding:14px 0}.site-header.scrolled{background:#fffffff0;box-shadow:0 10px 30px #0f172a0f}.header-inner,.section-inner,.hero-content{max-width:1180px}.header-logo-text,.gradient-text{-webkit-text-fill-color:currentColor;color:var(--text);background:0 0}.header-nav a:hover{color:var(--blue)}.hero-section{background:linear-gradient(#fff 0%,#f6f8fb 100%),radial-gradient(circle at 100% 0,#0f6f9f14,#0000 34%);align-items:stretch;min-height:92vh;padding:112px 24px 72px}.hero-content{grid-template-columns:minmax(0,1fr) 420px;gap:72px;margin:0 auto;display:grid}.hero-badge{color:var(--blue);border:1px solid var(--border);letter-spacing:.08em;text-transform:uppercase;background:#fff;border-radius:6px;padding:5px 10px;font-size:12px}.hero-title{color:#0f172a;letter-spacing:0;font-size:clamp(48px,6vw,78px);font-weight:850}.hero-sub{color:#475569;max-width:620px}.hero-proof{flex-wrap:wrap;gap:8px;margin:-12px 0 32px;display:flex}.hero-proof span{border:1px solid var(--border);color:#334155;background:#ffffffc7;border-radius:6px;padding:7px 10px;font-size:13px;font-weight:650}.btn-appstore,.btn-github,.download-btn-main,.download-btn-ghost,.contact-email-btn{letter-spacing:0;border-radius:8px}.btn-appstore{background:#0f172a;box-shadow:0 12px 28px #0f172a2e}.btn-appstore:hover{box-shadow:0 16px 34px #0f172a38}.btn-github{border:1px solid var(--border);color:#17202a}.hero-phone-wrap{gap:14px}.phone-frame{border:1px solid #cbd5e1;border-radius:28px;width:320px;box-shadow:0 28px 70px #0f172a2e}.phone-notch{width:92px;height:20px}.phone-screen{padding:18px}.phone-add-btn,.phone-todo-item.checked .phone-checkbox,.phone-progress-fill{background:#0f6f9f}.phone-progress-fill{background:linear-gradient(90deg,#13324a 0%,#0f6f9f 100%)}.phone-progress-text,.phone-back{color:var(--blue)}.hero-panel-caption{border:1px solid var(--border);color:#64748b;width:320px;box-shadow:var(--shadow-sm);background:#fff;border-radius:8px;justify-content:space-between;align-items:center;padding:10px 12px;font-size:13px;display:flex}.hero-panel-caption strong{color:#0f172a}.section-label{color:var(--blue);letter-spacing:.08em}.section-title{color:#0f172a;letter-spacing:0}.features-section,.scenarios-section{background:var(--bg-section)}.feature-card,.share-step,.scenario-content,.scenario-phone,.faq-item,.contact-card{border:1px solid var(--border);box-shadow:var(--shadow-sm);border-radius:8px}.feature-card{padding:28px}.feature-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.feature-icon{width:38px;height:28px;color:var(--blue);background:#eef5f9;border-radius:6px;justify-content:center;align-items:center;margin-bottom:18px;font-size:12px;font-weight:800;display:inline-flex}.feature-title,.share-step-body h4,.support-sub-title{color:#0f172a}.share-step{background:#fff}.share-step-num{background:#0f172a;border-radius:6px}.share-arrow{color:#94a3b8}.share-code-box{background:#f4f9fc;border:1px solid #9cc4d9;border-radius:8px}.share-copy-btn,.share-join-btn{border-radius:6px}.scenario-tab{border-width:1px;border-radius:8px}.scenario-content{border-width:1px}.scenario-badge{border-radius:6px}.support-section{background:#fff}.faq-item.open{border-color:var(--blue);box-shadow:0 8px 24px #0f6f9f1a}.faq-arrow{color:var(--blue)}.contact-card{background:#f8fafc;align-items:stretch}.contact-icon{border:1px solid var(--border);width:fit-content;color:var(--blue);background:#fff;border-radius:6px;padding:5px 9px;font-size:12px;font-weight:800}.contact-email-btn{background:#0f172a;width:fit-content;box-shadow:0 12px 28px #0f172a29}.download-section{background:#0f172a}.download-title{letter-spacing:0}.download-btn-main{color:#0f172a}.download-btn-ghost{border-width:1px}.site-footer{background:#0b1120}@media (width<=900px){.hero-content{grid-template-columns:1fr;gap:44px}.hero-proof,.hero-cta{justify-content:center}}@media (width<=600px){.hero-section{padding:92px 18px 56px}.hero-title{font-size:44px}.phone-frame,.hero-panel-caption{width:min(100%,300px)}}
