/* MandelaMap rails.css
   Single source of truth for shared rail host + shared rail component styling.
   Moved out of shell.css / shell-polish.css.
*/

/* Tokens used below; scoped so rails stay correct even when :root omits them */
.map-left,
.map-right,
.shell-rail {
  --border-subtle: #112830;
  --r: 1px;
  --t: 0.18s ease;
  --ls-wide: 3px;
  --ls-med: 2px;
  --fs-micro: 8px;
}

.shell-rail{grid-row:1;min-height:0;height:100%;display:flex;flex-direction:column;}

.side-header{padding:10px 14px 8px;border-bottom:1px solid var(--border);flex-shrink:0;}

.side-header{padding:8px 12px 7px;}

.side-header{padding:0.45rem 0.7rem 0.35rem;}

.side-header{
  flex:0 0 auto !important;
}

.side-title{font-size:9px;letter-spacing:3px;color:var(--text-dim);text-transform:uppercase;}

.side-subtitle{font-size:11px;color:var(--amber);letter-spacing:1px;margin-top:2px;}

.side-body{flex:1;overflow-y:auto;padding:10px 12px;}

.side-body{flex:0 0 auto !important;min-height:auto !important;padding-top:8px;padding-bottom:8px}

.side-body{margin-bottom:0}

.side-body{padding:8px 10px;}

.side-body{padding:0.45rem 0.6rem;}

.recent-item{padding:8px 10px;border:1px solid var(--border);background:var(--bg3);margin-bottom:6px;cursor:pointer;transition:all .15s;}

.recent-item { padding: 10px 12px; }

.recent-item:hover{border-color:var(--border-bright);}

.recent-time{font-size:9px;color:var(--text-dim);letter-spacing:1px;margin-bottom:3px;}

.recent-title{font-family:'Courier Prime',monospace;font-size:11px;color:var(--text-bright);font-weight:700;line-height:1.3;}

.quick-submit{flex-shrink:0 !important}

.quick-submit{padding:10px 12px;border-top:1px solid var(--border);flex-shrink:0;}

.quick-submit{margin-top:0;align-self:stretch;}

.quick-submit{
  flex:0 0 auto !important;
  margin-top:0 !important;
}

.qs-title{font-size:9px;letter-spacing:3px;color:var(--text-dim);text-transform:uppercase;margin-bottom:8px;}

.qs-btn{width:100%;font-family:'Share Tech Mono',monospace;font-size:10px;letter-spacing:2px;padding:7px;border:1px solid var(--amber);background:rgba(232,160,32,.06);color:var(--amber);cursor:pointer;text-transform:uppercase;transition:all .15s;}

.qs-btn{padding:0.4rem;}

.qs-btn:hover{background:rgba(232,160,32,.14);}

.search-suggest{position:relative}

.search-suggest-list{display:none;position:absolute;left:0;right:0;top:100%;z-index:250;background:rgba(2,12,16,.98);border:1px solid var(--border-bright);max-height:220px;overflow-y:auto;box-shadow:0 8px 28px rgba(0,0,0,.45)}

.search-suggest-list.open{display:block}

.search-suggest-item{padding:8px 10px;border-bottom:1px solid rgba(26,74,82,.45);cursor:pointer;transition:background .12s,border-color .12s}

.search-suggest-item:hover,.search-suggest-item.active{background:rgba(32,200,232,.07)}

.search-suggest-item:last-child{border-bottom:none}

.search-suggest-label{font-family:'Courier Prime',monospace;font-size:11px;color:var(--text-bright);font-weight:700;line-height:1.3}

.search-suggest-meta{font-size:9px;color:var(--text-dim);letter-spacing:1px;margin-top:2px;text-transform:uppercase}

#effect-selector{position:static !important;bottom:auto !important;right:auto !important;z-index:auto !important;background:transparent;border:none;padding:10px 12px;width:auto;animation:none;display:block}

#effect-selector{position:static !important;bottom:auto !important;right:auto !important;z-index:auto !important;background:transparent;border:none;padding:10px 12px;width:auto;animation:none;}

