#suvm-app,
#suvm-app * { box-sizing: border-box; }

#suvm-app {
  --suvm-navy:#071421;
  --suvm-navy-2:#0b1d2d;
  --suvm-blue:#2f8cff;
  --suvm-cyan:#43c7d8;
  --suvm-green:#22b573;
  --suvm-amber:#e6a23c;
  --suvm-purple:#7f6df2;
  --suvm-red:#e15759;
  --suvm-ink:#122231;
  --suvm-muted:#607385;
  --suvm-line:#dbe4ec;
  --suvm-soft:#f5f8fb;
  --suvm-white:#fff;
  width:100%;
  color:var(--suvm-ink);
  font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-size:16px;
  line-height:1.45;
}

#suvm-app button,
#suvm-app input,
#suvm-app select { font:inherit; }

#suvm-app .suvm-hero {
  overflow:hidden;
  border-radius:24px 24px 0 0;
  background:
    radial-gradient(circle at 82% 12%, rgba(47,140,255,.24), transparent 28%),
    radial-gradient(circle at 10% 90%, rgba(67,199,216,.13), transparent 30%),
    linear-gradient(135deg, #06111c, #0a1d2e 55%, #0d263d);
  color:#fff;
  box-shadow:0 18px 48px rgba(11,30,47,.18);
}

#suvm-app .suvm-hero__topline {
  display:flex;
  gap:10px;
  align-items:center;
  padding:15px 24px;
  border-bottom:1px solid rgba(255,255,255,.09);
  font-size:12px;
  font-weight:800;
  letter-spacing:.13em;
}

#suvm-app .suvm-live-dot {
  width:8px;
  height:8px;
  flex:0 0 8px;
  border-radius:50%;
  background:#5ae4a7;
  box-shadow:0 0 0 5px rgba(90,228,167,.1), 0 0 15px rgba(90,228,167,.7);
}

#suvm-app .suvm-updated {
  margin-left:auto;
  color:#a8bed0;
  font-weight:700;
  letter-spacing:0;
  text-transform:none;
}

#suvm-app .suvm-hero__content {
  display:grid;
  grid-template-columns:minmax(0,1fr) 150px;
  gap:28px;
  align-items:center;
  padding:35px 34px 28px;
}

#suvm-app .suvm-kicker,
#suvm-app .suvm-eyebrow {
  margin:0 0 7px;
  color:#6ed8e8;
  font-size:11px;
  font-weight:900;
  letter-spacing:.15em;
  text-transform:uppercase;
}

#suvm-app .suvm-hero h1 {
  margin:0;
  color:#fff;
  font-size:clamp(31px,4.1vw,53px);
  line-height:1.02;
  letter-spacing:-.035em;
  font-weight:850;
}

#suvm-app .suvm-subtitle {
  max-width:830px;
  margin:15px 0 0;
  color:#bdd0df;
  font-size:16px;
  line-height:1.65;
}

#suvm-app .suvm-pulse {
  display:flex;
  min-height:130px;
  padding:18px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:20px;
  background:rgba(255,255,255,.055);
  align-items:center;
  justify-content:center;
  flex-direction:column;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.05);
}

#suvm-app .suvm-pulse__label {
  color:#8faabd;
  font-size:10px;
  font-weight:900;
  letter-spacing:.14em;
}

#suvm-app .suvm-pulse strong {
  margin:5px 0 2px;
  color:#fff;
  font-size:45px;
  line-height:1;
}

#suvm-app .suvm-pulse > span:last-child { color:#78d9e7; font-weight:800; font-size:13px; }

#suvm-app .suvm-stats {
  display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));
  border-top:1px solid rgba(255,255,255,.09);
  background:rgba(1,9,16,.22);
}

#suvm-app .suvm-stat {
  min-width:0;
  padding:18px 24px 20px;
  border-right:1px solid rgba(255,255,255,.08);
}
#suvm-app .suvm-stat:last-child { border-right:0; }
#suvm-app .suvm-stat strong { display:block; color:#fff; font-size:25px; line-height:1.1; }
#suvm-app .suvm-stat span { display:block; margin-top:5px; color:#91a9bb; font-size:12px; font-weight:700; }

#suvm-app .suvm-tabs {
  display:flex;
  overflow-x:auto;
  scrollbar-width:thin;
  border:1px solid var(--suvm-line);
  border-top:0;
  background:#fff;
  box-shadow:0 6px 20px rgba(18,34,49,.05);
}

