:root{--su:clamp(1px, calc(1px + (100vw - 1920px) / 2880), 1.8px);}
@font-face {
  font-family: 'Kharkiv Tone';
  src: local('Kharkiv Tone Regular'),
       local('Kharkiv Tone'),
       url('/san-assets/KharkivTone-Regular.woff2?v=5') format('woff2'),
       url('/san-assets/KharkivTone-Regular.woff?v=5') format('woff'),
       url('/san-assets/KharkivTone-Regular.ttf?v=5') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Kharkiv Tone Fallback';
  src: url('/san-assets/KharkivTone-Regular.ttf?v=5') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
:root {
  --bg: #ef7fb6;
  --ink: #101112;
  --shadow: 0 calc(20 * var(--su)) calc(34 * var(--su)) rgba(0,0,0,.22);
  --footer-h: calc(40 * var(--su));
  --accent-green: #66ff00;
}
* { box-sizing: border-box; margin: 0; padding: 0; }
html, body { width: 100%; height: 100%; }
body {
  font-family: "Kharkiv Tone", "Kharkiv Tone Fallback", system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-weight: 400;
  color: var(--ink);
  overflow: hidden;
  background: var(--bg);
  cursor: none;
}
a { color: inherit; }
.copy a {
  text-decoration-line: line-through;
  text-decoration-thickness: 0.06em;
  text-decoration-color: currentColor;
  text-underline-offset: 0;
  transition: color .16s ease, text-decoration-color .16s ease;
}
.copy a:hover,
.copy a:focus-visible {
  color: var(--accent-green);
  text-decoration-color: var(--accent-green);
  outline: none;
}
button, input, textarea { font: inherit; }
img { display: block; max-width: 100%; }
#app { position: relative; height: 100vh; overflow: hidden; }
#main { position: relative; height: calc(100vh - var(--footer-h)); overflow: hidden; z-index: 2; }
#ambient-noise {
  position: fixed; inset: 0; pointer-events: none; z-index: 8; opacity: 0;
  background-image:
    repeating-linear-gradient(0deg, rgba(255,255,255,.10) 0 1px, transparent 1px calc(3 * var(--su))),
    repeating-radial-gradient(circle at 0 0, rgba(255,255,255,.24) 0 1px, transparent 1px calc(4 * var(--su))),
    linear-gradient(90deg, rgba(255,255,255,.02), rgba(255,255,255,.05), rgba(255,255,255,.02));
  mix-blend-mode: screen;
  animation: noiseMove .22s steps(5, end) infinite;
  transition: opacity .18s ease;
}
#ambient-noise.home-visible { opacity: .22; }
#glitch {
  position: fixed; inset: 0; pointer-events: none; opacity: 0; z-index: 90;
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,.08) 0 1px, transparent 1px calc(5 * var(--su))),
    linear-gradient(90deg, rgba(255,0,120,.06), rgba(0,255,255,.05));
  mix-blend-mode: screen;
}
#glitch.on { animation: glitchFlash .38s steps(6, end); }
@keyframes glitchFlash {
  0% { opacity: 0; transform: none; }
  15% { opacity: .95; transform: translateX(calc(8 * var(--su))) skewX(-1deg); }
  35% { opacity: .35; transform: translateX(calc(-10 * var(--su))) skewX(1.2deg); }
  55% { opacity: .78; transform: translateY(calc(-3 * var(--su))) scaleY(1.01); }
  100% { opacity: 0; transform: none; }
}
@keyframes noiseMove {
  0% { transform: translate(0, 0); }
  50% { transform: translate(calc(2 * var(--su)), calc(-2 * var(--su))); }
  100% { transform: translate(calc(-2 * var(--su)), calc(2 * var(--su))); }
}
@keyframes ticker { from { transform: translateX(0); } to { transform: translateX(-50%); } }
#cursor {
  position: fixed; left: 0; top: 0; width: calc(64 * var(--su)); height: calc(64 * var(--su)); z-index: 9999;
  pointer-events: none; transform: translate(-50%, -50%);
  background: url('./san-assets/KURSOR_KAMIEN.png') center / contain no-repeat;
  filter: drop-shadow(0 calc(10 * var(--su)) calc(16 * var(--su)) rgba(0,0,0,.34));
  will-change: transform, left, top;
}
#cursor.link { transform: translate(-50%, -50%) scale(1.04) rotate(-6deg); filter: drop-shadow(0 calc(14 * var(--su)) calc(20 * var(--su)) rgba(0,0,0,.42)); }
#capsule-layer { position: fixed; inset: 0; z-index: 60; pointer-events: none; }
.capsule {
  position: fixed;
  width: clamp(calc(84 * var(--su)), 9.4vw, calc(132 * var(--su))); height: clamp(calc(84 * var(--su)), 9.4vw, calc(132 * var(--su)));
  border: none; border-radius: calc(999 * var(--su)); padding: 0; overflow: hidden;
  background: rgba(255,255,255,.12);
  box-shadow: 0 calc(20 * var(--su)) calc(34 * var(--su)) rgba(0,0,0,.32), inset 0 1px 0 rgba(255,255,255,.14), inset 0 0 0 1px rgba(255,255,255,.08);
  backdrop-filter: blur(calc(8 * var(--su))) saturate(1.02);
  cursor: none; pointer-events: auto; user-select: none; touch-action: none;
  transition: box-shadow .16s ease, transform .16s ease, background .16s ease;
}
.capsule::before {
  content: ""; position: absolute; inset: 0; border-radius: calc(999 * var(--su));
  background: linear-gradient(180deg, rgba(255,255,255,.26), rgba(255,255,255,0) 42%);
  pointer-events: none;
}
.capsule:hover { box-shadow: 0 calc(22 * var(--su)) calc(36 * var(--su)) rgba(0,0,0,.36), 0 0 0 1px rgba(255,255,255,.16), inset 0 1px 0 rgba(255,255,255,.18); }
.capsule.active { box-shadow: 0 calc(22 * var(--su)) calc(38 * var(--su)) rgba(0,0,0,.38), 0 0 0 calc(2 * var(--su)) rgba(255,0,138,.18), inset 0 1px 0 rgba(255,255,255,.18); }
.capsule.dragging { transition: none; box-shadow: 0 calc(28 * var(--su)) calc(44 * var(--su)) rgba(0,0,0,.42), 0 0 0 calc(2 * var(--su)) rgba(255,255,255,.2); }
.capsule img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: calc(999 * var(--su)); mix-blend-mode: screen; opacity: .94; pointer-events: none; }
.capsule.screen { background: rgba(255,255,255,.1); }
.capsule-screen-inner {
  position: absolute; inset: calc(8 * var(--su)); border-radius: calc(999 * var(--su)); overflow: hidden; background: #000;
  border: 1px solid rgba(255,255,255,.24); box-shadow: 0 0 0 1px rgba(255,255,255,.08) inset, 0 calc(5 * var(--su)) calc(12 * var(--su)) rgba(0,0,0,.18);
}
.capsule-screen-inner iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; pointer-events: none; }
.capsule-screen-inner .tv-snow {
  position: absolute; inset: 0; pointer-events: none; opacity: .12;
  background: repeating-linear-gradient(0deg, rgba(255,255,255,.16) 0 1px, transparent 1px calc(3 * var(--su)));
  mix-blend-mode: screen;
}
.view { position: absolute; inset: 0; opacity: 0; pointer-events: none; transition: opacity .28s ease; }
.view.active { opacity: 1; pointer-events: auto; z-index: 2; }
.scroll-layer { position: absolute; inset: 0; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: contain; scrollbar-width: none; padding: calc(56 * var(--su)) min(2vw, calc(28 * var(--su))) calc(90 * var(--su)) min(2vw, calc(28 * var(--su))); }
.scroll-layer::-webkit-scrollbar { display: none; }
.scroll-track {
  position: relative; display: flex; flex-direction: column; gap: calc(48 * var(--su));
}
.scroll-copy { flex: 0 0 auto; }
.scrollbar-ghost {
  position: fixed; right: calc(12 * var(--su)); top: calc(56 * var(--su)); bottom: calc(var(--footer-h) + calc(14 * var(--su))); width: calc(14 * var(--su)); z-index: 26;
  border-radius: calc(999 * var(--su)); background: rgba(62,56,70,.72); box-shadow: 0 calc(8 * var(--su)) calc(18 * var(--su)) rgba(0,0,0,.24), inset 0 0 0 1px rgba(255,255,255,.08);
  opacity: 0; transition: opacity .18s ease; pointer-events: auto;
}
.scrollbar-ghost.visible { opacity: 1; }
.scrollbar-ghost-thumb {
  position: absolute; left: 1px; top: 0; width: calc(12 * var(--su)); height: calc(84 * var(--su)); border-radius: calc(999 * var(--su));
  background: rgba(240,109,183,.96); box-shadow: 0 calc(8 * var(--su)) calc(16 * var(--su)) rgba(0,0,0,.38), inset 0 1px 0 rgba(255,255,255,.14), inset 0 -1px 0 rgba(0,0,0,.18);
  will-change: top; pointer-events: auto;
}
.copy {
  max-width: none; width: calc(100vw - min(4vw, calc(56 * var(--su)))); font-size: clamp(calc(40 * var(--su)), 4.7vw, calc(82 * var(--su)));
  opacity: .95; line-height: .96; letter-spacing: -0.03em; text-align: left;
}
.copy p { margin: 0 0 1.05em 0; text-align: left; width: 100%; }
.copy .small { font-size: 1em; line-height: .96; display: block; max-width: none; }
.iframe-view { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; background: #fff; }
.iframe-fallback { position: absolute; inset: 0; display: flex; align-items: center; justify-content: center; padding: calc(80 * var(--su)) calc(24 * var(--su)) calc(96 * var(--su)); }
.iframe-card {
  max-width: calc(820 * var(--su)); background: rgba(255,255,255,.18); border: 1px solid rgba(255,255,255,.42); backdrop-filter: blur(calc(6 * var(--su)));
  border-radius: calc(22 * var(--su)); padding: calc(28 * var(--su)) calc(30 * var(--su)); box-shadow: 0 calc(12 * var(--su)) calc(28 * var(--su)) rgba(0,0,0,.18);
}
.iframe-card h2 { font-size: clamp(calc(36 * var(--su)), 4vw, calc(64 * var(--su))); line-height: .96; margin-bottom: calc(12 * var(--su)); }
.iframe-card p { font-size: clamp(calc(22 * var(--su)), 2vw, calc(30 * var(--su))); line-height: 1.04; margin-bottom: calc(16 * var(--su)); }
.iframe-open { display: inline-block; padding: calc(11 * var(--su)) calc(16 * var(--su)); border-radius: calc(999 * var(--su)); background: rgba(255,255,255,.86); color: #111; text-decoration: none; font-family: Arial, Helvetica, sans-serif; font-size: calc(14 * var(--su)); }
.workspace {
  position: absolute; inset: 0; display: grid; grid-template-columns: minmax(0, 1fr) minmax(calc(320 * var(--su)), 24vw) 12.5vw;
  gap: calc(16 * var(--su)); padding: calc(18 * var(--su)) calc(18 * var(--su)) calc(var(--footer-h) + calc(18 * var(--su))) calc(18 * var(--su)); z-index: 2;
}
.archive-main, .archive-input, .signal-strip, .research-map, .research-side {
  background: rgba(31, 35, 39, .18); border: 1px solid rgba(255,255,255,.18); border-radius: calc(24 * var(--su));
  backdrop-filter: blur(calc(8 * var(--su))) saturate(1.02); box-shadow: var(--shadow); overflow: hidden;
}
.archive-main { display: grid; grid-template-rows: auto minmax(0, 1fr) auto auto; }

/* ── ♻️ Home button ── */
.home-btn {
  position: relative;
  background: none; border: none; cursor: none;
  font-size: clamp(calc(18 * var(--su)), 1.8vw, calc(24 * var(--su)));
  line-height: 1; padding: calc(2 * var(--su)) calc(4 * var(--su));
  flex-shrink: 0; opacity: .82;
  transition: opacity .16s, transform .16s;
}
.home-btn:hover { opacity: 1; transform: rotate(120deg); }
.home-btn .home-tip {
  position: absolute; left: 50%; top: calc(100% + calc(6 * var(--su)));
  transform: translateX(-50%);
  background: rgba(0,0,0,.72); color: #fff7fb;
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su)); letter-spacing: .1em; text-transform: uppercase;
  padding: calc(4 * var(--su)) calc(8 * var(--su)); border-radius: calc(6 * var(--su)); white-space: nowrap;
  pointer-events: none; opacity: 0; transition: opacity .16s;
}
.home-btn:hover .home-tip { opacity: 1; }
.archive-head, .research-head {
  display: flex; align-items: center; justify-content: space-between; gap: calc(6 * var(--su));
  padding: calc(14 * var(--su)) calc(16 * var(--su)); border-bottom: 1px solid rgba(255,255,255,.14);
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0));
}
/* No gradient in ADD TO @RCHIVE sidebar panel */
.archive-input .archive-head {
  background: none;
  padding: calc(12 * var(--su)) calc(14 * var(--su));
}
/* .archive-title .research-title .panel-title — unified below */
.archive-actions, .research-actions { display: flex; flex-wrap: wrap; gap: calc(8 * var(--su)); }
.filter-input {
  min-width: calc(180 * var(--su));
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.08);
  color: #fff7fb;
  padding: calc(8 * var(--su)) calc(12 * var(--su));
  border-radius: calc(999 * var(--su));
  outline: none;
  cursor: none;
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(12 * var(--su));
}
.archive-tools {
  display: grid;
  gap: calc(10 * var(--su));
  padding: calc(10 * var(--su));
  border-radius: calc(16 * var(--su));
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
}
.tool-row {
  display: flex;
  gap: calc(8 * var(--su));
  flex-wrap: wrap;
}
.queue-stats {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(12 * var(--su));
  line-height: 1.35;
  opacity: .84;
}
.chip-btn {
  border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.1); color: #fff7fb;
  padding: calc(8 * var(--su)) calc(12 * var(--su)); border-radius: calc(999 * var(--su)); cursor: none; font-size: calc(11 * var(--su)); letter-spacing: .04em; text-transform: uppercase;
}
/* Archive main login btn — hidden on desktop (col3 has it), shown on mobile */
#archive-auth-btn-main { display: none; }
.chat-log { padding: calc(18 * var(--su)); overflow: auto; display: flex; flex-direction: column; gap: calc(12 * var(--su)); }
.chat-msg {
  max-width: 92%; padding: calc(14 * var(--su)) calc(16 * var(--su)); border-radius: calc(18 * var(--su)); line-height: 1.08; font-size: clamp(calc(16 * var(--su)), 1.05vw, calc(20 * var(--su)));
  background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.14);
}
.chat-msg.user { align-self: flex-end; background: rgba(255,255,255,.2); }
.chat-msg.bot { align-self: flex-start; }
.chat-msg .meta { display: block; margin-top: calc(10 * var(--su)); font-family: Arial, Helvetica, sans-serif; font-size: calc(12 * var(--su)); line-height: 1.35; opacity: .78; }
.chat-composer {
  border-top: 1px solid rgba(255,255,255,.14); padding: calc(12 * var(--su)) calc(14 * var(--su)); display: grid; grid-template-columns: 1fr auto; gap: calc(10 * var(--su));
}
.chat-input {
  min-height: calc(78 * var(--su)); resize: none; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.08);
  color: #161618; border-radius: calc(16 * var(--su)); padding: calc(12 * var(--su)) calc(14 * var(--su)); outline: none;
}
.archive-cards {
  border-top: 1px solid rgba(255,255,255,.14);
  padding: calc(12 * var(--su)) calc(14 * var(--su)) calc(14 * var(--su));
  display: grid;
  gap: calc(10 * var(--su));
  max-height: calc(220 * var(--su));
  overflow: auto;
}
.source-card {
  background: rgba(255,255,255,.10);
  border: 1px solid rgba(255,255,255,.14);
  border-radius: calc(18 * var(--su));
  padding: calc(12 * var(--su)) calc(14 * var(--su));
  display: grid;
  gap: calc(8 * var(--su));
  cursor: none;
  text-align: left;
}
.source-card.active {
  border-color: rgba(255,116,196,.32);
  box-shadow: 0 0 0 1px rgba(255,255,255,.12), 0 0 calc(18 * var(--su)) rgba(93,255,223,.22);
}
.source-card.hidden,
.node.hidden {
  display: none !important;
}
.source-card h4 { font-size: calc(16 * var(--su)); line-height: 1; }
.source-card p { font-family: Arial, Helvetica, sans-serif; font-size: calc(12 * var(--su)); line-height: 1.38; }
.source-meta { display: flex; flex-wrap: wrap; gap: calc(6 * var(--su)); }
.source-chip {
  padding: calc(4 * var(--su)) calc(7 * var(--su));
  border-radius: calc(999 * var(--su));
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  letter-spacing: .06em;
  text-transform: uppercase;
  background: rgba(255,255,255,.12);
}
.archive-input {
  display: grid;
  grid-template-rows: auto repeat(6, auto) 1fr auto auto auto;
  padding: calc(14 * var(--su));
  gap: calc(10 * var(--su));
}
/* .panel-title — unified below */
.field, .textarea {
  width: 100%; border: 1px solid rgba(255,255,255,.18); background: rgba(255,255,255,.12); color: #131314;
  border-radius: calc(14 * var(--su)); padding: calc(10 * var(--su)) calc(12 * var(--su)); outline: none;
}
.textarea { min-height: calc(88 * var(--su)); resize: vertical; }
.honeypot { position: absolute !important; left: calc(-9999 * var(--su)) !important; width: 1px; height: 1px; overflow: hidden; }
.mini-note { font-family: Arial, Helvetica, sans-serif; font-size: calc(12 * var(--su)); line-height: 1.35; opacity: .82; }
.audio-tools {
  display: grid;
  gap: calc(8 * var(--su));
  padding: calc(10 * var(--su));
  border-radius: calc(16 * var(--su));
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
}
.audio-row { display: flex; gap: calc(8 * var(--su)); flex-wrap: wrap; }
.audio-preview { width: 100%; height: calc(34 * var(--su)); }
.audio-status { font-family: Arial, Helvetica, sans-serif; font-size: calc(12 * var(--su)); line-height: 1.35; opacity: .82; }
.signal-strip {
  background: rgba(43, 46, 54, .88); color: #e9edf2; display: grid; grid-template-rows: auto minmax(0, 1fr);
}
.strip-head {
  padding: calc(12 * var(--su)) calc(12 * var(--su)) calc(10 * var(--su)); font-family: Arial, Helvetica, sans-serif; font-size: calc(10 * var(--su)); letter-spacing: .18em; text-transform: uppercase;
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.strip-stream-wrap { position: relative; overflow: hidden; }
.strip-stream { position: absolute; inset: 0; padding: calc(12 * var(--su)); display: flex; flex-direction: column; gap: calc(8 * var(--su)); will-change: transform; }
.strip-item {
  font-family: Arial, Helvetica, sans-serif; font-size: calc(10 * var(--su)); line-height: 1.22; letter-spacing: .08em; text-transform: uppercase;
  padding-bottom: calc(8 * var(--su)); border-bottom: 1px dotted rgba(255,255,255,.12); opacity: .9;
}
.strip-link {
  display: block;
  color: inherit;
  text-decoration: none;
  transition: color .14s ease, transform .14s ease;
}
.strip-link:hover,
.strip-link:focus-visible {
  color: var(--accent-green);
  transform: translateX(calc(2 * var(--su)));
  outline: none;
}
.chat-links {
  display: flex;
  flex-wrap: wrap;
  gap: calc(6 * var(--su));
  margin-top: calc(10 * var(--su));
}
.chat-link {
  display: inline-block;
  padding: calc(4 * var(--su)) calc(7 * var(--su));
  border-radius: calc(999 * var(--su));
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.14);
  color: inherit;
  text-decoration: none;
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  letter-spacing: .05em;
  text-transform: uppercase;
}
.chat-link:hover,
.chat-link:focus-visible {
  color: var(--accent-green);
  border-color: rgba(102,255,0,.35);
  outline: none;
}
.research-shell { position: absolute; inset: 0; display: grid; grid-template-columns: minmax(0, 1fr) calc(340 * var(--su)); gap: calc(16 * var(--su)); padding: calc(18 * var(--su)) calc(18 * var(--su)) calc(var(--footer-h) + calc(18 * var(--su))) calc(18 * var(--su)); }
.research-map {
  position: relative;
  overflow: hidden;
  background:
    radial-gradient(circle at 20% 20%, rgba(92,255,209,.10), transparent 24%),
    radial-gradient(circle at 78% 62%, rgba(255,77,166,.10), transparent 28%),
    linear-gradient(180deg, rgba(6,12,20,.62), rgba(20,18,28,.32));
}

