:root{--black:#1d1d1f;--paper:#fff;--lime:#ccff00;--coral:#ff375f;--lilac:#7d5cff;--sky:#2997ff;--yellow:#ffd60a;--blue:#0071e3;--line:rgba(0,0,0,.08)}
body{background:#fff;color:#1d1d1f;font-family:-apple-system,BlinkMacSystemFont,"SF Pro Display","SF Pro Text","Noto Sans KR",sans-serif;letter-spacing:-.02em}
.topbar{height:52px;padding:0 max(24px,calc((100vw - 1120px)/2));background:rgba(255,255,255,.82);box-shadow:none;border-bottom:1px solid rgba(0,0,0,.06);backdrop-filter:saturate(180%) blur(22px)}
.brand{font-size:20px;letter-spacing:-.04em}.brand-mark{width:26px;height:34px}.brand-mark img{width:32px;height:38px}.topbar nav{gap:28px;font-size:12px;font-weight:500}.login-btn{border:0;box-shadow:none;padding:8px 13px;font-size:12px}.login-btn:hover{transform:none;box-shadow:none;background:#f0f0f2}.creator-login{background:#0071e3;color:#fff}.creator-login:hover{background:#0077ed}
.live-hero{min-height:760px;background:#f5f5f7;grid-template-columns:1fr 1fr;padding:48px max(24px,calc((100vw - 1180px)/2));gap:28px;align-items:center;border:0}
.live-hero .hero-copy{padding:60px 26px}.live-hero .hero-copy:before{display:none}.live-hero h1{font-size:clamp(54px,6vw,88px);letter-spacing:-.07em}.live-hero h1 em{background:linear-gradient(100deg,#ff375f 0%,#bf5af2 42%,#0071e3 85%);-webkit-background-clip:text;background-clip:text;color:transparent;text-shadow:none}.live-hero .hero-sub{font-size:20px;color:#6e6e73;line-height:1.55}.live-hero .eyebrow{color:#6e6e73;letter-spacing:.05em}.live-dot{box-shadow:none}.live-hero .hero-art{min-height:650px;border-radius:36px;background:radial-gradient(circle at 46% 34%,#fff 0 5%,rgba(255,255,255,.78) 10%,transparent 28%),radial-gradient(circle at 20% 15%,#ff86a4,transparent 34%),radial-gradient(circle at 78% 22%,#72b5ff,transparent 38%),radial-gradient(circle at 52% 86%,#b389ff,transparent 45%),#e8e8ed;box-shadow:0 30px 80px rgba(70,45,130,.18);overflow:hidden}.live-hero .guardian{width:285px;opacity:.88}.live-hero .confetti{opacity:.22}.live-hero .spark{opacity:.65}.alert-burst,.ranking{border:0;border-radius:18px;box-shadow:0 14px 45px rgba(0,0,0,.16);backdrop-filter:blur(20px)}.alert-burst:after{border-radius:999px;border:0;box-shadow:0 7px 20px rgba(255,55,95,.3)}
.pop{border:0;background:#0071e3;box-shadow:none;padding:13px 22px}.pop:hover{transform:none;box-shadow:none;background:#0077ed}.circle-play{color:#0071e3}.circle-play i{border:0;background:#fff;box-shadow:0 3px 14px rgba(0,0,0,.1)}.trust-row{color:#6e6e73}.trust-row span:before{color:#34c759}
.ticker{background:#fff;color:#86868b;border:0;border-bottom:1px solid #e8e8ed;padding:13px 0}.ticker b{color:#0071e3}.section{padding:140px max(24px,calc((100vw - 1180px)/2))}.section .eyebrow,.feature-spec .eyebrow,.final-cta .eyebrow{color:#86868b;letter-spacing:.06em}.section h2,.feature-spec h2,.final-cta h2{letter-spacing:-.06em}.section-head>p{color:#6e6e73;font-size:18px}.round-link{width:auto;height:auto;border:0;border-radius:0;color:#0071e3;font-size:16px;display:block}.round-link:hover{text-decoration:underline}
.discover{background:#fff}.creator-grid{gap:24px}.creator-card{border:0;border-radius:28px;padding:12px;background:#f5f5f7;box-shadow:none;overflow:hidden}.creator-card:hover{transform:translateY(-5px);box-shadow:0 25px 60px rgba(0,0,0,.1)}.portrait{border:0;border-radius:20px;height:340px}.p1{background:linear-gradient(145deg,#d4ff79,#efffc3)}.p2{background:linear-gradient(145deg,#bfaaff,#ede8ff)}.p3{background:linear-gradient(145deg,#80dcff,#dff7ff)}.portrait span{background:rgba(29,29,31,.82);backdrop-filter:blur(12px);font-size:11px;padding:7px 11px}.viewer{background:rgba(255,255,255,.75);color:#1d1d1f;backdrop-filter:blur(12px)}.creator-info{padding:22px 10px 15px}.creator-info h3{font-size:24px}.heart{border:0;box-shadow:0 3px 15px rgba(0,0,0,.1)}.live-goal{border-top:1px solid rgba(0,0,0,.08);padding:14px 8px 7px}.live-goal b{color:#0071e3}
.ways{background:#000;color:#f5f5f7}.way-grid{border:0;gap:16px}.way-grid article{border:0;border-radius:26px;background:#1c1c1e;min-height:380px;padding:30px}.way-grid article:after{display:none}.way-grid article:hover{background:#242426}.way-icon{font-size:54px;color:#2997ff!important}.way-grid article:nth-child(2) .way-icon{background:linear-gradient(135deg,#ff375f,#ff9f0a);-webkit-background-clip:text;color:transparent!important}.way-grid article:nth-child(3) .way-icon{filter:saturate(.9)}.way-grid h3{font-size:25px}.way-grid p{font-size:15px;color:#a1a1a6}.way-grid article>b{color:#d2d2d7}
.overlay-lab{background:#f5f5f7;grid-template-columns:.9fr 1.1fr;gap:8vw}.overlay-copy>p:not(.eyebrow){color:#6e6e73}.url-box{border:0;border-radius:14px;box-shadow:0 12px 35px rgba(0,0,0,.08);padding:6px 6px 6px 16px}.url-box button{background:#0071e3;border-radius:10px}.overlay-checks{color:#6e6e73}.overlay-checks span:before{color:#34c759}.stream-preview{min-height:560px;border:0;border-radius:34px;background:radial-gradient(circle at 25% 15%,#9b8cff,transparent 40%),radial-gradient(circle at 80% 70%,#ff7898,transparent 38%),linear-gradient(145deg,#173080,#33205e);box-shadow:0 35px 80px rgba(43,35,109,.28)}.stream-person{background:linear-gradient(#ffd6e5,#ff85ad);box-shadow:0 0 80px rgba(255,255,255,.28)}.layer-alert{border:0;border-radius:18px;box-shadow:0 18px 50px rgba(0,0,0,.25)}.layer-rank{border:1px solid rgba(255,255,255,.18);border-radius:16px;background:rgba(20,18,33,.65)}
.steps{background:#fff}.step-tabs{background:#f5f5f7;border:0;padding:3px}.step-tabs button{color:#6e6e73}.step-tabs .active{background:#fff;color:#1d1d1f;box-shadow:0 2px 8px rgba(0,0,0,.09)}.step-list li{border-color:#d2d2d7;padding:40px 0}.step-list b{color:#0071e3}.step-list h3{font-size:28px}.step-list p{color:#6e6e73;font-size:17px}
.screens{background:#f5f5f7}.screen-tabs{justify-content:center;margin-bottom:28px}.screen-tabs button{border:0;background:#e8e8ed;color:#6e6e73}.screen-tabs .active{background:#1d1d1f;color:#fff}.browser-shell{border:0;border-radius:26px;overflow:hidden;box-shadow:0 35px 90px rgba(0,0,0,.14)}.browser-top{background:#fbfbfd}.demo-side{background:#1d1d1f}.demo-side a.active{color:#2997ff}.demo-head button{background:#0071e3;color:#fff}.demo-banner{border-radius:16px;background:linear-gradient(135deg,#7d5cff,#bf5af2)!important;color:#fff}.demo-card{border:0;border-radius:14px;background:#f5f5f7}.mini-avatar{background:#e8e8ed}
.feature-spec{padding:140px max(24px,calc((100vw - 1180px)/2));background:#fff;grid-template-columns:.65fr 1.35fr}.feature-spec>div>p:last-child{color:#6e6e73}.spec-columns{gap:18px}.spec-columns article{border:0;border-radius:24px;background:#f5f5f7;box-shadow:none;padding:28px}.spec-columns article:nth-child(2){background:linear-gradient(145deg,#edf5ff,#f3efff)}.spec-columns h3{font-size:23px}.spec-columns li{border-color:#d2d2d7;color:#424245;padding:12px 0}
.final-cta{background:#000;color:#f5f5f7;padding:140px 20px}.final-cta>img{filter:invert(1);opacity:.92}.final-cta h2{background:linear-gradient(90deg,#ff375f,#bf5af2,#2997ff);-webkit-background-clip:text;color:transparent}.final-cta>p:not(.eyebrow){color:#a1a1a6;font-size:18px}.final-cta .pill{border:0}.final-cta .pill.light{background:#0071e3;color:#fff}.final-cta .pill:not(.light){background:#2c2c2e;color:#fff}
footer{background:#f5f5f7;color:#424245;border-top:1px solid #d2d2d7;padding:45px max(24px,calc((100vw - 1120px)/2))}.inverse img{filter:none}footer>p{color:#86868b}
dialog{border:0;border-radius:24px;box-shadow:0 35px 100px rgba(0,0,0,.35)}dialog::backdrop{background:rgba(0,0,0,.35);backdrop-filter:blur(18px)}.login-dialog{background:#fff;border:0;box-shadow:0 35px 100px rgba(0,0,0,.3)}.login-badge{border:0;background:linear-gradient(135deg,#ff375f,#bf5af2);color:#fff}.social{border:0;border-radius:12px}.google{border:1px solid #d2d2d7}.login-dialog input{border:1px solid #d2d2d7;border-radius:12px}.login-dialog .pill{background:#0071e3;border:0}.amounts button{border:0;border-radius:10px;background:#f5f5f7}.amounts .active{background:#0071e3;color:white}#toast{background:rgba(29,29,31,.88);backdrop-filter:blur(16px);box-shadow:0 10px 35px rgba(0,0,0,.2)}
@media(max-width:900px){.live-hero{grid-template-columns:1fr;padding:28px 24px}.live-hero .hero-copy{padding:55px 4vw}.live-hero .hero-art{min-height:600px}}
@media(max-width:620px){.live-hero{padding:12px;gap:12px}.live-hero .hero-copy{padding:54px 10px}.live-hero h1{font-size:49px}.live-hero .hero-art{border-radius:26px}.topbar{padding:0 16px}}