#effect-selector{display:flex;flex-direction:column;min-height:0;height:100%;}

#effect-selector.hidden{display:block !important}

#effect-selector.hidden{display:block !important;}

.es-title{font-size:9px;letter-spacing:3px;color:var(--amber);text-transform:uppercase;margin-bottom:8px;}

.es-search{width:100%;font-family:'Share Tech Mono',monospace;font-size:11px;background:var(--bg3);border:1px solid var(--border);color:var(--text);padding:6px 9px;outline:none;letter-spacing:1px;margin-bottom:6px;transition:border-color .15s;}

.es-search:focus{border-color:var(--border-bright);}

.es-list{overflow-y:auto !important}

.es-list{max-height:160px}

.es-list{max-height:180px;overflow-y:auto;}

.es-list{flex:1;min-height:5rem;overflow-y:auto;}

.es-item{padding:7px 9px;border:1px solid transparent;font-family:'Courier Prime',monospace;font-size:11px;color:var(--text);cursor:pointer;transition:all .12s;margin-bottom:3px;}

.es-item:hover{border-color:var(--border);background:rgba(255,255,255,.02);}

.es-item.selected{border-color:var(--amber);color:var(--amber);background:rgba(232,160,32,.06);}

.es-item-meta{font-family:'Share Tech Mono',monospace;font-size:9px;color:var(--text-dim);letter-spacing:1px;margin-top:2px;}

.es-clear{width:100%;font-family:'Share Tech Mono',monospace;font-size:9px;letter-spacing:2px;padding:5px;border:1px solid var(--border);background:transparent;color:var(--text-dim);cursor:pointer;text-transform:uppercase;margin-top:6px;transition:all .15s;}

.es-clear:hover{border-color:var(--red);color:var(--red);}

.tr-item{padding:9px;border:1px solid var(--border);background:var(--bg3);margin-bottom:7px;cursor:pointer;transition:all .15s;position:relative;}

.tr-item:hover{border-color:var(--border-bright);}

.tr-rk{font-family:'VT323',monospace;font-size:22px;color:var(--border);position:absolute;top:5px;right:7px;line-height:1;}

.tr-nm{font-family:'Courier Prime',monospace;font-size:11px;color:var(--text-bright);font-weight:700;margin-bottom:3px;padding-right:20px;}

.tr-bar{height:2px;background:var(--border);margin:4px 0;overflow:hidden;position:relative;}

.tr-fill{position:absolute;top:0;left:0;height:100%;background:var(--amber);}

.tr-st{font-size:9px;color:var(--text-dim);letter-spacing:1px;}

.tr-st span{color:var(--amber);}

.side-header {
  background: linear-gradient(180deg, rgba(8,25,32,.9), rgba(5,18,24,.6));
  padding: 10px 14px 9px;
  border-bottom-color: var(--border);
  position: relative;
}

.side-title {
  font-size: 9px;
  letter-spacing: 3px;
  color: var(--text-dim);
  opacity: 1;
  font-weight: 700;
  text-transform: uppercase;
}

.side-subtitle {
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 1px;
  margin-top: 2px;
  color: var(--amber);
}

.side-body { background: transparent !important; }

.recent-item {
  background: linear-gradient(135deg, rgba(9,24,30,.95), rgba(7,20,26,.95));
  border-color: var(--border-subtle);
  border-radius: var(--r);
  transition: all var(--t);
}

.recent-item:hover {
  border-color: var(--border-bright);
  background: linear-gradient(135deg, rgba(14,36,46,.95), rgba(10,28,36,.95));
  transform: translateX(1px);
}

.recent-time {
  font-size: var(--fs-micro);
  opacity: .55;
}

.recent-time {
  font-size: 9px;
  color: var(--cyan);
  opacity: .7;
  letter-spacing: 1px;
  flex-shrink: 0;
  white-space: nowrap;
}

.recent-time   { font-size: 10px !important; letter-spacing: 0 !important; }

.recent-time { color: var(--cyan) !important; }