.research-broadcast {
  position: absolute;
  inset: calc(58 * var(--su)) calc(12 * var(--su)) calc(12 * var(--su)) calc(12 * var(--su));
  display: grid;
  grid-template-columns: calc(156 * var(--su)) minmax(0, 1fr) calc(310 * var(--su));
  gap: calc(12 * var(--su));
  align-items: start;
}
.player-column {
  display: block;
  min-height: 0;
}
.player-stack,
.player-main-shell,
.research-chat-shell {
  background: rgba(43, 46, 54, .88);
  color: #e9edf2;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: calc(18 * var(--su));
  overflow: hidden;
}
.player-stack {
  display: grid;
  grid-template-rows: repeat(5, minmax(0, 1fr));
  gap: calc(8 * var(--su));
  padding: calc(8 * var(--su));
  align-content: stretch;
  height: var(--player-stack-h, auto);
}
.player-tile {
  position: relative;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: calc(14 * var(--su));
  overflow: visible;
  background: linear-gradient(180deg, rgba(0,0,0,.64), rgba(24,18,32,.58));
  min-height: 0;
  cursor: none;
}
.player-tile.active {
  box-shadow: 0 0 0 1px rgba(255,255,255,.12), 0 0 calc(18 * var(--su)) rgba(93,255,223,.28);
  border-color: rgba(255,116,196,.32);
}
.player-tile iframe,
.player-main-frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background: #000;
}
.player-tile-label {
  position: absolute;
  left: calc(6 * var(--su));
  bottom: calc(6 * var(--su));
  z-index: 2;
  padding: calc(4 * var(--su)) calc(7 * var(--su));
  border-radius: calc(999 * var(--su));
  background: rgba(0,0,0,.58);
  color: #fff7fb;
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  letter-spacing: .08em;
  text-transform: uppercase;
}
.tv-snow-panel {
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,.16) 0 1px, transparent 1px calc(3 * var(--su))),
    repeating-radial-gradient(circle at 0 0, rgba(255,255,255,.14) 0 1px, transparent 1px calc(4 * var(--su))),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.08), rgba(255,255,255,.03));
  mix-blend-mode: screen;
  opacity: .28;
  animation: noiseMove .22s steps(5, end) infinite;
}
.player-main-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
}
.player-main-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(10 * var(--su));
  padding: calc(10 * var(--su)) calc(12 * var(--su));
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.player-main-title {
  font-size: calc(14 * var(--su));
  letter-spacing: .18em;
  text-transform: uppercase;
  font-family: Arial, Helvetica, sans-serif;
}
.player-main-tools {
  display: flex;
  gap: calc(8 * var(--su));
  flex-wrap: wrap;
}
.player-main-frame {
  position: relative;
  width: 100%;
  aspect-ratio: 16 / 9;
  min-height: 0;
  background: #000;
}
.player-main-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(24 * var(--su));
  text-align: center;
  color: rgba(255,255,255,.78);
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(14 * var(--su));
  line-height: 1.4;
}
.research-chat-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-width: 0;
}
.research-chat-title {
  padding: calc(10 * var(--su)) calc(12 * var(--su));
  border-bottom: 1px solid rgba(255,255,255,.12);
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(12 * var(--su));
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(255,255,255,.78);
}
.research-chat-log {
  padding: calc(12 * var(--su));
  overflow: auto;
  display: grid;
  gap: calc(8 * var(--su));
}
.research-chat-msg {
  padding: calc(10 * var(--su)) calc(12 * var(--su));
  border-radius: calc(14 * var(--su));
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(12 * var(--su));
  line-height: 1.4;
  color: rgba(255,255,255,.82);
}
.research-chat-foot {
  padding: calc(10 * var(--su)) calc(12 * var(--su));
  border-top: 1px solid rgba(255,255,255,.12);
  display: grid;
  gap: calc(8 * var(--su));
}
.research-url-row {
  display: flex;
  gap: calc(8 * var(--su));
  flex-wrap: wrap;
}
.research-url-input {
  flex: 1 1 calc(180 * var(--su));
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.08);
  color: #fff7fb;
  padding: calc(8 * var(--su)) calc(12 * var(--su));
  border-radius: calc(999 * var(--su));
  outline: none;
  cursor: none;
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(12 * var(--su));
}
.player-node-list {
  display: grid;
  gap: calc(8 * var(--su));
}
.player-node-item {
  padding: calc(9 * var(--su)) calc(10 * var(--su));
  border-radius: calc(14 * var(--su));
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,245,252,.96);
  text-align: left;
  cursor: none;
}
.player-node-item.active {
  border-color: rgba(255,116,196,.24);
  box-shadow: 0 0 0 1px rgba(255,255,255,.10), 0 0 calc(14 * var(--su)) rgba(93,255,223,.18);
}
.player-node-item strong {
  display: block;
  font-size: calc(12 * var(--su));
  line-height: 1.1;
  margin-bottom: calc(4 * var(--su));
}
.player-node-item span {
  display: block;
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(11 * var(--su));
  line-height: 1.3;
  opacity: .82;
}
.player-tile {
  position: relative;
  border: 1px solid rgba(255,255,255,.18);
  border-radius: calc(14 * var(--su));
  overflow: hidden;
  background: linear-gradient(180deg, rgba(0,0,0,.64), rgba(24,18,32,.58));
  min-height: calc(88 * var(--su));
  cursor: none;
}
.player-tile.active {
  box-shadow: 0 0 0 1px rgba(255,255,255,.12), 0 0 calc(18 * var(--su)) rgba(93,255,223,.28);
  border-color: rgba(255,116,196,.32);
}
.player-tile iframe,
.player-main-frame iframe {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  border: 0;
  background: #000;
}
.player-tile-label {
  position: absolute;
  left: calc(6 * var(--su));
  bottom: calc(6 * var(--su));
  z-index: 2;
  padding: calc(4 * var(--su)) calc(7 * var(--su));
  border-radius: calc(999 * var(--su));
  background: rgba(0,0,0,.58);
  color: #fff7fb;
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  letter-spacing: .08em;
  text-transform: uppercase;
}
.tv-snow-panel {
  position: absolute;
  inset: 0;
  background:
    repeating-linear-gradient(0deg, rgba(255,255,255,.16) 0 1px, transparent 1px calc(3 * var(--su))),
    repeating-radial-gradient(circle at 0 0, rgba(255,255,255,.14) 0 1px, transparent 1px calc(4 * var(--su))),
    linear-gradient(180deg, rgba(255,255,255,.03), rgba(255,255,255,.08), rgba(255,255,255,.03));
  mix-blend-mode: screen;
  opacity: .28;
  animation: noiseMove .22s steps(5, end) infinite;
}
.player-main-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
}
.player-main-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: calc(10 * var(--su));
  padding: calc(10 * var(--su)) calc(12 * var(--su));
  border-bottom: 1px solid rgba(255,255,255,.12);
}
.player-main-title {
  font-size: calc(14 * var(--su));
  letter-spacing: .04em;
}
.player-main-tools {
  display: flex;
  gap: calc(8 * var(--su));
  flex-wrap: wrap;
}
.player-main-frame {
  position: relative;
  min-height: calc(420 * var(--su));
  background: #000;
}
.player-main-placeholder {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(24 * var(--su));
  text-align: center;
  color: rgba(255,255,255,.78);
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(14 * var(--su));
  line-height: 1.4;
}
.research-chat-shell {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
}
.research-chat-title {
  padding: calc(10 * var(--su)) calc(12 * var(--su));
  border-bottom: 1px solid rgba(255,255,255,.12);
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(12 * var(--su));
  letter-spacing: .22em;
  text-transform: uppercase;
  color: rgba(255,255,255,.78);
}
.research-chat-log {
  padding: calc(12 * var(--su));
  overflow: auto;
  display: grid;
  gap: calc(8 * var(--su));
}
.research-chat-msg {
  padding: calc(10 * var(--su)) calc(12 * var(--su));
  border-radius: calc(14 * var(--su));
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(12 * var(--su));
  line-height: 1.4;
  color: rgba(255,255,255,.82);
}
.research-chat-foot {
  padding: calc(10 * var(--su)) calc(12 * var(--su));
  border-top: 1px solid rgba(255,255,255,.12);
  display: grid;
  gap: calc(8 * var(--su));
}
.research-url-row {
  display: flex;
  gap: calc(8 * var(--su));
  flex-wrap: wrap;
}
.research-url-input {
  flex: 1 1 calc(180 * var(--su));
  border: 1px solid rgba(255,255,255,.16);
  background: rgba(255,255,255,.08);
  color: #fff7fb;
  padding: calc(8 * var(--su)) calc(12 * var(--su));
  border-radius: calc(999 * var(--su));
  outline: none;
  cursor: none;
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(12 * var(--su));
}

