:root{--primary-50:#eef2ff;--primary-100:#e0e7ff;--primary-500:#6366f1;--primary-600:#4f46e5;--accent-500:#8b5cf6;--success-50:#ecfdf5;--success-100:#d1fae5;--success-500:#10b981;--success-600:#059669;--success-700:#047857;--warning-50:#fffbeb;--warning-500:#f59e0b;--warning-600:#d97706;--danger-50:#fef2f2;--danger-100:#fee2e2;--danger-500:#ef4444;--danger-600:#dc2626;--info-50:#eff6ff;--info-400:#60a5fa;--info-500:#3b82f6;--info-600:#2563eb;--gray-25:#fcfcfd;--gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-400:#9ca3af;--gray-500:#6b7280;--gray-600:#4b5563;--gray-700:#374151;--gray-800:#1f2937;--gray-900:#111827;--bg:#f5f6fa;--surface:#fff;--font:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--text-xs:.75rem;--text-sm:.8125rem;--text-base:.9375rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--radius-sm:.375rem;--radius-md:.5rem;--radius-lg:.75rem;--radius-xl:1rem;--radius-2xl:1.25rem;--radius-full:9999px;--border:1px solid var(--gray-200);--shadow-xs:0 1px 2px #0000000a;--shadow-sm:0 1px 3px #0000000f, 0 1px 2px #0000000a;--shadow-md:0 4px 6px -1px #0000000f, 0 2px 4px -2px #0000000a;--shadow-lg:0 10px 15px -3px #0000000f, 0 4px 6px -4px #0000000a;--shadow-xl:0 20px 25px -5px #00000014, 0 8px 10px -6px #0000000a;--shadow-primary:0 4px 14px #6366f140;--transition-fast:.15s cubic-bezier(.4,0,.2,1);--transition-base:.25s cubic-bezier(.4,0,.2,1);--transition-slow:.35s cubic-bezier(.4,0,.2,1);--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{-webkit-font-smoothing:antialiased;font-size:16px}body{font-family:var(--font);color:var(--gray-800);background:var(--bg);min-height:100vh;line-height:1.6}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}.upload-overlay{z-index:100;background:var(--bg);opacity:0;visibility:hidden;transition:opacity var(--transition-slow), visibility var(--transition-slow);justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.upload-overlay.active{opacity:1;visibility:visible}.upload-container{text-align:center;width:100%;max-width:500px;padding:var(--space-8);animation:.55s ease-out fadeInUp}.upload-brand{margin-bottom:var(--space-10)}.upload-logo{margin-bottom:var(--space-4);filter:drop-shadow(0 4px 12px #6366f14d);display:inline-flex}.upload-title{font-size:var(--text-2xl);letter-spacing:-.025em;background:linear-gradient(135deg, var(--primary-600), var(--accent-500));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text;font-weight:800}.upload-subtitle{font-size:var(--text-sm);color:var(--gray-500);margin-top:var(--space-2)}.drop-zone{background:var(--surface);border:2px dashed var(--gray-300);border-radius:var(--radius-2xl);padding:var(--space-12) var(--space-8);cursor:pointer;transition:all var(--transition-base)}.drop-zone:hover,.drop-zone.drag-over{border-color:var(--primary-400);background:var(--primary-50);box-shadow:var(--shadow-lg);transform:translateY(-2px)}.drop-zone.drag-over{border-style:solid}.drop-zone-icon{color:var(--gray-400);margin-bottom:var(--space-4);transition:color var(--transition-base)}.drop-zone:hover .drop-zone-icon,.drop-zone.drag-over .drop-zone-icon{color:var(--primary-500)}.drop-zone-text{font-size:var(--text-lg);color:var(--gray-700);margin-bottom:var(--space-2);font-weight:600}.drop-zone-hint{font-size:var(--text-sm);color:var(--gray-400);margin-bottom:var(--space-4)}.drop-zone-formats{font-size:var(--text-xs);color:var(--gray-400);margin-top:var(--space-4)}.btn{align-items:center;gap:var(--space-2);font-family:var(--font);font-size:var(--text-sm);border-radius:var(--radius-lg);cursor:pointer;transition:all var(--transition-fast);white-space:nowrap;border:none;padding:.5625rem 1.125rem;font-weight:600;line-height:1;text-decoration:none;display:inline-flex}.btn-primary{background:linear-gradient(135deg, var(--primary-500), var(--accent-500));color:#fff;box-shadow:var(--shadow-primary)}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px #6366f159}.btn-secondary{background:var(--gray-800);color:#fff}.btn-secondary:hover{background:var(--gray-700);transform:translateY(-1px)}.btn-outline{background:var(--surface);color:var(--gray-700);border:1px solid var(--gray-300)}.btn-outline:hover{background:var(--gray-50);border-color:var(--gray-400)}.dashboard{min-height:100vh}.hidden{display:none!important}.header{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:var(--border);padding:var(--space-4) var(--space-8);z-index:50;background:#ffffffeb;justify-content:space-between;align-items:center;display:flex;position:sticky;top:0}.header-left{align-items:center;gap:var(--space-3);display:flex}.header-logo{flex-shrink:0}.header-title{font-size:var(--text-base);color:var(--gray-900);letter-spacing:-.01em;font-weight:700}.header-domain{font-size:var(--text-xs);color:var(--primary-500);font-weight:500}.header-right{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.header-date{font-size:var(--text-xs);color:var(--gray-500);padding:3px var(--space-3);background:var(--gray-100);border-radius:var(--radius-full)}.export-group{gap:var(--space-2);display:flex}.main{max-width:1200px;padding:var(--space-6) var(--space-8);gap:var(--space-6);flex-direction:column;margin:0 auto;display:flex}.kpi-section{gap:var(--space-4);grid-template-columns:repeat(4,1fr);animation:.5s ease-out both fadeInUp;display:grid}.kpi-card{background:var(--surface);border-radius:var(--radius-xl);padding:var(--space-5) var(--space-5);align-items:center;gap:var(--space-4);border:var(--border);box-shadow:var(--shadow-xs);transition:all var(--transition-base);display:flex}.kpi-card:first-child{animation-delay:50ms}.kpi-card:nth-child(2){animation-delay:.1s}.kpi-card:nth-child(3){animation-delay:.15s}.kpi-card:nth-child(4){animation-delay:.2s}.kpi-card:hover{box-shadow:var(--shadow-md);transform:translateY(-2px)}.kpi-icon{border-radius:var(--radius-lg);flex-shrink:0;justify-content:center;align-items:center;width:46px;height:46px;display:flex}.kpi-icon-total{background:var(--primary-50);color:var(--primary-600)}.kpi-icon-ranked{background:var(--success-50);color:var(--success-600)}.kpi-icon-unranked{background:var(--gray-100);color:var(--gray-500)}.kpi-icon-avg{background:var(--info-50);color:var(--info-600)}.kpi-info{flex-direction:column;display:flex}.kpi-value{font-size:var(--text-2xl);color:var(--gray-900);letter-spacing:-.025em;font-weight:800;line-height:1.15}.kpi-label{font-size:var(--text-xs);color:var(--gray-500);margin-top:2px;font-weight:500}.kpi-sub{font-size:var(--text-xs);color:var(--success-600);margin-top:1px;font-weight:600}.kpi-sub-gray{color:var(--gray-400)}.kpi-sub-blue{color:var(--info-500)}.section-block{background:var(--surface);border-radius:var(--radius-xl);border:var(--border);box-shadow:var(--shadow-xs);animation:.5s ease-out .2s both fadeInUp;overflow:hidden}.section-header{padding:var(--space-5) var(--space-6);border-bottom:var(--border);justify-content:space-between;align-items:flex-start;gap:var(--space-4);flex-wrap:wrap;display:flex}.section-title{font-size:var(--text-base);color:var(--gray-800);font-weight:700}.section-desc{font-size:var(--text-xs);color:var(--gray-500);margin-top:2px}.section-legend{gap:var(--space-3);flex-wrap:wrap;align-items:center;display:flex}.legend-item{font-size:var(--text-xs);color:var(--gray-600);align-items:center;gap:6px;font-weight:500;display:flex}.legend-dot{border-radius:3px;flex-shrink:0;width:10px;height:10px}.chart-wrap{padding:var(--space-5) var(--space-6);position:relative}.chart-wrap-lg{height:340px}.chart-wrap-md{height:300px}.change-summary{gap:var(--space-2);flex-wrap:wrap;align-items:center;display:flex}.change-chip{border-radius:var(--radius-full);font-size:var(--text-xs);align-items:center;gap:4px;padding:4px 10px;font-weight:600;display:inline-flex}.chip-up{background:var(--success-50);color:var(--success-700)}.chip-down{background:var(--danger-50);color:var(--danger-600)}.chip-same{background:var(--gray-100);color:var(--gray-600)}.table-controls{align-items:center;gap:var(--space-3);flex-wrap:wrap;display:flex}.search-box{align-items:center;gap:var(--space-2);background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--radius-lg);padding:var(--space-2) var(--space-3);transition:all var(--transition-fast);color:var(--gray-400);display:flex}.search-box:focus-within{border-color:var(--primary-400);background:var(--surface);box-shadow:0 0 0 3px var(--primary-100)}.search-box input{font-family:var(--font);font-size:var(--text-sm);color:var(--gray-800);background:0 0;border:none;outline:none;width:180px}.search-box input::placeholder{color:var(--gray-400)}.table-select{font-family:var(--font);font-size:var(--text-sm);color:var(--gray-700);background:var(--gray-50);border:1px solid var(--gray-200);border-radius:var(--radius-lg);padding:var(--space-2) var(--space-3);cursor:pointer;transition:all var(--transition-fast);outline:none}.table-select:focus{border-color:var(--primary-400);box-shadow:0 0 0 3px var(--primary-100)}.table-wrapper{overflow-x:auto}table{border-collapse:collapse;width:100%}thead{background:var(--gray-50)}th{padding:var(--space-3) var(--space-4);text-align:left;font-size:var(--text-xs);color:var(--gray-500);text-transform:uppercase;letter-spacing:.05em;white-space:nowrap;border-bottom:var(--border);-webkit-user-select:none;user-select:none;font-weight:600}th.sortable{cursor:pointer;transition:color var(--transition-fast)}th.sortable:hover{color:var(--primary-600)}th.sorted-asc .sort-icon:after{content:"↑"}th.sorted-desc .sort-icon:after{content:"↓"}.sort-icon{opacity:.5;font-size:.7rem}td{padding:var(--space-3) var(--space-4);font-size:var(--text-sm);color:var(--gray-700);border-bottom:1px solid var(--gray-100);vertical-align:middle}tbody tr{transition:background var(--transition-fast)}tbody tr:hover{background:var(--gray-25)}tbody tr:last-child td{border-bottom:none}.th-index{text-align:center;width:44px}td:first-child{text-align:center;color:var(--gray-400);font-size:var(--text-xs)}.td-keyword{color:var(--gray-800);max-width:320px;font-weight:500}.td-pos{text-align:center}.td-change{text-align:center;font-weight:600;font-size:var(--text-xs)}.td-url{text-overflow:ellipsis;white-space:nowrap;max-width:260px;overflow:hidden}.td-url a{color:var(--primary-500);font-size:var(--text-xs);text-decoration:none}.td-url a:hover{text-decoration:underline}.pos-badge{border-radius:var(--radius-full);min-width:34px;font-size:var(--text-xs);justify-content:center;align-items:center;padding:2px 8px;font-weight:700;display:inline-flex}.pos-top10{color:#065f46;background:#dcfce7}.pos-top30{color:#1d4ed8;background:#dbeafe}.pos-top50{color:#92400e;background:#fef3c7}.pos-top100{color:#9a3412;background:#ffedd5}.pos-over100{background:var(--danger-50);color:var(--danger-600)}.pos-unranked{background:var(--gray-100);color:var(--gray-500);font-size:.6875rem;font-weight:500}.change-up{color:var(--success-600)}.change-down{color:var(--danger-500)}.change-same{color:var(--gray-400)}.table-footer{padding:var(--space-3) var(--space-6);border-top:var(--border);font-size:var(--text-xs);color:var(--gray-500)}.export-loading{z-index:200;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#0006;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.export-loading-content{background:var(--surface);padding:var(--space-8) var(--space-10);border-radius:var(--radius-xl);text-align:center;box-shadow:var(--shadow-xl)}.export-loading-content p{margin-top:var(--space-4);color:var(--gray-700);font-weight:600}.spinner{border:3px solid var(--gray-200);border-top-color:var(--primary-500);border-radius:50%;width:38px;height:38px;margin:0 auto;animation:.8s linear infinite spin}@keyframes fadeInUp{0%{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}@media (width<=1024px){.kpi-section{grid-template-columns:repeat(2,1fr)}}@media (width<=768px){.header{padding:var(--space-3) var(--space-4);gap:var(--space-3);flex-wrap:wrap}.header-right{justify-content:flex-end;width:100%}.main{padding:var(--space-4);gap:var(--space-4)}.kpi-section{gap:var(--space-3)}.kpi-card{padding:var(--space-4)}.kpi-value{font-size:var(--text-xl)}.chart-wrap-lg{height:280px}.chart-wrap-md{height:240px}.section-header{flex-direction:column}.td-keyword{max-width:200px}.td-url{max-width:140px}}@media (width<=540px){.kpi-section{grid-template-columns:repeat(2,1fr)}.kpi-icon{width:40px;height:40px}.kpi-icon svg{width:18px;height:18px}.kpi-value{font-size:var(--text-lg)}.export-group .btn{padding:.5rem .75rem;font-size:.75rem}}