.recent-title {
  font-size: 11px;
  color: var(--text-bright);
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.recent-title  { font-size: 12px !important; letter-spacing: 0 !important; line-height: 1.4 !important; }

.recent-title { color: var(--text-bright) !important; }

.quick-submit {
  background: linear-gradient(0deg, rgba(5,16,20,.98), rgba(4,13,17,.92));
  border-top-color: var(--border);
  padding: 12px 13px;
}

.qs-title {
  letter-spacing: var(--ls-wide);
  opacity: .6;
  margin-bottom: 9px;
}

.qs-title      { font-size: 10px !important; letter-spacing: 2px !important; }

.qs-input {
  background: rgba(4,12,16,.9);
  border-color: var(--border);
  border-radius: var(--r);
  transition: all var(--t);
  font-size: 10px;
}

.qs-input:focus {
  border-color: var(--cyan);
  box-shadow: var(--glow-cyan), 0 0 0 3px rgba(34,212,238,.05);
}

.qs-btn {
  background: linear-gradient(135deg, rgba(240,168,50,.1), rgba(240,168,50,.04));
  border-color: rgba(240,168,50,.4);
  letter-spacing: var(--ls-med);
  transition: all var(--t);
}

.qs-btn        { font-size: 11px !important; letter-spacing: 1px !important; }

.qs-btn:hover {
  background: linear-gradient(135deg, rgba(240,168,50,.18), rgba(240,168,50,.08));
  box-shadow: var(--glow-amber);
}

.qs-btn:hover { background: #8a3c00 !important; }

.search-suggest { position: relative; }

.search-suggest-list {
  background: rgba(4,12,16,.98);
  border-color: var(--border-bright);
  border-radius: var(--r);
  box-shadow: 0 12px 40px rgba(0,0,0,.6);
  backdrop-filter: blur(12px);
}

.search-suggest-list {
  max-height: calc(5 * 44px) !important; /* 5 items × ~44px each */
  overflow-y: auto !important;
}

.search-suggest-label { font-size: 11px; }

.search-suggest-label { font-size: 12px !important; letter-spacing: 0 !important; }

.search-suggest-label { color: var(--text-bright) !important; }

.search-suggest-meta  { font-size: var(--fs-micro); opacity: .6; }

.search-suggest-meta  { font-size: 10px !important; letter-spacing: 0 !important; }

.search-suggest-meta { color: var(--text-dim) !important; }

.es-title { color: var(--amber) !important; }

.es-title { font-size: 10px !important; letter-spacing: 2px !important; color: var(--amber) !important; }

.es-search {
  background: rgba(4,13,18,.92);
  border-color: var(--border);
  border-radius: var(--r);
  font-size: 10px;
  transition: all var(--t);
}

.es-search     { font-size: 12px !important; letter-spacing: 0 !important; }

.es-search:focus {
  border-color: var(--cyan);
  box-shadow: var(--glow-cyan);
}

.es-search:focus { border-color: var(--cyan) !important; }

.es-item {
  border-radius: var(--r);
  font-size: 11px;
  line-height: 1.4;
  transition: all var(--t);
}

.es-item       { font-size: 12px !important; letter-spacing: 0 !important; line-height: 1.4 !important; }

.es-item { color: var(--text-bright) !important; background: rgba(10,18,28,.85) !important; }

.es-item:hover {
  background: rgba(34,212,238,.04);
  border-color: var(--border);
}

.es-item:hover { background: rgba(20,32,48,.95) !important; border-color: var(--border) !important; }

.es-item.selected {
  background: rgba(240,168,50,.07);
  border-color: rgba(240,168,50,.45);
  box-shadow: 0 0 0 1px rgba(240,168,50,.08) inset;
}

.es-item.selected {
  background: rgba(0,102,136,.1) !important;
  border-color: var(--cyan) !important;
  border-left-color: var(--cyan) !important;
}

.es-clear {
  border-radius: var(--r);
  font-size: var(--fs-micro);
  transition: all var(--t);
}

.es-clear {
  background: rgba(204,24,24,.08) !important;
  border-color: var(--red) !important;
  color: var(--red) !important;
}

.es-clear:hover {
  border-color: var(--red);
  color: var(--red);
  background: rgba(232,40,80,.04);
}

.rail-component-shell {
  border: 1px solid var(--border);
  background: linear-gradient(180deg, rgba(10,32,40,.92), rgba(6,22,28,.96));
  box-shadow: inset 0 0 0 1px rgba(13,79,95,.22), 0 0 0 1px rgba(5,18,24,.65);
  margin: 0 0 10px;
}

.rail-component-shell__inner {
  padding: 10px 10px 12px;
}

.rail-component-shell .sec-lbl,
.rail-component-shell [class*="sec-lbl"] {
  margin-bottom: 8px;
}

/* --- existing shared rail component rules --- */

/* shared rail panels: flat shell style */
.mm-rail-widget,
.mm-rail-panel {
  display: block;
  margin: 0 0 12px;
  border: 1px solid var(--border-bright);
  background: rgba(4,15,18,.88);
  box-shadow: none;
  border-radius: 0;
  overflow: hidden;
}

.mm-rail-widget:last-child,
.mm-rail-panel:last-child {
  margin-bottom: 0;
}

.mm-rail-widget-header {
  padding: 10px 12px 8px;
  border-bottom: 1px solid rgba(91,211,255,.14);
  background: transparent;
  border-radius: 0;
}

.mm-rail-widget-body,
.mm-rail-panel-inner {
  padding: 10px 12px;
  background: transparent;
  box-shadow: none;
  border-radius: 0;
}

.mm-rail-note {
  font-size: 12px;
  line-height: 1.45;
  color: rgba(208,227,242,.78);
}

.mm-rail-list {
  display: grid;
  gap: 0;
}

.mm-rail-row {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  align-items: flex-start;
  padding: 10px 0;
  border-bottom: 1px solid rgba(91,211,255,.09);
}

.mm-rail-row:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.mm-rail-label {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .04em;
}

.mm-rail-meta {
  font-size: 11px;
  opacity: .72;
  text-transform: uppercase;
  letter-spacing: .08em;
}

.mm-rail-badge {
  min-width: 32px;
  padding: 3px 8px;
  border-radius: 0;
  border: 1px solid rgba(91,211,255,.22);
  background: rgba(91,211,255,.08);
  text-align: center;
  font-size: 11px;
  font-weight: 700;
}

.mm-rail-kpi-grid {
  display: grid;
  grid-template-columns: repeat(3,1fr);
  gap: 10px;
}

.mm-rail-kpi {
  border: 1px solid rgba(91,211,255,.14);
  border-radius: 0;
  padding: 10px;
  text-align: center;
  background: rgba(255,255,255,.02);
}

.mm-rail-kpi span {
  display: block;
  font-size: 22px;
  font-weight: 700;
  line-height: 1;
}

.mm-rail-kpi label {
  display: block;
  margin-top: 6px;
  font-size: 10px;
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: .72;
}

.mm-rail-divider {
  height: 1px;
  background: rgba(91,211,255,.12);
  margin: 12px 0;
}

.mm-rail-component-table {
  width: 100%;
  border-collapse: collapse;
}

.mm-rail-component-table th,
.mm-rail-component-table td {
  padding: 10px 12px;
  border-bottom: 1px solid rgba(91,211,255,.09);
  text-align: left;
  font-size: 12px;
  vertical-align: top;
}

.mm-rail-component-table th {
  font-size: 11px;
  letter-spacing: .08em;
  text-transform: uppercase;
  opacity: .72;
}

.mm-chip {
  display: inline-flex;
  align-items: center;
  padding: 2px 8px;
  border-radius: 0;
  border: 1px solid rgba(91,211,255,.18);
  font-size: 11px;
  letter-spacing: .06em;
  text-transform: uppercase;
  background: rgba(91,211,255,.08);
}

/* shared rail containment */
.shell-rail,
.shell-rail .side-body,
.mm-rail-panel,
.mm-rail-panel-inner,
.mm-rail-widget,
.mm-rail-widget-body {
  overflow-x: hidden;
}

.shell-rail .side-body {
  display: grid;
  gap: 12px;
  align-content: start;
  word-break: break-word;
}

/* flatten everything in rails */
.mm-rail-widget *,
.mm-rail-panel * {
  border-radius: 0;
}


/* shared rail host layout */
.shell-rail{
  grid-row:1;
  min-height:0;
  height:100%;
  display:flex;
  flex-direction:column;
}

/* Ensure rail stacks scroll inside the column (instead of extending under footer). */
.map-left .shell-rail,
.map-right .shell-rail{
  min-height:0;
  max-height:100%;
  overflow-y:auto;
  overflow-x:hidden;
  scrollbar-width:thin;
  scrollbar-color:rgba(36,100,120,.65) rgba(4,15,18,.4);
}
.map-left .shell-rail::-webkit-scrollbar,
.map-right .shell-rail::-webkit-scrollbar{
  width:6px;
}
.map-left .shell-rail::-webkit-scrollbar-track,
.map-right .shell-rail::-webkit-scrollbar-track{
  background:rgba(4,15,18,.35);
}
.map-left .shell-rail::-webkit-scrollbar-thumb,
.map-right .shell-rail::-webkit-scrollbar-thumb{
  background:rgba(36,100,120,.55);
  border-radius:3px;
}

.shell-rail .side-body{
  flex:1;
  overflow-y:auto;
  overflow-x:hidden;
  padding:10px 12px;
  display:grid;
  gap:12px;
  align-content:start;
  word-break:break-word;
}

/* Top-by-vote / top-divisive lists: tag + votes/split must stay one row in narrow rails */
.shell-rail .side-body#top-votes .rank-meta,
.shell-rail .side-body#top-divisive .rank-meta{
  display:flex !important;
  flex-direction:row !important;
  flex-wrap:nowrap !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:6px !important;
  width:100%;
  box-sizing:border-box;
}
.shell-rail .side-body#top-votes .rank-meta > .tag,
.shell-rail .side-body#top-divisive .rank-meta > .tag{
  flex-shrink:0;
}
.shell-rail .side-body#top-votes .rank-meta > .rank-votes,
.shell-rail .side-body#top-divisive .rank-meta > .rank-votes{
  flex:0 1 auto;
  min-width:0;
  white-space:nowrap;
}

