:root {
  --v2-coral: #ff6b6b;
  --v2-sky: #4dabf7;
  --v2-mint: #38d9a9;
  --v2-sun: #fcc419;
  --v2-violet: #9775fa;
  --v2-ink: #163147;
}

:root[data-theme="dark"] {
  --v2-coral: #f0f0f0;
  --v2-sky: #d6d6d6;
  --v2-mint: #bfbfbf;
  --v2-sun: #a8a8a8;
  --v2-violet: #cecece;
  --v2-ink: #f4f4f4;
}

.v2-shell { padding: 34px 0 84px; }
.v2-shell .container { width: min(1680px, 98vw); }
.v2-layout { display:grid; grid-template-columns: 270px minmax(0, 1fr); gap:22px; align-items:start; }
.v2-side { position: sticky; top: 92px; margin-left: -34px; display:grid; gap:14px; background: linear-gradient(165deg, color-mix(in srgb, var(--v2-sky) 18%, var(--card) 82%), color-mix(in srgb, var(--v2-violet) 16%, var(--card) 84%)); border: 1px solid color-mix(in srgb, var(--v2-sky) 28%, var(--line-soft) 72%); }
.v2-kicker { font-size:.75rem; letter-spacing:.13em; text-transform:uppercase; color:var(--v2-violet); font-weight:700; }
.v2-side h1 { margin:0; font-size:2rem; line-height:1.05; color: var(--v2-ink); }
.v2-sub { color:var(--ink-soft); margin:0; }
.v2-next { border:1px dashed var(--line-dashed); border-radius:12px; padding:10px; background: color-mix(in srgb, var(--v2-sun) 20%, var(--card) 80%); }
.v2-next h3 { margin:0 0 4px; font-size:1rem; color: var(--v2-coral); }
.v2-next p { margin:2px 0; color:var(--ink-soft); }
.v2-side-actions { display:grid; gap:8px; }
.v2-main { display:grid; gap:14px; min-width: 0; }
.v2-surface { display:grid; gap:18px; width: 100%; }
.v2-block { display:grid; gap:12px; padding-bottom: 2px; }
.v2-block + .v2-block { border-top: 1px solid color-mix(in srgb, var(--line-soft) 80%, transparent); padding-top: 16px; }
.v2-head { display:flex; justify-content:space-between; align-items:center; gap:10px; }
.v2-head h2 { margin:0; font-size:1.25rem; color: var(--v2-ink); }
.v2-head a { text-decoration:none; color:var(--v2-sky); font-size:.9rem; font-weight:600; }
.v2-list { display:grid; gap:8px; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); }
.v2-list article { border:1px solid color-mix(in srgb, var(--v2-mint) 42%, var(--line-soft) 58%); background:color-mix(in srgb, var(--v2-mint) 17%, var(--surface-muted) 83%); border-radius:12px; padding:10px; display:grid; gap:2px; }
.v2-list .role { font-size:.82rem; color:var(--v2-mint); font-weight:700; }
.v2-list small { color:var(--ink-soft); }
.v2-map { width: 100%; min-height: 310px; border-radius: 14px; border: 1px solid var(--line-soft); }
.v2-map-missing { margin-top: 8px; display:grid; gap:6px; }
.v2-map-missing p { margin:0; padding:8px 10px; border-radius:10px; border:1px dashed var(--line-dashed); background: var(--surface-muted); color: var(--ink-soft); font-size:.9rem; }

.v2-routes { display:grid; gap:8px; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); }
.v2-routes article { border:1px solid color-mix(in srgb, var(--v2-sky) 40%, var(--line-soft) 60%); border-radius:12px; padding:10px; background:color-mix(in srgb, var(--v2-sky) 10%, var(--surface-muted) 90%); }
.v2-routes header { display:flex; justify-content:space-between; align-items:flex-start; gap:8px; margin-bottom:4px; }
.v2-routes span, .v2-routes small { color:var(--ink-soft); }
.v2-ships { display:grid; gap:8px; grid-template-columns:repeat(auto-fit,minmax(210px,1fr)); }
.v2-ships a { text-decoration:none; color:inherit; border:1px solid color-mix(in srgb, var(--v2-violet) 38%, var(--line-soft) 62%); border-radius:12px; padding:10px; background:color-mix(in srgb, var(--v2-violet) 9%, var(--surface-muted) 91%); display:grid; gap:3px; transition: transform .15s ease; }
.v2-ships a:hover { transform: translateY(-1px); }
.v2-ships span, .v2-ships small { color:var(--ink-soft); }
@media (max-width: 1080px){ .v2-layout{grid-template-columns:1fr;} .v2-side{position:relative; top:auto; margin-left:0;} .v2-shell .container{width:min(1320px,93vw);} }
