html,body,#root{margin:0;padding:0;min-height:100vh;background:#f2f4f6}#root{width:100%}:root{--bg: #f2f4f6;--card: #ffffff;--text: #191f28;--text-sub: #4e5968;--text-meta: #8b95a1;--border: #e5e8eb;--up: #f04452;--down: #3182f6;--same: #8b95a1;--radius: 16px;--shadow: 0 1px 4px rgba(0, 0, 0, .04)}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Pretendard,Apple SD Gothic Neo,Noto Sans KR,sans-serif;-webkit-font-smoothing:antialiased;overflow-x:hidden}.app{max-width:480px;margin:0 auto;min-height:100vh;overflow-x:hidden;animation:viewIn .2s ease-out}@keyframes viewIn{0%{opacity:0}to{opacity:1}}.home-view{padding:calc(20px + env(safe-area-inset-top,0px)) 16px calc(72px + env(safe-area-inset-bottom,0px))}.header-count{display:flex;align-items:center;justify-content:center;gap:6px;width:100%;padding:12px 16px;background:var(--text);border:none;border-radius:14px;cursor:pointer;font-family:inherit;color:#fff;transition:transform .1s,opacity .1s}.header-count:active{transform:scale(.95);opacity:.85}.header-count-num{font-size:14px;font-weight:800;font-variant-numeric:tabular-nums}.header-count-label{font-size:11px;font-weight:700;letter-spacing:-.2px}.header-count-arrow{font-size:12px;margin-left:2px}.app-version{margin:8px 0 80px;font-size:11px;color:var(--text-sub);text-align:center;opacity:.5}.rankings-updated-at{margin:0 0 16px;font-size:11px;color:var(--text-sub);text-align:right;padding:0 4px}.favorites-section{margin-bottom:20px}.favorites-title{margin:0 4px 10px;font-size:14px;font-weight:700;color:var(--text-sub)}.favorites-scroll{display:flex;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;margin:0 -16px;padding:0 16px 4px}.favorites-scroll::-webkit-scrollbar{display:none}.fav-chip{flex-shrink:0;display:flex;align-items:center;gap:8px;padding:10px 14px;background:var(--card);border-radius:14px;border:none;border-left:3px solid var(--fav-color);box-shadow:var(--shadow);cursor:pointer;font-family:inherit;transition:transform .1s}.fav-chip:active{transform:scale(.97)}.fav-chip-emoji{font-size:18px}.fav-chip-label{font-size:13px;font-weight:700;color:var(--text);white-space:nowrap}.fav-chip-top{font-size:12px;color:var(--text-sub);white-space:nowrap}.questions-section{margin-bottom:20px}.questions-title{margin:0 4px 12px;font-size:15px;font-weight:700;color:var(--text)}.questions-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.q-card{display:flex;flex-direction:column;gap:8px;background:var(--card);border-radius:14px;box-shadow:var(--shadow);padding:14px 12px 12px;border:none;border-top:3px solid var(--q-color);cursor:pointer;text-align:left;font-family:inherit;transition:transform .1s,box-shadow .1s}.q-card:active{transform:scale(.97);box-shadow:none}.q-card-emoji{font-size:22px}.q-card-text{margin:0;font-size:13px;font-weight:700;color:var(--text);line-height:1.4;flex:1}.q-card-bottom{display:flex;justify-content:space-between;align-items:center;margin-top:auto}.q-card-mystery{font-size:11px;font-weight:700;color:var(--q-color);background:color-mix(in srgb,var(--q-color) 10%,white);padding:2px 8px;border-radius:8px}.q-card-cta{font-size:11px;font-weight:700;color:var(--text-meta)}.all-rankings-btn{display:flex;flex-direction:column;gap:10px;width:100%;padding:16px 20px;background:var(--card);border:none;border-radius:14px;box-shadow:var(--shadow);cursor:pointer;font-family:inherit;transition:transform .1s;margin-bottom:16px;text-align:left}.all-rankings-btn:active{transform:scale(.98)}.all-rankings-btn-top{display:flex;align-items:center;width:100%}.all-rankings-btn-label{font-size:15px;font-weight:700;color:var(--text);flex:1}.all-rankings-btn-arrow{font-size:16px;color:var(--text-meta)}.all-rankings-btn-hint{display:flex;flex-wrap:wrap;gap:6px}.all-rankings-btn-tag{font-size:11px;font-weight:600;color:var(--text-sub);background:var(--bg);padding:3px 8px;border-radius:8px;white-space:nowrap}.list-view{padding:calc(4px + env(safe-area-inset-top,0px)) 16px calc(72px + env(safe-area-inset-bottom,0px))}.list-header{display:flex;align-items:center;gap:12px;padding:12px 0 16px}.list-header .detail-back{background:var(--bg);color:var(--text)}.list-header .detail-back:active{background:var(--border)}.list-header-title{margin:0;font-size:18px;font-weight:800;color:var(--text);flex:1}.list-tabs{display:flex;gap:0;margin-bottom:16px;border-bottom:1px solid var(--border)}.list-tab{flex:1;padding:12px 8px 14px;background:none;border:none;cursor:pointer;font-family:inherit;font-size:14px;font-weight:700;color:var(--text-meta);position:relative;transition:color .15s}.list-tab.active{color:var(--text)}.list-tab.active:after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--text);border-radius:2px 2px 0 0}.list-tab:active{opacity:.6}.emoji-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;overflow:hidden;animation:gridIn .2s ease-out}.emoji-card{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;aspect-ratio:1;background:var(--card);border-radius:14px;box-shadow:var(--shadow);border:none;border-top:3px solid var(--card-color);cursor:pointer;font-family:inherit;padding:8px;transition:transform .1s,box-shadow .1s}.emoji-card:active{transform:scale(.94);box-shadow:none}.emoji-card-emoji{font-size:32px}.emoji-card-label{font-size:11px;font-weight:700;color:var(--text);text-align:center;line-height:1.2;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.home-group{margin-bottom:12px}.home-group-header{display:flex;align-items:center;gap:8px;width:100%;padding:10px 4px;background:none;border:none;cursor:pointer;font-family:inherit}.home-group-header:active{opacity:.7}.home-group-emoji{font-size:18px;flex-shrink:0}.home-group-label{font-size:14px;font-weight:700;color:var(--text);flex:1;text-align:left}.home-group-count{font-size:11px;font-weight:600;color:var(--text-meta);background:var(--bg);padding:2px 7px;border-radius:999px}.home-group-chevron{font-size:14px;color:var(--text-meta);width:20px;text-align:center;transform:rotate(-90deg);transition:transform .2s ease}.home-group-chevron.collapsed{transform:rotate(0)}.dashboard-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;padding:2px 0 0;overflow:hidden;animation:gridIn .2s ease-out}@keyframes gridIn{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:translateY(0)}}.dashboard-card{background:var(--card);border-radius:14px;box-shadow:var(--shadow);padding:14px 12px;border:none;cursor:pointer;text-align:left;border-left:3px solid var(--card-color);display:flex;flex-direction:column;gap:6px;font-family:inherit;min-width:0;overflow:hidden;transition:transform .1s,box-shadow .1s}.dashboard-card:active{transform:scale(.97);box-shadow:none}.dashboard-card-top{display:flex;align-items:center;gap:6px}.dashboard-card-emoji{font-size:18px}.dashboard-card-label{font-size:13px;font-weight:700;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dashboard-card-preview{display:flex;align-items:center;gap:3px;font-size:12px;min-width:0}.dashboard-card-rank{color:var(--card-color);font-weight:700;flex-shrink:0}.dashboard-card-flag{font-size:13px;flex-shrink:0}.dashboard-card-name{color:var(--text);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.dashboard-card-value{font-size:11px;color:var(--text-meta);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}.detail-view{padding:0 0 calc(72px + env(safe-area-inset-bottom,0px))}.detail-hero{background:radial-gradient(ellipse at 50% 20%,rgba(255,255,255,.12),transparent 65%),linear-gradient(160deg,var(--theme),color-mix(in srgb,var(--theme) 55%,#1a1a2e));padding:calc(4px + env(safe-area-inset-top,0px)) 16px 16px;color:#fff}.detail-back{background:#ffffff26;border:none;border-radius:10px;width:34px;height:34px;font-size:18px;cursor:pointer;color:#fff;font-weight:600;display:flex;align-items:center;justify-content:center;transition:background .1s}.detail-back:active{background:#ffffff40}.detail-hero-top{display:flex;justify-content:space-between;align-items:center}.detail-hero-actions{display:flex;gap:8px}.detail-share{background:#ffffff26;border:none;border-radius:10px;width:34px;height:34px;font-size:16px;cursor:pointer;color:#fff;display:flex;align-items:center;justify-content:center;transition:background .1s,transform .1s}.detail-share:active{transform:scale(.9)}.detail-fav{background:#ffffff26;border:none;border-radius:10px;width:34px;height:34px;font-size:18px;cursor:pointer;color:#fff;display:flex;align-items:center;justify-content:center;transition:background .1s,transform .1s}.detail-fav:active{transform:scale(.9)}.detail-fav-on{background:#ffffff4d;color:#fbbf24}.detail-hero-content{margin-top:2px;text-align:center}.detail-hero-emoji{font-size:28px;display:block}.detail-hero-title{margin:2px 0 0;font-size:20px;font-weight:800;letter-spacing:-.02em}.detail-hero-subtitle{margin:2px 0 0;font-size:13px;opacity:.8}.detail-hero-meta{margin:10px 0 0;font-size:11px;opacity:.5;text-align:center}.winner-card{margin-top:12px;background:#fff;border-radius:16px;padding:10px 16px;text-align:center;cursor:pointer;box-shadow:0 8px 32px #0000001f;transition:transform .15s;position:relative;overflow:hidden}.winner-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,#f59e0b,#fbbf24,#f59e0b)}.winner-card:active{transform:scale(.98)}.winner-medal{font-size:24px;margin-bottom:4px;filter:drop-shadow(0 3px 8px rgba(245,158,11,.3))}.winner-info{display:flex;align-items:center;justify-content:center;gap:10px}.winner-flag{font-size:24px}.winner-name{font-size:18px;font-weight:800;color:var(--text);letter-spacing:-.02em}.winner-value{margin-top:6px;display:inline-block;background:color-mix(in srgb,var(--theme) 10%,#f8f9fa);color:color-mix(in srgb,var(--theme) 80%,#000);padding:4px 14px;border-radius:20px;font-size:13px;font-weight:700}.winner-detail{margin-top:16px;padding-top:16px;border-top:1px solid var(--border);font-size:13px;line-height:1.6;color:var(--text-sub);text-align:left;animation:fadeIn .2s ease-out}.podium{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:16px 16px 0}.podium-card{background:var(--card);border-radius:14px;box-shadow:var(--shadow);padding:16px 14px;text-align:center;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;transition:transform .1s;border:2px solid transparent}.podium-card:active{transform:scale(.97)}.podium-card-highlight{border-color:color-mix(in srgb,var(--theme) 50%,white);background:color-mix(in srgb,var(--theme) 4%,white)}.podium-medal{font-size:28px}.podium-flag{font-size:22px}.podium-name{font-size:14px;font-weight:700;color:var(--text)}.podium-value{font-size:12px;color:var(--text-sub);font-weight:500}.podium-detail{margin-top:8px;padding-top:8px;border-top:1px dashed var(--border);font-size:12px;line-height:1.5;color:var(--text-sub);text-align:left;width:100%;animation:fadeIn .2s ease-out}.rank-list{list-style:none;padding:12px 16px 0;margin:0;display:flex;flex-direction:column;gap:8px}.rank-card{background:var(--card);border-radius:14px;box-shadow:var(--shadow);padding:14px 16px;cursor:pointer;transition:transform .1s,box-shadow .15s;border:2px solid transparent}.rank-card:active{transform:scale(.99)}.rank-card-highlight{border-color:color-mix(in srgb,var(--theme) 50%,white);background:color-mix(in srgb,var(--theme) 4%,white)}.rank-card-expanded{box-shadow:0 4px 12px #0000000f}.rank-row{display:flex;align-items:center;gap:12px}.rank-num{width:36px;display:flex;justify-content:center;align-items:center;flex-shrink:0}.medal{font-size:26px}.num{font-size:18px;font-weight:800;color:var(--text-meta);font-variant-numeric:tabular-nums}.rank-body{flex:1;min-width:0}.rank-name-row{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.flag{font-size:16px}.name{font-size:15px;font-weight:700;color:var(--text)}.badge-kr{display:inline-block;padding:1px 5px;border-radius:4px;font-size:9px;font-weight:700;background:var(--theme);color:#fff;letter-spacing:.3px}.rank-value{margin-top:2px;font-size:12px;color:var(--text-sub);font-weight:500}.delta{flex-shrink:0;width:26px;height:26px;border-radius:8px;display:flex;align-items:center;justify-content:center;font-size:12px;font-weight:700}.delta-up{color:var(--up);background:color-mix(in srgb,var(--up) 8%,white)}.delta-down{color:var(--down);background:color-mix(in srgb,var(--down) 8%,white)}.delta-same{color:var(--same);background:color-mix(in srgb,var(--same) 8%,white)}.rank-detail{margin-top:12px;padding-top:12px;border-top:1px dashed var(--border);animation:fadeIn .2s ease-out}.rank-detail p{margin:0;font-size:13px;line-height:1.6;color:var(--text-sub)}@keyframes fadeIn{0%{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:translateY(0)}}.empty-state{text-align:center;padding:48px 16px}.empty-state-emoji{font-size:40px;margin:0}.empty-state-text{margin:12px 0 0;font-size:14px;color:var(--text-meta)}.namu-link{display:inline-block;margin-top:8px;font-size:12px;font-weight:600;color:var(--theme, #3182f6);text-decoration:none}.namu-link:active{opacity:.6}.winner-detail .namu-link{color:var(--theme, #3182f6)}.namu-btn{display:inline-flex;align-items:center;justify-content:center;padding:2px 6px;border-radius:6px;font-size:10px;font-weight:700;color:var(--text-meta);background:var(--bg);text-decoration:none;flex-shrink:0;transition:background .1s;letter-spacing:-.3px}.namu-btn:active{background:var(--border)}.winner-info .namu-btn{color:var(--text-meta);background:var(--bg)}.podium-card .namu-btn{margin-top:2px}.ad-placeholder{display:flex;align-items:center;justify-content:center;width:100%;min-height:64px;border-radius:var(--radius);background:repeating-linear-gradient(45deg,#ffe066,#ffe066 8px,#ffd43b 8px,#ffd43b 16px);border:2px dashed #f59f00}.ad-placeholder-label{color:#e67700;font-size:12px;font-weight:700;letter-spacing:.1em}.ad-slot-home{margin:0 16px 16px}.ad-slot-detail{margin:16px}.bottom-tab-bar{position:fixed;bottom:0;left:50%;transform:translate(-50%);display:flex;gap:4px;background:#ffffffb8;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);border-radius:24px;box-shadow:0 2px 16px #0000001a;padding:4px 8px;margin-bottom:calc(env(safe-area-inset-bottom,0px) + 6px);z-index:100}.bottom-tab{display:flex;flex-direction:column;align-items:center;gap:1px;background:none;border:none;padding:6px 20px;cursor:pointer;font-family:inherit;min-height:36px;border-radius:20px;color:var(--text-meta);position:relative;transition:color .15s,background .15s}.bottom-tab.active{color:var(--text);background:#191f2814}.bottom-tab:active{opacity:.6}.bottom-tab-icon{font-size:16px;line-height:1}.bottom-tab-label{font-size:9px;font-weight:600;letter-spacing:-.2px}.bottom-tab-badge{position:absolute;top:0;right:8px;min-width:16px;height:16px;padding:0 4px;border-radius:999px;background:#f04452;color:#fff;font-size:10px;font-weight:700;display:flex;align-items:center;justify-content:center;font-variant-numeric:tabular-nums}.favorites-tab{min-height:60vh}.fav-limit-info{display:flex;align-items:center;justify-content:space-between;padding:10px 14px;background:var(--card);border-radius:12px;box-shadow:var(--shadow);margin-bottom:12px}.fav-limit-text{font-size:13px;font-weight:700;color:var(--text-sub)}.fav-limit-btn{padding:6px 12px;background:var(--text);color:#fff;border:none;border-radius:999px;font-size:12px;font-weight:700;font-family:inherit;cursor:pointer;transition:transform .1s,opacity .1s}.fav-limit-btn:active{transform:scale(.95);opacity:.85}.favorites-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;animation:gridIn .2s ease-out}.empty-state-hint{margin:8px 0 0;font-size:13px;color:var(--text-meta)}.ad-modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000073;display:flex;align-items:flex-end;justify-content:center;z-index:200;animation:overlayIn .15s ease-out}@keyframes overlayIn{0%{opacity:0}to{opacity:1}}.ad-modal{width:100%;max-width:480px;background:#fff;border-radius:20px 20px 0 0;padding:28px 24px calc(24px + env(safe-area-inset-bottom,0px));text-align:center;animation:modalUp .2s ease-out}@keyframes modalUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.ad-modal-emoji{font-size:36px;margin:0 0 8px;color:#fbbf24}.ad-modal-title{margin:0;font-size:18px;font-weight:800;color:var(--text)}.ad-modal-desc{margin:8px 0 0;font-size:14px;color:var(--text-sub);line-height:1.5}.ad-modal-actions{display:flex;gap:8px;margin-top:20px}.ad-modal-cancel{flex:1;padding:14px;background:var(--bg);border:none;border-radius:12px;font-size:15px;font-weight:700;color:var(--text-sub);cursor:pointer;font-family:inherit;transition:background .1s}.ad-modal-cancel:active{background:var(--border)}.ad-modal-confirm{flex:1;padding:14px;background:var(--text);border:none;border-radius:12px;font-size:15px;font-weight:700;color:#fff;cursor:pointer;font-family:inherit;transition:transform .1s,opacity .1s}.ad-modal-confirm:active{transform:scale(.97);opacity:.85}
