:root{--bg:#0b0d12;--panel:#12151c;--panel2:#181c25;--line:#232837;--text:#e8ebf2;--mut:#8a93a6;--acc:#f5c84c;--acc2:#ffdf7e;--up:#22c55e;--down:#ef4444;--blue:#5b8cff;--r:10px}
*{box-sizing:border-box}html,body{margin:0;background:var(--bg);color:var(--text);font:14px/1.45 -apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Pretendard","Noto Sans KR","Malgun Gothic",sans-serif}
a{color:inherit;text-decoration:none}button{font:inherit;color:inherit;cursor:pointer}
.wrap{max-width:1180px;margin:0 auto;padding:0 12px}
header.top{position:sticky;top:0;z-index:20;background:rgba(11,13,18,.92);backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.bar{display:flex;align-items:center;gap:10px;height:54px}
.logo{display:flex;align-items:center;gap:8px;font-weight:800;font-size:17px;letter-spacing:-.3px;white-space:nowrap}
.logo .mark{width:28px;height:28px;border-radius:8px;background:linear-gradient(135deg,#f5c84c,#ff8a3d);display:grid;place-items:center;color:#111;font-size:15px}
.search{flex:1;min-width:0}.search input{width:100%;background:var(--panel2);border:1px solid var(--line);border-radius:8px;color:var(--text);padding:8px 10px;font:inherit}
.btn{border:1px solid var(--line);background:var(--panel2);border-radius:8px;padding:7px 12px;white-space:nowrap}
.btn:hover{border-color:#39405a}.btn.acc{background:var(--acc);color:#111;border-color:var(--acc);font-weight:700}
.btn.boost{background:linear-gradient(135deg,#f5c84c,#ff9d3d);color:#111;border:0;font-weight:800;padding:6px 10px}
.btn.sm{padding:4px 8px;font-size:12px}.btn.block{width:100%;padding:11px}
.pill{display:inline-flex;align-items:center;gap:4px;background:var(--panel2);border:1px solid var(--line);border-radius:999px;padding:4px 10px;font-size:12px;white-space:nowrap}
.pill b{color:var(--acc)}
.ticker{border-bottom:1px solid var(--line);background:#0e1117;overflow:hidden;height:30px;position:relative}
.ticker .track{display:inline-flex;gap:26px;white-space:nowrap;padding-left:100%;animation:tick 45s linear infinite;line-height:30px;font-size:12px;color:var(--mut)}
.ticker .track span b{color:var(--acc)}.ticker .track span i{font-style:normal;color:var(--text)}
@keyframes tick{to{transform:translateX(-100%)}}
.stats{display:flex;gap:8px;overflow-x:auto;padding:10px 0;scrollbar-width:none}
.stat{flex:0 0 auto;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:8px 12px;min-width:120px}
.stat small{color:var(--mut);display:block;font-size:11px}.stat strong{font-size:16px}
.cats{display:flex;gap:6px;overflow-x:auto;padding:4px 0 8px;scrollbar-width:none}
.cats a{flex:0 0 auto;padding:6px 11px;border-radius:999px;background:var(--panel);border:1px solid var(--line);font-size:13px;color:var(--mut)}
.cats a.on{background:#2a2410;border-color:var(--acc);color:var(--acc2)}
.cats.sub a{font-size:12px;padding:4px 9px}
.tabs{display:flex;gap:4px;background:var(--panel);border:1px solid var(--line);border-radius:9px;padding:3px;width:max-content}
.tabs a{padding:5px 12px;border-radius:7px;color:var(--mut);font-size:13px;font-weight:600}.tabs a.on{background:var(--panel2);color:var(--text)}
.toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:6px 0 8px;flex-wrap:wrap}
.live{font-size:12px;color:var(--mut)}.live:before{content:"";display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--up);margin-right:6px;animation:pulse 1.6s infinite}
@keyframes pulse{50%{opacity:.3}}
table.lb{width:100%;table-layout:auto;border-collapse:collapse;background:var(--panel);border:1px solid var(--line);border-radius:var(--r);overflow:hidden}
.lb th{font-size:11px;color:var(--mut);font-weight:600;text-align:right;padding:8px;border-bottom:1px solid var(--line);background:#0f1218}
.lb th:nth-child(2),.lb td:nth-child(2){text-align:left}
.lb td{padding:7px 8px;border-bottom:1px solid #1b1f2b;text-align:right;white-space:nowrap;font-variant-numeric:tabular-nums}
.lb tr:hover td{background:#151925}
.lb .rk{color:var(--mut);font-weight:700;width:44px;text-align:center}
.lb tr.top1 .rk{color:#ffd54a}.lb tr.top2 .rk{color:#cfd6e4}.lb tr.top3 .rk{color:#e3a26b}
.ent{display:flex;align-items:center;gap:9px;min-width:0}
.av{width:30px;height:30px;border-radius:8px;flex:0 0 30px;display:grid;place-items:center;font-weight:800;font-size:13px;color:#fff;overflow:hidden}
.av img{width:100%;height:100%;object-fit:cover}
.nm{min-width:0}.nm b{display:block;overflow:hidden;text-overflow:ellipsis;max-width:240px}.nm small{color:var(--mut);font-size:11px}
.tag{font-size:10px;padding:1px 5px;border-radius:4px;background:#1f2533;color:var(--mut);margin-left:4px;vertical-align:1px}
.tag.new{background:#10331f;color:#4ade80}
.bst{display:inline-flex;align-items:center;gap:3px;background:#2a2410;color:var(--acc2);border:1px solid #4a3d12;border-radius:6px;padding:2px 7px;font-weight:800}
.up{color:var(--up)}.down{color:var(--down)}.flat{color:#555c6e}
tr.flash td{animation:flash 2.2s ease-out}
@keyframes flash{0%{background:rgba(245,200,76,.28)}100%{background:transparent}}
tr.hot td:first-child{box-shadow:inset 3px 0 0 var(--acc)}
.more{text-align:center;padding:12px}
.disc-line{font-size:11px;color:var(--mut);margin:8px 0}
.card{background:var(--panel);border:1px solid var(--line);border-radius:var(--r);padding:16px;margin:12px 0}
.card h2{margin:0 0 10px;font-size:17px}.card h3{margin:14px 0 6px;font-size:15px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.pkgs{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px}
.pkg{background:var(--panel2);border:1px solid var(--line);border-radius:var(--r);padding:14px;text-align:center;cursor:pointer}
.pkg.on{border-color:var(--acc);box-shadow:0 0 0 1px var(--acc) inset}
.pkg .v{font-size:22px;font-weight:800;color:var(--acc2)}.pkg .p{color:var(--mut)}
.testbadge{display:inline-block;background:#3b1d1d;color:#ffb4b4;border:1px solid #6b2c2c;border-radius:6px;padding:2px 8px;font-size:12px;font-weight:700}
label.f{display:block;margin:10px 0 4px;font-size:13px;color:var(--mut)}
input.i,select.i,textarea.i{width:100%;background:var(--panel2);border:1px solid var(--line);border-radius:8px;color:var(--text);padding:10px;font:inherit}
.chk{display:flex;gap:8px;align-items:flex-start;margin:8px 0;font-size:13px}.chk input{margin-top:3px}
.msg{padding:10px;border-radius:8px;margin:10px 0;font-size:13px}.msg.e{background:#3b1d1d;color:#ffc9c9}.msg.ok{background:#11301f;color:#b8f5cf}
.missions{display:grid;gap:8px}
.mi{display:flex;align-items:center;gap:10px;background:var(--panel2);border:1px solid var(--line);border-radius:9px;padding:10px}
.mi .ic{font-size:20px;width:28px;text-align:center}.mi .tx{flex:1;min-width:0}.mi .tx small{color:var(--mut);display:block;font-size:12px}
.mi.done{opacity:.55}.mi.off{opacity:.4}
.prog{height:8px;background:var(--panel2);border-radius:99px;overflow:hidden;margin:6px 0 12px}.prog i{display:block;height:100%;background:linear-gradient(90deg,#f5c84c,#ff9d3d)}
.ad-slot{border:1px dashed #333a4d;border-radius:var(--r);color:#555d72;font-size:12px;display:grid;place-items:center;min-height:90px;margin:12px 0}
.modal{position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:50;display:flex;align-items:flex-end;justify-content:center}
.modal .box{background:var(--panel);border:1px solid var(--line);border-radius:14px 14px 0 0;width:100%;max-width:460px;padding:18px;max-height:90vh;overflow:auto}
@media(min-width:700px){.modal{align-items:center}.modal .box{border-radius:14px}}
.qty{display:flex;gap:6px;flex-wrap:wrap;margin:8px 0}.qty button{flex:1;min-width:52px}
.seg{display:flex;gap:6px;margin:8px 0}.seg button{flex:1}.seg button.on{border-color:var(--acc);color:var(--acc2)}
footer{border-top:1px solid var(--line);margin-top:30px;padding:18px 0 90px;color:var(--mut);font-size:12px}
footer a{margin-right:12px;text-decoration:underline}
.biz{margin-top:8px;line-height:1.7}
.legal{max-width:820px}.legal h1{font-size:22px}.legal h2{font-size:16px;margin-top:22px}.legal p,.legal li{color:#c9cfdb;line-height:1.75}
.legal .strong{border:2px solid var(--acc);background:#1d1a0d;border-radius:10px;padding:14px 16px}
.ph{background:#3b2f0d;color:#ffe08a;padding:0 4px;border-radius:3px}
.tabbar{position:fixed;bottom:0;left:0;right:0;z-index:30;display:flex;background:rgba(14,17,23,.97);border-top:1px solid var(--line);padding-bottom:env(safe-area-inset-bottom)}
.tabbar a{flex:1;text-align:center;padding:8px 0 7px;font-size:11px;color:var(--mut)}.tabbar a span{display:block;font-size:18px}.tabbar a.on{color:var(--acc2)}
@media(min-width:900px){.tabbar{display:none}footer{padding-bottom:30px}}
@media(max-width:640px){.hide-m{display:none}.nm b{max-width:130px}.lb td,.lb th{padding:7px 5px}.logo .t{display:none}.grid2{grid-template-columns:1fr}}
.kv{display:grid;grid-template-columns:120px 1fr;gap:6px 12px;font-size:13px}.kv div:nth-child(odd){color:var(--mut)}
table.s{width:100%;border-collapse:collapse;font-size:12px}table.s td,table.s th{border-bottom:1px solid var(--line);padding:6px;text-align:left}
.toast{position:fixed;left:50%;bottom:80px;transform:translateX(-50%);background:#222838;border:1px solid var(--line);padding:10px 16px;border-radius:10px;z-index:60;font-size:13px}


/* 꾸미기: 이름 색 / 빛나기 (시각 효과만) */
.nmx{--nc:#ffe9a8}
.nmx.glow{background:linear-gradient(100deg,var(--nc) 0%,var(--nc) 35%,#fff 50%,var(--nc) 65%,var(--nc) 100%);background-size:250% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;
  filter:drop-shadow(0 0 4px var(--nc)) drop-shadow(0 0 10px color-mix(in srgb,var(--nc) 60%,transparent));animation:shimmer 2.4s linear infinite}
@keyframes shimmer{0%{background-position:100% 0}100%{background-position:-150% 0}}
@media(prefers-reduced-motion:reduce){.nmx.glow{animation:none}}
.pal{display:flex;flex-wrap:wrap;gap:8px;margin:8px 0}
.sw{width:34px;height:34px;border-radius:50%;border:2px solid #2a3042}.sw.on{border-color:#fff;box-shadow:0 0 0 2px var(--acc)}
.perkbox{margin-top:10px}

/* mobile-app polish 2026-11-09 */
html.in-app body{padding-top:env(safe-area-inset-top)}
html.in-app .tabbar{padding-bottom:max(8px,env(safe-area-inset-bottom))}
@media(max-width:640px){
  .wrap{padding:0 10px}
  .card{padding:14px 12px;margin:10px 0}
  .card h2{font-size:16px;line-height:1.35;word-break:keep-all}
  .chk{font-size:12.5px;line-height:1.45;word-break:keep-all}
  .chk span{flex:1;min-width:0}
  .msg,.msg.e{font-size:12.5px;line-height:1.5;word-break:keep-all}
  .disc-line{font-size:11px;line-height:1.5;word-break:keep-all}
  .tabs{max-width:100%;overflow-x:auto}
  .pkgs{grid-template-columns:repeat(2,minmax(0,1fr))}
  .pkg{padding:12px 8px}.pkg .v{font-size:18px}
  .modal .box{padding:16px 14px 22px;padding-bottom:max(22px,env(safe-area-inset-bottom))}
  .legal .strong{padding:12px;font-size:13px;line-height:1.55}
  .legal h1{font-size:18px}.legal h2{font-size:15px}
  .kv{grid-template-columns:96px 1fr;gap:4px 8px;font-size:12.5px}
  #rising .btn.sm{max-width:70vw;overflow:hidden;text-overflow:ellipsis}
  .nm b{max-width:42vw}
  label.f{word-break:keep-all}
}

.rank-banner{background:#2a2410;border:1px solid #5a4a18;color:#ffe9a8;border-radius:8px;padding:8px 10px;font-size:12px;font-weight:700;margin:8px 0 0;line-height:1.4;word-break:keep-all}
@media(max-width:640px){.rank-banner{font-size:11.5px;padding:7px 8px}}

.lbw{overflow-x:hidden;border-radius:var(--r)}
.lb td.votec,.lb th:nth-child(3){white-space:normal;vertical-align:middle}
.lb .brk{display:block;color:var(--mut);font-size:10px;line-height:1.25;margin-top:2px;font-weight:500}
.lb .dlt-m{display:none}
.lb td.act{width:44px;padding-left:4px;padding-right:6px;white-space:nowrap}
@media(max-width:640px){
  .btn.boost.rowb{padding:7px 8px;min-width:36px}
  .btn.boost.rowb .bt{display:none}
  .lb .rk{width:22px;padding:7px 2px;font-size:12px}
  .nm b{max-width:100%}
  .bst{padding:2px 5px;font-size:12px}
  .lb td.votec{padding:6px 4px;font-size:12px;min-width:72px;max-width:96px}
  .lb .dlt-m{display:block;margin-top:2px;font-size:11px}
  .lb td.namec{padding-right:4px}
  .lb td.act{width:40px;padding:6px 4px}
  .av{width:26px;height:26px;flex-basis:26px;font-size:11px;border-radius:7px}
  .ent{gap:6px}
}
@media(max-width:412px){
  .lb td,.lb th{padding:6px 3px}
  .lb td.votec{max-width:88px;padding:6px 3px}
  .nm small{font-size:10px}
  .lb .brk{font-size:9px}
  .wrap{padding:0 8px}
}
@media(max-width:360px){
  .lb .rk{width:18px;padding:6px 1px}
  .lb td.votec{max-width:80px}
  .bst{font-size:11px;padding:1px 4px}
  .btn.boost.rowb{padding:6px 7px}
}

/* SNS 링크 옆 가벼운 경고 (상세만) */
.sns-block{display:flex;flex-direction:column;gap:6px;min-width:0}
.sns-caution{display:flex;align-items:center;gap:8px;justify-content:space-between}
.sns-caution-text{font-size:11px;color:var(--mut);line-height:1.4;flex:1;min-width:0;word-break:keep-all}
.sns-caution .btn.sm{flex:0 0 auto;padding:3px 8px;font-size:11px;color:var(--mut)}
/* iOS 앱: 네이티브 느낌(탭 하이라이트·길게 눌러 선택 끔, 입력칸은 선택 허용) */
html.ios{-webkit-tap-highlight-color:transparent}
html.ios body{-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;overscroll-behavior-y:none}
html.ios input,html.ios textarea,html.ios .disc-line{-webkit-user-select:text;user-select:text}
html.ios footer{display:none}

/* 사업자 정보: 웹은 한 줄 접기, 앱은 MY → 설정 → 사업자 정보 */
.bizfold{margin:8px 0}.bizfold summary{cursor:pointer;list-style:none;font-size:12px;color:var(--mut)}.bizfold summary::-webkit-details-marker{display:none}
.bizfold[open] summary{margin-bottom:6px}.bizfold .biz{font-size:11px;line-height:1.7}
html.in-app footer{display:none}
.biz-table th{text-align:left;color:var(--mut);font-weight:500;padding-right:12px}
/* 사기 주의 한 줄: 평소엔 작게, 금융·투자·다단계 분류에선 조금 더 눈에 띄게 */
.scam-line{color:var(--mut)}
.sns-caution.risky{background:#2a2410;border:1px solid #6b5a1e;border-radius:10px;padding:6px 8px}
.sns-caution.risky .scam-line{color:#ffe9a8;font-weight:600}
/* 로그인·프로필 */
.login-btns{display:grid;gap:10px;margin:16px 0 10px}
.sbtn{display:flex;align-items:center;justify-content:center;gap:8px;font-weight:700;padding:13px 14px;font-size:15px}
.sbtn.apple{background:#fff;color:#000;border-color:#fff}
.sbtn.google{background:#fff;color:#1f1f1f;border-color:#dadce0}
.sbtn.google .g{font-weight:900;color:#4285f4}
.sbtn.mock{background:#1d2a1f;color:#b9f6c5;border:1px dashed #4caf6a}
.sbtn .soon{font-size:11px;font-weight:600;color:#888;margin-left:4px}
.mock-note{font-size:11px;color:#8fd19e;margin:-4px 2px 0;line-height:1.4}
.review-login{margin-top:14px;border-top:1px solid var(--line,#2a2f3a);padding-top:10px}
.review-login summary{cursor:pointer;font-size:13px;color:var(--mut);text-align:center}
.hint{font-size:12px;color:var(--mut);margin:4px 0 2px}
.hint.bad{color:#ff8a8a}
.job{display:block;font-size:12px;color:var(--mut)}
.linkbtn{background:none;border:0;padding:0;color:var(--acc);text-decoration:underline;font:inherit;cursor:pointer}

/* 메인: TOP3 포디움 · 인기 검색어 · 일주일 급상승 */
.hotq{display:flex;gap:6px;overflow-x:auto;padding:2px 0 8px;margin:2px 0 4px;scrollbar-width:none;align-items:center}
.hotq::-webkit-scrollbar{display:none}
.hotq .hl{flex:none;font-size:12px;font-weight:700;color:var(--mut);margin-right:2px}
.hotq .chip{flex:none;font-size:12px;padding:5px 10px;border-radius:999px;background:var(--card,#151922);border:1px solid var(--line,#2a2f3a);color:inherit;text-decoration:none;white-space:nowrap}
.hotq .chip b{color:var(--acc);margin-right:2px}
.podium{display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;margin:6px 0 12px;align-items:end}
.podium:empty{display:none}
.pcard{position:relative;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;padding:14px 8px 10px;border-radius:16px;background:linear-gradient(180deg,#1c2232,#131722);border:1px solid #2a3142;color:inherit;text-decoration:none;min-width:0}
.pcard.p1{order:2;padding-top:20px;border-color:#f5c84b;box-shadow:0 0 0 1px #f5c84b55,0 8px 24px #f5c84b22;background:linear-gradient(180deg,#2c2615,#141722)}
.pcard.p2{order:1;border-color:#b9c3d6}
.pcard.p3{order:3;border-color:#cd8a4f}
.pcard .pm{font-size:26px;line-height:1}
.pcard.p1 .pm{font-size:34px}
.pcard .av{width:48px;height:48px;font-size:20px}
.pcard.p1 .av{width:60px;height:60px;font-size:24px}
.pcard .pn{font-size:14px;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcard.p1 .pn{font-size:16px}
.pcard .sub{font-size:11px;color:var(--mut);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.pcard .pv{font-size:13px;font-weight:800;color:var(--acc)}
.pcard .boost{margin-top:2px;padding:6px 10px;font-size:12px}
.rising{margin:4px 0 14px}
.rising:empty{display:none}
.rising .sec{font-size:15px;margin:0 0 8px}
.rlist{display:grid;gap:6px}
.ritem{display:flex;align-items:center;gap:10px;padding:8px 10px;border-radius:12px;background:var(--card,#151922);border:1px solid var(--line,#2a2f3a);color:inherit;text-decoration:none}
.ritem .rr{width:18px;text-align:center;font-weight:800;color:#ff7a59}
.ritem .av{width:32px;height:32px;font-size:14px}
.ritem .rn{flex:1;min-width:0;font-weight:600;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ritem .rn small{display:block;font-weight:400;font-size:11px;color:var(--mut);overflow:hidden;text-overflow:ellipsis}
.ritem .rv{font-size:13px;font-weight:800;color:#ff7a59;white-space:nowrap}
.catpick{display:flex;flex-wrap:wrap;gap:6px;margin:4px 0 6px}
.catpick .cp input{display:none}
.catpick .cp span{display:inline-block;padding:7px 12px;border-radius:999px;border:1px solid var(--line,#2a2f3a);font-size:13px;cursor:pointer}
.catpick .cp input:checked+span{border-color:var(--acc);background:#5b8cff22;color:var(--acc);font-weight:700}
.catpick.two{display:grid;grid-template-columns:1fr 1fr}
.catpick.two .cp span{display:block;text-align:center;padding:11px 12px;font-size:14px}
.pcard .av,.ritem .av{flex:none;display:inline-flex;align-items:center;justify-content:center;border-radius:50%;overflow:hidden}
.pcard .av{width:48px!important;height:48px!important;min-height:48px}
.pcard.p1 .av{width:60px!important;height:60px!important}
.ritem .av{width:32px!important;height:32px!important}
/* 모바일 사파리: 입력창 확대 방지(16px), 하단 탭바·홈 인디케이터 여백, 가로 넘침 방지 */
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{overflow-x:hidden}
@media (max-width:820px){input.i,select.i,textarea.i,.i{font-size:16px}}
.sbtn,.btn{-webkit-tap-highlight-color:transparent;touch-action:manipulation}
.modal .box{max-height:calc(100dvh - 24px);overflow-y:auto;-webkit-overflow-scrolling:touch}