:root{--bg:#f3f6f3;--paper:#fff;--ink:#17201b;--muted:#737d76;--line:#e1e7e2;--green:#267451;--deep:#173f30;--soft:#e5f2ea;--lime:#d9f59e;--red:#cf5656;--amber:#fff0d2}
*[hidden]{display:none!important}
*{box-sizing:border-box}html{background:#dce3de}body{margin:0;font-family:Pretendard,"Noto Sans KR",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:var(--ink);background:#dce3de}button,input,select{font:inherit}.phone{width:100%;max-width:430px;min-height:100vh;margin:auto;position:relative;overflow:hidden;background:var(--bg);box-shadow:0 0 50px #203b2b20}.status{height:26px;padding:5px 16px 0;background:var(--deep);color:#fff;display:flex;justify-content:space-between;font-size:11px;font-weight:700}.screen{display:none;padding:0 16px 92px}.screen.active{display:block}.hero,.top{height:66px;margin:0 -16px 16px;padding:0 18px;display:flex;align-items:center;justify-content:space-between;background:var(--paper);border-bottom:1px solid var(--line)}.hero{background:var(--deep);color:#fff;border:0}.brand{display:flex;align-items:center;gap:10px}.brand>b{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--lime);color:var(--deep);font-size:12px}.brand span,.top span{display:grid;gap:3px}.brand strong,.top strong{font-size:20px}.brand small{color:#c1d4c8}.brand small,.top small{font-size:10px}.top small,.muted{color:var(--muted)}.icon{border:0;background:transparent;color:inherit;font-size:22px}.search{height:52px;padding:0 8px 0 14px;margin:14px 0;display:flex;align-items:center;gap:9px;border:1px solid var(--line);border-radius:16px;background:var(--paper);box-shadow:0 7px 20px #1d3d2b0f}.search span{font-size:20px}.search input{min-width:0;flex:1;border:0;outline:0;background:transparent}.search button{border:0;border-radius:11px;padding:9px 13px;background:var(--green);color:#fff;font-size:11px;font-weight:800}.tabs,.chips{display:flex;gap:7px;overflow:auto;scrollbar-width:none}.tabs{margin:0 -16px;padding:0 16px 12px;border-bottom:1px solid var(--line)}.tabs button,.chips button{border:0;white-space:nowrap;background:transparent;color:var(--muted);font-size:11px}.tabs button{padding:8px 4px;font-weight:700}.tabs button.active{color:var(--green)}.chips{padding:13px 0}.chips button{padding:8px 12px;border-radius:20px;background:#e7ece8}.chips button.active{background:var(--ink);color:#fff}.heading{display:flex;align-items:end;justify-content:space-between;margin:10px 1px 12px}.heading h1,.heading h2{margin:0;font-size:17px}.heading h2{font-size:14px}.heading small{color:var(--muted);font-size:9px}.list{display:grid;gap:10px}.loading,.empty{padding:58px 15px;text-align:center;color:var(--muted);font-size:11px}.trend-row,.shop-row,.saved-row{display:grid;align-items:center;gap:11px;padding:14px;border:1px solid var(--line);border-radius:16px;background:var(--paper);cursor:pointer}.trend-row{grid-template-columns:32px 1fr auto}.shop-row{grid-template-columns:26px 1fr auto}.saved-row{grid-template-columns:1fr auto}.rank{font-weight:800;text-align:center;color:#929c95}.copy strong,.copy small{display:block}.copy strong{font-size:14px}.copy small{margin-top:5px;color:var(--muted);font-size:9px}.delta{text-align:right;color:var(--green);font-size:11px;font-weight:800}.delta small{display:block;margin-top:5px;padding:4px 7px;border-radius:12px;background:var(--soft);font-size:8px}.delta.down{color:var(--red)}.delta.down small{background:#fae9e9}.signal{margin-top:14px;padding:17px;border-radius:16px;background:var(--deep);color:#fff}.signal small{color:var(--lime);font-size:8px;font-weight:800;letter-spacing:.1em}.signal strong{display:block;margin:8px 0;font-size:14px}.signal p{margin:0;color:#c3d3ca;font-size:10px;line-height:1.5}.select{width:100%;padding:13px;border:1px solid var(--line);border-radius:13px;background:var(--paper);color:var(--ink)}.summary,.metrics{display:grid;grid-template-columns:repeat(2,1fr);gap:9px}.summary article,.metrics article{padding:13px;border:1px solid var(--line);border-radius:14px;background:var(--paper)}.summary small,.summary strong,.summary em,.metrics small,.metrics strong,.metrics em{display:block}.summary small,.metrics small{color:var(--muted);font-size:9px}.summary strong,.metrics strong{margin-top:6px;font-size:17px}.summary em,.metrics em{margin-top:4px;color:var(--green);font-size:8px;font-style:normal}.disclaimer{color:var(--muted);font-size:9px;line-height:1.5}.minor{margin-top:20px;font-size:12px}.recent{display:flex;gap:7px;flex-wrap:wrap}.recent button{padding:8px 11px;border:1px solid var(--line);border-radius:20px;background:var(--paper);color:var(--muted);font-size:10px}.empty i{display:grid;place-items:center;width:66px;height:66px;margin:auto;border-radius:22px;background:var(--soft);color:var(--green);font-size:28px;font-style:normal}.empty h1{margin:16px 0 7px;color:var(--ink);font-size:17px}.empty p{line-height:1.6}.notice{margin-bottom:12px;padding:12px;border-radius:13px;background:var(--amber);color:#755016;font-size:10px}.bottom{position:absolute;z-index:10;left:0;right:0;bottom:0;height:74px;padding:8px;background:#fffffff7;border-top:1px solid var(--line);display:grid;grid-template-columns:repeat(4,1fr)}.bottom button{border:0;background:transparent;color:#89938c;font-size:9px;display:grid;place-items:center;gap:2px}.bottom b{font-size:19px;font-weight:400}.bottom button.active{color:var(--green);font-weight:800}.detail{display:none;position:absolute;z-index:20;inset:26px 0 0;overflow:auto;background:var(--bg)}.detail.open{display:block}.detail>header{height:60px;padding:0 10px;position:sticky;top:0;z-index:2;background:var(--paper);border-bottom:1px solid var(--line);display:grid;grid-template-columns:40px 1fr 40px;place-items:center}.detail>header button{border:0;background:transparent;font-size:21px}.detail-body{padding:18px 16px 40px}.detail-body>h1{margin:9px 0 5px;font-size:24px}.badge{padding:5px 8px;border-radius:11px;background:var(--soft);color:var(--green);font-size:9px;font-weight:800}.metrics{grid-template-columns:repeat(3,1fr);margin-top:16px}.chart-box{margin:12px 0;padding:15px;border:1px solid var(--line);border-radius:16px;background:var(--paper)}#chart{width:100%;height:180px}.chart-grid{stroke:#e7ece8}.chart-fill{fill:var(--soft)}.chart-line{fill:none;stroke:var(--green);stroke-width:3;stroke-linejoin:round;stroke-linecap:round}.chart-dot{fill:#fff;stroke:var(--green);stroke-width:3}.chart-label{fill:var(--muted);font-size:9px}.chart-box>p{margin:7px 0 0;color:var(--muted);font-size:9px;line-height:1.5}.related,.news{padding:12px 1px;border-bottom:1px solid var(--line);display:grid;grid-template-columns:1fr auto;gap:10px}.related strong,.related small,.news strong,.news small{display:block}.related strong,.news strong{font-size:12px}.related small,.news small{margin-top:4px;color:var(--muted);font-size:9px}.related span{font-size:11px;font-weight:800}.news{grid-template-columns:1fr}.news a{color:inherit;text-decoration:none}.toast{position:absolute;z-index:30;left:16px;right:16px;bottom:82px;padding:12px;border-radius:12px;background:var(--ink);color:#fff;text-align:center;font-size:10px;opacity:0;transform:translateY(8px);pointer-events:none;transition:.2s}.toast.show{opacity:1;transform:none}
.category-selects{display:grid;gap:8px}.category-selects .select:disabled{opacity:.55}.shopping-chart-box{margin-top:2px}.shopping-chart-box svg{width:100%;height:180px}.audience-section{margin:4px 0 14px}.distribution-cards{display:grid;gap:9px}.distribution{padding:14px;border:1px solid var(--line);border-radius:15px;background:var(--paper)}.distribution>strong{display:block;margin-bottom:10px;font-size:12px}.distribution>small{color:var(--muted);font-size:9px}.distribution>div{display:grid;grid-template-columns:48px 1fr 30px;gap:8px;align-items:center;margin:7px 0;font-size:9px}.distribution i{height:7px;overflow:hidden;border-radius:5px;background:#e8ede9}.distribution b{display:block;height:100%;border-radius:5px;background:var(--green)}.distribution em{text-align:right;color:var(--green);font-style:normal;font-weight:800}.loading.compact{padding:24px 12px}
.copy small.competition{display:inline-block;margin-top:7px;padding:3px 7px;border-radius:10px;font-size:8px;font-weight:800}.competition.high{background:#fbe8e8;color:#b34747}.competition.medium{background:#fff2d8;color:#946814}.competition.low{background:var(--soft);color:var(--green)}
.activity-card{margin:11px 0;padding:15px;border:1px solid var(--line);border-radius:16px;background:var(--paper)}.activity-card .heading{margin:0 0 12px}.activity-values{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.activity-values>div{min-width:0;padding:10px 7px;border-radius:12px;background:var(--soft);text-align:center}.activity-values span,.activity-values b,.activity-values small{display:block}.activity-values span{color:var(--muted);font-size:8px}.activity-values b{margin-top:6px;color:var(--green);font-size:12px}.activity-values small{margin-top:4px;color:var(--muted);font-size:7px;line-height:1.35}.activity-card>p{margin:10px 1px 0;color:var(--muted);font-size:8px;line-height:1.5}.content-tabs{display:flex;gap:7px;margin-bottom:10px}.content-tabs button{flex:1;padding:9px 6px;border:0;border-radius:12px;background:#e7ece8;color:var(--muted);font-size:9px;font-weight:800}.content-tabs button.active{background:var(--ink);color:#fff}.content-total{margin:0 0 8px;color:var(--muted);font-size:9px}
.content-more{width:100%;margin-top:12px;padding:12px;border:1px solid var(--line);border-radius:13px;background:var(--paper);color:var(--green);font-size:10px;font-weight:800}
.eyebrow{margin:0 0 7px;color:var(--green);font-size:8px;font-weight:900;letter-spacing:.12em}.signal-card{margin:16px 0 11px;padding:18px;border-radius:18px;background:var(--deep);color:#fff}.signal-card>small{color:#b9cfc2;font-size:9px}.signal-card>strong{display:block;margin:7px 0 12px;font-size:21px}.signal-basis{display:grid;margin-bottom:13px;border-top:1px solid #ffffff1c}.signal-basis>div{display:grid;grid-template-columns:76px 1fr;gap:5px 10px;padding:9px 0;border-bottom:1px solid #ffffff12}.signal-basis span{color:#a9c1b4;font-size:8px}.signal-basis b{font-size:9px;line-height:1.45}.signal-basis small{grid-column:2;color:#8fa99a;font-size:7px}.signal-tags{display:flex;gap:6px;flex-wrap:wrap}.signal-tags span{padding:5px 8px;border-radius:12px;background:#ffffff14;color:var(--lime);font-size:8px;font-weight:800}.detail-actions{display:grid;gap:9px;margin-top:15px}.detail-actions button{width:100%;padding:14px;border:1px solid var(--line);border-radius:15px;background:var(--paper);display:grid;grid-template-columns:34px 1fr 18px;gap:10px;align-items:center;text-align:left;color:var(--ink)}.detail-actions i{display:grid;place-items:center;width:34px;height:34px;border-radius:11px;background:var(--soft);color:var(--green);font-style:normal;font-weight:900}.detail-actions span strong,.detail-actions span small{display:block}.detail-actions span strong{font-size:12px}.detail-actions span small{margin-top:4px;color:var(--muted);font-size:9px}.detail-actions b{text-align:right;color:#9aa39d;font-size:20px}.signal-disclaimer{margin:15px 3px}.detail-subview[hidden],.detail-summary[hidden]{display:none}.subview-back{padding:0;border:0;background:transparent;color:var(--green);font-size:11px;font-weight:800}.subview-heading{margin-top:18px}.subview-heading h1{font-size:22px}.related-summary{margin-bottom:7px;padding:10px 12px;border-radius:12px;background:var(--soft);color:var(--green);font-size:9px}.detail-subview .related{grid-template-columns:27px 1fr auto;align-items:center}.detail-subview .related>b{font-size:10px}.detail-subview .related>em{color:var(--green);font-size:11px;font-style:normal;font-weight:900}
.chart-controls{display:grid;gap:8px;margin-bottom:8px}.chart-period,.chart-unit{display:grid;gap:5px}.chart-period{grid-template-columns:repeat(4,1fr)}.chart-unit{grid-template-columns:repeat(3,1fr)}.chart-controls button{padding:8px 3px;border:1px solid var(--line);border-radius:10px;background:#fff;color:var(--muted);font-size:9px;font-weight:700}.chart-controls button.active{border-color:var(--deep);background:var(--deep);color:#fff}.chart-custom{display:grid;grid-template-columns:1fr auto 1fr auto;gap:5px;align-items:center}.chart-custom[hidden]{display:none}.chart-custom input{min-width:0;padding:7px 4px;border:1px solid var(--line);border-radius:9px;background:#fff;color:var(--ink);font-size:8px}.chart-custom span{color:var(--muted);font-size:9px}.chart-axis{fill:var(--muted);font-size:8px;font-weight:700}
.detail{inset:0}.detail>header{top:0}@media(min-width:431px){.phone{min-height:850px;height:calc(100vh - 36px);margin:18px auto;border-radius:30px}.screen{height:calc(100vh - 36px);overflow:auto}.detail{border-radius:30px}}
.brand-logo{display:block;width:38px;height:38px;border-radius:11px;object-fit:cover;box-shadow:0 4px 12px #071d1438}
.trend-category{padding:12px 0 0}.trend-category .select{padding:10px 13px;font-size:11px}.pager{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:12px;margin:18px 0}.pager button{padding:10px;border:1px solid var(--line);border-radius:12px;background:var(--paper);color:var(--green);font-size:10px;font-weight:800}.pager button:disabled{opacity:.4}.pager span{color:var(--muted);font-size:9px;white-space:nowrap}
.trend-row[href]{color:inherit;text-decoration:none}
.trend-row.news-result{display:block;min-width:0}.news-result>strong,.news-result>small{display:block}.news-result>strong{width:100%;font-size:13px;line-height:1.45;white-space:normal;overflow-wrap:break-word}.news-result>small{margin-top:7px;color:var(--muted);font-size:9px}
.trend-row.youtube-result{grid-template-columns:92px minmax(0,1fr) 22px;padding:10px}.youtube-result>img{width:92px;aspect-ratio:16/9;object-fit:cover;border-radius:10px;background:var(--soft)}.youtube-result .copy{min-width:0}.youtube-result .copy strong{display:-webkit-box;overflow:hidden;-webkit-line-clamp:2;-webkit-box-orient:vertical;line-height:1.4}.youtube-result>b{color:var(--green);font-size:16px;text-align:center}
.detail-actions{grid-template-columns:1fr}.detail-actions button{min-width:0}.detail-actions span{min-width:0}.detail-actions span strong,.detail-actions span small{overflow-wrap:anywhere;line-height:1.35}.detail-actions button>b{display:block}
.saved-toolbar{display:flex;align-items:center;justify-content:space-between;margin:13px 0 11px;padding:10px 2px}.saved-toolbar[hidden]{display:none}.saved-toolbar label{display:flex;align-items:center;gap:6px;color:var(--muted);font-size:10px}.saved-toolbar span{display:flex;gap:6px}.saved-toolbar button{padding:7px 9px;border:1px solid var(--line);border-radius:10px;background:var(--paper);color:var(--ink);font-size:9px;font-weight:800}.saved-toolbar button.danger{color:#b34747}.saved-row{grid-template-columns:auto minmax(0,1fr)}.saved-check{width:17px;height:17px;accent-color:var(--green)}.saved-meta{grid-column:2;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.saved-meta button{min-width:0;padding:8px 5px;border:0;border-radius:11px;background:var(--soft);color:var(--green);font-size:8px;font-weight:800;white-space:nowrap}.saved-meta button:nth-child(2){background:var(--green);color:#fff}.saved-meta button.delete{background:transparent;color:#a65a5a}
.trend-return{margin:12px 0 0;padding:8px 2px;border:0;background:transparent;color:var(--green);font-size:10px;font-weight:800;text-align:left}
.news-search select{max-width:72px;border:0;outline:0;background:transparent;color:var(--green);font-size:10px;font-weight:800}
html,body{height:100%;overflow:hidden}.phone{height:100vh}.screen{height:100vh;overflow-y:auto;scrollbar-width:none}.screen::-webkit-scrollbar,.detail::-webkit-scrollbar{display:none}@media(min-width:431px){.phone{height:calc(100vh - 36px)}.screen{height:calc(100vh - 36px)}}
@media(min-width:480px){body{background:#e4eae6}.phone{width:100%;max-width:none;height:100vh;margin:0;border-radius:0;box-shadow:none}.screen{height:100vh;padding:0 36px 110px}.hero,.top{height:84px;margin:0 -36px 22px;padding:0 36px}.brand-logo{width:46px;height:46px;border-radius:13px}.brand strong,.top strong{font-size:24px}.brand small,.top small{font-size:12px}.search{height:62px;margin:20px 0;border-radius:19px}.search input{font-size:16px}.search button{padding:11px 18px;font-size:13px}.tabs{margin:0 -36px;padding:0 36px 16px}.tabs button,.chips button{font-size:13px}.chips{gap:10px;padding:17px 0}.chips button{padding:10px 16px}.heading{margin:17px 2px}.heading h1{font-size:22px}.trend-row,.shop-row,.saved-row{padding:19px 21px;border-radius:19px}.trend-row{grid-template-columns:42px 1fr auto}.copy strong{font-size:17px}.copy small,.delta{font-size:11px}.signal{padding:22px;border-radius:20px}.bottom{height:90px;padding:11px 32px}.bottom button{font-size:11px}.bottom b{font-size:23px}.detail-body{width:min(680px,100%);margin:auto;padding:26px 30px 56px}.detail>header{height:72px}.signal-card{padding:24px;border-radius:22px}.signal-card>strong{font-size:26px}.detail-actions{gap:12px}.detail-actions button{padding:18px}.category-selects{grid-template-columns:repeat(3,1fr);gap:12px}.select{font-size:14px}.chart-box{padding:22px}.distribution-cards{grid-template-columns:repeat(3,1fr)}}
.app-header{height:66px;margin:0;padding:0 18px;flex:none}.main-tabs{height:54px;padding:7px 12px;display:grid;grid-template-columns:repeat(4,1fr);gap:5px;background:var(--paper);border-bottom:1px solid var(--line)}.main-tabs button{border:0;border-radius:11px;background:transparent;color:var(--muted);font-size:11px;font-weight:700}.main-tabs button.active{background:var(--deep);color:#fff}.screen,.screen.active{height:calc(100vh - 120px);padding-top:1px;padding-bottom:36px}.detail{inset:0}.detail>header{top:0}@media(min-width:480px){.app-header{height:84px;margin:0;padding:0 36px}.main-tabs{height:66px;padding:9px 32px}.main-tabs button{font-size:13px}.screen,.screen.active{height:calc(100vh - 150px);padding-top:1px;padding-bottom:48px}}

/* Responsive web shell. Native WebView keeps the app-only surface at every size. */
.web-shell{width:100%;min-height:100%}.web-ad-rail{display:none}.web-ad-slot{border:1px dashed #c7d1ca;border-radius:18px;background:#f8faf8;color:#8a958e;place-items:center;text-align:center}.web-ad-slot small,.web-ad-slot strong,.web-ad-slot span{display:block}.web-ad-slot small{font-size:9px;letter-spacing:.14em}.web-ad-slot strong{margin-top:9px;color:#66736b;font-size:15px}.web-ad-slot span{margin-top:5px;font-size:10px}.web-mobile-ad{position:fixed;z-index:40;left:50%;bottom:max(8px,env(safe-area-inset-bottom));width:min(320px,calc(100% - 24px));height:100px;padding:12px;display:flex;flex-direction:column;align-items:center;justify-content:center;border:1px dashed #c7d1ca;border-radius:14px;background:#f8faf8f2;box-shadow:0 12px 30px #203b2b24;color:#8a958e;text-align:center;transform:translateX(-50%)}.web-mobile-ad small{font-size:8px;letter-spacing:.12em}.web-mobile-ad strong{margin-top:6px;color:#66736b;font-size:13px}.web-mobile-ad span{margin-top:3px;font-size:9px}.native-app .web-mobile-ad{display:none}.web-mobile-ad~*{pointer-events:auto}
html:not(.native-app) .screen,html:not(.native-app) .screen.active{padding-bottom:126px}
@media(max-width:1023px){html:not(.native-app) .detail-body{padding-bottom:140px}}
@media(min-width:1024px){
  html:not(.native-app),html:not(.native-app) body{overflow:auto;min-height:100%;height:auto}
  html:not(.native-app) body{background:linear-gradient(135deg,#e8ede9 0%,#dce4de 100%)}
  html:not(.native-app) .web-shell{width:min(1240px,calc(100% - 48px));min-height:calc(100vh - 48px);margin:24px auto;display:grid;grid-template-columns:minmax(0,880px) 300px;gap:24px;align-items:start}
  html:not(.native-app) .phone{width:100%;max-width:none;height:auto;min-height:calc(100vh - 48px);margin:0;border:1px solid #d5ddd7;border-radius:24px;box-shadow:0 24px 70px #203b2b22}
  html:not(.native-app) .screen,html:not(.native-app) .screen.active{height:auto;min-height:calc(100vh - 198px);overflow:visible;padding-left:32px;padding-right:32px;padding-bottom:48px}
  html:not(.native-app) .app-header{padding-left:32px;padding-right:32px}
  html:not(.native-app) .main-tabs{padding-left:28px;padding-right:28px}
  html:not(.native-app) .detail{border-radius:24px}
  html:not(.native-app) .web-ad-rail{display:grid;gap:18px;position:sticky;top:24px}
  html:not(.native-app) .web-mobile-ad{display:none}
  html:not(.native-app) .web-ad-slot{display:grid;width:300px;background:#f8faf8cc}
  html:not(.native-app) .web-ad-slot-tall{height:600px}
  html:not(.native-app) .web-ad-slot-box{height:250px}
}
@media(min-width:1024px) and (max-width:1180px){
  html:not(.native-app) .web-shell{width:calc(100% - 32px);grid-template-columns:minmax(0,1fr) 280px;gap:18px;margin:16px auto}
  html:not(.native-app) .phone{height:auto;min-height:calc(100vh - 32px)}
  html:not(.native-app) .screen,html:not(.native-app) .screen.active{height:auto;min-height:calc(100vh - 182px)}
  html:not(.native-app) .web-ad-slot{width:280px}
}