#suvm-app .suvm-tab {
  position:relative;
  flex:0 0 auto;
  min-width:140px;
  padding:17px 20px;
  border:0;
  border-right:1px solid #e7edf2;
  background:#fff;
  color:#506477;
  cursor:pointer;
  font-weight:800;
}
#suvm-app .suvm-tab:hover { background:#f8fbfd; color:#172b3b; }
#suvm-app .suvm-tab.is-active { color:#0a67c7; background:#f6faff; }
#suvm-app .suvm-tab.is-active:after {
  content:"";
  position:absolute;
  left:20px;
  right:20px;
  bottom:0;
  height:3px;
  border-radius:4px 4px 0 0;
  background:#2f8cff;
}

#suvm-app .suvm-toolbar {
  display:grid;
  grid-template-columns:minmax(280px,1.7fr) repeat(3,minmax(145px,.65fr)) auto;
  gap:10px;
  padding:16px;
  border:1px solid var(--suvm-line);
  border-top:0;
  background:#f8fafc;
}

#suvm-app .suvm-search-wrap { position:relative; }
#suvm-app .suvm-search-wrap > span {
  position:absolute;
  left:14px;
  top:50%;
  transform:translateY(-50%);
  color:#8394a4;
  font-size:22px;
  pointer-events:none;
}
#suvm-app .suvm-search-wrap input { padding-left:42px; }
#suvm-app .suvm-toolbar input,
#suvm-app .suvm-toolbar select {
  width:100%;
  min-height:43px;
  border:1px solid #cad6df;
  border-radius:10px;
  background:#fff;
  color:#1b2f3f;
  padding:9px 12px;
  outline:none;
}
#suvm-app .suvm-toolbar input:focus,
#suvm-app .suvm-toolbar select:focus { border-color:#70adf1; box-shadow:0 0 0 3px rgba(47,140,255,.12); }
#suvm-app .suvm-reset {
  min-height:43px;
  padding:9px 16px;
  border:1px solid #becbd5;
  border-radius:10px;
  background:#fff;
  color:#263d50;
  font-weight:800;
  cursor:pointer;
}

#suvm-app .suvm-main {
  border:1px solid var(--suvm-line);
  border-top:0;
  border-radius:0 0 24px 24px;
  background:#eef3f7;
  padding:22px;
}

#suvm-app .suvm-view { display:none; }
#suvm-app .suvm-view.is-active { display:block; }

#suvm-app .suvm-radar-grid {
  display:grid;
  grid-template-columns:minmax(0,1.65fr) minmax(320px,.7fr);
  gap:18px;
}

#suvm-app .suvm-map-card,
#suvm-app .suvm-feed-card,
#suvm-app .suvm-market-card,
#suvm-app .suvm-table-wrap,
#suvm-app .suvm-section-intro {
  border:1px solid #d8e2e9;
  border-radius:18px;
  background:#fff;
  box-shadow:0 8px 24px rgba(23,45,63,.06);
}

#suvm-app .suvm-card-heading {
  display:flex;
  gap:18px;
  align-items:center;
  justify-content:space-between;
  padding:18px 20px 15px;
}
#suvm-app .suvm-card-heading h2,
#suvm-app .suvm-section-intro h2 { margin:0; color:#102638; font-size:23px; line-height:1.12; }

#suvm-app .suvm-map-legend { display:flex; gap:12px; flex-wrap:wrap; justify-content:flex-end; color:#63788a; font-size:11px; font-weight:750; }
#suvm-app .suvm-map-legend span { display:flex; align-items:center; gap:5px; }
#suvm-app .suvm-map-legend i { display:inline-block; width:9px; height:9px; border-radius:50%; }
#suvm-app .suvm-map-legend .is-sale { background:var(--suvm-blue); }
#suvm-app .suvm-map-legend .is-charter { background:var(--suvm-green); }
#suvm-app .suvm-map-legend .is-open { background:var(--suvm-amber); }
#suvm-app .suvm-map-legend .is-both { background:var(--suvm-purple); }

#suvm-app .suvm-map { width:100%; min-height:560px; border-top:1px solid #e2e8ee; }
#suvm-app .suvm-map-note { padding:10px 15px 12px; border-top:1px solid #e5ebf0; color:#687d8e; background:#fbfcfd; font-size:11px; border-radius:0 0 18px 18px; }