@media (max-width: 1100px) {
  .research-broadcast {
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    position: static;
    inset: auto;
  }
  .player-column { order: 1; }
  .player-main-shell { order: 2; }
  .research-chat-shell { order: 3; }
  .player-stack {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    grid-template-rows: none;
    height: auto;
  }
}


@media (max-width: 720px) {
  .research-shell {
    grid-template-columns: 1fr;
    grid-template-rows: minmax(0, 1fr) auto;
    gap: calc(8 * var(--su));
    padding: calc(10 * var(--su)) calc(10 * var(--su)) calc(14 * var(--su)) calc(10 * var(--su));
  }
  .research-broadcast {
    position: static;
    inset: auto;
    display: grid;
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto;
    gap: calc(8 * var(--su));
  }
  .player-column { order: 1; }
  .player-stack {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    grid-template-rows: none;
    gap: calc(6 * var(--su));
    padding: calc(6 * var(--su));
    height: auto;
  }
  .player-tile {
    border-radius: calc(10 * var(--su));
    min-height: 0;
  }
  .player-tile-label {
    left: calc(4 * var(--su));
    right: calc(4 * var(--su));
    bottom: calc(4 * var(--su));
    padding: calc(3 * var(--su)) calc(5 * var(--su));
    font-size: calc(8 * var(--su));
    letter-spacing: .04em;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }
  .player-main-shell { order: 2; }
  .player-main-head { padding: calc(8 * var(--su)) calc(10 * var(--su)); }
  .player-main-title { font-size: calc(11 * var(--su)); letter-spacing: .1em; }
  .player-main-tools { gap: calc(6 * var(--su)); }
  .player-main-frame { aspect-ratio: 16 / 9; min-height: 0; }
  .research-chat-shell { order: 3; }
  .research-chat-foot { gap: calc(6 * var(--su)); }
  .research-url-row {
    display: grid;
    grid-template-columns: 1fr auto 1fr auto;
    gap: calc(6 * var(--su));
    align-items: center;
  }
  .research-url-input {
    min-width: 0;
    padding: calc(7 * var(--su)) calc(10 * var(--su));
    font-size: calc(11 * var(--su));
  }
  .research-side { max-height: calc(40 * var(--su)); overflow: hidden; opacity: .5; font-size: calc(11 * var(--su)); }
  .research-chat-log { min-height: calc(100 * var(--su)); }
}