/* Compact spacing for Most Answered / Most Divisive / Open Effects */
.shell-rail .side-body#top-votes,
.shell-rail .side-body#top-divisive,
.shell-rail .side-body#open-effects{
  gap:3px;
  padding-top:3px;
  padding-bottom:3px;
}
.shell-rail .side-body#top-votes .rank-item,
.shell-rail .side-body#top-divisive .rank-item,
.shell-rail .side-body#open-effects .rank-item{
  padding:4px 6px;
  margin-bottom:2px;
}
.shell-rail .side-body#top-votes .rank-title,
.shell-rail .side-body#top-divisive .rank-title,
.shell-rail .side-body#open-effects .rank-title{
  line-height:1.2;
}
.shell-rail .side-body#top-votes .rank-meta,
.shell-rail .side-body#top-divisive .rank-meta,
.shell-rail .side-body#open-effects .rank-meta{
  margin-top:1px;
}

/* Compact spacing for live-stats rail to match dense stacks */
.shell-rail .side-body#live-stats{
  gap:3px;
  padding-top:3px;
  padding-bottom:3px;
}
.shell-rail .side-body#live-stats .sblock{
  padding:4px 6px;
  margin-bottom:2px;
}
.shell-rail .side-body#live-stats .snum{
  font-size:22px;
  line-height:.9;
}
.shell-rail .side-body#live-stats .slbl{
  margin-top:1px;
  font-size:8px;
  letter-spacing:1.2px;
}

