/* Shared glue for the Navo tracking apps. DS tokens only; per-app mode colour from the Navo transport palette
   (same as rate-hierarchy / Distance mode colours). Callum 29.10.2026. */
body.nv-apps[data-app=parcel] { --mode: #F17B34; --mode-dk: #B4590A; --mode-wash: #FFF3E4; }
body.nv-apps[data-app=vessel] { --mode: #113EC9; --mode-dk: #0B2A45; --mode-wash: #F0F5FF; }
body.nv-apps[data-app=road]   { --mode: #18B6B8; --mode-dk: #0E969B; --mode-wash: #E6F7F7; }
body.nv-apps[data-app=rail]   { --mode: #86D31C; --mode-dk: #385618; --mode-wash: #F8FEE7; }
.xa-ic-truck { --i: url(/example-site/icons/truck.svg); }
.xa-ic-train { --i: url(/example-site/icons/train-front.svg); }
.xa-ic-package { --i: url(/example-site/icons/package.svg); }
.xa-ic-ship { --i: url(/example-site/icons/ship.svg); }
body.nv-apps .xa-line { background: var(--mode-dk); }
body.nv-apps .xa-line-dash { background: repeating-linear-gradient(90deg, var(--mode) 0 4px, transparent 4px 7px); }
body.nv-apps .xa-mk { border-color: var(--mode-dk); }
body.nv-apps .xa-dot-pol { border-color: var(--mode-dk); }
.xa-lane, .xa-mk span { font-family: var(--font-sans); }
body.nv-apps .xa-mk-pod { border-color: #e2462b; }
body.nv-apps .xa-mk-now { width: 16px; height: 16px; background: var(--mode); border: 3px solid #fff; box-shadow: 0 0 0 6px var(--mode-wash), var(--shadow-1); }
body.nv-apps .xa-dot-now { background: var(--mode); border: 0; box-shadow: 0 0 0 3px var(--mode-wash); }
body.nv-apps .tl-item.completed .tl-dot, body.nv-apps .tl-item.current .tl-dot { background: var(--mode-dk); }
body.nv-apps .tl-item.completed .tl-line { background: var(--mode-dk); }
body.nv-apps .tl-item.current .tl-dot { box-shadow: 0 0 0 4px var(--mode-wash); }
.xa-mk-ves { width: 22px; height: 22px; border: 0; background: none; }
.xa-mk-ves svg { width: 22px; height: 22px; display: block; filter: drop-shadow(0 1px 2px rgba(11,13,16,.35)); }
.ac-hint { margin: 0; padding: var(--sp-7); font-size: var(--fs-2); color: var(--text-secondary); }
.ac-hint.err { color: var(--badge-error-text); }
.ac-pad { padding: var(--sp-6) var(--sp-7); display: flex; flex-direction: column; gap: var(--sp-4); }
.ac-recent { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); padding: 0 var(--sp-7) var(--sp-6); }
.ac-recent button, .nx-try button { cursor: pointer; }
.nx-try { display: flex; flex-wrap: wrap; align-items: center; gap: var(--sp-3); padding: 0 var(--sp-7) var(--sp-6); }
.nx-src { display: flex; flex-direction: column; gap: var(--sp-3); padding: 0 var(--sp-7) var(--sp-7); }
.nx-src h3 { margin: 0; }
.nx-src ul { margin: 0; padding: 0; list-style: none; display: flex; flex-wrap: wrap; gap: var(--sp-3); }
.nx-list { display: flex; flex-direction: column; }
.nx-list button { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; width: 100%; padding: var(--sp-5) var(--sp-7); border: 0; border-bottom: 1px solid var(--divider); background: none; font: inherit; text-align: left; cursor: pointer; }
.nx-list button:hover { background: var(--accent-wash); }
.nx-list .t { font-size: var(--fs-2); font-weight: var(--fw-medium); color: var(--text-primary); }
.nx-list .m { font-size: var(--fs-1); color: var(--text-tertiary); }
.nx-note { font-size: var(--fs-1); color: var(--text-tertiary); padding: 0 var(--sp-7) var(--sp-6); margin: 0; }
.nx-extra { display: none; }
.ac-ovl { position: fixed; inset: 0; z-index: 90; display: grid; place-items: center; background: rgba(11, 13, 16, .45); padding: 16px; }
.ac-ovl[hidden] { display: none; }
.ac-ovl-card { max-width: 420px; padding: var(--sp-8); display: flex; flex-direction: column; gap: var(--sp-5); }
.ac-ovl-card p { margin: 0; color: var(--text-secondary); }
[hidden] { display: none !important; }
.nx-dev { position: absolute; top: var(--sp-7); right: var(--sp-7); z-index: 4; }
@media (width <= 980px) { .nx-dev { display: none; } }

/* port-call flags on the vessel path + operator logo before the vessel name (Stefan 30.10) */
.xa-mk-flag { width: auto; height: auto; border: 0 !important; border-radius: 3px; background: #fff; padding: 2px; box-shadow: var(--shadow-1); line-height: 0; }
.xa-mk-flag .xa-flag { width: 20px; height: 15px; box-shadow: none; }
.xa-trk-head .xa-vn { gap: var(--sp-4); }
.xa-trk-head .xa-vn .xa-logo { width: 32px; height: 32px; }
.xa-trk-head .xa-vn .xa-logo img { max-width: 26px; max-height: 26px; }
.tl-content .t .xa-flag { width: 16px; height: 12px; vertical-align: -1px; margin-right: 2px; }
.mini-tag .xa-flag { width: 16px; height: 12px; vertical-align: -1px; }
/* road: trip header (plate + ids) */
.xa-trip-id{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-bottom:6px}
.xa-trip-id b{font-size:16px;letter-spacing:.02em}
.xa-trip-id .xa-flag{width:20px;height:14px;border-radius:2px;object-fit:cover}

/* clustered port flags (Stefan 30.10) */
.xa-mk-cl { cursor: pointer; display: flex; align-items: center; gap: 4px; padding: 2px 5px 2px 2px; z-index: 2; }
.xa-mk-cl:hover { box-shadow: var(--shadow-2, 0 2px 8px rgba(11,13,16,.2)); }
.xa-mk-stack { display: flex; line-height: 0; font-style: normal; }
.xa-mk-stack .xa-flag + .xa-flag { margin-left: -8px; box-shadow: -2px 0 0 #fff; }
.xa-mk-n { font: 600 11px/15px var(--font-sans); color: #0b0d10; }

/* ── map chrome like tracking.navo24.com (Stefan 30.10): tools, base maps, rate cards, table, AI Mode ── */
.xa-ic-layers { --i: url(/example-site/icons/layers.svg); }
.xa-ic-moon { --i: url(/example-site/icons/moon.svg); }
.xa-ic-sun { --i: url(/example-site/icons/sun.svg); }
.xa-ic-maximize { --i: url(/example-site/icons/maximize.svg); }
.xa-ic-minimize { --i: url(/example-site/icons/minimize.svg); }
.xa-ic-table-2 { --i: url(/example-site/icons/table-2.svg); }
.xa-ic-chart-column { --i: url(/example-site/icons/chart-column.svg); }
.xa-ic-calendar-clock { --i: url(/example-site/icons/calendar-clock.svg); }
.xa-ic-triangle-alert { --i: url(/example-site/icons/triangle-alert.svg); }
.xa-ic-chevron-left { --i: url(/example-site/icons/chevron-left.svg); }
.xa-ic-chevron-right { --i: url(/example-site/icons/chevron-right.svg); }
.xa-ic-eye-off { --i: url(/example-site/icons/eye-off.svg); }
.xa-ic-house { --i: url(/example-site/icons/house.svg); }
.xa-ic-history { --i: url(/example-site/icons/clock.svg); }

/* tool column, top right; AI Mode to its left */
.xa-tools { position: absolute; top: var(--sp-7); right: var(--sp-7); z-index: 6; display: flex; flex-direction: column; gap: var(--sp-2); padding: var(--sp-2); background: var(--bg-base); border-radius: var(--r-float, 12px); box-shadow: var(--shadow-2); }
.xa-tool { width: 36px; height: 36px; display: grid; place-items: center; border: 0; border-radius: var(--radius-8); background: none; color: var(--text-secondary); cursor: pointer; }
.xa-tool:hover { background: var(--bg-sunken); color: var(--text-primary); }
.xa-tool[aria-pressed="true"] { background: var(--accent-wash); color: var(--accent); }
.xa-tool:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
.xa-tool .xa-ic { width: 18px; height: 18px; }
.xa-tool-sep { height: 1px; margin: var(--sp-1) var(--sp-3); background: var(--divider); }
.nx-dev { display: none; }
html.nx-on-dev .nx-dev { display: inline-flex; top: auto; bottom: var(--sp-7); right: auto; left: calc(var(--sp-7) + 400px + var(--sp-5) + 230px); }
.xa-trk:fullscreen { height: 100vh; background: var(--bg-sunken); }

/* AI Mode button: left of the tool column */
.nx-ask { position: absolute; top: var(--sp-7); right: calc(var(--sp-7) + 52px + var(--sp-4)); z-index: 6; box-shadow: var(--shadow-3); }
.nx-ask .xa-ic { width: 16px; height: 16px; }
html.in-app .nx-ask { display: none; }

/* base-map switcher = the credit line */
.xa-styles { position: absolute; left: calc(var(--sp-7) + 400px + var(--sp-5)); bottom: var(--sp-7); z-index: 6; }
.xa-attr { display: inline-flex; align-items: center; gap: var(--sp-3); height: 28px; padding: 0 var(--sp-4); border: 0; border-radius: var(--r-pill); background: var(--bg-base); box-shadow: var(--shadow-2); color: var(--text-tertiary); font: var(--fw-medium) var(--fs-1) var(--font-sans); cursor: pointer; }
.xa-attr:hover, .xa-attr[aria-expanded="true"] { color: var(--text-primary); }
.xa-attr .xa-ic { width: 14px; height: 14px; }
.xa-pop { position: absolute; left: 0; bottom: calc(100% + var(--sp-3)); width: 260px; padding: var(--sp-2); box-shadow: var(--shadow-3); display: flex; flex-direction: column; }
.xa-pop[hidden] { display: none; }
.xa-pop button { display: flex; flex-direction: column; align-items: flex-start; gap: 2px; padding: var(--sp-3) var(--sp-4); border: 0; border-radius: var(--radius-8); background: none; text-align: left; cursor: pointer; font: var(--fw-medium) var(--fs-2) var(--font-sans); color: var(--text-primary); }
.xa-pop button:hover { background: var(--bg-sunken); }
.xa-pop button[aria-selected="true"] { background: var(--accent-wash); }

/* zoom: right next to the Map key (nx.js layout() sets the exact offsets) */
.xa-trk .maplibregl-ctrl-bottom-right { right: 214px; bottom: 64px; }

/* rate cards along the bottom of the map */
.xa-rates { position: absolute; left: calc(var(--sp-7) + 400px + var(--sp-5)); right: calc(var(--sp-7) + 260px); bottom: calc(var(--sp-7) + 40px); z-index: 5; display: flex; flex-direction: column; gap: var(--sp-3); pointer-events: none; }
.xa-rates[hidden] { display: none; }
.xa-rates > * { pointer-events: auto; }
.xa-rates-head { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); align-self: flex-start; max-width: 100%; background: var(--bg-base); border-radius: var(--r-pill); padding: var(--sp-1) var(--sp-2) var(--sp-1) var(--sp-5); box-shadow: var(--shadow-2); }
.xa-rates-head > a { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; min-width: 0; color: inherit; text-decoration: none; display: inline-flex; align-items: center; gap: var(--sp-2); }
.xa-rates-head > a:hover { color: var(--accent); }
.xa-rates-head > a .xa-ic { width: 12px; height: 12px; }
.xa-rates-head > .u-cluster { flex-wrap: nowrap; flex: none; }
.xa-rates-nav[hidden] { display: none; }
.xa-rates-row { display: grid; grid-auto-flow: column; grid-auto-columns: calc((100% - 2 * var(--sp-4)) / 3); gap: var(--sp-4); overflow-x: auto; overflow-y: hidden; scroll-snap-type: x mandatory; scrollbar-width: none; }
.xa-rates-row::-webkit-scrollbar { display: none; }
.xa-rates-row[hidden] { display: none; }
.xa-rcard { scroll-snap-align: start; display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: var(--sp-2) var(--sp-4); padding: var(--sp-5); box-shadow: var(--shadow-2); color: inherit; text-decoration: none; min-width: 0; }
.xa-rcard:hover { box-shadow: var(--shadow-3); text-decoration: none; }
.xa-rcard-c { display: flex; align-items: center; gap: var(--sp-3); min-width: 0; }
.xa-rcard-c b { font-size: var(--fs-2); font-weight: var(--fw-semibold); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.xa-rcard-p { font: var(--fw-semibold) var(--fs-3) var(--font-display); color: var(--text-primary); text-align: right; }
.xa-rcard-m { font-size: var(--fs-1); color: var(--text-secondary); }
.xa-rcard .mini-badge { justify-self: end; }

/* table view instead of the map */
.xa-trk-table { position: absolute; top: var(--sp-7); bottom: var(--sp-7); left: calc(var(--sp-7) + 400px + var(--sp-5)); right: calc(var(--sp-7) + 52px + var(--sp-5)); z-index: 5; overflow: auto; padding: var(--sp-6); box-shadow: var(--shadow-3); }
.xa-trk-table[hidden] { display: none; }
.xa-trk.xa-tbl-on :is(.xa-key, .xa-rates, .xa-styles, .maplibregl-ctrl-bottom-right, .nx-dev) { visibility: hidden; }
.xa-tbl-head { margin: var(--sp-5) 0 var(--sp-3); }
.xa-tbl-head:first-child { margin-top: 0; }
.xa-cell { display: inline-flex; align-items: center; gap: var(--sp-3); white-space: nowrap; }
.xa-panel { display: flex; flex-direction: column; gap: var(--sp-5); }
.xa-kpis-wrap { grid-template-columns: repeat(2, 1fr); }
.xa-ov .ovl-close svg { width: var(--size-icon-lg, 20px); height: var(--size-icon-lg, 20px); }
.xa-ov .nx-list button { padding-left: 0; padding-right: 0; }

/* AI drawer (same look as the launcher on distance/loading) */
.nx-ai { position: fixed; inset: 0; z-index: 1000; pointer-events: none; }
.nx-ai-dim { position: absolute; inset: 0; background: rgba(8, 22, 38, .28); opacity: 0; transition: opacity .2s; }
.nx-ai-panel { position: absolute; top: 0; right: 0; bottom: 0; width: min(440px, 100vw); background: var(--bg-base); box-shadow: -20px 0 60px rgba(0, 0, 0, .18); transform: translateX(100%); transition: transform .25s cubic-bezier(.2, .8, .2, 1); display: flex; flex-direction: column; }
.nx-ai.open { pointer-events: auto; }
.nx-ai.open .nx-ai-dim { opacity: 1; }
.nx-ai.open .nx-ai-panel { transform: none; }
.nx-ai-head { flex: none; display: flex; align-items: center; gap: 10px; padding: 16px 18px; border-bottom: 1px solid var(--divider); }
.nx-ai-head b { flex: 1; font: var(--fw-semibold) 16px/1.2 var(--font-display, var(--font-sans)); color: var(--text-primary); }
.nx-ai-head img { width: 28px; height: 28px; border-radius: 50%; }
.nx-ai-frame { flex: 1; border: 0; width: 100%; background: #fff; }

@media (width <= 980px) {
  .xa-trk .maplibregl-ctrl-bottom-right { right: auto; left: var(--sp-4); bottom: auto; top: 56px; }
  .xa-styles { left: var(--sp-7); bottom: auto; top: var(--sp-7); }
  .xa-pop { bottom: auto; top: calc(100% + var(--sp-3)); }
  .xa-rates { left: var(--sp-7); right: calc(var(--sp-7) + 52px); bottom: calc(58% + var(--sp-7) + var(--sp-4)); }
  .xa-rates-row { grid-auto-columns: 78%; }
  .xa-trk-table { left: var(--sp-4); right: var(--sp-4); top: var(--sp-4); bottom: calc(58% + var(--sp-7)); }
  .nx-ask { top: auto; bottom: calc(58% + var(--sp-7) + var(--sp-4)); right: calc(var(--sp-7) + 52px + var(--sp-4)); }
  html.nx-on-dev .nx-dev { display: none; }
}
@media (width <= 639px) {
  .xa-tools { top: var(--sp-4); right: var(--sp-4); }
  .xa-tool { width: 32px; height: 32px; }
  .xa-styles { left: var(--sp-4); top: var(--sp-4); }
  .xa-rates { left: var(--sp-4); right: calc(var(--sp-4) + 48px); }
  .nx-ask { right: calc(var(--sp-4) + 48px + var(--sp-3)); padding: 0; width: 36px; justify-content: center; }
  .nx-ask span { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
}

/* vessel photo on the card + fleet map hover (Stefan 30.10 10:36) */
.xa-vphoto { margin: 0 0 var(--sp-4); border-radius: 12px; overflow: hidden; aspect-ratio: 16 / 9; background: var(--mode-wash, #f0f5ff); }
.xa-vphoto img { display: block; width: 100%; height: 100%; object-fit: cover; }
.xa-fleet-pop .maplibregl-popup-content { padding: 0; border-radius: 10px; overflow: hidden; box-shadow: 0 6px 24px rgba(11,42,69,.22); width: 240px; }
.xa-fleet-pop .ph { aspect-ratio: 3 / 2; background: #eef2f7; }
.xa-fleet-pop .ph.ld { background: linear-gradient(90deg,#eef2f7 0%,#f7f9fb 50%,#eef2f7 100%); background-size: 200% 100%; animation: xaShim 1.1s linear infinite; }
.xa-fleet-pop .ph img { display: block; width: 100%; height: 100%; object-fit: cover; }
.xa-fleet-pop .t { padding: 8px 10px; display: flex; flex-direction: column; gap: 2px; font-size: 12px; color: #0B2A45; }
.xa-fleet-pop .t b { font-size: 13px; }
.xa-fleet-pop .t span { color: #6b7a88; }
@keyframes xaShim { to { background-position: -200% 0; } }
.xa-fleet-n { position: absolute; left: 50%; transform: translateX(-50%); top: var(--sp-4, 16px); z-index: 2; background: rgba(255,255,255,.94); color: #0B2A45; font-size: 12px; padding: 6px 12px; border-radius: 12px; box-shadow: 0 2px 8px rgba(11,42,69,.12); pointer-events: none; display: flex; flex-wrap: wrap; gap: 4px 14px; justify-content: center; max-width: min(560px, calc(100% - 32px)); }
.xa-fleet-n span { display: inline-flex; align-items: center; gap: 6px; white-space: nowrap; }
.xa-fleet-n .d { width: 9px; height: 9px; border-radius: 50%; border: 1.5px solid #fff; box-shadow: 0 0 0 1px rgba(11,42,69,.15); }
.xa-fleet-n .d.trk { background: var(--mode, #1f6feb); }
.xa-fleet-n .d.oth { background: #8a97a6; }
.xa-fleet-n small { flex-basis: 100%; text-align: center; color: #6b7a88; font-size: 11px; }
.xa-fleet-pop .t .dl { color: #a0671a; font-size: 11px; }

/* dd.navo24.com: demurrage & detention (Stefan 30.10 10:30). Mode colour: Navo ocean deep. */
body.nv-apps[data-app=dd] { --mode: #0B6BCB; --mode-dk: #0B2A45; --mode-wash: #EAF3FC; }
.xa-ic-hourglass { --i: url(/example-site/icons/hourglass.svg); }
.xa-ic-calculator { --i: url(/example-site/icons/calculator.svg); }
.xa-dd-form { display: flex; flex-direction: column; gap: var(--sp-5); padding: var(--sp-6); box-shadow: var(--shadow-3); }
.xa-dd-row { display: flex; gap: var(--sp-5); }
.xa-dd-3 > * { flex: 1; min-width: 0; }
.xa-dd-f { display: flex; flex-direction: column; gap: var(--sp-2); flex: 1; min-width: 0; position: relative; }
.xa-dd-f .mini-input, .xa-dd-f .field-shell { width: 100%; box-sizing: border-box; }
.xa-dd-seg { align-self: flex-start; }
.xa-dd-seg .tab-pill { border: 0; background: none; font: inherit; font-size: var(--fs-2); }
.xa-dd-seg .tab-pill.active { background: var(--bg-base); color: var(--text-primary); box-shadow: var(--shadow-1); }
.xa-dd-form .xa-ac { top: calc(100% + 4px); }
.xa-dd-b { display: flex; flex-direction: column; gap: var(--sp-4); padding-bottom: var(--sp-6); margin-bottom: var(--sp-6); border-bottom: 1px solid var(--divider); }
.xa-dd-b:last-of-type { border-bottom: 0; }
.xa-dd-bh { display: flex; align-items: center; justify-content: space-between; gap: var(--sp-4); }
.xa-dd-bh b { font-size: var(--fs-3); color: var(--text-primary); }
.xa-dd-fd { display: flex; align-items: baseline; gap: var(--sp-4); }
.xa-dd-fd b { font-size: var(--fs-4); color: var(--text-primary); }
.xa-dd-b p, .xa-tabp > p.field-help { margin: 0; }
.xa-dd-calc { display: flex; flex-direction: column; gap: var(--sp-6); }
.xa-dd-dates { display: grid; grid-template-columns: 1fr; gap: var(--sp-4); }
.xa-dd-calc .kv-list b { color: var(--text-primary); }
.xa-trk-card .dt-table .xa-vn { gap: var(--sp-3); }
.xa-tabp .dt-wrap { max-width: 100%; }
@media (width <= 980px) { body[data-app=dd] .xa-trk-side { width: auto; height: 72%; } }
.xa-dd-n { text-align: right !important; white-space: nowrap; width: 1%; }
.xa-tabp .dt-table td:first-child .xa-vn span:last-child { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 170px; display: inline-block; vertical-align: middle; }
.xa-tabp [data-cmp] > p.field-help { margin-top: var(--sp-4); }

/* plates over the map (Stefan 30.10: "не боковое меню справа а поверх всей карты"), same box as the table view,
   like tracking.navo24.com; top/bottom clear AI Mode and the chat launcher */
.xa-trk-table { top: calc(var(--sp-7) + 52px); bottom: calc(var(--sp-7) + 52px); }
.xa-plate-h { display: flex; align-items: flex-start; justify-content: space-between; gap: var(--sp-5); margin-bottom: var(--sp-5); }
.xa-plate-t { font: var(--fw-semibold) var(--fs-3) var(--font-display); color: var(--text-primary); }
.xa-plate-h .ovl-close { flex: none; }
.xa-plate-h .ovl-close svg { width: var(--size-icon-lg, 20px); height: var(--size-icon-lg, 20px); }
.xa-plate-kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: var(--sp-4); margin-top: var(--sp-4); }
.xa-plate-kpis .card { padding: var(--sp-5); display: flex; flex-direction: column; gap: var(--sp-2); }
.xa-plate-kpis b { font: var(--fw-semibold) var(--fs-4, 20px)/1.2 var(--font-display); color: var(--text-primary); }
.xa-plate-note { margin-top: var(--sp-6); }
.xa-plate-foot { margin-top: var(--sp-5); }
.xa-trk-table .nx-list button { padding-left: 0; padding-right: 0; }
.xa-wrap-c { white-space: normal; min-width: 160px; }
@media (max-width: 980px) {
  .xa-trk-table { top: var(--sp-4); bottom: var(--sp-4); left: var(--sp-4); right: calc(var(--sp-4) + 44px + var(--sp-3)); z-index: 7; }
}

/* start-card links, same as navo24.com/apps/tracking/ (Stefan 31.10); never underlined */
.xa-ic-container { --i: url(/example-site/icons/container.svg); }
.xa-ic-file-text { --i: url(/example-site/icons/file-text.svg); }
.xa-ic-sparkles { --i: url(/example-site/icons/sparkles.svg); }
.xa-land-links { margin-top: auto; display: grid; grid-template-columns: 1fr 1fr; gap: var(--sp-2); padding: var(--sp-5) var(--sp-6) var(--sp-6); border-top: 1px solid var(--divider); }
.xa-land-links a { display: flex; align-items: center; gap: var(--sp-3); padding: var(--sp-3); border-radius: var(--radius-8); font: var(--fw-medium) var(--fs-1) var(--font-sans); color: var(--text-primary); text-decoration: none; }
.xa-land-links a:hover { background: var(--bg-sunken); text-decoration: none; }
.xa-land-links .xa-ic { color: var(--accent); flex: none; }
@media (width <= 639px) { .xa-land-links { grid-template-columns: 1fr; } }