#suvm-app .suvm-count-pill {
  display:inline-flex;
  min-width:32px;
  height:28px;
  padding:0 9px;
  border-radius:999px;
  align-items:center;
  justify-content:center;
  background:#edf5ff;
  color:#176fc7;
  font-size:12px;
  font-weight:900;
}

#suvm-app .suvm-feed { max-height:610px; overflow:auto; padding:0 10px 10px; }
#suvm-app .suvm-feed-item {
  display:block;
  width:100%;
  padding:15px 12px;
  border:0;
  border-top:1px solid #e7edf2;
  background:#fff;
  text-align:left;
  cursor:pointer;
}
#suvm-app .suvm-feed-item:hover { background:#f8fbfd; }
#suvm-app .suvm-feed-top { display:flex; gap:8px; align-items:center; justify-content:space-between; margin-bottom:6px; }
#suvm-app .suvm-feed-title { color:#162c3e; font-weight:850; font-size:14px; line-height:1.35; }
#suvm-app .suvm-feed-meta { margin-top:7px; color:#718495; font-size:12px; }
#suvm-app .suvm-feed-price { margin-top:8px; color:#102638; font-size:14px; font-weight:900; }

#suvm-app .suvm-badge {
  display:inline-flex;
  align-items:center;
  min-height:22px;
  border-radius:999px;
  padding:3px 8px;
  font-size:10px;
  font-weight:900;
  letter-spacing:.04em;
  text-transform:uppercase;
  white-space:nowrap;
}
#suvm-app .suvm-badge--sale { background:#eaf3ff; color:#176bc2; }
#suvm-app .suvm-badge--charter { background:#e8f8f0; color:#168354; }
#suvm-app .suvm-badge--open_tonnage { background:#fff4df; color:#99600c; }
#suvm-app .suvm-badge--sale_or_charter { background:#f0edff; color:#6854cc; }
#suvm-app .suvm-badge--event { background:#f1f4f7; color:#53697b; }

#suvm-app .suvm-section-intro {
  display:flex;
  justify-content:space-between;
  gap:24px;
  align-items:center;
  padding:20px 22px;
  margin-bottom:16px;
}
#suvm-app .suvm-section-intro p { margin:7px 0 0; color:#63788a; }
#suvm-app .suvm-big-metric { flex:0 0 auto; min-width:125px; text-align:right; }
#suvm-app .suvm-big-metric strong { display:block; color:#11283a; font-size:33px; line-height:1; }
#suvm-app .suvm-big-metric span { display:block; margin-top:5px; color:#718698; font-size:11px; font-weight:800; }

#suvm-app .suvm-card-grid {
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

#suvm-app .suvm-market-card {
  position:relative;
  overflow:hidden;
  padding:18px;
  cursor:pointer;
  transition:transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
#suvm-app .suvm-market-card:hover { transform:translateY(-2px); border-color:#b8cbe0; box-shadow:0 13px 30px rgba(23,45,63,.10); }
#suvm-app .suvm-market-card:before { content:""; position:absolute; top:0; left:0; right:0; height:3px; background:#2f8cff; }
#suvm-app .suvm-market-card.is-charter:before { background:var(--suvm-green); }
#suvm-app .suvm-market-card.is-open_tonnage:before { background:var(--suvm-amber); }
#suvm-app .suvm-market-card.is-sale_or_charter:before { background:var(--suvm-purple); }
#suvm-app .suvm-market-card__top { display:flex; align-items:center; justify-content:space-between; gap:10px; }
#suvm-app .suvm-market-card h3 { margin:12px 0 8px; color:#102638; font-size:17px; line-height:1.28; }
#suvm-app .suvm-market-card__summary { margin:0; color:#5d7284; font-size:13px; line-height:1.55; }
#suvm-app .suvm-market-card__specs { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 14px; margin-top:14px; padding-top:13px; border-top:1px solid #e6edf2; }
#suvm-app .suvm-market-card__specs span { min-width:0; color:#6f8495; font-size:11px; }
#suvm-app .suvm-market-card__specs strong { display:block; overflow:hidden; color:#203747; font-size:12px; text-overflow:ellipsis; white-space:nowrap; }
#suvm-app .suvm-market-card__price { margin-top:14px; color:#102638; font-weight:900; font-size:18px; }
#suvm-app .suvm-market-card__source { margin-top:8px; color:#788b9a; font-size:11px; }

