
.commons-gateway-kicker { color:var(--muted); font:700 11px/1 var(--mono); letter-spacing:.09em; text-transform:uppercase; }

.commons-gateway-copy { margin:0; max-width:920px; color:#47534b; font:400 clamp(16px,1.25vw,19px)/1.55 var(--sans); }

.commons-gateway-privacy { display:block; color:var(--muted); font:600 11px/1.5 var(--mono); }

.commons-gateway-actions { display:flex; gap:8px; align-items:center; }

.commons-gateway-actions a { min-height:44px; display:inline-flex; align-items:center; justify-content:center; padding:0 14px; border:1px solid var(--line); font:700 11px/1 var(--mono); letter-spacing:.06em; white-space:nowrap; }

.commons-gateway-actions a:last-child { border-color:rgba(166,70,36,.42); color:var(--signal); }

.home-commons-map-mount .commons-preview-map { width:100%; height:100%; max-height:none; border:0; background:transparent; }

.home-commons-map-mount .commons-preview-map-status { position:absolute; z-index:3; left:14px; top:12px; margin:0; pointer-events:none; }

.home-commons-map-mount .commons-preview-map-status.is-demo { color:#9b5a3d; }

.home-commons-map-mount .commons-preview-map-status.is-error { color:var(--signal); }


.commons-page { padding-bottom:111px; }

.commons-summary { margin-top:8px; }

.commons-status-line { display:flex; align-items:center; gap:16px; justify-content:space-between; padding:13px 0; border-top:1px solid var(--line); border-bottom:1px solid var(--line-soft); }

.commons-status-line .instrument-status { margin-left:0; }

.commons-status-line p { margin:0; max-width:820px; color:var(--muted); font:600 11px/1.45 var(--mono); text-align:right; }

.commons-metrics { display:grid; grid-template-columns:repeat(5,1fr); border-bottom:1px solid var(--line); }

.commons-metrics article { min-width:0; padding:22px 18px 24px 0; border-right:1px solid var(--line-soft); }

.commons-metrics article + article { padding-left:18px; }

.commons-metrics article:last-child { border-right:0; }

.commons-metrics span { display:block; color:var(--muted); font:700 11px/1.2 var(--mono); letter-spacing:.065em; }

.commons-metrics strong { display:block; margin-top:14px; color:var(--fg); font:500 clamp(28px,3.5vw,48px)/1 var(--serif); letter-spacing:-.04em; }


.commons-workspace { margin-top:54px; }

.commons-toolbar { display:flex; align-items:flex-end; justify-content:space-between; gap:24px; padding-bottom:11px; border-bottom:1px solid var(--line); }

.commons-layer-controls,.commons-horizon,.commons-time-modes,.commons-time-reference { display:flex; flex-wrap:wrap; gap:5px; }

.commons-layer-controls button,.commons-horizon button,.commons-time-modes button,.commons-time-reference button {
  min-height:40px; padding:0 12px; border:1px solid var(--line); background:transparent; color:var(--muted); cursor:pointer;
  font:700 11px/1 var(--mono); letter-spacing:.055em;
}

.commons-layer-controls button.is-active,.commons-horizon button.is-active,.commons-time-modes button.is-active,.commons-time-reference button.is-active { border-color:rgba(166,70,36,.42); color:var(--signal); background:rgba(166,70,36,.045); }

.commons-time-controls { display:flex; align-items:center; gap:12px; }

.commons-time-controls > span { color:var(--muted); font:700 11px/1 var(--mono); letter-spacing:.075em; }

.commons-map-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(250px,315px); gap:18px; padding-top:18px; }

.commons-map-frame { position:relative; min-width:0; aspect-ratio:1.76/1; min-height:470px; overflow:hidden; border:1px solid var(--line); background:rgba(246,244,238,.45); }

.commons-sphere { fill:rgba(246,244,238,.28); stroke:rgba(21,32,25,.28); stroke-width:1.1; vector-effect:non-scaling-stroke; }

.commons-countries path { fill:rgba(21,32,25,.035); stroke:rgba(21,32,25,.18); stroke-width:.65; vector-effect:non-scaling-stroke; }

.commons-graticule { fill:none; stroke:rgba(21,32,25,.09); stroke-width:.6; vector-effect:non-scaling-stroke; }

.commons-night { fill:rgba(21,32,25,.12); stroke:rgba(21,32,25,.18); stroke-width:.75; vector-effect:non-scaling-stroke; }

.commons-visits circle { fill:rgba(166,70,36,.18); stroke:rgba(166,70,36,.56); stroke-width:1; vector-effect:non-scaling-stroke; cursor:pointer; transition:r .16s var(--ease),fill .16s; }

.commons-visits circle:hover,.commons-visits circle:focus { fill:rgba(166,70,36,.32); outline:none; }

.commons-observation-marks circle { fill:none; stroke:rgba(21,32,25,.72); stroke-width:1.25; stroke-dasharray:2 3; vector-effect:non-scaling-stroke; cursor:pointer; }

.commons-now-marks circle { fill:var(--signal); stroke:var(--bg); stroke-width:1.8; vector-effect:non-scaling-stroke; }

.commons-host-mark circle,.commons-host-preview { fill:var(--fg); stroke:var(--bg); stroke-width:2; vector-effect:non-scaling-stroke; }

.commons-you-mark circle { fill:var(--signal); stroke:var(--bg); stroke-width:2; vector-effect:non-scaling-stroke; }

.commons-relation-line { fill:none; stroke:var(--signal); stroke-width:1.35; stroke-dasharray:4 3; vector-effect:non-scaling-stroke; }

.commons-selected-ring { fill:none; stroke:var(--signal); stroke-width:1.2; vector-effect:non-scaling-stroke; }

.commons-map-status { position:absolute; z-index:3; left:14px; top:12px; max-width:min(520px,70%); color:var(--muted); font:700 11px/1.35 var(--mono); letter-spacing:.04em; pointer-events:none; }

.commons-map-status.is-demo { color:#9b5a3d; }

.commons-map-status.is-error { color:var(--signal); }

.commons-map-source { position:absolute; z-index:3; left:14px; bottom:11px; color:var(--muted); font:650 11px/1.3 var(--mono); }

.commons-map-legend { position:absolute; z-index:3; right:12px; bottom:11px; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px 12px; max-width:55%; }

.commons-map-legend span { display:flex; align-items:center; gap:5px; color:var(--muted); font:700 11px/1 var(--mono); }

.commons-map-legend i { width:8px; height:8px; display:inline-block; border:1px solid var(--soft); border-radius:50%; }

.commons-map-legend .visit-dot { border-color:var(--signal); background:rgba(166,70,36,.16); }

.commons-map-legend .observation-dot { width:11px; height:11px; border-style:dashed; }

.commons-map-legend .now-dot { background:var(--signal); border-color:var(--signal); }

.commons-map-legend .host-dot { background:var(--fg); border-color:var(--fg); }


.commons-inspector { min-width:0; padding:20px; border:1px solid var(--line); background:rgba(246,244,238,.42); }

.commons-inspector-kicker { color:var(--muted); font:700 11px/1 var(--mono); letter-spacing:.075em; }

.commons-inspector h2 { margin:11px 0 11px; font:500 clamp(25px,2.4vw,35px)/1.03 var(--serif); letter-spacing:-.035em; }

.commons-inspector > p { margin:0; color:var(--soft); font-size:14px; line-height:1.55; }

.commons-inspector > small { display:block; margin-top:12px; color:var(--muted); font:600 11px/1.45 var(--mono); }

.commons-inspector dl { margin:18px 0 0; border-top:1px solid var(--line-soft); }

.commons-inspector dl div { display:grid; grid-template-columns:1fr 1.2fr; gap:12px; padding:9px 0; border-bottom:1px solid var(--line-soft); }

.commons-inspector dt,.commons-inspector dd { margin:0; font:650 11px/1.35 var(--mono); }

.commons-inspector dt { color:var(--muted); }
 .commons-inspector dd { color:var(--fg); text-align:right; }

.commons-place-meta { display:flex; flex-wrap:wrap; gap:8px 14px; margin-top:15px; color:var(--muted); font:650 11px/1.35 var(--mono); }

.commons-observation-list { margin-top:18px; border-top:1px solid var(--line); }

.commons-observation-list article { padding:11px 0; border-bottom:1px solid var(--line-soft); }

.commons-observation-list time,.commons-observation-list small { color:var(--muted); font:600 11px/1.3 var(--mono); }

.commons-observation-list p { margin:5px 0; font:400 14px/1.45 var(--serif); }


.commons-temporal-panel { display:grid; grid-template-columns:auto minmax(180px,1fr) auto; gap:20px; align-items:center; padding:13px 0 0; }

.commons-hour-control label { display:flex; justify-content:space-between; margin-bottom:7px; color:var(--muted); font:700 11px/1 var(--mono); }

.commons-hour-control input { width:100%; accent-color:var(--signal); }


.commons-participate { display:grid; grid-template-columns:1fr 1fr; gap:34px; margin-top:96px; padding-top:34px; border-top:1px solid var(--line); }

.commons-you,.commons-observe { min-width:0; }

.commons-block-head > span { color:var(--muted); font:700 11px/1 var(--mono); letter-spacing:.075em; }

.commons-block-head h2 { margin:11px 0 24px; max-width:620px; font:500 clamp(28px,3vw,44px)/1.02 var(--serif); letter-spacing:-.04em; }

.commons-relation-readout { display:grid; grid-template-columns:repeat(2,1fr); border-top:1px solid var(--line); }

.commons-relation-readout > div { min-width:0; padding:15px 16px 16px 0; border-bottom:1px solid var(--line-soft); }

.commons-relation-readout > div:nth-child(even) { padding-left:16px; border-left:1px solid var(--line-soft); }

.commons-relation-readout span,.commons-relation-readout small { display:block; color:var(--muted); font:650 11px/1.35 var(--mono); }

.commons-relation-readout strong { display:block; margin:8px 0 5px; overflow-wrap:anywhere; font:550 17px/1.25 var(--sans); }

.commons-actions { display:flex; flex-wrap:wrap; gap:7px; margin-top:18px; }

.commons-actions button,.commons-form-foot button { min-height:44px; padding:0 14px; border:1px solid var(--line); background:transparent; color:var(--fg); cursor:pointer; font:700 11px/1 var(--mono); letter-spacing:.05em; }

.commons-actions button.primary,.commons-form-foot button { border-color:rgba(166,70,36,.5); color:var(--signal); }

.commons-actions button:disabled,.commons-form-foot button:disabled { opacity:.34; cursor:not-allowed; }

.commons-privacy-note { margin:16px 0 0; max-width:620px; color:var(--muted); font:600 11px/1.55 var(--mono); }

.commons-form-foot { display:flex; align-items:center; gap:14px; min-height:44px; }

.commons-form-foot span { color:var(--muted); font:600 11px/1.4 var(--mono); }

.commons-preview-head { display:flex; align-items:flex-end; justify-content:space-between; gap:20px; margin-bottom:14px; }

.commons-preview-head span { color:#6e7a72; font:700 11px/1 var(--mono); letter-spacing:.075em; }

.commons-preview-head h3 { margin:7px 0 0; color:#e0e5e1; font:500 clamp(28px,3vw,42px)/1 var(--serif); }

.commons-preview-head a { min-height:42px; display:inline-flex; align-items:center; padding:0 12px; border:1px solid rgba(209,99,57,.4); color:#d39a82; font:700 11px/1 var(--mono); }

.commons-preview-map { display:block; width:100%; max-height:58dvh; border:1px solid rgba(241,239,231,.1); background:rgba(12,18,15,.38); }

.commons-preview-map .commons-sphere { fill:rgba(241,239,231,.015); stroke:rgba(241,239,231,.18); }

.commons-preview-map .commons-countries path { fill:rgba(241,239,231,.025); stroke:rgba(241,239,231,.12); }

.commons-preview-map .commons-graticule { stroke:rgba(241,239,231,.06); }

.commons-preview-map .commons-visits circle { fill:rgba(209,99,57,.25); stroke:rgba(209,99,57,.7); }

.commons-preview-map .commons-host-preview { fill:#d3dad4; stroke:#17211b; }

.commons-preview-map-status,.commons-preview-stats,.commons-preview-loading { color:#7e8a81; font:700 11px/1.4 var(--mono); }

.commons-preview-map-status { margin-bottom:8px; }

.commons-preview-stats { margin-top:11px; }


.commons-page {
  height: 100svh;
  min-height: 0;
  padding-top: 84px;
  padding-bottom: 12px;
  display: grid;
  grid-template-rows: auto auto minmax(0, 1fr);
  gap: 8px;
  overflow: hidden;
}

.commons-page .page-title {
  grid-template-columns: minmax(0, .85fr) minmax(340px, .65fr);
  gap: 28px;
  align-items: end;
  padding-bottom: 9px;
}

.commons-page .page-title h1 {
  margin-top: 5px;
  font-size: clamp(36px, 3.7vw, 58px);
  line-height: .9;
}

.commons-page .page-title .page-intro {
  max-width: 620px;
  margin: 0;
  font-size: clamp(14px, 1.05vw, 17px);
  line-height: 1.35;
}

.commons-page .commons-summary { margin-top: 0; min-height: 0; }

.commons-page .commons-status-line { min-height: 32px; padding: 5px 0; }

.commons-page .commons-status-line p { max-width: 760px; line-height: 1.3; }

.commons-page .commons-metrics { min-height: 0; }

.commons-page .commons-metrics article { padding: 8px 12px 9px 0; }

.commons-page .commons-metrics article + article { padding-left: 12px; }

.commons-page .commons-metrics strong { margin-top: 4px; font-size: clamp(20px, 2vw, 29px); }

.commons-page .commons-workspace {
  min-height: 0;
  margin-top: 0;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}

.commons-page .commons-toolbar { min-height: 38px; padding-bottom: 6px; }

.commons-page .commons-layer-controls button,
.commons-page .commons-horizon button,
.commons-page .commons-time-modes button,
.commons-page .commons-time-reference button { min-height: 34px; padding: 0 10px; }

.commons-page .commons-map-layout {
  min-height: 0;
  height: 100%;
  padding-top: 8px;
  grid-template-columns: minmax(0, 1fr) minmax(300px, 350px);
  gap: 12px;
  overflow: hidden;
}

.commons-map-stack {
  min-width: 0;
  min-height: 0;
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
}

.commons-page .commons-map-frame {
  min-height: 0;
  height: 100%;
  aspect-ratio: auto;
}

.commons-page .commons-temporal-panel {
  min-height: 38px;
  padding-top: 6px;
  gap: 10px;
}

.commons-side-stack {
  min-width: 0;
  min-height: 0;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  border: 1px solid var(--line);
  background: rgba(246,244,238,.42);
}

.commons-side-stack .commons-inspector {
  min-height: 0;
  padding: 13px 14px;
  border: 0;
  border-bottom: 1px solid var(--line);
  background: transparent;
}

.commons-side-stack .commons-inspector h2 { margin: 7px 0 7px; font-size: clamp(21px, 1.8vw, 27px); }

.commons-side-stack .commons-inspector dl { margin-top: 10px; }

.commons-side-stack .commons-inspector dl div { padding: 6px 0; }

.commons-side-stack .commons-place-meta { margin-top: 10px; }

.commons-side-stack .commons-observation-list { margin-top: 10px; }

.commons-side-stack .commons-observation-list article { padding: 8px 0; }

.commons-side-stack .commons-participate {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  margin: 0;
  padding: 13px 14px 18px;
  border-top: 0;
}

.commons-side-stack .commons-observe { padding-top: 14px; border-top: 1px solid var(--line-soft); }

.commons-side-stack .commons-block-head h2 {
  margin: 6px 0 10px;
  max-width: none;
  font-size: 20px;
  line-height: 1.08;
}

.commons-side-stack .commons-relation-readout > div { padding: 8px 8px 9px 0; }

.commons-side-stack .commons-relation-readout > div:nth-child(even) { padding-left: 8px; }

.commons-side-stack .commons-relation-readout strong { margin: 4px 0 2px; font-size: 14px; }

.commons-side-stack .commons-actions { margin-top: 10px; }

.commons-side-stack .commons-privacy-note { margin-top: 9px; line-height: 1.4; }

.commons-side-stack #commonsObservationForm { gap: 8px; }

.commons-side-stack #commonsObservationForm label { gap: 5px; }

.commons-side-stack #commonsObservationForm input,
.commons-side-stack #commonsObservationForm textarea { padding: 9px 10px; font-size: 14px; }

.commons-side-stack #commonsObservationForm textarea { min-height: 68px; resize: none; }