*{box-sizing:border-box}
:root{
  --bg:#080d14;--panel:#0d141e;--panel2:#111a26;--line:#202a38;--line2:#2a3646;
  --text:#f4f6f9;--muted:#8d9aad;--pink:#ff3b6b;--pink2:#ff5e87;--chip:#101925;
  --shadow:0 16px 40px rgba(0,0,0,.28);--safe-bottom:env(safe-area-inset-bottom,0px)
}
html{background:#050a10;scroll-behavior:smooth}
body{margin:0;background:#050a10;color:var(--text);font-family:Pretendard,"SUIT Variable",SUIT,"Noto Sans KR","Apple SD Gothic Neo","Malgun Gothic",system-ui,sans-serif;font-weight:500;letter-spacing:-.018em}
button,input,select{font:inherit}button{color:inherit;cursor:pointer}.svg-sprite{position:absolute;width:0;height:0;overflow:hidden}
svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.app-shell{position:relative;max-width:560px;min-height:100vh;margin:0 auto;background:var(--bg);padding-bottom:calc(82px + var(--safe-bottom));overflow:hidden;border-inline:1px solid rgba(255,255,255,.025)}
.topbar{position:sticky;top:0;z-index:40;height:62px;padding:0 14px 0 15px;display:flex;align-items:center;justify-content:space-between;background:rgba(8,13,20,.94);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.055)}
.brand{display:flex;align-items:center;border:0;background:none;padding:0;height:42px}.brand img{display:block;width:auto;height:37px;object-fit:contain}.top-actions{display:flex;align-items:center;gap:7px}
.icon-btn{width:36px;height:36px;border:1px solid var(--line);border-radius:10px;background:#0d151f;display:grid;place-items:center;color:#d6dce5}.icon-btn svg{width:18px;height:18px}.login-mini{height:36px;border:0;border-radius:9px;background:var(--pink);padding:0 12px;font-size:11px;font-weight:850;color:#fff}
main{padding:0 14px 18px}.page{display:none}.page.active{display:block}.hero{padding:23px 3px 18px;border-bottom:1px solid var(--line)}
.kicker{margin:0 0 7px;font-size:9px;letter-spacing:.14em;color:#6f7d91;font-weight:850}.hero h1{margin:0;font-size:27px;line-height:1.17;letter-spacing:-1.25px;font-weight:900}.hero h1 strong{color:var(--pink)}
.hero-copy{margin:9px 0 0;color:#9aa7b9;font-size:11.5px;line-height:1.6}.hero-foot{margin-top:14px;display:flex;align-items:center;justify-content:space-between;color:#708095;font-size:10px;font-weight:700}.hero-foot b{color:var(--pink)}.pulse-dot{width:7px;height:7px;border-radius:50%;background:var(--pink);box-shadow:0 0 0 5px rgba(255,59,107,.10),0 0 18px rgba(255,59,107,.55)}
.section{padding-top:18px}.section-head{display:flex;align-items:flex-end;justify-content:space-between;margin-bottom:10px}.section-head h2{font-size:18px;margin:0;font-weight:880;letter-spacing:-.7px}.section-head p{font-size:10px;color:var(--muted);margin:3px 0 0}.text-btn{border:0;background:none;color:#94a0b2;font-size:10px;font-weight:800;padding:7px 0}
.filter-pills{display:flex;gap:6px;margin:0 0 11px}.filter-pills button{height:28px;padding:0 12px;border:1px solid var(--line);border-radius:7px;background:var(--panel2);color:#8e9bad;font-size:10px;font-weight:800}.filter-pills button.active{background:var(--pink);border-color:var(--pink);color:#fff}
.live-grid{display:grid;grid-template-columns:1fr;gap:18px}.live-card{min-width:0}.thumb{position:relative;aspect-ratio:16/9;overflow:hidden;border:1px solid #1e2a38;border-radius:8px;background:linear-gradient(135deg,var(--c1),var(--c2));box-shadow:0 4px 15px rgba(0,0,0,.13)}
.thumb-art{position:absolute;inset:0;display:grid;place-items:center;font-size:44px;background:radial-gradient(circle at 30% 25%,rgba(255,255,255,.10),transparent 38%),linear-gradient(145deg,transparent 35%,rgba(0,0,0,.25));filter:saturate(.92)}
.live-badge{position:absolute;top:6px;left:6px;height:20px;padding:0 6px;border-radius:5px;background:#f02f56;display:flex;align-items:center;color:#fff;font-size:8px;font-weight:950;letter-spacing:.04em;box-shadow:0 5px 14px rgba(240,47,86,.25)}
.viewer-badge{position:absolute;top:6px;right:6px;height:20px;padding:0 6px;border-radius:5px;background:rgba(3,8,14,.72);backdrop-filter:blur(6px);display:flex;align-items:center;color:#fff;font-size:8px;font-weight:850}.viewer-badge::before{content:"";width:5px;height:5px;border-radius:50%;background:var(--pink);margin-right:4px}
.fav-float{position:absolute;right:6px;bottom:6px;width:29px;height:29px;border:1px solid rgba(255,255,255,.15);border-radius:8px;background:rgba(4,10,17,.68);backdrop-filter:blur(6px);display:grid;place-items:center;color:#fff}.fav-float svg{width:14px;height:14px}.fav-float.on{color:#ff5d87;border-color:rgba(255,93,135,.48);background:rgba(57,14,29,.76);fill:#ff5d87}.fav-float.on svg{fill:currentColor}
.card-body{padding:7px 2px 0}.card-title{margin:0;color:#f0f3f7;font-size:11.4px;line-height:1.38;min-height:31px;font-weight:790;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.channel{margin:4px 0 0;color:#8996a8;font-size:9.7px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.tags{margin-top:5px;display:flex;gap:4px;overflow:hidden}.tag{flex:0 0 auto;border-radius:5px;background:#111b28;color:#8390a1;padding:3px 6px;font-size:7.5px;font-weight:760}
.compact-banner{margin:24px 0 4px;padding:16px;border:1px solid #242f3e;border-radius:13px;background:radial-gradient(circle at 90% 20%,rgba(255,59,107,.12),transparent 40%),#0d151f;display:flex;justify-content:space-between;align-items:center;gap:12px}.compact-banner div{min-width:0}.compact-banner span{display:block;color:#ff6b91;font-size:8px;font-weight:900;letter-spacing:.12em}.compact-banner strong{display:block;margin-top:4px;font-size:13px}.compact-banner small{display:block;margin-top:4px;color:var(--muted);font-size:8.5px;line-height:1.45}.compact-banner button{flex:0 0 auto;height:34px;border:1px solid #3a4656;border-radius:8px;background:#141f2c;padding:0 11px;font-size:9px;font-weight:850}
.page-title{padding:22px 2px 14px}.page-title h1{font-size:25px;margin:0;font-weight:900;letter-spacing:-1px}.page-title p{font-size:10.5px;color:var(--muted);margin:5px 0 0;line-height:1.55}.toolbar{min-height:43px;display:flex;align-items:center;justify-content:space-between;border-top:1px solid var(--line);padding:10px 0 11px;margin-bottom:7px}.toolbar strong{font-size:13px;font-weight:850}.toolbar strong em{font-style:normal;color:var(--pink);margin-left:5px}.toolbar select{height:32px;border:1px solid var(--line);border-radius:7px;background:#101925;color:#a8b3c2;padding:0 25px 0 9px;font-size:9px;outline:none}
.explore-title{padding-bottom:10px}.category-rail{display:flex;gap:8px;overflow-x:auto;overflow-y:hidden;padding:2px 1px 12px;margin:0 -14px;padding-left:14px;padding-right:14px;scroll-snap-type:x proximity;scrollbar-width:none}.category-rail::-webkit-scrollbar{display:none}.category-card{position:relative;flex:0 0 auto;height:124px;width:auto;padding:0;border:0;border-radius:10px;background:transparent;overflow:hidden;scroll-snap-align:start}.category-card img{display:block;height:124px;width:auto;max-width:none;object-fit:contain;border-radius:10px}.category-card.active::after{content:"";position:absolute;inset:1px;border:2px solid var(--pink);border-radius:9px;box-shadow:0 0 0 1px rgba(255,59,107,.55),0 0 16px rgba(255,59,107,.28);pointer-events:none}.explore-toolbar{margin-top:2px}.explore-toolbar strong{font-size:14px}
.empty-state{display:none;margin:20px 0;padding:38px 20px;border:1px dashed #2b3746;border-radius:16px;text-align:center;color:#8e9aac}.empty-state.show{display:block}.empty-state svg{width:34px;height:34px;color:#657389}.empty-state strong{display:block;margin-top:11px;color:#d9dfe7;font-size:14px}.empty-state p{font-size:10px;line-height:1.55}.empty-state button{height:36px;border:0;border-radius:8px;background:var(--pink);color:#fff;padding:0 14px;font-size:10px;font-weight:850}
.account-card{margin-top:20px;padding:17px;border:1px solid #263242;border-radius:15px;background:radial-gradient(circle at 90% 10%,rgba(255,59,107,.13),transparent 38%),#0d151f;display:grid;grid-template-columns:46px 1fr;gap:11px}.avatar{width:46px;height:46px;border-radius:13px;background:linear-gradient(145deg,#ff3b6b,#8d315d);display:grid;place-items:center;font-weight:950;font-size:18px}.account-copy small{color:#ff7396;font-size:8px;font-weight:900;letter-spacing:.1em}.account-copy h1{margin:3px 0 0;font-size:17px}.account-copy p{margin:4px 0 0;color:var(--muted);font-size:9.5px;line-height:1.5}.pink-btn{grid-column:1/-1;height:38px;border:0;border-radius:9px;background:var(--pink);color:#fff;font-size:11px;font-weight:900}.my-menu{margin-top:14px;border:1px solid var(--line);border-radius:13px;overflow:hidden}.my-menu button{width:100%;height:49px;border:0;border-bottom:1px solid var(--line);background:#0d151f;display:flex;align-items:center;justify-content:space-between;padding:0 14px;font-size:11px}.my-menu button:last-child{border-bottom:0}.my-menu b{color:#8491a3;font-size:10px}.register-teaser{margin-top:16px;padding:18px;border:1px solid #2a3544;border-radius:14px;background:#0e1621}.register-teaser small{color:#ff6b91;font-size:8px;font-weight:900;letter-spacing:.12em}.register-teaser h2{font-size:15px;margin:5px 0 0}.register-teaser p{font-size:9.5px;color:var(--muted);line-height:1.55}.register-teaser button{height:34px;border:1px solid #3a4656;border-radius:8px;background:#151f2b;color:#fff;padding:0 12px;font-size:9px;font-weight:850}
.bottom-nav{position:fixed;left:50%;bottom:0;transform:translateX(-50%);z-index:50;width:min(560px,100%);height:calc(72px + var(--safe-bottom));padding:6px 7px var(--safe-bottom);display:grid;grid-template-columns:repeat(5,1fr);background:rgba(8,13,20,.97);backdrop-filter:blur(20px);border-top:1px solid #202a38}.bottom-nav button{position:relative;border:0;background:none;color:#6f7c8e;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px}.bottom-nav svg{width:20px;height:20px}.bottom-nav b{font-size:9px;font-weight:800}.bottom-nav button.active{color:#fff}.bottom-nav button.active::before{content:"";position:absolute;top:-6px;width:29px;height:3px;border-radius:0 0 5px 5px;background:var(--pink)}.bottom-nav button.active svg{color:var(--pink)}
.search-layer{position:fixed;z-index:80;inset:0;background:rgba(4,8,13,.96);padding:12px 14px}.search-layer[hidden]{display:none}.search-panel{max-width:560px;margin:0 auto}.search-input-wrap{height:48px;display:grid;grid-template-columns:20px 1fr 30px;gap:8px;align-items:center;border:1px solid #2b3746;border-radius:12px;background:#0f1722;padding:0 11px}.search-input-wrap svg{width:18px;height:18px;color:#8190a3}.search-input-wrap input{height:44px;border:0;outline:0;background:transparent;color:#fff;font-size:13px}.search-input-wrap button{border:0;background:none;color:#8592a5}.search-results{margin-top:14px}.search-results .live-grid{grid-template-columns:1fr}.search-results .live-card{display:grid;grid-template-columns:132px 1fr;gap:10px}.search-results .card-body{padding:2px 0}.search-results .card-title{font-size:12px}.search-results .thumb{width:132px}
.toast{position:fixed;left:50%;bottom:calc(83px + var(--safe-bottom));transform:translate(-50%,8px);z-index:90;background:#f4f6f9;color:#10151d;padding:9px 12px;border-radius:9px;font-size:9px;font-weight:900;opacity:0;pointer-events:none;transition:.18s}.toast.show{opacity:1;transform:translate(-50%,0)}
@media(max-width:370px){main{padding-inline:11px}.topbar{padding-inline:11px}.hero h1{font-size:24px}.live-grid{gap:16px}.card-title{font-size:10.8px}.category-rail{margin-inline:-11px;padding-inline:11px}.category-card,.category-card img{height:115px}}
@media(min-width:561px){.app-shell{box-shadow:0 0 50px rgba(0,0,0,.35)}}

/* v0.10: mobile hero + single-column feed */
.featured-section{padding-top:18px}
.featured-head{align-items:center}
.recommend-pill{height:25px;display:inline-flex;align-items:center;padding:0 10px;border-radius:999px;background:rgba(255,59,107,.12);border:1px solid rgba(255,59,107,.35);color:#ff6b91;font-size:9px;font-weight:900}
.featured-live{position:relative;border:1px solid #2b3545;border-radius:14px;overflow:hidden;background:#0d141e;box-shadow:0 14px 32px rgba(0,0,0,.24)}
.featured-live .thumb{border:0;border-radius:0;aspect-ratio:16/9;box-shadow:none}
.featured-live .thumb-art{font-size:68px}
.featured-live .live-badge{top:10px;left:10px;font-size:10px;padding:5px 7px}
.featured-live .viewer-badge{top:10px;right:10px;font-size:10px;padding:5px 8px}
.featured-live .fav-float{right:10px;bottom:10px;width:36px;height:36px}
.featured-copy{padding:13px 14px 14px}
.featured-copy h3{margin:0;font-size:17px;line-height:1.35;font-weight:900;letter-spacing:-.45px}
.featured-copy .channel{margin:7px 0 0;font-size:11px;color:#a6b1bf;font-weight:800}
.featured-copy .tags{margin-top:9px}
.home-live .live-card,.page:not(#page-home) .live-card{display:block}
.home-live .thumb,.page:not(#page-home) .thumb{border-radius:10px}
.home-live .card-title,.page:not(#page-home) .card-title{font-size:14px;line-height:1.35;margin-top:8px}
.home-live .channel,.page:not(#page-home) .channel{font-size:10.5px;margin-top:5px}
.home-live .tags,.page:not(#page-home) .tags{margin-top:7px}

/* v0.11: SOOP-inspired recommended LIVE carousel + larger mobile typography */
body{font-size:16px}
.topbar{height:68px}
.topbar .brand img{height:39px}
.icon-btn{width:40px;height:40px}
.icon-btn svg{width:22px;height:22px}
.login-mini{height:34px;padding:0 12px;font-size:11.5px}
.hero{padding-top:24px}
.hero .kicker{font-size:10px}
.hero h1{font-size:29px;line-height:1.22}
.hero-copy{font-size:12px;line-height:1.6}
.hero-foot{font-size:10.5px}
.section-head h2{font-size:17px}
.section-head p{font-size:10.5px}
.text-btn{font-size:10.5px}
.filter-pills button{font-size:10.5px;height:34px;padding:0 12px}
.recommend-pill{height:29px;padding:0 12px;font-size:10.5px}

.featured-carousel-shell{position:relative;padding:13px 10px 0;margin:0 -2px;overflow:visible}
.featured-carousel{position:relative;height:calc((min(100vw, 560px) - 48px) * .5625 + 145px);max-height:440px;min-height:320px;perspective:900px}
.featured-live{position:absolute;inset:0;transition:transform .38s cubic-bezier(.2,.75,.2,1),opacity .32s ease,filter .32s ease;transform-origin:center top}
.featured-live.is-active{z-index:3;transform:translateY(24px) scale(1);opacity:1;filter:none}
.featured-live.is-next{z-index:2;transform:translateY(12px) scale(.965);opacity:.72;filter:saturate(.82) brightness(.8)}
.featured-live.is-next-2{z-index:1;transform:translateY(0) scale(.925);opacity:.38;filter:saturate(.7) brightness(.65)}
.featured-live .thumb-art{font-size:74px}
.featured-live .live-badge{font-size:11px;min-height:25px;padding:0 8px}
.featured-live .viewer-badge{font-size:11px;min-height:25px;padding:0 9px}
.featured-live .fav-float{width:39px;height:39px}
.featured-live .fav-float svg{width:18px;height:18px}
.featured-copy{padding:14px 15px 15px}
.featured-copy h3{font-size:18px;line-height:1.4}
.featured-copy .channel{font-size:12.5px}
.featured-copy .tag{font-size:9.5px;padding:4px 7px}
.featured-carousel-meta{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:10px 3px 0}
.featured-dots{display:flex;align-items:center;gap:5px;min-width:0;overflow:hidden}
.featured-dot{width:6px;height:6px;padding:0;border:0;border-radius:999px;background:#3d4958;transition:.2s ease;flex:0 0 auto}
.featured-dot.active{width:18px;background:var(--pink)}
.featured-counter{display:flex;align-items:baseline;gap:3px;color:#748195;font-size:10px;font-weight:800;letter-spacing:.02em;flex:0 0 auto}
.featured-counter b{color:#fff;font-size:12px}
.featured-progress{height:2px;margin:8px 3px 0;border-radius:999px;background:#1b2634;overflow:hidden}
.featured-progress i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,var(--pink),#ff7a9d)}
.featured-progress i.running{animation:featuredProgress var(--featured-duration,10000ms) linear forwards}
@keyframes featuredProgress{from{width:0}to{width:100%}}

.card-title{font-size:13.2px;min-height:36px}
.channel{font-size:11.2px}
.tag{font-size:9px;padding:4px 7px}
.home-live .card-title,.page:not(#page-home) .card-title{font-size:15.5px;line-height:1.42}
.home-live .channel,.page:not(#page-home) .channel{font-size:12px}
.page-title h1{font-size:28px}
.page-title p{font-size:12px}
.toolbar strong,.explore-toolbar strong{font-size:15px}
.toolbar select{font-size:10.5px;height:35px}
.compact-banner span,.register-teaser small,.account-copy small{font-size:9.5px}
.compact-banner strong{font-size:14.5px}
.compact-banner small,.account-copy p,.register-teaser p{font-size:10.5px}
.compact-banner button,.register-teaser button{font-size:10.5px}
.empty-state strong{font-size:15.5px}
.empty-state p{font-size:11.5px}
.empty-state button{font-size:11px}
.account-copy h1{font-size:19px}
.pink-btn{font-size:12px}
.my-menu button{font-size:13px;height:54px}
.my-menu b{font-size:11.5px}
.register-teaser h2{font-size:17px}
.search-input-wrap input{font-size:14px}
.search-results .card-title{font-size:13.5px}
.toast{font-size:10.5px}

.app-shell{padding-bottom:calc(91px + var(--safe-bottom))}
.bottom-nav{height:calc(82px + var(--safe-bottom));padding:7px 5px var(--safe-bottom)}
.bottom-nav button{gap:6px}
.bottom-nav svg{width:25px;height:25px;stroke-width:1.9}
.bottom-nav b{font-size:11.5px;font-weight:850;letter-spacing:-.02em}
.bottom-nav button.active::before{top:-7px;width:34px;height:3px}
.toast{bottom:calc(94px + var(--safe-bottom))}

@media(max-width:370px){
  .hero h1{font-size:26px}
  .featured-carousel{min-height:282px}
  .featured-copy h3{font-size:16.5px}
  .home-live .card-title,.page:not(#page-home) .card-title{font-size:14.5px}
  .bottom-nav svg{width:23px;height:23px}
  .bottom-nav b{font-size:10.8px}
}

/* v0.12: real LIVON API thumbnails/data */
.live-card,.featured-live{cursor:pointer}
.thumb{background:#0c131d}
.thumb-fallback{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;background:linear-gradient(145deg,#151e2a,#0a1018);color:#6f7b8d}
.thumb-fallback span{font-size:10px;font-weight:900;letter-spacing:.14em;color:#ff5e87}
.thumb-fallback b{font-size:20px;font-weight:950;letter-spacing:-.04em;color:#d9e0e9}
.thumb-img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;display:block;background:#0b1119;transition:opacity .18s ease}
.thumb-img.is-broken{opacity:0}
.duration-badge{position:absolute;left:7px;bottom:7px;min-height:22px;padding:0 7px;border-radius:5px;background:rgba(3,8,14,.76);backdrop-filter:blur(5px);display:flex;align-items:center;color:#dfe5ed;font-size:9px;font-weight:800}
.live-card:active .thumb,.featured-live.is-active:active{transform:scale(.997)}
.data-empty{margin:0;min-height:190px;display:flex!important;flex-direction:column;justify-content:center;align-items:center;background:#0d141e;border-style:solid}
.featured-carousel .data-empty{position:absolute;inset:24px 0 auto;min-height:245px}
.featured-live .thumb-fallback b{font-size:28px}
.featured-live .thumb-img{z-index:1}
.featured-live .live-badge,.featured-live .viewer-badge,.featured-live .fav-float{z-index:3}
.featured-live .thumb-fallback{z-index:0}
.live-card .thumb-img{z-index:1}
.live-card .live-badge,.live-card .viewer-badge,.live-card .fav-float,.live-card .duration-badge{z-index:3}
.live-card .thumb-fallback{z-index:0}
.featured-live .duration-badge{z-index:3}

/* v0.13: MY screen reorganization */
#page-my{padding-bottom:8px}
.my-live-panel{margin-top:16px;padding:16px;border:1px solid var(--line);border-radius:15px;background:#0d151f}
.my-section-head{display:flex;align-items:flex-end;justify-content:space-between;gap:12px}
.my-section-head small{display:block;color:#ff6b91;font-size:9.5px;font-weight:900;letter-spacing:.12em}
.my-section-head h2{margin:4px 0 0;font-size:17px;line-height:1.35;font-weight:900;letter-spacing:-.45px}
.my-section-head h2 em{margin-left:5px;color:var(--pink);font-style:normal}
.my-link{flex:0 0 auto;border:0;background:none;color:#9aa6b8;padding:5px 0;font-size:10.5px;font-weight:850}
.my-live-rail{display:none;gap:10px;overflow-x:auto;overflow-y:hidden;margin:13px -16px -2px;padding:0 16px 4px;scroll-snap-type:x proximity;scrollbar-width:none}
.my-live-rail::-webkit-scrollbar{display:none}.my-live-rail.show{display:flex}
.my-live-card{flex:0 0 196px;min-width:0;scroll-snap-align:start;cursor:pointer}
.my-live-thumb{position:relative;aspect-ratio:16/9;overflow:hidden;border-radius:10px;background:#0a1119;border:1px solid #202b39}
.my-live-thumb .thumb-fallback,.my-live-thumb .thumb-img{position:absolute;inset:0}
.my-live-thumb .thumb-img{width:100%;height:100%;object-fit:cover}
.my-live-card h3{margin:7px 1px 0;font-size:12.5px;line-height:1.35;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-live-card p{margin:4px 1px 0;color:#8996a8;font-size:10.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.my-live-empty{display:none;margin-top:13px;padding:18px 14px;border-radius:11px;background:#101925;border:1px solid #202a38;text-align:left}
.my-live-empty.show{display:block}
.my-live-empty strong{display:block;font-size:13px;font-weight:850;color:#e7ebf1}
.my-live-empty p{margin:6px 0 12px;color:#8d9aad;font-size:10.5px;line-height:1.55}
.my-live-empty button{height:33px;border:1px solid #334153;border-radius:8px;background:#151f2b;color:#fff;padding:0 11px;font-size:10px;font-weight:850}
.my-group{margin-top:20px}.my-group-title{margin:0 2px 8px;font-size:13px;color:#a9b4c3;font-weight:850;letter-spacing:-.2px}
.my-menu-detail{margin-top:0}
.my-menu-detail button{height:auto;min-height:64px;display:grid;grid-template-columns:minmax(0,1fr) auto 12px;gap:8px;text-align:left;padding:10px 14px}
.my-menu-detail button>span{min-width:0;display:flex;flex-direction:column;gap:3px}
.my-menu-detail button strong{font-size:13.5px;line-height:1.3;font-weight:850;color:#f1f4f8}
.my-menu-detail button small{font-size:10.5px;line-height:1.4;color:#7f8c9e;font-weight:600}
.my-menu-detail button b{align-self:center;color:#9aa6b8;font-size:11px;font-weight:800;white-space:nowrap}
.my-menu-detail button i{align-self:center;color:#748297;font-size:17px;font-style:normal;line-height:1}
.my-menu-detail button:active{background:#111b27}
.my-settings-group{margin-top:14px}
#page-my .register-teaser{margin-top:20px}
#page-my .register-teaser p{margin:7px 0 13px}
#page-my .register-teaser button{height:36px}

@media(max-width:370px){
  .my-live-card{flex-basis:174px}
  .my-menu-detail button{min-height:61px;padding-inline:12px}
  .my-menu-detail button strong{font-size:13px}
  .my-menu-detail button small{font-size:10px}
}


/* v0.8.19: local watch history */
.history-page-title{display:flex;align-items:flex-end;justify-content:space-between;gap:14px}
.history-page-title>div{min-width:0}
.history-clear-btn{flex:0 0 auto;height:34px;border:1px solid #2c3949;border-radius:8px;background:#111a26;color:#9ba8b9;padding:0 11px;font-size:10.5px;font-weight:800}
.history-clear-btn:active{background:#172231}
.history-grid{padding-bottom:10px}
.history-badge{position:absolute;left:7px;top:7px;z-index:3;min-height:22px;padding:0 7px;border-radius:5px;background:rgba(9,15,23,.82);backdrop-filter:blur(5px);display:flex;align-items:center;color:#dbe2eb;font-size:9px;font-weight:850}
.history-meta{display:flex;align-items:center;gap:7px;margin-top:6px;color:#7f8c9e;font-size:10.5px;font-weight:650}
.history-meta span+span::before{content:"·";margin-right:7px;color:#526174}
@media(max-width:370px){.history-clear-btn{font-size:10px;padding-inline:9px}}

/* v0.8.20 Google account state */
.avatar.signed-in{overflow:hidden;background:#111b27;border:1px solid #2c3949}.avatar.signed-in img{width:100%;height:100%;object-fit:cover;display:block}.login-mini.logged-in{display:flex;align-items:center;gap:6px;padding:0 9px;background:#111b27;border:1px solid #2d3948}.login-mini.logged-in img{width:22px;height:22px;border-radius:50%;object-fit:cover}.login-mini.logged-in span{font-size:10.5px;font-weight:900}.account-card .pink-btn{transition:opacity .15s}.account-card .pink-btn:active{opacity:.82}


/* v0.8.22 account favorites */
.favorite-offline-card{position:relative;display:grid;grid-template-columns:112px minmax(0,1fr) 38px;align-items:center;gap:12px;padding:10px;border:1px solid var(--line);border-radius:14px;background:var(--panel);min-height:88px}.favorite-offline-card[role="link"]{cursor:pointer}.favorite-offline-card:hover{background:var(--panel2)}.favorite-offline-thumb{position:relative;width:112px;aspect-ratio:16/9;overflow:hidden;border-radius:10px;background:#101722;border:1px solid var(--line);display:grid;place-items:center}.favorite-offline-thumb img{width:100%;height:100%;object-fit:cover;opacity:.5}.favorite-offline-thumb>span{font-weight:950;font-size:22px;color:var(--pink)}.favorite-offline-thumb>b{position:absolute;left:6px;bottom:6px;padding:3px 6px;border-radius:5px;background:rgba(0,0,0,.72);color:#aab4c1;font-size:9px;letter-spacing:.04em}.favorite-offline-copy{min-width:0}.favorite-offline-copy strong{display:block;font-size:15px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.favorite-offline-copy small{display:block;margin-top:5px;color:var(--muted);font-size:12px}.favorite-offline-remove{position:static!important;justify-self:end;align-self:center}.favorite-offline-card .fav-float{width:36px;height:36px}.favorite-offline-card .fav-float svg{width:18px;height:18px}


/* v0.8.26 account LIVE alert settings */
.alert-page-title{padding-bottom:4px}.alert-back{display:inline-flex;align-items:center;height:28px;margin:0 0 8px;padding:0;border:0;background:transparent;color:#9aa6b8;font-size:11px;font-weight:850}.mobile-alert-master{margin-top:18px;padding:15px 14px;border:1px solid var(--line);border-radius:14px;background:#0d151f;display:flex;align-items:center;justify-content:space-between;gap:14px}.mobile-alert-master>div{min-width:0}.mobile-alert-master strong{display:block;font-size:14px;color:#f2f5f8}.mobile-alert-master small{display:block;margin-top:4px;color:#7f8c9e;font-size:10.5px;line-height:1.45}.mobile-toggle{position:relative;flex:0 0 auto;width:44px;height:24px;padding:0;border:1px solid #334153;border-radius:999px;background:#17202c}.mobile-toggle i{position:absolute;top:3px;left:3px;width:16px;height:16px;border-radius:50%;background:#8290a2;transition:.15s}.mobile-toggle.on{border-color:rgba(255,59,107,.62);background:rgba(255,59,107,.2)}.mobile-toggle.on i{left:23px;background:var(--pink)}.alert-mobile-summary{display:flex;align-items:center;justify-content:space-between;padding:18px 2px 8px}.alert-mobile-summary strong{font-size:12px;color:#f1f4f8}.alert-mobile-summary span{font-size:10px;color:#7f8c9e}.mobile-alert-list{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#0d151f}.mobile-alert-row{display:grid;grid-template-columns:62px minmax(0,1fr) auto;align-items:center;gap:10px;padding:10px;border-bottom:1px solid var(--line)}.mobile-alert-row:last-child{border-bottom:0}.mobile-alert-thumb{width:62px;aspect-ratio:16/9;border-radius:8px;overflow:hidden;border:1px solid #253244;background:#111923;display:grid;place-items:center}.mobile-alert-thumb img{width:100%;height:100%;object-fit:cover}.mobile-alert-thumb span{color:var(--pink);font-weight:950}.mobile-alert-copy{min-width:0}.mobile-alert-copy strong{display:block;font-size:12.5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.mobile-alert-copy small{display:block;margin-top:4px;font-size:9.5px;color:#7f8c9e}.mobile-alert-copy small.live-now{color:#ff6b91}.mobile-alert-row .mobile-toggle{width:42px;height:23px}.mobile-alert-row .mobile-toggle i{width:15px;height:15px}.mobile-alert-row .mobile-toggle.on i{left:22px}.mobile-alert-empty{padding:30px 14px;text-align:center;color:#7f8c9e;font-size:11px;line-height:1.6}


/* v0.8.30 LIVON latest compact logo */
.topbar .brand{
  flex:0 0 auto;
  width:132px;
  height:48px;
  display:flex;
  align-items:center;
  justify-content:flex-start;
  overflow:visible;
  background:transparent!important;
}
.topbar .brand img{
  display:block;
  width:100%;
  height:40px;
  max-width:132px;
  object-fit:contain;
  object-position:left center;
  background:transparent!important;
}
@media(max-width:390px){
  .topbar .brand{width:116px}
  .topbar .brand img{max-width:116px;height:37px}
}

/* ==========================================================
   v0.8.31 — mobile uses the same approved infinity LIVON logo
   ========================================================== */
.topbar .brand{
  flex:0 0 auto!important;
  width:128px!important;
  height:48px!important;
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  overflow:visible!important;
  background:transparent!important;
  border:0!important;
  padding:0!important;
}
.topbar .brand img{
  display:block!important;
  width:124px!important;
  height:42px!important;
  max-width:124px!important;
  max-height:42px!important;
  object-fit:contain!important;
  object-position:left center!important;
  margin:0!important;
  padding:0!important;
  background:transparent!important;
  border:0!important;
  box-shadow:none!important;
}
@media(max-width:390px){
  .topbar .brand{width:116px!important;height:46px!important}
  .topbar .brand img{width:112px!important;height:39px!important;max-width:112px!important;max-height:39px!important}
}


/* ==========================================================
   v0.8.32 — TRUE /mobile LAYOUT
   This stylesheet is used only by /mobile. Desktop / never
   switches into this layout.
   ========================================================== */
.app-shell{
  width:100%!important;
  max-width:480px!important;
  min-width:0!important;
  margin:0 auto!important;
  overflow:hidden!important;
  padding-bottom:calc(96px + var(--safe-bottom))!important;
}
.topbar{height:64px!important;padding:0 13px!important}
.topbar .brand{
  width:150px!important;height:42px!important;max-width:150px!important;
  display:flex!important;align-items:center!important;justify-content:flex-start!important;
  overflow:visible!important;background:transparent!important;
}
.topbar .brand img{
  width:150px!important;height:42px!important;max-width:150px!important;max-height:42px!important;
  object-fit:contain!important;object-position:left center!important;margin:0!important;padding:0!important;
}
.bottom-nav{
  width:min(480px,100%)!important;
  height:calc(78px + var(--safe-bottom))!important;
  padding:7px 5px var(--safe-bottom)!important;
}
.search-panel{max-width:480px!important}
.featured-carousel{
  height:calc((min(100vw, 480px) - 48px) * .5625 + 132px)!important;
  min-height:292px!important;
  max-height:392px!important;
}
.featured-live.is-active{transform:translateY(20px) scale(1)!important}
.featured-live.is-next{transform:translateY(10px) scale(.965)!important}
.featured-live.is-next-2{transform:translateY(0) scale(.925)!important}
main{padding-bottom:24px!important}
@media(max-width:390px){
  .topbar .brand{width:138px!important;max-width:138px!important;height:40px!important}
  .topbar .brand img{width:138px!important;max-width:138px!important;height:40px!important;max-height:40px!important}
  .featured-carousel{min-height:278px!important}
}
@media(max-width:350px){
  .topbar .brand{width:126px!important;max-width:126px!important}
  .topbar .brand img{width:126px!important;max-width:126px!important}
  .icon-btn{width:36px!important;height:36px!important}
  .login-mini{padding-inline:9px!important}
}
/* v0.8.33-B operating/legal links */
.legal-mobile-menu a{min-height:58px;width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;text-decoration:none;color:inherit;padding:0 15px;border-bottom:1px solid #1d2734;background:transparent}.legal-mobile-menu a:last-child{border-bottom:0}.legal-mobile-menu a span{display:grid;gap:2px}.legal-mobile-menu a strong{font-size:13px;color:#eef3f9}.legal-mobile-menu a small{font-size:10px;color:#738196}.legal-mobile-menu a i{font-size:21px;color:#68778b;font-style:normal}.legal-mobile-menu em{font-size:8px;font-style:normal;color:#ff7899;border:1px solid #6b3043;border-radius:999px;padding:2px 5px;margin-left:5px;vertical-align:1px}.mobile-legal-links{display:flex;flex-wrap:wrap;gap:7px 12px;padding:13px 4px 2px;color:#647286;font-size:9px}.mobile-legal-links a{color:#8d9bad;text-decoration:none}.mobile-legal-links span{width:100%}


/* v0.8.34.1 — all mobile Explore category cards use exactly one size. */
.category-rail .category-card{width:96px!important;min-width:96px!important;max-width:96px!important;height:124px!important;min-height:124px!important;max-height:124px!important;background:#0d1520!important}
.category-rail .category-card img{width:100%!important;min-width:100%!important;max-width:100%!important;height:100%!important;min-height:100%!important;max-height:100%!important;object-fit:cover!important;object-position:center center!important}
@media(max-width:370px){
  .category-rail .category-card{width:89px!important;min-width:89px!important;max-width:89px!important;height:115px!important;min-height:115px!important;max-height:115px!important}
}

/* v0.8.35 account deletion */
body.account-sheet-open{overflow:hidden}.mobile-account-modal[hidden]{display:none}.mobile-account-modal{position:fixed;inset:0;z-index:200}.mobile-account-backdrop{position:absolute;inset:0;background:rgba(2,6,11,.72);backdrop-filter:blur(5px)}.mobile-account-sheet{position:absolute;left:50%;bottom:0;transform:translateX(-50%);width:min(480px,100%);max-height:88vh;overflow:auto;border:1px solid #293545;border-bottom:0;border-radius:20px 20px 0 0;background:#0c131c;padding:18px 17px calc(22px + env(safe-area-inset-bottom));box-shadow:0 -22px 60px rgba(0,0,0,.48)}.mobile-account-head{display:flex;justify-content:space-between;align-items:flex-start}.mobile-account-head small{color:#ff6b91;font-size:8px;font-weight:900;letter-spacing:.12em}.mobile-account-head h2{margin:4px 0 0;font-size:19px}.mobile-account-head>button{width:34px;height:34px;border:1px solid var(--line);border-radius:9px;background:#111b27;color:#fff}.mobile-account-profile{display:flex;align-items:center;gap:11px;margin-top:18px;padding:13px;border:1px solid var(--line);border-radius:12px;background:#0e1721}.mobile-account-profile>div{width:44px;height:44px;border-radius:12px;display:grid;place-items:center;overflow:hidden;background:linear-gradient(145deg,#ff3b6b,#7d2a57);font-weight:900}.mobile-account-profile img{width:100%;height:100%;object-fit:cover}.mobile-account-profile span strong,.mobile-account-profile span small{display:block}.mobile-account-profile span strong{font-size:12px}.mobile-account-profile span small{margin-top:4px;color:var(--muted);font-size:9px}.mobile-delete-note{margin-top:12px;padding:13px;border:1px solid var(--line);border-radius:12px;background:#0e1721}.mobile-delete-note strong{font-size:11px}.mobile-delete-note p{margin:7px 0 0;font-size:10px;line-height:1.55}.mobile-delete-note small{display:block;margin-top:7px;color:var(--muted);font-size:9px;line-height:1.5}.mobile-account-logout,.mobile-delete-start{width:100%;height:42px;margin-top:10px;border-radius:10px;font-size:11px;font-weight:900}.mobile-account-logout{border:1px solid var(--line);background:#121d29;color:#fff}.mobile-delete-start{border:1px solid #6e2d41;background:#22131a;color:#ff7899}.mobile-delete-confirm{margin-top:12px;padding:13px;border:1px solid #7a2f44;border-radius:12px;background:#211118}.mobile-delete-confirm>strong{font-size:11px;color:#ff7899}.mobile-delete-confirm p{margin:6px 0 11px;color:var(--muted);font-size:9.5px;line-height:1.5}.mobile-delete-confirm label{font-size:9.5px}.mobile-delete-confirm input{width:100%;height:39px;margin-top:6px;border:1px solid #633347;border-radius:9px;background:#090f16;color:#fff;padding:0 11px}.mobile-delete-confirm>div{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:10px}.mobile-delete-confirm button{height:38px;border-radius:9px;border:1px solid var(--line);background:#121d29;color:#fff;font-size:10px;font-weight:850}#mobileDeleteFinal{border-color:#a52e4f;background:#a52e4f}#mobileDeleteFinal:disabled{opacity:.4}


/* v0.8.36 YouTube API branding attribution */
.youtube-source-strip{height:34px;display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:0 14px;border-bottom:1px solid var(--line);background:var(--bg);color:var(--muted);font-size:7px;font-weight:800;letter-spacing:.09em}.youtube-source-strip>a{display:inline-flex;align-items:center;text-decoration:none;border-radius:6px;padding:2px 4px}.youtube-source-strip>a:active{background:var(--panel2)}.yt-mobile-brand{display:block;width:94px;height:auto}.yt-mobile-on-light{display:none}html[data-theme="light"] .yt-mobile-on-dark{display:none}html[data-theme="light"] .yt-mobile-on-light{display:block}@media(max-width:380px){.youtube-source-strip{height:31px;padding:0 11px}.yt-mobile-brand{width:86px}.youtube-source-strip>span{display:none}}


/* ==========================================================
   v0.8.39.2 — MOBILE LIVE PREVIEW
   - 추천 LIVE: 활성 카드 썸네일 안에서 무음 자동 미리보기
   - 일반 LIVE: 길게 누르는 동안 손가락을 가리지 않게 떠 있는 16:9 미리보기
   ========================================================== */
.mobile-featured-preview-frame{
  position:absolute;inset:0;z-index:2;width:100%;height:100%;border:0;background:#000;display:block;pointer-events:none
}
.featured-live .thumb.mobile-featured-previewing{background:#000}
.featured-live .thumb.mobile-featured-previewing>.thumb-img{opacity:0!important}
.featured-live .thumb.mobile-featured-previewing>.thumb-fallback{opacity:0}
.mobile-float-preview{
  position:fixed;z-index:180;overflow:hidden;border:1px solid rgba(255,255,255,.22);border-radius:12px;background:#000;
  box-shadow:0 18px 52px rgba(0,0,0,.62),0 0 0 1px rgba(255,59,107,.18);
  pointer-events:none;animation:mobilePreviewPop .12s ease-out both
}
.mobile-float-preview-frame{width:100%;height:100%;border:0;background:#000;display:block;pointer-events:none}
@keyframes mobilePreviewPop{from{opacity:0;transform:translateY(5px) scale(.985)}to{opacity:1;transform:translateY(0) scale(1)}}

/* Fixed search overlay owns its scroll area; retain result limits. */
.search-layer{overflow-y:auto;overscroll-behavior:contain}
#moreSearchResults{display:block;margin:16px auto;padding:12px 24px;border:1px solid #405572;border-radius:8px;background:#172638;color:#fff}