#suvm-app .suvm-table-wrap { overflow:auto; }
#suvm-app .suvm-table { width:100%; min-width:900px; border-collapse:collapse; }
#suvm-app .suvm-table th { padding:13px 14px; border-bottom:1px solid #dce6ed; background:#f7f9fb; color:#65798a; text-align:left; font-size:10px; font-weight:900; letter-spacing:.08em; text-transform:uppercase; }
#suvm-app .suvm-table td { padding:14px; border-bottom:1px solid #e7edf2; color:#304858; font-size:12px; vertical-align:top; }
#suvm-app .suvm-table tbody tr { cursor:pointer; }
#suvm-app .suvm-table tbody tr:hover { background:#f7fbff; }
#suvm-app .suvm-table td strong { color:#11293b; font-size:13px; }

#suvm-app .suvm-empty {
  grid-column:1/-1;
  padding:42px 22px;
  border:1px dashed #c8d4dd;
  border-radius:16px;
  background:rgba(255,255,255,.68);
  color:#718697;
  text-align:center;
}

#suvm-app .suvm-drawer-backdrop {
  position:fixed;
  inset:0;
  z-index:99997;
  background:rgba(1,11,18,.48);
  backdrop-filter:blur(1px);
}
#suvm-app .suvm-drawer {
  position:fixed;
  top:0;
  right:0;
  z-index:99998;
  width:min(570px,94vw);
  height:100vh;
  overflow:auto;
  padding:0 0 40px;
  background:#fff;
  box-shadow:-18px 0 48px rgba(4,23,36,.24);
  transform:translateX(103%);
  transition:transform .22s ease;
}
#suvm-app .suvm-drawer.is-open { transform:translateX(0); }
#suvm-app .suvm-drawer-close {
  position:sticky;
  top:12px;
  float:right;
  z-index:2;
  width:39px;
  height:39px;
  margin:12px 14px 0 0;
  border:1px solid #d6e0e7;
  border-radius:50%;
  background:#fff;
  color:#21394a;
  font-size:26px;
  line-height:1;
  cursor:pointer;
  box-shadow:0 4px 15px rgba(17,39,56,.08);
}
#suvm-app .suvm-drawer-head {
  clear:both;
  padding:13px 28px 24px;
  border-bottom:1px solid #e3eaf0;
  background:linear-gradient(180deg,#f8fbfe,#fff);
}
#suvm-app .suvm-drawer-head h2 { margin:10px 0 10px; color:#0d2435; font-size:28px; line-height:1.12; }
#suvm-app .suvm-drawer-summary { margin:14px 0 0; color:#506779; line-height:1.65; }
#suvm-app .suvm-drawer-source { margin-top:11px; color:#708696; font-size:12px; }
#suvm-app .suvm-drawer-price { margin-top:16px; color:#0f2a3d; font-size:25px; font-weight:900; }
#suvm-app .suvm-drawer-body { padding:22px 28px; }
#suvm-app .suvm-detail-section { margin-bottom:24px; }
#suvm-app .suvm-detail-section h3 { margin:0 0 11px; color:#173044; font-size:15px; }
#suvm-app .suvm-detail-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:9px; }
#suvm-app .suvm-detail {
  min-width:0;
  padding:10px 11px;
  border:1px solid #e0e8ee;
  border-radius:11px;
  background:#f8fafc;
}
#suvm-app .suvm-detail span { display:block; color:#7b8f9e; font-size:10px; font-weight:800; text-transform:uppercase; letter-spacing:.05em; }
#suvm-app .suvm-detail strong { display:block; margin-top:3px; overflow-wrap:anywhere; color:#203748; font-size:13px; }
#suvm-app .suvm-source-button {
  display:inline-flex;
  min-height:43px;
  padding:10px 15px;
  border-radius:10px;
  align-items:center;
  background:#106fce;
  color:#fff !important;
  font-weight:850;
  text-decoration:none !important;
}
#suvm-app .suvm-source-button:hover { background:#0b5fab; }
#suvm-app .suvm-tags { display:flex; flex-wrap:wrap; gap:7px; }
#suvm-app .suvm-tags span { padding:5px 8px; border-radius:999px; background:#eef3f7; color:#5b7082; font-size:11px; }
#suvm-app .suvm-history { position:relative; padding-left:18px; }
#suvm-app .suvm-history:before { content:""; position:absolute; left:4px; top:4px; bottom:4px; width:2px; background:#dce6ed; }
#suvm-app .suvm-history-item { position:relative; padding:0 0 16px 10px; }
#suvm-app .suvm-history-item:before { content:""; position:absolute; left:-18px; top:4px; width:10px; height:10px; border:2px solid #fff; border-radius:50%; background:#2f8cff; box-shadow:0 0 0 1px #a9bfd2; }
#suvm-app .suvm-history-item strong { color:#183144; font-size:12px; }
#suvm-app .suvm-history-item small { display:block; margin-top:2px; color:#7c8e9d; }
#suvm-app .suvm-history-changes { margin-top:5px; color:#5f7485; font-size:11px; line-height:1.5; }