.node {
  position: absolute;
  min-width: calc(148 * var(--su));
  max-width: calc(236 * var(--su));
  padding: calc(12 * var(--su)) calc(14 * var(--su));
  border-radius: calc(16 * var(--su));
  border: 1px solid rgba(149,255,232,.22);
  background: linear-gradient(180deg, rgba(12,20,28,.78), rgba(24,18,32,.58));
  color: rgba(236,248,255,.96);
  box-shadow: 0 calc(14 * var(--su)) calc(26 * var(--su)) rgba(0,0,0,.22), inset 0 1px 0 rgba(255,255,255,.08), 0 0 0 1px rgba(0,255,200,.05);
  cursor: none;
  user-select: none;
  backdrop-filter: blur(calc(6 * var(--su))) saturate(1.1);
  transform: translate3d(0,0,0);
  transition: box-shadow .18s ease, border-color .18s ease;
}
.node::before {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: calc(16 * var(--su));
  background: linear-gradient(180deg, rgba(255,255,255,.08), rgba(255,255,255,0) 40%);
  pointer-events: none;
}
.node h4 {
  font-size: calc(16 * var(--su)); line-height: .98; margin-bottom: calc(6 * var(--su));
  color: rgba(255,245,252,.98);
  text-shadow: 1px 0 0 rgba(255,0,120,.16), -1px 0 0 rgba(0,255,255,.14);
}
.node p {
  font-family: Arial, Helvetica, sans-serif; font-size: calc(11 * var(--su)); line-height: 1.28; opacity: .86; color: rgba(215,236,244,.92);
}
.node.active {
  box-shadow: 0 calc(18 * var(--su)) calc(30 * var(--su)) rgba(0,0,0,.28), 0 0 0 1px rgba(255,255,255,.14), 0 0 calc(18 * var(--su)) rgba(93,255,223,.28);
  border-color: rgba(255,116,196,.26);
}
.node.dragging {
  box-shadow: 0 calc(20 * var(--su)) calc(34 * var(--su)) rgba(0,0,0,.30), 0 0 0 1px rgba(255,255,255,.16), 0 0 calc(22 * var(--su)) rgba(93,255,223,.34);
}
.research-side { display: grid; grid-template-rows: auto minmax(0, 1fr) auto; }
.inspector { padding: calc(16 * var(--su)); overflow: auto; display: grid; gap: calc(12 * var(--su)); }
.inspector-card {
  background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.14); border-radius: calc(18 * var(--su)); padding: calc(14 * var(--su));
}
.inspector-card h3 { font-size: calc(18 * var(--su)); line-height: 1; margin-bottom: calc(8 * var(--su)); }
.inspector-card p { font-family: Arial, Helvetica, sans-serif; font-size: calc(13 * var(--su)); line-height: 1.4; }
.output-list { display: grid; gap: calc(8 * var(--su)); }
.output-item {
  padding: calc(10 * var(--su)) calc(12 * var(--su)); border-radius: calc(14 * var(--su)); background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.12);
  font-family: Arial, Helvetica, sans-serif; font-size: calc(12 * var(--su)); line-height: 1.35;
}
.badge-row { display: flex; flex-wrap: wrap; gap: calc(8 * var(--su)); }
.badge { padding: calc(5 * var(--su)) calc(8 * var(--su)); border-radius: calc(999 * var(--su)); font-family: Arial, Helvetica, sans-serif; font-size: calc(10 * var(--su)); letter-spacing: .08em; text-transform: uppercase; background: rgba(255,255,255,.12); }
.status-line { font-family: Arial, Helvetica, sans-serif; font-size: calc(12 * var(--su)); line-height: 1.35; opacity: .82; }
.micro-help {
  position: absolute;
  z-index: 120;
  max-width: calc(220 * var(--su));
  padding: calc(8 * var(--su)) calc(10 * var(--su));
  border-radius: calc(12 * var(--su));
  background: rgba(34,36,42,.86);
  color: rgba(245,247,250,.96);
  border: 1px solid rgba(255,255,255,.12);
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(11 * var(--su));
  line-height: 1.35;
  letter-spacing: .02em;
  pointer-events: none;
  opacity: 0;
  transform: translateY(calc(4 * var(--su)));
  transition: opacity .18s ease, transform .18s ease;
}
.micro-help.visible {
  opacity: 1;
  transform: translateY(0);
}
@media (hover: none), (pointer: coarse) {
  .micro-help {
    display: none !important;
  }
}
/* footer replaced by #san-ticker from san-shared.js */
footer:not(#san-ticker) { display: none !important; }
.footer-inner {
  display: inline-flex; align-items: center; gap: 3rem; white-space: nowrap; font-size: clamp(calc(13 * var(--su)), 1.1vw, calc(16 * var(--su))); line-height: 1;
  animation: ticker 26s linear infinite; font-family: Arial, Helvetica, sans-serif; color: #1a1a1a;
}
.footer-segment { flex: 0 0 auto; padding-left: calc(28 * var(--su)); }
@media (max-width: 1100px) {
  .workspace { grid-template-columns: minmax(0, 1fr); grid-template-rows: minmax(0, 1fr) auto auto; }
  .signal-strip { min-height: calc(180 * var(--su)); }
  .research-shell {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-bottom: calc(24 * var(--su));
  }
  .research-map { overflow: visible; }
  .research-side {
    max-height: calc(40 * var(--su));
    overflow: hidden;
    opacity: .45;
    border-radius: calc(12 * var(--su));
    pointer-events: none;
  }
}
@media (max-width: 900px) {
  body { cursor: auto; }
  #cursor { display: none; }
  #main { height: 100dvh; }
  footer { display: none; }

  /* Scrollbar */
  .scrollbar-ghost { right: calc(6 * var(--su)); top: calc(78 * var(--su)); bottom: calc(10 * var(--su)); width: calc(8 * var(--su)); }
  .scrollbar-ghost-thumb { left: 1px; width: calc(6 * var(--su)); height: calc(56 * var(--su)); }

  /* Home view text */
  .scroll-layer { padding: calc(78 * var(--su)) calc(14 * var(--su)) calc(20 * var(--su)) calc(14 * var(--su)); }
  .copy { font-size: clamp(calc(20 * var(--su)), 6vw, calc(30 * var(--su))); }

  /* Workspace & research shell */
  .workspace { padding: calc(8 * var(--su)) calc(8 * var(--su)) calc(12 * var(--su)) calc(8 * var(--su)); grid-template-columns: 1fr; grid-template-rows: 1fr auto; }
  .research-shell { padding: 0; overflow-y: auto; -webkit-overflow-scrolling: touch; }

  /* ── ARCHIVE MOBILE ── */
  .archive-head {
    position: sticky; top: 0; z-index: 10;
    background: rgba(20,22,28,.98); backdrop-filter: blur(calc(8 * var(--su)));
    padding: calc(8 * var(--su)) calc(12 * var(--su));
    flex-wrap: wrap; gap: calc(6 * var(--su));
  }
  .archive-title { font-size: clamp(calc(13 * var(--su)),3.5vw,calc(16 * var(--su))); }
  .archive-actions { display: flex; flex-wrap: wrap; gap: calc(6 * var(--su)); }
  /* Hide desktop-only nav buttons in archive on mobile */
  #send-selected-to-research { display: none !important; }
  #goto-projectroom { display: none !important; }
  /* Keep only HIDE B@DGES and LOGIN visible */
  #toggle-badges-btn { display: none !important; }

  /* ASK MIS@RCHIVIST — full width */
  .chat-composer { grid-template-columns: 1fr auto; padding: calc(10 * var(--su)) calc(12 * var(--su)); }
  #ask-archivist { border-radius: calc(12 * var(--su)); padding: calc(10 * var(--su)) calc(14 * var(--su)); font-size: calc(13 * var(--su)); }
  .archive-main { display: flex; flex-direction: column; }

  /* Archive input (ADD TO @RCHIVE) — collapsed on mobile */
  .archive-input { display: none; }
  .workspace .signal-strip { display: none; }

  /* ── RESEARCH MOBILE ── */
  .research-head {
    position: sticky; top: 0; z-index: 10;
    background: rgba(30,26,42,.98); backdrop-filter: blur(calc(8 * var(--su)));
    padding: calc(8 * var(--su)) calc(12 * var(--su));
    flex-wrap: wrap; gap: calc(6 * var(--su)); min-height: calc(48 * var(--su));
  }
  .research-title { font-size: clamp(calc(13 * var(--su)),3.5vw,calc(16 * var(--su))); }
  .research-actions { display: flex; flex-wrap: wrap; gap: calc(6 * var(--su)); align-items: center; }

  /* LOG IN button — always visible in research header on mobile */
  .research-auth-btn-mobile { display: inline-flex !important; }
  /* Archive main LOG IN — mobile only */
  #archive-auth-btn-main { display: inline-flex; }
  /* Hide desktop nav in research on mobile */
  #ask-from-research { display: none !important; }
  #goto-projectroom-r { display: none !important; }
  #toggle-badges-btn-r { display: none !important; }

  /* Research map — allow scroll */
  .research-map { overflow-y: auto; -webkit-overflow-scrolling: touch; }

  /* Player tiles — horizontal scroll row */
  .research-broadcast-refined .player-column { flex-direction: row; overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .research-broadcast-refined .player-stack {
    display: flex; flex-direction: row;
    height: auto !important; padding: calc(6 * var(--su)); gap: calc(6 * var(--su));
    overflow-x: auto; -webkit-overflow-scrolling: touch;
  }
  .research-broadcast-refined .player-tile {
    min-width: calc(120 * var(--su)); flex-shrink: 0; aspect-ratio: unset;
  }
  .research-broadcast-refined .player-tile-screen { min-height: calc(68 * var(--su)); }

  /* Player tile buttons — always visible */
  .research-broadcast-refined .player-tile-btns { display: flex !important; flex-shrink: 0; }
  .research-broadcast-refined .player-tile-btn { font-size: calc(7 * var(--su)); padding: calc(3 * var(--su)) calc(2 * var(--su)); }

  /* Main player — 16:9 */
  .research-broadcast-refined .player-main-shell { padding: calc(6 * var(--su)); }
  .research-broadcast-refined .player-main-frame {
    flex: none; width: 100%; aspect-ratio: 16/9; min-height: 0;
  }

  /* Chat log hidden on mobile, URL inputs visible */
  .research-broadcast-refined .research-chat-log { display: none !important; }
  .research-broadcast-refined .research-chat-foot { display: block !important; padding: calc(8 * var(--su)); border-top: none; }
  .research-broadcast-refined .research-chat-shell { height: auto !important; overflow: visible !important; }
}

@media (max-width: 640px) {
  .scroll-layer { padding: calc(72 * var(--su)) calc(12 * var(--su)) calc(16 * var(--su)) calc(12 * var(--su)); }
  .copy { font-size: clamp(calc(18 * var(--su)), 6.5vw, calc(26 * var(--su))); }
  .research-broadcast-refined .player-tile { min-width: calc(100 * var(--su)); }
  .research-broadcast-refined .player-tile-screen { min-height: calc(56 * var(--su)); }
}



/* research layout refinement v3 */
.research-broadcast-refined {
  position: absolute;
  inset: calc(58 * var(--su)) calc(12 * var(--su)) calc(12 * var(--su)) calc(12 * var(--su));
  display: grid;
  grid-template-columns: calc(148 * var(--su)) minmax(0, 1fr) calc(272 * var(--su));
  grid-template-rows: auto 1fr;
  gap: 0;
  align-items: stretch;
  border-radius: calc(20 * var(--su));
  overflow: hidden;
  background: rgba(43, 46, 54, .92);
  border: 1px solid rgba(255,255,255,.14);
  box-shadow: var(--shadow);
}
.research-broadcast-head {
  grid-column: 1 / -1;
  display: grid;
  grid-template-columns: calc(148 * var(--su)) minmax(0, 1fr) calc(272 * var(--su));
  min-height: calc(30 * var(--su));
  border-bottom: 1px solid rgba(255,255,255,.12);
  background: rgba(53, 45, 62, .96);
}
.broadcast-head-cell {
  min-width: 0;
  display: flex;
  align-items: center;
  gap: calc(10 * var(--su));
  padding: calc(5 * var(--su)) calc(12 * var(--su));
  color: #e9edf2;
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(11 * var(--su));
  line-height: 1;
  letter-spacing: .18em;
  text-transform: uppercase;
  border-right: 1px solid rgba(255,255,255,.10);
}
.broadcast-head-cell:last-child { border-right: 0; }
.broadcast-head-main { letter-spacing: .14em; }
.broadcast-head-chat { justify-content: space-between; }
.research-broadcast-refined .player-column,
.research-broadcast-refined .player-main-shell,
.research-broadcast-refined .research-chat-shell {
  min-width: 0;
  min-height: 0;
  border: 0;
  border-right: 1px solid rgba(255,255,255,.10);
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  overflow: hidden;
}
.research-broadcast-refined .research-chat-shell { border-right: 0; }
.research-broadcast-refined .player-column {
  display: flex;
  flex-direction: column;
}
.research-broadcast-refined .player-stack {
  flex: 1;
  min-height: 0;
  padding: calc(8 * var(--su));
  gap: calc(8 * var(--su));
  background: transparent;
}
.research-broadcast-refined .player-tile {
  border-radius: calc(10 * var(--su));
  border: 1px solid rgba(255,255,255,.12);
  background: rgba(24, 26, 31, .96);
  display: flex;
  flex-direction: column;
  overflow: visible;
  aspect-ratio: unset;
}
/* tile inner: the video area */
.player-tile-screen {
  position: relative;
  aspect-ratio: 16 / 9;
  border-radius: calc(10 * var(--su));
  overflow: hidden;
  background: rgba(24,26,31,.96);
  flex-shrink: 0;
}
.research-broadcast-refined .player-tile-screen iframe,
.research-broadcast-refined .player-tile-screen .tv-snow-panel,
.research-broadcast-refined .player-tile-screen .player-tile-label {
  position: absolute;
  inset: 0;
}
.research-broadcast-refined .player-tile-screen iframe {
  width: 100%; height: 100%; border: 0;
  pointer-events: auto; /* allow direct interaction with YouTube/SC play buttons */
}
.research-broadcast-refined .player-tile-screen video,
.research-broadcast-refined .player-tile-screen audio {
  pointer-events: auto;
}
/* hint tooltip on mini screen for iframes */
.player-tile-screen::after {
  content: 'click inside to interact';
  position: absolute;
  bottom: calc(24 * var(--su));
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,.75);
  color: rgba(255,255,255,.7);
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(8 * var(--su));
  letter-spacing: .06em;
  padding: calc(3 * var(--su)) calc(7 * var(--su));
  border-radius: calc(999 * var(--su));
  white-space: nowrap;
  opacity: 0;
  transition: opacity .2s;
  pointer-events: none;
  z-index: 3;
}
.player-tile-screen:hover::after { opacity: 1; }

/* two buttons under each tile */
.player-tile-btns {
  display: flex;
  gap: calc(3 * var(--su));
  padding: calc(3 * var(--su)) calc(3 * var(--su)) 0;
  flex-shrink: 0;
}
.player-tile-btn {
  flex: 1;
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(8 * var(--su));
  letter-spacing: .06em;
  text-transform: uppercase;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.12);
  color: rgba(255,255,255,.65);
  border-radius: calc(6 * var(--su));
  padding: calc(3 * var(--su)) calc(2 * var(--su));
  cursor: pointer;
  pointer-events: auto;
  transition: background .12s, color .12s;
  white-space: nowrap;
  text-align: center;
}
.player-tile-btn:hover { background: rgba(255,255,255,.16); color: #fff; }
.player-tile-btn.btn-main {
  color: var(--accent-green, #66ff00);
  border-color: rgba(102,255,0,.28);
  background: rgba(102,255,0,.07);
}
.player-tile-btn.btn-main:hover { background: rgba(102,255,0,.18); color: #66ff00; }
.player-tile-btns {
  pointer-events: auto;
  position: relative;
  z-index: 5;
}
/* active tile highlight on screen only */
.player-tile.active .player-tile-screen {
  box-shadow: 0 0 0 1px rgba(255,255,255,.12), 0 0 calc(14 * var(--su)) rgba(93,255,223,.28);
  border: 1px solid rgba(255,116,196,.32);
}
.research-broadcast-refined .player-tile-label {
  left: calc(5 * var(--su));
  right: calc(5 * var(--su));
  bottom: calc(5 * var(--su));
  padding: calc(4 * var(--su)) calc(6 * var(--su));
  border-radius: calc(999 * var(--su));
  background: rgba(15, 17, 22, .72);
  font-size: calc(9 * var(--su));
  letter-spacing: .08em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.research-broadcast-refined .player-main-shell {
  padding: calc(8 * var(--su));
  display: flex;
  flex-direction: column;
}
.research-broadcast-refined .player-main-frame {
  flex: 1;
  position: relative;
  min-height: 0;
  width: 100%;
  border-radius: calc(10 * var(--su));
  overflow: hidden;
  background: #000;
  border: 1px solid rgba(255,255,255,.12);
}
.research-broadcast-refined .research-chat-shell {
  display: flex;
  flex-direction: column;
}
.research-broadcast-refined .research-chat-log {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: calc(10 * var(--su));
  gap: calc(8 * var(--su));
}
.research-broadcast-refined .research-chat-msg {
  border-radius: calc(16 * var(--su));
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  font-size: calc(12 * var(--su));
}
.research-broadcast-refined .research-chat-foot {
  padding: calc(10 * var(--su));
  gap: calc(8 * var(--su));
  border-top: 1px solid rgba(255,255,255,.10);
}
.research-broadcast-refined .research-url-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: calc(8 * var(--su));
  align-items: center;
}
.research-broadcast-refined .research-url-input {
  min-width: 0;
  padding: calc(9 * var(--su)) calc(12 * var(--su));
  border-radius: calc(999 * var(--su));
}
.research-broadcast-refined .chip-btn {
  border-color: rgba(255,255,255,.16);
  background: rgba(255,255,255,.08);
}
/* ── TABLET / LANDSCAPE ≤calc(1100 * var(--su)) ── */
@media (max-width: 1100px) {
  .research-broadcast-refined {
    position: static;
    inset: auto;
    /* stack: header / 5-tile row / main / chat+urls */
    grid-template-columns: 1fr;
    grid-template-rows: auto auto auto auto;
    align-items: stretch;
  }
  .research-broadcast-head {
    grid-template-columns: 1fr;
  }
  .broadcast-head-cell {
    border-right: 0;
    border-bottom: 1px solid rgba(255,255,255,.08);
  }
  .broadcast-head-cell:last-child { border-bottom: 0; }

  /* all columns go full-width, separated by horizontal rules */
  .research-broadcast-refined .player-column,
  .research-broadcast-refined .player-main-shell,
  .research-broadcast-refined .research-chat-shell {
    border-right: 0;
    border-bottom: 1px solid rgba(255,255,255,.10);
    overflow: visible;
  }
  .research-broadcast-refined .research-chat-shell { border-bottom: 0; }

  /* 5 tiles → single horizontal row */
  .research-broadcast-refined .player-column {
    flex-direction: row;
  }
  .research-broadcast-refined .player-stack {
    flex: 1;
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    grid-template-rows: none;
    height: auto !important;
    padding: calc(8 * var(--su));
    gap: calc(8 * var(--su));
  }
  .research-broadcast-refined .player-tile {
    aspect-ratio: 16 / 9;
  }

  /* main player: full width, 16:9 ratio */
  .research-broadcast-refined .player-main-shell {
    padding: calc(8 * var(--su));
  }
  .research-broadcast-refined .player-main-frame {
    flex: none;
    width: 100%;
    aspect-ratio: 16 / 9;
    min-height: 0;
  }
  .research-broadcast-refined .player-main-frame iframe {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
  }

  /* chat shell: URL inputs only — log hidden, foot always visible */
  .research-broadcast-refined .research-chat-shell {
    display: block !important;
    height: auto !important;
    overflow: visible !important;
  }
  .research-broadcast-refined .research-chat-log {
    display: none !important;
  }
  .research-broadcast-refined .research-chat-foot {
    display: block !important;
    padding: calc(10 * var(--su));
    border-top: none;
  }
}

/* ── MOBILE / PORTRAIT ≤calc(720 * var(--su)) ── */
@media (max-width: 720px) {
  .research-broadcast-refined {
    border-radius: calc(16 * var(--su));
  }
  .research-broadcast-refined .player-stack {
    padding: calc(6 * var(--su));
    gap: calc(6 * var(--su));
  }
  .research-broadcast-refined .player-main-shell {
    padding: calc(6 * var(--su));
  }
  .research-broadcast-refined .research-chat-foot {
    padding: calc(8 * var(--su));
    gap: calc(6 * var(--su));
  }
  .research-broadcast-refined .research-url-row {
    grid-template-columns: minmax(0, 1fr) auto;
    gap: calc(6 * var(--su));
  }
  .research-broadcast-refined .research-url-input {
    font-size: calc(11 * var(--su));
    padding: calc(8 * var(--su)) calc(10 * var(--su));
  }
  .research-broadcast-refined .broadcast-head-chat {
    flex-wrap: wrap;
    justify-content: flex-start;
  }
}


/* ═══════════════════════════════════════════
   SAN COLUMN 3 — v2
   auth states: .san-guest / .san-logged
═══════════════════════════════════════════ */
.col3-login-btn {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(9 * var(--su));
  letter-spacing: .18em;
  text-transform: uppercase;
  color: #66ff00;
  background: transparent;
  border: none;
  padding: calc(4 * var(--su)) calc(2 * var(--su));
  cursor: pointer;
  text-shadow: 0 0 calc(6 * var(--su)) #66ff00, 0 0 calc(14 * var(--su)) rgba(102,255,0,.6);
  transition: text-shadow .2s, color .2s;
  outline: none;
}
.col3-login-btn:hover {
  text-shadow: 0 0 calc(10 * var(--su)) #66ff00, 0 0 calc(22 * var(--su)) rgba(102,255,0,.8), 0 0 calc(40 * var(--su)) rgba(102,255,0,.3);
}
/* LOGOUT state — red */
.col3-login-btn.active {
  color: #ff3333;
  text-shadow: 0 0 calc(6 * var(--su)) #ff3333, 0 0 calc(14 * var(--su)) rgba(255,51,51,.6);
}
.col3-login-btn.active:hover {
  text-shadow: 0 0 calc(10 * var(--su)) #ff3333, 0 0 calc(22 * var(--su)) rgba(255,51,51,.8), 0 0 calc(40 * var(--su)) rgba(255,51,51,.3);
}
/* ─ Sections ─ */
.col3-body {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow: hidden; /* children handle own scroll */
}
.col3-section {
  flex-shrink: 0;
  border-bottom: 1px solid rgba(255,255,255,.08);
}
.col3-section:last-child { border-bottom: 0; }
/* grow sections split available space equally */
.col3-sec-grow {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
/* bottom section: fixed size, pinned down */
.col3-sec-bottom {
  flex-shrink: 0;
  margin-top: auto;
  border-top: 1px solid rgba(255,255,255,.08);
  border-bottom: 0;
}
.col3-section-head {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(255,255,255,.45);
  padding: calc(7 * var(--su)) calc(12 * var(--su)) calc(4 * var(--su));
}
/* ─ Zulip panel ─ */
.col3-zulip-grow {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}
.col3-zulip-logged-panel {
  display: flex;
  flex-direction: column;
  flex: 1;
  min-height: 0;
  overflow: hidden;
}
.col3-zulip-logged-msg {
  flex: 1;
  min-height: 0;
  overflow-y: auto;
  padding: calc(8 * var(--su)) calc(12 * var(--su));
  display: flex;
  flex-direction: column;
  gap: calc(5 * var(--su));
}
.col3-zulip-open-btn {
  display: block;
  margin: calc(6 * var(--su)) calc(12 * var(--su)) calc(10 * var(--su));
  padding: calc(8 * var(--su)) calc(14 * var(--su));
  background: rgba(102,255,0,.14);
  border: 1px solid rgba(102,255,0,.32);
  border-radius: calc(999 * var(--su));
  color: var(--accent-green, #66ff00);
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  letter-spacing: .14em;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  cursor: none;
  flex-shrink: 0;
  transition: background .15s;
}
.col3-zulip-open-btn:hover { background: rgba(102,255,0,.24); }
.col3-zulip-wrap {
  position: relative;
  flex: 1;
  min-height: 0;
}
.col3-zulip-wrap iframe {
  position: absolute;
  inset: 0; width: 100%; height: 100%;
  border: 0;
  border-radius: 0;
}
.col3-zulip-readonly {
  padding: calc(10 * var(--su)) calc(12 * var(--su));
  display: flex;
  flex-direction: column;
  gap: calc(6 * var(--su));
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}
.col3-zulip-msg {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(11 * var(--su));
  line-height: 1.4;
  color: rgba(255,255,255,.72);
  background: rgba(255,255,255,.05);
  border: 1px solid rgba(255,255,255,.09);
  border-radius: calc(10 * var(--su));
  padding: calc(7 * var(--su)) calc(10 * var(--su));
}
.col3-zulip-msg .zmsg-who {
  display: block;
  font-size: calc(9 * var(--su));
  letter-spacing: .08em;
  text-transform: uppercase;
  color: rgba(102,255,0,.7);
  margin-bottom: calc(3 * var(--su));
}
.col3-zulip-notice {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  color: rgba(255,255,255,.38);
  padding: calc(8 * var(--su)) calc(12 * var(--su));
  text-align: center;
}
/* ─ Playlist ─ */
.col3-playlist-list {
  display: flex;
  flex-direction: column;
  gap: calc(4 * var(--su));
  padding: calc(6 * var(--su)) calc(8 * var(--su));
  flex: 1;
  min-height: 0;
  overflow-y: auto;
}
.col3-pl-item {
  display: flex;
  align-items: center;
  gap: calc(6 * var(--su));
  padding: calc(5 * var(--su)) calc(8 * var(--su));
  border-radius: calc(8 * var(--su));
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.09);
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  color: rgba(255,255,255,.75);
  min-width: 0;
}
.col3-pl-item.pl-active {
  border-color: rgba(102,255,0,.4);
  background: rgba(102,255,0,.08);
  color: rgba(255,255,255,.95);
}
.col3-pl-item.pl-error {
  border-color: rgba(255,80,80,.3);
  background: rgba(255,80,80,.06);
  opacity: .6;
}
.col3-pl-item .pl-label {
  flex: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.col3-pl-item .pl-remove {
  flex-shrink: 0;
  font-size: calc(10 * var(--su));
  color: rgba(255,255,255,.3);
  background: none;
  border: none;
  cursor: none;
  padding: 0 calc(2 * var(--su));
  line-height: 1;
}
.col3-pl-item .pl-remove:hover { color: rgba(255,100,100,.7); }
.col3-pl-add-row {
  display: flex;
  gap: calc(6 * var(--su));
  padding: calc(6 * var(--su)) calc(8 * var(--su));
  align-items: center;
}
.col3-pl-textarea-row {
  padding: 0 calc(8 * var(--su)) calc(4 * var(--su));
}
.col3-pl-textarea {
  width: 100%;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.14);
  color: #fff7fb;
  border-radius: calc(10 * var(--su));
  padding: calc(8 * var(--su)) calc(10 * var(--su));
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  line-height: 1.5;
  outline: none;
  cursor: text;
  resize: vertical;
  min-height: calc(52 * var(--su));
  box-sizing: border-box;
  width: 100%;
}
.col3-pl-textarea::placeholder { color: rgba(255,255,255,.28); white-space: pre-line; }
.col3-pl-textarea:focus { border-color: rgba(255,255,255,.28); background: rgba(255,255,255,.09); }
.col3-pl-empty-state {
  flex: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: calc(8 * var(--su)) calc(12 * var(--su));
}
.col3-pl-instruction {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  line-height: 1.6;
  color: rgba(255,255,255,.38);
  text-align: center;
}
.col3-pl-instruction strong { color: rgba(255,255,255,.58); display: block; margin-bottom: calc(4 * var(--su)); }
.col3-pl-instruction em { color: rgba(255,120,120,.5); font-style: normal; display: block; margin-top: calc(4 * var(--su)); font-size: calc(9 * var(--su)); }
.col3-pl-controls {
  display: flex;
  gap: calc(4 * var(--su));
  padding: 0 calc(8 * var(--su)) calc(7 * var(--su));
  flex-wrap: nowrap;
  overflow: hidden;
}
.col3-pl-btn {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(9 * var(--su));
  letter-spacing: .06em;
  text-transform: uppercase;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.14);
  color: rgba(255,255,255,.82);
  border-radius: calc(999 * var(--su));
  padding: calc(4 * var(--su)) calc(7 * var(--su));
  cursor: none;
  transition: background .13s;
  white-space: nowrap;
  flex-shrink: 0;
}
.col3-pl-btn:hover { background: rgba(255,255,255,.16); }
.col3-pl-btn.pl-on {
  color: var(--accent-green, #66ff00);
  border-color: rgba(102,255,0,.35);
  background: rgba(102,255,0,.10);
}
.col3-pl-status {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  color: rgba(255,255,255,.38);
  padding: 0 calc(12 * var(--su)) calc(7 * var(--su));
  min-height: calc(14 * var(--su));
}
/* ─ P4 PUBLIC ─ */
.col3-p4-row, .col3-p5-row {
  display: flex;
  gap: calc(6 * var(--su));
  align-items: center;
  padding: calc(7 * var(--su)) calc(8 * var(--su));
}
.col3-url-input {
  flex: 1;
  min-width: 0;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.14);
  color: #fff7fb;
  border-radius: calc(999 * var(--su));
  padding: calc(7 * var(--su)) calc(11 * var(--su));
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(11 * var(--su));
  outline: none;
  cursor: none;
}
.col3-url-input::placeholder { color: rgba(255,255,255,.28); }
.col3-url-input:disabled {
  opacity: .3;
  cursor: not-allowed;
}
.col3-locked-notice {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  color: rgba(255,255,255,.3);
  letter-spacing: .10em;
  text-transform: uppercase;
  padding: calc(7 * var(--su)) calc(12 * var(--su));
}
.col3-status {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  color: rgba(255,255,255,.35);
  padding: calc(5 * var(--su)) calc(12 * var(--su)) calc(8 * var(--su));
  min-height: calc(20 * var(--su));
}
.workspace.archive-layout-v13 { grid-template-columns: 12.5vw minmax(0, 1fr) minmax(calc(320 * var(--su)), 24vw); }
/* ── Auth buttons: green LOGIN / red LOGOUT ── */
.archive-auth-btn, .research-auth-btn {
  white-space: nowrap;
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(9 * var(--su));
  letter-spacing: .18em;
  text-transform: uppercase;
  font-weight: 700;
  padding: calc(6 * var(--su)) calc(12 * var(--su));
  border-radius: calc(999 * var(--su));
  border: none;
  cursor: pointer;
  transition: opacity .15s, transform .12s, background .2s;
  /* LOGIN state — green */
  background: rgba(102,255,0,.2);
  color: #66ff00;
  box-shadow: 0 0 calc(10 * var(--su)) rgba(102,255,0,.25), inset 0 0 0 1px rgba(102,255,0,.4);
  text-shadow: 0 0 calc(8 * var(--su)) rgba(102,255,0,.5);
}
.archive-auth-btn:hover, .research-auth-btn:hover {
  opacity: .85;
  transform: scale(1.04);
}
/* LOGOUT state */
.archive-auth-btn.active, .research-auth-btn.active {
  background: rgba(255,40,40,.35);
  color: #fff;
  box-shadow: 0 0 calc(10 * var(--su)) rgba(255,40,40,.3), inset 0 0 0 1px rgba(255,80,80,.6);
  text-shadow: 0 0 calc(6 * var(--su)) rgba(255,40,40,.8);
}
#col3-login-btn {
  display: none !important;
}
/* Titles: always green, always same size */
.archive-title, .research-title, .panel-title {
  color: var(--accent-green);
  font-size: clamp(calc(12 * var(--su)), 1vw, calc(16 * var(--su)));
  letter-spacing: .08em;
  text-transform: uppercase;
  white-space: nowrap;
}

.archive-input .section-label { font-family: Arial, Helvetica, sans-serif; font-size: calc(11 * var(--su)); letter-spacing: .08em; text-transform: uppercase; opacity: .72; margin-bottom: calc(2 * var(--su)); }
.archive-input .drawer-note { font-family: Arial, Helvetica, sans-serif; font-size: calc(12 * var(--su)); line-height: 1.35; opacity: .82; margin-top: calc(4 * var(--su)); }
.archive-input .visibility-row, .research-note-actions, .research-lists-head { display:flex; gap:calc(8 * var(--su)); flex-wrap:wrap; align-items:center; }

/* ── Universal save buttons (archive + research) ── */
.arc-save-row {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: calc(6 * var(--su));
}
.arc-save-btn {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(9 * var(--su));
  letter-spacing: .14em;
  text-transform: uppercase;
  border: none;
  border-radius: calc(10 * var(--su));
  padding: calc(8 * var(--su)) calc(6 * var(--su));
  cursor: pointer;
  font-weight: 600;
  transition: opacity .15s, transform .1s;
  white-space: nowrap;
  text-align: center;
}
.arc-save-btn:hover { opacity: .85; transform: translateY(-1px); }
.arc-save-btn:active { transform: translateY(0); opacity: .7; }
.arc-save-internal {
  background: rgba(102,255,0,.15);
  color: #66ff00;
  border: 1px solid rgba(102,255,0,.35);
  text-shadow: 0 0 calc(8 * var(--su)) rgba(102,255,0,.4);
}
.arc-save-internal:hover { background: rgba(102,255,0,.25); }
.arc-save-public {
  background: rgba(93,255,223,.12);
  color: #5dffdf;
  border: 1px solid rgba(93,255,223,.3);
  text-shadow: 0 0 calc(8 * var(--su)) rgba(93,255,223,.4);
}
.arc-save-public:hover { background: rgba(93,255,223,.22); }

/* mark-row for archive panel */
.arc-mark-row {
  display: flex;
  gap: calc(5 * var(--su));
  align-items: center;
  flex-wrap: wrap;
}
.arc-mark-btn {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(8 * var(--su));
  letter-spacing: .1em;
  text-transform: uppercase;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.16);
  color: rgba(255,255,255,.6);
  border-radius: calc(8 * var(--su));
  padding: calc(5 * var(--su)) calc(8 * var(--su));
  cursor: pointer;
  transition: background .12s;
}
.arc-mark-btn:hover { background: rgba(255,255,255,.16); color: #fff; }
.arc-file-input { font-size: calc(11 * var(--su)); padding: calc(7 * var(--su)) calc(10 * var(--su)); }
.arc-file-preview {
  background: #0a0a0a; border: 1px solid #1a1a1a; padding: calc(6 * var(--su)) calc(8 * var(--su));
  font-size: calc(10 * var(--su)); letter-spacing: 1px; color: #555;
  display: flex; align-items: center; gap: calc(8 * var(--su)); max-height: calc(60 * var(--su)); overflow: hidden;
}
.arc-file-preview img, .arc-file-preview video {
  height: calc(48 * var(--su)); width: auto; object-fit: cover; border: 1px solid #1a1a1a; opacity: .8;
}
.arc-file-preview .afp-icon { font-size: calc(18 * var(--su)); flex-shrink: 0; }
.arc-file-preview .afp-name { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: #444; }
.arc-file-preview .afp-size { color: #2a2a2a; flex-shrink: 0; }

/* ── Research notes panel ── */
.research-side.v13 { display:grid; grid-template-rows: auto minmax(0,1fr) auto; }
.research-side.v13 .archive-head { padding: calc(12 * var(--su)) calc(14 * var(--su)); }
.research-side.v13 .research-topline { display:flex; align-items:center; justify-content:space-between; gap:calc(10 * var(--su)); }
.research-side.v13 .inspector {
  padding: calc(10 * var(--su)) calc(12 * var(--su));
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: calc(8 * var(--su));
  min-height: 0;
}
.rn-notes-card {
  display: flex;
  flex-direction: column;
  gap: calc(6 * var(--su));
  flex-shrink: 0;
}
.rn-list-card {
  flex-shrink: 0;
}
.rn-label {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(9 * var(--su));
  letter-spacing: .18em;
  text-transform: uppercase;
  color: rgba(255,255,255,.45);
  margin-bottom: calc(2 * var(--su));
}
.rn-field { font-size: calc(12 * var(--su)); padding: calc(7 * var(--su)) calc(10 * var(--su)); }
.rn-textarea {
  min-height: calc(90 * var(--su));
  max-height: calc(180 * var(--su));
  resize: vertical;
  font-size: calc(12 * var(--su));
}
.rn-list-head {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(9 * var(--su));
  letter-spacing: .16em;
  text-transform: uppercase;
  color: rgba(255,255,255,.4);
  margin-bottom: calc(6 * var(--su));
}
.rn-status-bar {
  padding: calc(8 * var(--su)) calc(14 * var(--su));
  border-top: 1px solid rgba(255,255,255,.08);
  flex-shrink: 0;
}
@media (max-width: 1100px) {
  .workspace.archive-layout-v13 { grid-template-columns: 1fr; }
  .workspace.archive-layout-v13 .signal-strip { order: 1; min-height: calc(110 * var(--su)); }
  .workspace.archive-layout-v13 .archive-main { order: 2; }
  .workspace.archive-layout-v13 .archive-input { order: 3; }
}

/* ── Auth visibility ─────────────────────────────────────── */
body.san-guest [data-researcher-only] { display: none !important; }
body.san-logged [data-researcher-only] { display: flex; }
body.san-logged .archive-tools[data-researcher-only] { display: grid; }
body.san-guest #col3-p4-active { display: none !important; }
body.san-guest #col3-p4-locked { display: block !important; }
body.san-logged #col3-p4-locked { display: none !important; }
body.san-logged #col3-p4-active { display: flex !important; }

/* ── Archive input panel v2 ─────────────────────────── */
.archive-input-body {
  display: flex;
  flex-direction: column;
  gap: calc(10 * var(--su));
  padding: calc(12 * var(--su)) calc(14 * var(--su));
  overflow-y: auto;
  flex: 1;
  min-height: 0;
}
.arc-field-group {
  display: flex;
  flex-direction: column;
  gap: calc(5 * var(--su));
}
.arc-field-group.arc-grow {
  flex: 1;
  min-height: calc(80 * var(--su));
}
.arc-field-group .arc-textarea {
  flex: 1;
  min-height: calc(80 * var(--su));
  resize: vertical;
}
.arc-label {
  font-family: Arial, Helvetica, sans-serif;
  font-size: calc(10 * var(--su));
  letter-spacing: .12em;
  text-transform: uppercase;
  color: rgba(255,255,255,.55);
  margin-bottom: calc(2 * var(--su));
}
.arc-formats {
  font-size: calc(9 * var(--su));
  letter-spacing: .04em;
  text-transform: none;
  color: rgba(255,255,255,.35);
}
/* Zulip connect status */
#col3-zulip-loading {
  font-style: italic;
  opacity: .6;
}

/* ── UNIFIED LOGIN MODAL ── */
#san-login-modal{display:none;position:fixed;inset:0;z-index:500;
  background:rgba(0,0,0,.72);backdrop-filter:blur(calc(10 * var(--su)));
  align-items:center;justify-content:center;}
#san-login-modal.open{display:flex;}
#san-login-box{
  background:rgba(20,18,28,.98);border:1px solid rgba(239,127,182,.3);
  border-radius:calc(16 * var(--su));padding:calc(28 * var(--su)) calc(32 * var(--su));min-width:calc(300 * var(--su));max-width:calc(380 * var(--su));width:90%;
  display:flex;flex-direction:column;gap:calc(14 * var(--su));
  box-shadow:0 calc(20 * var(--su)) calc(60 * var(--su)) rgba(0,0,0,.6);}
#san-login-box h2{font-size:clamp(calc(13 * var(--su)),1.1vw,calc(17 * var(--su)));letter-spacing:.08em;
  text-transform:uppercase;color:#66ff00;}
.san-lf{display:flex;flex-direction:column;gap:calc(5 * var(--su));}
.san-ll{font-family:Arial,Helvetica,sans-serif;font-size:calc(9 * var(--su));letter-spacing:.1em;
  text-transform:uppercase;color:rgba(255,255,255,.4);}
#san-login-box input{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);
  color:#e9edf2;padding:calc(9 * var(--su)) calc(12 * var(--su));border-radius:calc(8 * var(--su));outline:none;
  font-family:Arial,Helvetica,sans-serif;font-size:calc(13 * var(--su));width:100%;}