/* host wrappers should own the box; component markup stays content-first */
.rail-component-shell{
  border:1px solid var(--border-bright);
  background:rgba(4,15,18,.88);
  box-shadow:none;
  border-radius:0;
  margin:0 0 12px;
  overflow:hidden;
}

.rail-component-shell:last-child{margin-bottom:0}

.rail-component-shell__inner{
  padding:10px 12px;
  background:transparent;
  box-shadow:none;
  border-radius:0;
}

/* flatten rail visuals */
.rail-component-shell *,
.mm-rail-widget *,
.mm-rail-panel *{
  border-radius:0;
}

.mm-rail-widget,
.mm-rail-panel{
  box-shadow:none;
  border-radius:0;
}

/* keep shell/admin look: single framed boxes, no inner card feel */
.mm-rail-widget-body,
.mm-rail-panel-inner{
  background:transparent;
  box-shadow:none;
}

.map-left .recent-signals-host,
.rail-component-shell__inner .recent-signals-host{
  flex:0 1 auto;
  min-height:0;
}
#recent-signals.recent-signals-list{
  box-sizing:border-box;
  max-height:calc(5 * 3.1rem);
  overflow-y:auto;
  overflow-x:hidden;
  min-height:0;
  padding:4px 4px 12px 4px;
  background:rgba(4,15,18,.96);
  border-radius:2px;
  scrollbar-width:thin;
  scrollbar-color:rgba(36,100,120,.65) rgba(4,15,18,.4);
}
#recent-signals.recent-signals-list::-webkit-scrollbar{
  width:6px;
}
#recent-signals.recent-signals-list::-webkit-scrollbar-track{
  background:rgba(4,15,18,.35);
  margin:2px 0 8px;
  border-radius:3px;
}
#recent-signals.recent-signals-list::-webkit-scrollbar-thumb{
  background:rgba(36,100,120,.55);
  border-radius:3px;
}
#recent-signals.recent-signals-list .recent-item:last-child{
  margin-bottom:0;
}