#suvm-app .leaflet-popup-content-wrapper { border-radius:12px; }
#suvm-app .leaflet-popup-content { margin:13px 15px; min-width:210px; }
#suvm-app .suvm-popup-title { color:#122b3d; font-weight:900; line-height:1.3; }
#suvm-app .suvm-popup-meta { margin-top:5px; color:#6e8292; font-size:11px; }
#suvm-app .suvm-popup-price { margin-top:7px; color:#122b3d; font-weight:900; }
#suvm-app .suvm-popup-open { display:block; margin-top:8px; color:#0f6fcf; font-size:11px; font-weight:900; cursor:pointer; }

@media (max-width:1100px) {
  #suvm-app .suvm-toolbar { grid-template-columns:minmax(260px,1.5fr) repeat(2,minmax(140px,.7fr)); }
  #suvm-app .suvm-reset { grid-column:auto; }
  #suvm-app .suvm-radar-grid { grid-template-columns:1fr; }
  #suvm-app .suvm-feed { max-height:420px; }
  #suvm-app .suvm-card-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
}

@media (max-width:760px) {
  #suvm-app { font-size:15px; }
  #suvm-app .suvm-hero { border-radius:18px 18px 0 0; }
  #suvm-app .suvm-hero__topline { padding:13px 16px; flex-wrap:wrap; }
  #suvm-app .suvm-updated { width:100%; margin-left:18px; }
  #suvm-app .suvm-hero__content { grid-template-columns:1fr; padding:27px 20px 22px; }
  #suvm-app .suvm-pulse { display:none; }
  #suvm-app .suvm-subtitle { font-size:14px; }
  #suvm-app .suvm-stats { grid-template-columns:repeat(2,minmax(0,1fr)); }
  #suvm-app .suvm-stat:nth-child(2) { border-right:0; }
  #suvm-app .suvm-stat:nth-child(-n+2) { border-bottom:1px solid rgba(255,255,255,.08); }
  #suvm-app .suvm-stat { padding:14px 16px; }
  #suvm-app .suvm-stat strong { font-size:22px; }
  #suvm-app .suvm-tab { min-width:126px; padding:15px 16px; }
  #suvm-app .suvm-toolbar { grid-template-columns:1fr 1fr; padding:12px; }
  #suvm-app .suvm-search-wrap { grid-column:1/-1; }
  #suvm-app .suvm-reset { width:100%; }
  #suvm-app .suvm-main { padding:13px; border-radius:0 0 18px 18px; }
  #suvm-app .suvm-card-heading { align-items:flex-start; flex-direction:column; }
  #suvm-app .suvm-map-legend { justify-content:flex-start; }
  #suvm-app .suvm-map { min-height:430px; }
  #suvm-app .suvm-section-intro { align-items:flex-start; flex-direction:column; }
  #suvm-app .suvm-big-metric { text-align:left; }
  #suvm-app .suvm-card-grid { grid-template-columns:1fr; }
  #suvm-app .suvm-detail-grid { grid-template-columns:1fr; }
  #suvm-app .suvm-drawer-head, #suvm-app .suvm-drawer-body { padding-left:20px; padding-right:20px; }
}

@media (max-width:480px) {
  #suvm-app .suvm-toolbar { grid-template-columns:1fr; }
  #suvm-app .suvm-search-wrap { grid-column:auto; }
  #suvm-app .suvm-stats { grid-template-columns:1fr 1fr; }
  #suvm-app .suvm-map { min-height:390px; }
}