:root{--bg:#f6f5fb;--surface:#fff;--text:#1c1a24;--muted:#6b6878;--border:#e6e3f0;--accent:#6d4aff;--accent-soft:#ece7ff;--accent-text:#fff;--bar:#c9bcff;--error-bg:#fff0f0;--error-text:#b42318;--radius:16px;color-scheme:light}@media (prefers-color-scheme:dark){:root{--bg:#121117;--surface:#1c1b23;--text:#f1f0f5;--muted:#a19eae;--border:#2e2c39;--accent:#9c85ff;--accent-soft:#2a2442;--accent-text:#121117;--bar:#4c3f8a;--error-bg:#3a1d1d;--error-text:#ffb4ab;color-scheme:dark}}*,:before,:after{box-sizing:border-box}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;word-break:keep-all;margin:0;font-family:Pretendard,-apple-system,BlinkMacSystemFont,Apple SD Gothic Neo,Malgun Gothic,system-ui,sans-serif;line-height:1.6}a{color:var(--accent)}h1,h2{margin:0;line-height:1.3}.container{max-width:640px;margin:0 auto;padding:32px 16px 48px}.muted{color:var(--muted);font-size:.875rem}.hero{text-align:center;margin-bottom:24px}.eyebrow{background:var(--accent-soft);color:var(--accent);border-radius:999px;margin:0 0 12px;padding:4px 12px;font-size:.8125rem;font-weight:600;display:inline-block}.hero h1{font-size:clamp(1.75rem,6vw,2.25rem)}.lead{color:var(--muted);margin:12px 0 0}.dropzone{border:2px dashed var(--border);border-radius:var(--radius);background:var(--surface);cursor:pointer;text-align:center;flex-direction:column;align-items:center;gap:4px;padding:32px 16px;transition:border-color .15s,background .15s;display:flex}.dropzone:hover,.dropzone:focus-within,.dropzone.is-dragging{border-color:var(--accent);background:var(--accent-soft)}.dropzone input{opacity:0;width:1px;height:1px;position:absolute}.icon{width:1em;height:1em;display:block}.dropzone-icon{color:var(--accent);font-size:2rem}.dropzone-title{font-size:1.125rem;font-weight:700}.privacy .icon{vertical-align:-.2em;width:1.1em;height:1.1em;color:var(--accent);margin-right:4px;display:inline-block}.privacy{text-align:center;color:var(--muted);margin:12px 0 0;font-size:.875rem}.status{text-align:center;color:var(--accent);margin:16px 0 0;font-weight:600}.result{gap:16px;margin-top:24px;scroll-margin-top:16px;display:grid}.card{border-radius:var(--radius);background:var(--surface);border:1px solid var(--border);min-width:0;padding:20px}.card h2{margin-bottom:12px;font-size:1.125rem}.overview h2{overflow-wrap:anywhere;margin-bottom:4px;font-size:1.375rem}.stats{grid-template-columns:repeat(3,1fr);gap:8px;margin:16px 0 0;display:grid}.stats div{background:var(--accent-soft);text-align:center;border-radius:12px;padding:12px 8px}.stats dt{color:var(--muted);font-size:.8125rem}.stats dd{margin:0;font-size:1.25rem;font-weight:700}.highlight{color:var(--muted);margin:-4px 0 16px}.highlight strong{color:var(--accent)}.notice{background:var(--accent-soft);border-radius:12px;padding:12px 16px;font-size:.9375rem}.notice p{margin:0}.notice-error{background:var(--error-bg);color:var(--error-text)}.versus-head{overflow-wrap:anywhere;justify-content:space-between;gap:16px;font-weight:700;display:flex}.share-bar{background:var(--bar);border-radius:999px;height:28px;margin:8px 0 16px;font-size:.8125rem;font-weight:700;display:flex;overflow:hidden}.share-bar span{white-space:nowrap;align-items:center;padding:0 10px;display:flex}.share-bar span:first-child{background:var(--accent);color:var(--accent-text)}.share-bar span:last-child{flex:1;justify-content:flex-end}.versus{border-collapse:collapse;width:100%}.versus th,.versus td{border-top:1px solid var(--border);padding:10px 4px}.versus th{color:var(--muted);text-align:center;font-size:.875rem;font-weight:400}.versus td{width:35%;font-weight:600}.versus td:first-child{text-align:left}.versus td:last-child{text-align:right}.versus td.win{color:var(--accent)}.titles{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:8px;margin:0;padding:0;list-style:none;display:grid}.titles li{background:var(--accent-soft);text-align:center;border-radius:12px;flex-direction:column;align-items:center;gap:2px;min-width:0;padding:16px 8px;display:flex}.title-icon{color:var(--accent);margin-bottom:4px;font-size:1.75rem}.title-label{color:var(--muted);font-size:.8125rem}.titles strong{overflow-wrap:anywhere;font-size:1.0625rem}.ranking{gap:10px;margin:0;padding:0;list-style:none;display:grid}.ranking li{grid-template-columns:24px minmax(0,6em) 1fr auto;align-items:center;gap:8px;display:grid}.rank{color:var(--muted);text-align:center;font-weight:700}.name{text-overflow:ellipsis;white-space:nowrap;font-weight:600;overflow:hidden}.bar{background:var(--accent-soft);border-radius:999px;height:10px;overflow:hidden}.bar span{background:var(--accent);border-radius:999px;height:100%;display:block}.count{text-align:right;white-space:nowrap;font-size:.875rem;font-weight:600}details{margin-top:12px}details summary{cursor:pointer;color:var(--accent);margin-bottom:10px;font-weight:600}.chart{align-items:flex-end;gap:2px;height:140px;padding-bottom:20px;display:flex;position:relative}.chart-col{flex:1;align-items:flex-end;min-width:0;height:100%;display:flex;position:relative}.chart-bar{background:var(--bar);border-radius:4px 4px 0 0;width:100%;min-height:2px}.chart-col.is-peak .chart-bar{background:var(--accent)}.chart-label{color:var(--muted);white-space:nowrap;font-size:.75rem;position:absolute;bottom:-20px;left:50%;transform:translate(-50%)}.share-options{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;display:flex}.segmented{background:var(--accent-soft);border-radius:12px;padding:4px;display:inline-flex}.segmented button{color:var(--muted);font:inherit;cursor:pointer;background:0 0;border:0;border-radius:9px;padding:8px 14px;font-size:.875rem;font-weight:600}.segmented button[aria-checked=true]{background:var(--surface);color:var(--accent);box-shadow:0 1px 3px #00000014}.toggle{cursor:pointer;align-items:center;gap:8px;font-size:.9375rem;font-weight:600;display:inline-flex}.toggle input{width:18px;height:18px;accent-color:var(--accent)}.share-preview{justify-content:center;display:flex}.share-preview canvas{border-radius:12px;width:100%;max-width:420px;height:auto;display:block;box-shadow:0 4px 16px #0000001f}.share[data-format=story] .share-preview canvas{max-width:280px}.share-actions{gap:8px;margin-top:16px;display:grid}.share-actions .button{margin-top:0}.button.button-secondary{background:var(--accent-soft);color:var(--accent)}.button{background:var(--accent);width:100%;color:var(--accent-text);font:inherit;cursor:pointer;border:0;border-radius:12px;margin-top:24px;padding:14px;font-weight:700;display:block}.button[hidden]{display:none}.howto{margin-top:40px}.howto h2{margin-bottom:8px;font-size:1.125rem}.howto ol{color:var(--muted);margin:0;padding-left:1.25em}.howto strong{color:var(--text)}.site-footer{padding:24px 16px calc(40px + env(safe-area-inset-bottom));text-align:center;color:var(--muted);font-size:.8125rem}.site-footer p{margin:4px 0}.site-header{border-bottom:1px solid var(--border);background:var(--surface)}.site-nav{justify-content:space-between;align-items:center;gap:16px;max-width:640px;margin:0 auto;padding:12px 16px;font-size:.9375rem;display:flex}.site-nav a{color:var(--muted);font-weight:600;text-decoration:none}.site-nav .brand{color:var(--text);font-weight:800}.prose h1{margin-bottom:8px;font-size:clamp(1.5rem,5vw,2rem)}.prose>section{margin-top:24px}.prose>section:not(.card) h2{margin-bottom:8px;font-size:1.125rem}.prose .card ul,.prose .card ol,.prose>section ul,.prose>section ol{margin:0;padding-left:1.25em}.prose li+li{margin-top:6px}.breadcrumb{color:var(--muted);margin:0 0 8px;font-size:.875rem}.breadcrumb a{text-decoration:none}.steps li::marker{color:var(--accent);font-weight:700}.prose .button{text-align:center;text-decoration:none}.related ul{color:var(--muted)}.guide-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:24px 0;padding:0;list-style:none;display:grid}.guide-link{height:100%;color:var(--text);flex-direction:column;gap:4px;text-decoration:none;transition:border-color .15s;display:flex}.guide-link:hover{border-color:var(--accent)}.guide-link strong{font-size:1.0625rem}.highlight-card{background:var(--accent-soft);border-color:#0000;margin-top:24px}.highlight-card p{margin:0}.info-table{border-collapse:collapse;width:100%;margin:12px 0;font-size:.875rem}.info-table th,.info-table td{border-bottom:1px solid var(--border);text-align:left;vertical-align:top;padding:10px 8px}.info-table th{color:var(--muted);font-weight:600}.device-links{color:var(--muted);margin:12px 0 0;font-size:.9375rem}.faq{margin-top:40px}.faq h2{margin-bottom:8px;font-size:1.125rem}.faq details{border-bottom:1px solid var(--border);margin:0;padding:14px 0}.faq summary{color:var(--text);margin:0}.faq details p{color:var(--muted);margin:8px 0 0}