/* Map rails: always dark chrome (never light panels), even with html.theme-light */
.map-left,
.map-right {
  background: rgba(4, 15, 18, 0.98) !important;
}

/* Second map-rail section header (divisive list): keep a clear separator without inline styles. */
.map-right .side-header.map-rail-section-follow {
  border-top: 1px solid var(--border);
  margin-top: 0;
}

/* Map rails: one readable orange title line */
.map-left .side-header .side-title,
.map-right .side-header .side-title,
.map-left .quick-submit .qs-title {
  color: var(--amber) !important;
  font-size: 10px !important;
  letter-spacing: 2px !important;
  opacity: 1 !important;
}
.map-left .side-header .side-subtitle,
.map-right .side-header .side-subtitle {
  display: none !important;
}

/* Map recent-signals text compression */
.map-left #recent-signals .recent-item,
.map-right #recent-signals .recent-item {
  padding: 4px 6px !important;
}
.map-left #recent-signals .recent-item-row,
.map-right #recent-signals .recent-item-row {
  gap: 5px !important;
}
.map-left #recent-signals .recent-title,
.map-right #recent-signals .recent-title {
  font-size: 10px !important;
  line-height: 1.15 !important;
}
.map-left #recent-signals .recent-survey-line,
.map-right #recent-signals .recent-survey-line {
  margin-top: 1px !important;
  font-size: 8px !important;
  letter-spacing: .8px !important;
}
.map-left #recent-signals .recent-time,
.map-right #recent-signals .recent-time {
  font-size: 8px !important;
}

.mm-live-flash{animation:mm-live-flash-kf .55s ease;}
@keyframes mm-live-flash-kf{0%{box-shadow:0 0 0 0 rgba(34,212,238,.0);background-color:transparent;}35%{box-shadow:0 0 0 3px rgba(34,212,238,.16);background-color:rgba(34,212,238,.08);}100%{box-shadow:0 0 0 0 rgba(34,212,238,0);background-color:transparent;}}
.recent-signals-list .recent-item.mm-signal-new-flash{
  animation:mm-signal-item-new 1.2s ease-out 1;
}
@keyframes mm-signal-item-new{
  0%{ border-color:rgba(34,184,207,.2); box-shadow:0 0 0 0 rgba(34,184,207,.0); transform:translateX(0); }
  28%{ border-color:rgba(34,184,207,.72); box-shadow:0 0 16px rgba(34,184,207,.28); transform:translateX(1px); background:rgba(34,184,207,.09); }
  100%{ border-color:var(--border-subtle, var(--border)); box-shadow:none; transform:translateX(0); background:transparent; }
}