#san-login-box input:focus{border-color:rgba(239,127,182,.5);}
#san-login-err{font-family:Arial,Helvetica,sans-serif;font-size:calc(11 * var(--su));
  color:#ff6b6b;display:none;min-height:calc(16 * var(--su));}
#san-login-user-info{font-family:Arial,Helvetica,sans-serif;font-size:calc(11 * var(--su));
  color:rgba(255,255,255,.5);display:none;}
.san-login-row{display:flex;gap:calc(8 * var(--su));justify-content:flex-end;}


/* ── EMBED BLOCKED COVER CARD ── */
.embed-blocked-card {
  position: absolute; inset: 0; display: flex; flex-direction: column;
  background: #0d0b12; overflow: hidden;
}
.ebc-thumb { flex: 1; min-height: 0; overflow: hidden; position: relative; }
.ebc-thumb img { width: 100%; height: 100%; object-fit: cover; filter: brightness(.55) saturate(.7); }
.ebc-thumb-overlay {
  position: absolute; inset: 0;
  background: linear-gradient(to bottom, transparent 30%, rgba(13,11,18,.95) 100%);
}
.ebc-info { padding: calc(14 * var(--su)) calc(16 * var(--su)) calc(10 * var(--su)); background: #0d0b12; flex-shrink: 0; }
.ebc-channel {
  font-family: Arial, sans-serif; font-size: calc(9 * var(--su)); letter-spacing: .14em;
  text-transform: uppercase; color: rgba(239,127,182,.6); margin-bottom: calc(4 * var(--su));
}
.ebc-title {
  font-family: 'Kharkiv Tone', system-ui, sans-serif; font-size: calc(13 * var(--su));
  color: #e9edf2; line-height: 1.3; margin-bottom: calc(6 * var(--su));
}
.ebc-desc {
  font-family: Arial, sans-serif; font-size: calc(9 * var(--su)); color: rgba(255,255,255,.35);
  line-height: 1.4; margin-bottom: calc(10 * var(--su));
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}
.ebc-btn {
  display: inline-block; background: rgba(239,127,182,.12);
  border: 1px solid rgba(239,127,182,.35); color: #ef7fb6;
  padding: calc(6 * var(--su)) calc(14 * var(--su)); border-radius: calc(4 * var(--su)); font-family: Arial, sans-serif;
  font-size: calc(9 * var(--su)); letter-spacing: .1em; text-transform: uppercase;
  text-decoration: none; transition: background .15s;
}
.ebc-btn:hover { background: rgba(239,127,182,.22); }
.ebc-notice {
  font-family: Arial, sans-serif; font-size: calc(8 * var(--su));
  color: rgba(255,255,255,.18); margin-top: calc(6 * var(--su)); letter-spacing: .04em;
}

/* ── shared header (san-shared.js) sits above #main ── */
#san-hdr ~ #main { height: calc(100vh - var(--footer-h) - var(--san-hdr-h)); }
/* player: the old in-panel head row is gone (tools live in the shared header) */
.research-broadcast, .research-broadcast-refined { top: calc(12 * var(--su)); }
@media (max-width: 900px) {
  #san-hdr ~ #main { height: calc(100dvh - var(--san-hdr-h)); }
}

/* home: native scroll replaced the fake scrollbar */
.scrollbar-ghost { display: none !important; }

/* ── player: tap targets instead of micro-buttons ── */
.player-tile-btns { display: none !important; }
.player-tile-screen::after { display: none !important; }
.player-tile-hit { position: absolute; inset: 0; z-index: 5; cursor: pointer; background: transparent; }
.player-main-frame:fullscreen { width: 100vw; height: 100vh; aspect-ratio: auto; }
#player-fullscreen { background: #ff0000 !important; border-color: #ff0000 !important; color: #fff !important; font-size: calc(14 * var(--su)); box-shadow: 0 0 calc(10 * var(--su)) rgba(255,0,0,.45); }
#player-fullscreen:hover { background: #ff2a2a !important; }
@media (min-width: 901px) {
  .research-broadcast-refined .player-tile-screen { flex: 1 1 auto; aspect-ratio: auto; min-height: 0; }
}
@media (max-width: 900px) {
  .research-broadcast-refined .player-stack {
    display: grid !important; grid-template-columns: repeat(5, 1fr); gap: calc(4 * var(--su)); padding: calc(6 * var(--su)); overflow: visible;
  }
  .research-broadcast-refined .player-tile { min-width: 0 !important; }
  .research-broadcast-refined .player-tile-screen { min-height: 0 !important; aspect-ratio: 16 / 9; }
  .research-broadcast-refined .player-tile-label { display: none !important; }
}

/* ── SAN CHAT ── */
#col3-sec-chat { display: flex; flex-direction: column; min-height: 0; }
.san-chat-log { flex: 1; min-height: calc(120 * var(--su)); overflow-y: auto; padding: calc(8 * var(--su)) calc(10 * var(--su)); display: flex; flex-direction: column; gap: calc(6 * var(--su));
  font-family: Arial, Helvetica, sans-serif; font-size: calc(12 * var(--su)); line-height: 1.4; color: rgba(255,255,255,.85); }
.san-chat-empty { color: rgba(255,255,255,.35); font-size: calc(11 * var(--su)); font-style: italic; }
.san-chat-msg { position: relative; padding-right: calc(18 * var(--su)); word-break: break-word; }
.san-chat-who { color: #66ff00; font-weight: 700; margin-right: calc(6 * var(--su)); }
.san-chat-time { color: rgba(255,255,255,.3); font-size: calc(10 * var(--su)); margin-right: calc(6 * var(--su)); }
.san-chat-del { position: absolute; right: 0; top: 0; background: none; border: 0; color: rgba(255,255,255,.35); cursor: pointer; font-size: calc(11 * var(--su)); }
.san-chat-del:hover { color: #ff4d4d; }
.san-chat-form { display: flex; gap: calc(6 * var(--su)); padding: calc(8 * var(--su)) calc(10 * var(--su)); border-top: 1px solid rgba(255,255,255,.08); }
.san-chat-form input { min-width: 0; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.15); color: #e9edf2;
  border-radius: calc(999 * var(--su)); padding: calc(7 * var(--su)) calc(11 * var(--su)); font-family: Arial, Helvetica, sans-serif; font-size: calc(12 * var(--su)); outline: none; }
#san-chat-nick { flex: 0 0 calc(72 * var(--su)); }
#san-chat-text { flex: 1; }
#san-chat-status { padding: calc(4 * var(--su)) calc(10 * var(--su)); font: calc(11 * var(--su)) Arial, sans-serif; color: #ff6b6b; }
/* mobile player: no P4/P5 (login-only work tools); archive contexts stay visible */
@media (max-width: 1100px) {
  .research-side { max-height: none !important; overflow: visible !important; opacity: 1 !important; pointer-events: auto !important; }
}
@media (max-width: 900px) {
  #col3-sec-slots, #col3-sec-playlist { display: none !important; }
  .san-chat-log { max-height: 40vh; }
}