*{box-sizing:border-box;margin:0;padding:0}
body{background:#0d1117;color:#e6edf3;font-family:-apple-system,BlinkMacSystemFont,'Segoe UI',Inter,sans-serif;min-height:100vh}
a{text-decoration:none;color:inherit}
.page{padding:62px 20px 60px;max-width:1300px;margin:0 auto}
.analytics-title{font-family:'Space Grotesk',Inter,sans-serif;font-size:28px;font-weight:800;color:#f0f6fc;margin:0 0 16px}
.analytics-muted{color:#334155;font-size:12px;padding:8px 0}
.analytics-error{color:#ef4444;font-size:12px}
.analytics-load-error{color:#ef4444;grid-column:1/-1}
.analytics-vessel-count{font-size:10px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:#475569;margin-bottom:8px}
.analytics-vessel-list{display:grid;gap:6px;max-height:220px;overflow-y:auto;scrollbar-width:thin;scrollbar-color:#334155 #0d1117}
.analytics-vessel-link{display:flex;align-items:center;gap:10px;padding:8px 12px;background:#0d1117;border-radius:8px;border:1px solid #1a2332;cursor:pointer;transition:border-color .15s;text-decoration:none}
.analytics-flex-fill{flex:1;min-width:0}
.analytics-vessel-name{font-size:12px;font-weight:700;color:#e2e8f0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.analytics-vessel-meta{font-size:10px;color:#475569;margin-top:2px}
.analytics-type-pill{font-size:10px;font-weight:700;padding:2px 8px;border-radius:8px;flex-shrink:0}
.analytics-type-pill-lng{color:#38bdf8;background:rgba(56,189,248,.1)}
.analytics-type-pill-product{color:#a78bfa;background:rgba(167,139,250,.1)}
.analytics-type-pill-crude{color:#f59e0b;background:rgba(245,158,11,.1)}
.analytics-tab-bar{display:flex;gap:4px;margin-bottom:16px;border-bottom:1px solid #21262d;padding-bottom:0}
.analytics-tab{padding:8px 18px;border:0;border-bottom:2px solid transparent;background:transparent;color:#475569;font-size:13px;font-weight:600;cursor:pointer}
.analytics-tab.is-active{border-bottom-color:#38bdf8;color:#f1f5f9;font-weight:700}
.analytics-about{background:#161b22;border:1px solid #21262d;border-radius:12px;padding:24px 28px;margin-top:4px}
.analytics-about-title{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.7px;color:#475569;margin-bottom:14px}
.analytics-about p{color:#94a3b8;font-size:14px;line-height:1.75;margin-bottom:14px}
.analytics-about p:last-of-type{margin-bottom:18px}
.analytics-about-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:12px}
.analytics-about-item{font-size:13px;color:#64748b}
.analytics-about-item a{color:#38bdf8;text-decoration:none;font-weight:600}
.analytics-tab-pane.is-hidden{display:none}
.analytics-pane-loading{color:#334155;font-size:13px;padding:20px 0;text-align:center}
.analytics-country-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:16px;margin-bottom:24px}
.analytics-country-card{display:block;background:#161b22;border:1px solid #21262d;border-radius:12px;padding:18px;text-decoration:none;transition:border-color .15s}
.analytics-country-flag{font-size:28px;margin-bottom:6px}
.analytics-country-name{font-size:15px;font-weight:700;color:#f1f5f9;margin-bottom:4px}
.analytics-country-desc{font-size:12px;color:#475569}
.analytics-note-card{background:#161b22;border:1px solid #21262d;border-radius:12px;padding:18px;font-size:13px;color:#475569}
.analytics-ssr-title{font-size:1rem;color:#94a3b8;margin-bottom:10px}
.analytics-ssr-updated{font-size:12px;color:#64748b;margin:-4px 0 12px}
.analytics-ssr-table{width:100%;border-collapse:collapse;font-size:13px;margin-bottom:24px}
.analytics-ssr-table th{background:#1e293b;color:#94a3b8;padding:8px 12px}
.analytics-ssr-table th:first-child{text-align:left}
.analytics-ssr-link,.analytics-ssr-links a{color:#38bdf8;text-decoration:none}
.analytics-ssr-links{display:flex;gap:10px;flex-wrap:wrap}
@keyframes chokePulse{0%,100%{opacity:1}50%{opacity:.4}}
@keyframes spin{to{transform:rotate(360deg)}}
.spinner{display:inline-block;width:14px;height:14px;border:2px solid #21262d;border-top-color:#38bdf8;border-radius:50%;animation:spin .7s linear infinite;vertical-align:middle}
.analytics-straits-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:24px;min-height:648px}
.analytics-strait-card{display:block;background:#161b22;border:1px solid #21262d;border-radius:12px;padding:18px;text-decoration:none;transition:border-color .15s;min-height:316px}
.analytics-hover-card:hover,.analytics-strait-card:hover,.analytics-vessel-link:hover{border-color:#334155!important}
.analytics-vessel-link:hover{border-color:#38bdf8!important}
.analytics-vessel-close{float:right;cursor:pointer;color:#334155;background:transparent;border:0;font:inherit;line-height:1;padding:0}
.analytics-chokepoint-option{display:flex;align-items:center;gap:10px;padding:10px 12px;background:#0d1117;border-radius:10px;border:1px solid #1a2332;cursor:pointer;transition:border-color .15s;text-align:left;font:inherit;width:100%}
.analytics-chokepoint-option.is-active{background:#1a0a0a;border-color:#ef4444}
.analytics-chokepoint-dot{width:8px;height:8px;border-radius:50%;background:#334155;flex-shrink:0}
.analytics-chokepoint-dot.has-transits{background:#ef4444;animation:chokePulse 2s infinite}
.analytics-chokepoint-name{font-size:12px;font-weight:600;color:#e2e8f0}
.analytics-chokepoint-name.is-active{font-weight:700;color:#f87171}
.analytics-bar-track{height:5px;background:#1a2332;border-radius:3px;overflow:hidden;margin-top:5px}
.analytics-bar-fill{width:0;height:100%;background:linear-gradient(90deg,#ef4444,#f97316);border-radius:3px}
.analytics-chokepoint-count{font-size:20px;font-weight:900;color:#334155;letter-spacing:-1px;width:32px;text-align:right}
.analytics-chokepoint-count.has-transits{color:#f87171}
.analytics-trend-up{color:#22c55e}
.analytics-trend-down{color:#ef4444}
.analytics-sparkline{width:100%;height:100%}
.analytics-strait-head{display:flex;align-items:center;gap:8px;margin-bottom:4px}
.analytics-status-dot{width:10px;height:10px;border-radius:50%;flex-shrink:0}
.analytics-status-green{background:#22c55e}
.analytics-status-amber{background:#f59e0b}
.analytics-status-red{background:#ef4444}
.analytics-strait-name{font-size:15px;font-weight:700;color:#e2e8f0}
.analytics-strait-region{font-size:11px;color:#475569;margin-bottom:12px}
.analytics-live-row{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.analytics-live-dot{width:8px;height:8px;border-radius:50%;background:#22c55e;animation:chokePulse 2s infinite;flex-shrink:0}
.analytics-today-count{font-size:22px;font-weight:800;color:#f0f6fc}
.analytics-live-label{font-size:11px;color:#475569}
.analytics-spark-wrap{height:48px;border-radius:6px;overflow:hidden;margin-bottom:10px}
.analytics-card-stats{display:flex;justify-content:space-between;font-size:11px;color:#475569}
.analytics-ports-note{font-size:11px;color:#475569;margin-bottom:14px}
.analytics-ports-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:10px}
.analytics-port-card{display:block;background:#161b22;border:1px solid #21262d;border-radius:12px;padding:14px 16px;text-decoration:none;transition:border-color .15s}
.analytics-port-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:6px}
.analytics-port-name{font-size:13px;font-weight:700;color:#e2e8f0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:160px}
.analytics-port-commodity{font-size:10px;font-weight:700;background:rgba(56,189,248,.08);padding:2px 7px;border-radius:8px;flex-shrink:0}
.analytics-port-commodity-lng{color:#38bdf8}
.analytics-port-commodity-crude{color:#f59e0b}
.analytics-port-commodity-products{color:#a78bfa}
.analytics-port-commodity-default{color:#94a3b8}
.analytics-port-country{font-size:11px;color:#475569;margin-bottom:8px}
.analytics-port-stats{display:flex;align-items:center;justify-content:space-between}
.analytics-port-arrivals{font-size:11px;color:#64748b}
.analytics-port-trend{font-size:11px;font-weight:700}
.analytics-footer{background:#0c1322;border-top:1px solid #1e293b;padding:18px 24px;text-align:center;color:#475569;font-size:13px}
.analytics-footer a{color:#475569;text-decoration:none}
.analytics-strait-skeleton{background:linear-gradient(90deg,#161b22 0%,#1a2332 50%,#161b22 100%);background-size:200% 100%;animation:analyticsSkeleton 1.2s ease-in-out infinite}
@keyframes analyticsSkeleton{0%{background-position:200% 0}100%{background-position:-200% 0}}
@media (min-width:760px){.analytics-straits-grid{min-height:416px}.analytics-strait-card{min-height:196px}}