/* ROOMS WORLD — Three.js 3D map for the rooms empty state
   (js/sections/rooms-world.js). Mounted only under graphite; .world-on on the
   container hands the stage over while the 2D eye scene + copy stay in the DOM
   as the fallback. Warp-in/out rides opacity — motion lives in the canvas. */
[data-theme="graphite"] #rooms-world {
  position: absolute; inset: 0;
  width: 100%; height: 100%;
  z-index: 1;
  opacity: 0;
  transition: opacity 1.1s ease;
  pointer-events: none;
  /* Flat sky on purpose. The old stacked CSS vignette + linear wash was the
     "layered gradient around the orbits": a full-viewport gradient over
     near-black quantises to 8-bit and every step reads as a ring. Depth now
     comes from the scene's own clouds, and .rw-grain dithers what's left. */
  background: #080b0f;
  filter: saturate(1.08) contrast(1.04);
}
/* Screen-space dither: fine SVG noise at ~2.5% over the whole stage. Breaks
   both the CSS and the WebGL 8-bit steps; too fine to read as texture. */
[data-theme="graphite"] #rooms-world::after {
  content: '';
  position: absolute; inset: 0;
  z-index: 3;
  pointer-events: none;
  opacity: 0.045;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='160' height='160'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='3'/%3E%3C/filter%3E%3Crect width='160' height='160' filter='url(%23n)'/%3E%3C/svg%3E");
  background-size: 160px 160px;
  mix-blend-mode: overlay;
}
[data-theme="graphite"] #rooms-world.on { opacity: 1; pointer-events: auto; }
/* SURREAL renders its own sky, so the CSS vignette underneath it has to go:
   two backdrops stacked was exactly the "old one showing through the new one"
   muddiness (Wolf, 2026-07-28). */
[data-theme="graphite"] #rooms-world.rw-surreal {
  background: #05070c;
  filter: saturate(1.05) contrast(1.02);
}
/* click-travel: fade to black while the camera accelerates into the node */
[data-theme="graphite"] #rooms-world.leaving { opacity: 0; transition: opacity 0.5s ease 0.25s; }
[data-theme="graphite"] #no-agent-selected.world-on #nas-scene { opacity: 0; }
[data-theme="graphite"] #no-agent-selected.world-on .nas-text-rooms { opacity: 0; }
[data-theme="graphite"] .rw-hint {
  position: absolute; left: 50%; bottom: 24px;
  z-index: 2;
  width: max-content; max-width: calc(100% - 32px);
  padding: 8px 14px;
  border: 1px solid transparent;
  border-radius: 2px;
  background: rgba(10, 14, 19, 0);
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0);
  font-size: 12px; letter-spacing: 3px; text-transform: uppercase;
  color: #76818c;
  text-align: center;
  opacity: 0;
  transform: translate(-50%, 6px);
  transition: opacity 0.5s ease, transform 0.5s cubic-bezier(.2,.8,.2,1), color 0.3s ease,
              border-color 0.3s ease, background 0.3s ease, box-shadow 0.3s ease;
  pointer-events: none;
}
[data-theme="graphite"] .rw-hint.on { opacity: 1; transform: translate(-50%, 0); }
[data-theme="graphite"] .rw-hint.target {
  display: none;
}

/* Colour legend, top-left. Same panel language as the dossier, mirrored:
   the dossier clips its top-right/bottom-left corners, the legend clips
   top-left/bottom-right, so the two frames read as one chart family. */
[data-theme="graphite"] .rw-legend {
  position: absolute;
  top: 24px;
  left: 24px;
  z-index: 2;
  padding: 11px 16px 12px;
  background: linear-gradient(180deg, rgba(17, 23, 30, 0.88), rgba(8, 12, 17, 0.84));
  border: 1px solid rgba(111, 156, 198, 0.22);
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.38), inset 0 0 26px rgba(111, 156, 198, 0.03);
  clip-path: polygon(10px 0, 100% 0, 100% calc(100% - 10px), calc(100% - 10px) 100%, 0 100%, 0 10px);
  font-size: 12px;
  letter-spacing: 2.5px;
  text-transform: uppercase;
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity 0.5s ease, transform 0.5s cubic-bezier(.2,.8,.2,1);
  pointer-events: none;
}
[data-theme="graphite"] .rw-legend.on { opacity: 1; transform: translateY(0); }
[data-theme="graphite"] .rw-legend::before,
[data-theme="graphite"] .rw-legend::after {
  content: "";
  position: absolute;
  width: 22px;
  height: 2px;
  background: #6f9cc6;
  box-shadow: 0 0 12px rgba(111, 156, 198, 0.7);
  opacity: 0.7;
}
[data-theme="graphite"] .rw-legend::before { top: 0; left: 10px; }
[data-theme="graphite"] .rw-legend::after { right: 10px; bottom: 0; }
[data-theme="graphite"] .rw-legend-title {
  margin-bottom: 9px;
  letter-spacing: 3px;
  color: #76818c;
}
[data-theme="graphite"] .rw-legend-row {
  display: flex;
  align-items: center;
  gap: 9px;
  margin-top: 6px;
  color: #a6adb5;
}
[data-theme="graphite"] .rw-ldot {
  flex: 0 0 auto;
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: radial-gradient(circle at 38% 34%, #fff, var(--c) 55%, color-mix(in srgb, var(--c) 45%, transparent));
  box-shadow: 0 0 9px color-mix(in srgb, var(--c) 75%, transparent);
}
/* The tool marker: the white wireframe shell the TERMINAL and RESEARCH LAB
   planets wear, shrunk to a dot — a pale mesh ball instead of a solid glow. */
[data-theme="graphite"] .rw-ldot-tool {
  background:
    repeating-linear-gradient(0deg, color-mix(in srgb, var(--c) 85%, transparent) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(90deg, color-mix(in srgb, var(--c) 85%, transparent) 0 1px, transparent 1px 3px);
  border: 1px solid color-mix(in srgb, var(--c) 80%, transparent);
  box-shadow: 0 0 9px color-mix(in srgb, var(--c) 55%, transparent);
}
/* VIEW SWITCH — STAR CHART (the readable map) vs SURREAL (the same system
   rendered as a place). Top-right, mirrors the legend's chrome and its entry:
   it rides in with the map once the camera settles. */
[data-theme="graphite"] .rw-view {
  position: absolute;
  top: 24px;
  right: 24px;
  z-index: 4;
  display: flex;
  gap: 2px;
  padding: 3px;
  background: linear-gradient(180deg, rgba(17, 23, 30, 0.88), rgba(8, 12, 17, 0.84));
  border: 1px solid rgba(111, 156, 198, 0.22);
  box-shadow: 0 16px 44px rgba(0, 0, 0, 0.38);
  clip-path: polygon(8px 0, 100% 0, 100% calc(100% - 8px), calc(100% - 8px) 100%, 0 100%, 0 8px);
  opacity: 0;
  transform: translateY(-10px);
  transition: opacity 0.5s ease, transform 0.5s cubic-bezier(.2,.8,.2,1);
  pointer-events: none;
}
[data-theme="graphite"] .rw-view.on { opacity: 1; transform: translateY(0); pointer-events: auto; }
[data-theme="graphite"] .rw-view-btn {
  padding: 6px 12px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 2.2px;
  text-transform: uppercase;
  color: #76818c;
  background: transparent;
  border: 1px solid transparent;
  cursor: pointer;
  transition: color 0.22s ease, background 0.22s ease, border-color 0.22s ease;
}
[data-theme="graphite"] .rw-view-btn:hover { color: #c3cbd3; background: rgba(111, 156, 198, 0.08); }
[data-theme="graphite"] .rw-view-btn.on {
  color: #e6e8ea;
  background: rgba(111, 156, 198, 0.16);
  border-color: rgba(111, 156, 198, 0.45);
}

/* VIEW WARP — the switch is an event, not a swap. The flash washes the whole
   stage (the shockwave and camera kick live in the scene), and the material
   change is hidden inside its peak. */
[data-theme="graphite"] .rw-flash {
  position: absolute;
  inset: 0;
  z-index: 5;
  pointer-events: none;
  opacity: 0;
  background:
    radial-gradient(circle at 50% 52%, rgba(226, 241, 255, 0.95) 0%, rgba(139, 186, 236, 0.42) 22%, rgba(90, 130, 190, 0.14) 40%, rgba(8, 11, 16, 0) 66%);
  mix-blend-mode: screen;
}
[data-theme="graphite"] .rw-flash.fire { animation: rw-warp-flash 1.15s cubic-bezier(.16, 1, .3, 1); }
@keyframes rw-warp-flash {
  0%   { opacity: 0;    transform: scale(0.72); }
  14%  { opacity: 0.98; transform: scale(1); }
  42%  { opacity: 0.34; transform: scale(1.08); }
  100% { opacity: 0;    transform: scale(1.2); }
}
/* The control itself takes the hit: it dims and locks while the wave runs. */
[data-theme="graphite"] .rw-view.warping { pointer-events: none; }
[data-theme="graphite"] .rw-view.warping .rw-view-btn { color: #5f666e; }
[data-theme="graphite"] .rw-view.warping .rw-view-btn.on {
  color: #eef3f8;
  border-color: rgba(200, 226, 250, 0.75);
  background: rgba(140, 186, 232, 0.28);
}
@media (prefers-reduced-motion: reduce) {
  [data-theme="graphite"] .rw-flash.fire { animation: none; }
}

@media (max-width: 700px) {
  /* On a phone the top-right corner is already the legend's, and the two
     collided. The switch moves to the bottom, above the hint, where nothing
     else lives and the thumb already is. */
  [data-theme="graphite"] .rw-view {
    top: auto;
    right: auto;
    bottom: 38px;
    left: 50%;
    transform: translate(-50%, 10px);
  }
  [data-theme="graphite"] .rw-view.on { transform: translate(-50%, 0); }
  /* Finger-sized targets: same type, taller hit area. */
  [data-theme="graphite"] .rw-view-btn { padding: 10px 14px; letter-spacing: 1.6px; }
  /* A dossier open at the bottom owns that space — the switch steps aside. */
  [data-theme="graphite"] .rw-dossier[aria-hidden="false"] ~ .rw-view { opacity: 0; pointer-events: none; }
  [data-theme="graphite"] .rw-legend { top: 14px; left: 14px; padding: 9px 12px 10px; }
  /* the mobile dossier is pinned to the same corner — yield to it */
  [data-theme="graphite"] .rw-dossier[aria-hidden="false"] ~ .rw-legend { opacity: 0; }
}

/* Planet hover dossier — a game-style celestial profile that stays entirely
   outside the WebGL hit layer, so it never steals hover or clicks. */
[data-theme="graphite"] .rw-dossier {
  --rw-project: #9cc0e8;
  position: absolute;
  top: 24px;
  left: 24px;
  z-index: 3;
  width: min(390px, calc(100% - 52px));
  overflow: hidden;
  color: #e6e8ea;
  text-align: left;
  background:
    linear-gradient(135deg, color-mix(in srgb, var(--rw-project) 11%, transparent), transparent 42%),
    linear-gradient(180deg, rgba(17, 23, 30, 0.96), rgba(8, 12, 17, 0.94));
  border: 1px solid color-mix(in srgb, var(--rw-project) 44%, #303842);
  box-shadow: 0 26px 70px rgba(0, 0, 0, 0.54), inset 0 0 42px rgba(111, 156, 198, 0.035);
  clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 15px, 100% 100%, 15px 100%, 0 calc(100% - 15px));
  opacity: 0;
  transform: perspective(700px) translate3d(26px, -8px, 0) rotateY(-7deg) scale(0.965);
  transform-origin: right top;
  filter: blur(3px);
  transition: opacity 0.22s ease, transform 0.42s cubic-bezier(.16,.86,.24,1), filter 0.3s ease;
  pointer-events: none;
}
[data-theme="graphite"] .rw-dossier.dock-left {
  transform: perspective(700px) translate3d(-26px, -8px, 0) rotateY(7deg) scale(0.965);
  transform-origin: left top;
}
[data-theme="graphite"] .rw-dossier.dock-above { transform-origin: right bottom; }
[data-theme="graphite"] .rw-dossier.dock-left.dock-above { transform-origin: left bottom; }
/* Entry: a deep-space signal being decoded. The card warps in from the void
   (strong perspective + blur + over-bright), snaps to focus, stutters twice
   like an unstable transmission, then locks. Entry side follows the dock. */
[data-theme="graphite"] .rw-dossier { --rw-ex: 34px; --rw-ery: -16deg; }
[data-theme="graphite"] .rw-dossier.dock-left { --rw-ex: -34px; --rw-ery: 16deg; }
[data-theme="graphite"] .rw-dossier.show {
  opacity: 1;
  transform: perspective(700px) translate3d(0, 0, 0) rotateY(0) scale(1);
  filter: none;
  animation: rwDossierBoot 0.85s cubic-bezier(.18,.9,.22,1) both;
}
@keyframes rwDossierBoot {
  0% {
    opacity: 0;
    transform: perspective(700px) translate3d(var(--rw-ex), -16px, 0) rotateY(var(--rw-ery)) rotateX(7deg) scale(0.88);
    filter: blur(10px) saturate(2.4) brightness(1.7);
  }
  38% { opacity: 0.92; filter: blur(1.5px) saturate(1.5) brightness(1.25); }
  46% { opacity: 0.3; }
  52% { opacity: 1; }
  58% { opacity: 0.55; }
  64% { opacity: 1; }
  100% {
    opacity: 1;
    transform: perspective(700px) translate3d(0, 0, 0) rotateY(0) rotateX(0) scale(1);
    filter: none;
  }
}
/* The card's sections decode in sequence: header, then profile, then verdict. */
[data-theme="graphite"] .rw-dossier.show .rw-dossier-head { animation: rwDossierPart 0.5s ease 0.16s both; }
[data-theme="graphite"] .rw-dossier.show .rw-dossier-body,
[data-theme="graphite"] .rw-dossier.show .rw-mini-profile { animation: rwDossierPart 0.5s ease 0.28s both; }
[data-theme="graphite"] .rw-dossier.show .rw-dossier-foot { animation: rwDossierPart 0.5s ease 0.42s both; }
@keyframes rwDossierPart {
  from { opacity: 0; transform: translateY(9px); }
  to { opacity: 1; transform: translateY(0); }
}
@media (prefers-reduced-motion: reduce) {
  [data-theme="graphite"] .rw-dossier.show,
  [data-theme="graphite"] .rw-dossier.show .rw-dossier-head,
  [data-theme="graphite"] .rw-dossier.show .rw-dossier-body,
  [data-theme="graphite"] .rw-dossier.show .rw-mini-profile,
  [data-theme="graphite"] .rw-dossier.show .rw-dossier-foot,
  [data-theme="graphite"] .rw-dossier.show .rw-dossier-scan { animation: none !important; }
}
[data-theme="graphite"] .rw-dossier::before,
[data-theme="graphite"] .rw-dossier::after {
  content: "";
  position: absolute;
  z-index: 2;
  width: 34px;
  height: 2px;
  background: var(--rw-project);
  box-shadow: 0 0 15px color-mix(in srgb, var(--rw-project) 70%, transparent);
  opacity: 0.75;
}
[data-theme="graphite"] .rw-dossier::before { top: 0; left: 15px; }
[data-theme="graphite"] .rw-dossier::after { right: 15px; bottom: 0; }
[data-theme="graphite"] .rw-dossier-scan {
  position: absolute;
  inset: 0 auto 0 -28%;
  z-index: 1;
  width: 24%;
  background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--rw-project) 16%, transparent), transparent);
  transform: skewX(-12deg);
  opacity: 0;
}
[data-theme="graphite"] .rw-dossier.show .rw-dossier-scan {
  animation: rwDossierScan 1.05s cubic-bezier(.2,.7,.2,1) 0.14s both;
}
@keyframes rwDossierScan {
  0% { left: -28%; opacity: 0; }
  18% { opacity: 1; }
  100% { left: 112%; opacity: 0; }
}
[data-theme="graphite"] .rw-dossier-head,
[data-theme="graphite"] .rw-dossier-foot {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 14px;
  font-size: 12px;
  line-height: 1;
  letter-spacing: 2.2px;
  color: #78838e;
  background: rgba(255, 255, 255, 0.018);
}
[data-theme="graphite"] .rw-dossier-head { border-bottom: 1px solid rgba(154, 161, 169, 0.13); }
[data-theme="graphite"] .rw-dossier-foot { border-top: 1px solid rgba(154, 161, 169, 0.13); }
[data-theme="graphite"] .rw-dossier-tier,
[data-theme="graphite"] .rw-dossier-action { color: var(--rw-project); }
/* A click on a closed world: the whole status bar answers, three beats of the
   project's own colour, so the refusal cannot be missed or mistaken for a bug. */
[data-theme="graphite"] .rw-dossier.locked-flash .rw-dossier-foot {
  animation: rwLockedBar 1.25s cubic-bezier(0.16, 1, 0.3, 1) both;
}
[data-theme="graphite"] .rw-dossier.locked-flash .rw-dossier-action {
  animation: rwLockedText 1.25s cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes rwLockedBar {
  0%, 100% { background: rgba(255, 255, 255, 0.018); box-shadow: none; }
  12%, 46% { background: rgba(255, 255, 255, 0.07); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.16); }
  28%, 64% { background: rgba(255, 255, 255, 0.018); box-shadow: none; }
}
@keyframes rwLockedText {
  0%, 100% { color: var(--rw-project); letter-spacing: 2.2px; }
  12%, 46% { color: #fdfefe; letter-spacing: 3.4px; text-shadow: 0 0 14px var(--rw-project); }
  28%, 64% { color: var(--rw-project); letter-spacing: 2.2px; text-shadow: none; }
}
[data-theme="graphite"] .rw-hint.locked-flash {
  animation: rwLockedHint 1.25s cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes rwLockedHint {
  0%, 100% { color: #76818c; border-color: transparent; background: rgba(10, 14, 19, 0); }
  12%, 46% { color: #fdfefe; border-color: rgba(255, 255, 255, 0.28); background: rgba(10, 14, 19, 0.85); }
  28%, 64% { color: #76818c; border-color: transparent; background: rgba(10, 14, 19, 0.4); }
}
/* reduced motion: no pulsing, one steady highlight for the same 1.25s */
@media (prefers-reduced-motion: reduce) {
  [data-theme="graphite"] .rw-hint.locked-flash { animation: none; color: #fdfefe; }
  [data-theme="graphite"] .rw-dossier.locked-flash .rw-dossier-foot { animation: none; background: rgba(255, 255, 255, 0.07); }
  [data-theme="graphite"] .rw-dossier.locked-flash .rw-dossier-action { animation: none; color: #fdfefe; }
}
/* The right slot now carries the project's field ("MULTI-AGENT ORCHESTRATION"),
   which is far longer than the old tier word. It keeps its full line and the
   static "CELESTIAL DOSSIER" label gives up room first. */
[data-theme="graphite"] .rw-dossier-tier { flex: 0 0 auto; white-space: nowrap; text-align: right; }
[data-theme="graphite"] .rw-dossier-head > span:first-child {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
[data-theme="graphite"] .rw-dossier-body {
  position: relative;
  z-index: 2;
  display: grid;
  grid-template-columns: 116px minmax(0, 1fr);
  gap: 18px;
  padding: 18px;
}
[data-theme="graphite"] .rw-dossier-portrait {
  min-width: 0;
  padding: 12px 8px 9px;
  border: 1px solid color-mix(in srgb, var(--rw-project) 28%, #29323b);
  background:
    radial-gradient(circle at 50% 46%, color-mix(in srgb, var(--rw-project) 14%, transparent), transparent 60%),
    repeating-linear-gradient(0deg, transparent 0 8px, rgba(255,255,255,0.018) 8px 9px);
  text-align: center;
}
[data-theme="graphite"] .rw-profile-orb {
  position: relative;
  width: 84px;
  height: 84px;
  margin: 0 auto 9px;
}
/* Live portrait: a second WebGL canvas showing a clone of the hovered planet
   itself. When it mounts, the hand-drawn CSS effigy yields; if the second
   context is refused, the effigy remains the fallback. */
[data-theme="graphite"] .rw-portrait-live {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  display: none;
}
[data-theme="graphite"] .rw-dossier.has-live .rw-portrait-live { display: block; }
[data-theme="graphite"] .rw-dossier.has-live .rw-profile-core,
[data-theme="graphite"] .rw-dossier.has-live .rw-profile-ring,
[data-theme="graphite"] .rw-dossier.has-live .rw-profile-structure,
[data-theme="graphite"] .rw-dossier.has-live .rw-profile-crown,
[data-theme="graphite"] .rw-dossier.has-live .rw-profile-glyph,
[data-theme="graphite"] .rw-dossier.has-live .rw-profile-moon { display: none !important; }
[data-theme="graphite"] .rw-profile-core {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background:
    radial-gradient(circle at 31% 27%, rgba(255,255,255,0.65), transparent 14%),
    radial-gradient(circle at 36% 32%, color-mix(in srgb, var(--rw-project) 92%, white), var(--rw-project) 54%, color-mix(in srgb, var(--rw-project) 35%, #080b0f));
  box-shadow: 0 0 10px var(--rw-project), 0 0 30px color-mix(in srgb, var(--rw-project) 40%, transparent);
  transform: translate(-50%, -50%);
  z-index: 2;
}
[data-theme="graphite"] .rw-profile-ring {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 78px;
  height: 24px;
  border: 1px solid color-mix(in srgb, var(--rw-project) 80%, white);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotate(-12deg);
  opacity: 0.55;
  z-index: 3;
}
[data-theme="graphite"] .rw-profile-structure,
[data-theme="graphite"] .rw-profile-crown,
[data-theme="graphite"] .rw-profile-glyph { display: none; position: absolute; }
[data-theme="graphite"] .rw-profile-moon {
  display: none;
  position: absolute;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--rw-project) 65%, white);
  box-shadow: 0 0 9px var(--rw-project);
}
[data-theme="graphite"] .rw-dossier.kind-citadel .rw-profile-core {
  border-radius: 0;
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
}
[data-theme="graphite"] .rw-dossier.kind-citadel .rw-profile-ring {
  width: 68px; height: 68px; border-radius: 0;
  clip-path: polygon(50% 0, 100% 50%, 50% 100%, 0 50%);
  transform: translate(-50%, -50%) rotate(18deg);
}
[data-theme="graphite"] .rw-dossier.kind-recursive .rw-profile-ring {
  width: 72px; height: 25px;
  box-shadow: none;
}
[data-theme="graphite"] .rw-dossier.kind-network .rw-profile-moon { display: block; }
[data-theme="graphite"] .rw-dossier.kind-network .rw-profile-moon.m1 { left: 4px; top: 19px; }
[data-theme="graphite"] .rw-dossier.kind-network .rw-profile-moon.m2 { right: 5px; top: 14px; }
[data-theme="graphite"] .rw-dossier.kind-network .rw-profile-moon.m3 { right: 10px; bottom: 9px; }
[data-theme="graphite"] .rw-dossier.kind-network .rw-profile-moon.m4 { left: 7px; bottom: 11px; }

/* Public Good portraits mirror the actual landmark geometry. */
[data-theme="graphite"] .rw-dossier.project-utopia .rw-profile-structure,
[data-theme="graphite"] .rw-dossier.project-arc .rw-profile-structure,
[data-theme="graphite"] .rw-dossier.project-vibecode .rw-profile-structure {
  display: block;
  inset: 0;
  z-index: 4;
}
[data-theme="graphite"] .rw-dossier.project-utopia .rw-profile-structure i {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 55px;
  height: 55px;
  border: 1px solid color-mix(in srgb, var(--rw-project) 72%, white);
  transform: translate(-50%, -50%) rotate(45deg);
  opacity: 0.72;
}
[data-theme="graphite"] .rw-dossier.project-utopia .rw-profile-structure i:nth-child(2) {
  width: 68px;
  height: 42px;
  transform: translate(-50%, -50%) rotate(18deg);
  opacity: 0.5;
}
[data-theme="graphite"] .rw-dossier.project-utopia .rw-profile-structure i:nth-child(3) {
  width: 42px;
  height: 68px;
  transform: translate(-50%, -50%) rotate(-18deg);
  opacity: 0.44;
}
[data-theme="graphite"] .rw-dossier.project-arc .rw-profile-structure i {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 74px;
  height: 28px;
  border: 1px solid color-mix(in srgb, var(--rw-project) 76%, white);
  border-radius: 50%;
  transform: translate(-50%, -50%) rotate(28deg);
  opacity: 0.62;
}
[data-theme="graphite"] .rw-dossier.project-arc .rw-profile-structure i:nth-child(2) {
  transform: translate(-50%, -50%) rotate(88deg);
  opacity: 0.48;
}
[data-theme="graphite"] .rw-dossier.project-arc .rw-profile-structure i:nth-child(3) {
  transform: translate(-50%, -50%) rotate(-31deg);
  opacity: 0.4;
}
[data-theme="graphite"] .rw-dossier.project-vibecode .rw-profile-structure { z-index: 1; }
[data-theme="graphite"] .rw-dossier.project-vibecode .rw-profile-structure i {
  position: absolute;
  left: 50%;
  top: 9px;
  width: 1px;
  height: 66px;
  background: color-mix(in srgb, var(--rw-project) 62%, white);
  transform-origin: center;
  opacity: 0.32;
}
[data-theme="graphite"] .rw-dossier.project-vibecode .rw-profile-structure i:first-child { transform: rotate(31deg); }
[data-theme="graphite"] .rw-dossier.project-vibecode .rw-profile-structure i:nth-child(2) { transform: rotate(90deg); }
[data-theme="graphite"] .rw-dossier.project-vibecode .rw-profile-structure i:nth-child(3) { transform: rotate(149deg); }
[data-theme="graphite"] .rw-dossier.project-keepsimple .rw-profile-glyph {
  display: grid;
  place-items: center;
  left: 50%;
  top: 50%;
  z-index: 6;
  width: 34px;
  height: 34px;
  transform: translate(-50%, -50%);
  color: rgba(255, 255, 255, 0.9);
  font: 700 20px/1 "Yu Mincho", "Hiragino Mincho ProN", "IPAMincho", serif;
  text-shadow: 0 0 8px var(--rw-project);
}
[data-theme="graphite"] .rw-dossier.project-keepsimple .rw-profile-ring {
  width: 81px;
  height: 25px;
  opacity: 0.78;
}
[data-theme="graphite"] .rw-dossier.project-keepsimple .rw-profile-crown,
[data-theme="graphite"] .rw-dossier.project-arc .rw-profile-crown {
  display: block;
  left: 17px;
  top: 1px;
  z-index: 7;
  width: 50px;
  height: 22px;
  background:
    linear-gradient(35deg, transparent 47%, color-mix(in srgb, var(--rw-project) 72%, white) 49% 51%, transparent 53%) 1px 7px / 17px 14px no-repeat,
    linear-gradient(-35deg, transparent 47%, color-mix(in srgb, var(--rw-project) 72%, white) 49% 51%, transparent 53%) 16px 3px / 18px 18px no-repeat,
    linear-gradient(35deg, transparent 47%, color-mix(in srgb, var(--rw-project) 72%, white) 49% 51%, transparent 53%) 32px 7px / 17px 14px no-repeat;
  opacity: 0.72;
  filter: drop-shadow(0 0 4px var(--rw-project));
}
[data-theme="graphite"] .rw-dossier.project-arc .rw-profile-crown {
  left: 22px;
  top: 3px;
  transform: scale(0.78);
  opacity: 0.54;
}
[data-theme="graphite"] .rw-profile-crown i {
  position: absolute;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: color-mix(in srgb, var(--rw-project) 64%, white);
  box-shadow: 0 0 6px var(--rw-project);
}
[data-theme="graphite"] .rw-profile-crown i:nth-child(1) { left: 0; top: 16px; }
[data-theme="graphite"] .rw-profile-crown i:nth-child(2) { left: 12px; top: 7px; }
[data-theme="graphite"] .rw-profile-crown i:nth-child(3) { left: 23px; top: 1px; }
[data-theme="graphite"] .rw-profile-crown i:nth-child(4) { left: 35px; top: 7px; }
[data-theme="graphite"] .rw-profile-crown i:nth-child(5) { right: 0; top: 16px; }
[data-theme="graphite"] .rw-dossier.kind-ice .rw-profile-core {
  background: transparent;
  border: 1px solid var(--rw-project);
  box-shadow: inset 0 0 22px color-mix(in srgb, var(--rw-project) 28%, transparent), 0 0 18px color-mix(in srgb, var(--rw-project) 35%, transparent);
}
[data-theme="graphite"] .rw-dossier.kind-moon .rw-profile-core { width: 28px; height: 28px; }
[data-theme="graphite"] .rw-dossier.kind-moon .rw-profile-ring { width: 48px; height: 14px; opacity: 0.25; }
[data-theme="graphite"] .rw-dossier-id {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  font-size: 12px;
  letter-spacing: 1.7px;
  color: #8b959e;
  white-space: nowrap;
}
[data-theme="graphite"] .rw-dossier-copy { min-width: 0; align-self: center; }
[data-theme="graphite"] .rw-dossier-name {
  margin-bottom: 9px;
  font-size: 18px;
  line-height: 1.05;
  letter-spacing: 3px;
  color: color-mix(in srgb, var(--rw-project) 72%, white);
}
[data-theme="graphite"] .rw-dossier-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-bottom: 13px;
}
[data-theme="graphite"] .rw-dossier-meta span {
  padding: 4px 6px;
  border: 1px solid color-mix(in srgb, var(--rw-project) 30%, #303842);
  background: color-mix(in srgb, var(--rw-project) 7%, transparent);
  font-size: 12px;
  line-height: 1;
  letter-spacing: 1.2px;
  color: #aeb8c2;
}
[data-theme="graphite"] .rw-dossier-description {
  margin: 0;
  font-size: 16px;
  line-height: 1.48;
  letter-spacing: 0.1px;
  color: #c8cfd6;
}
[data-theme="graphite"] .rw-dossier-key { color: #5f6973; }

[data-theme="graphite"] .rw-mini-profile { display: none; }
[data-theme="graphite"] .rw-dossier.is-orchestrator {
  --rw-project: #eef5fa !important;
  /* Widened from 208px: the card's labels were 7px, below this project's 10px
     floor, and once they read at a legal size the old width crushed every row
     (Wolf, 2026-07-29). */
  width: 252px;
  color: #f2f6f8;
  background:
    linear-gradient(115deg, rgba(255, 255, 255, 0.065), transparent 42%),
    repeating-linear-gradient(90deg, transparent 0 19px, rgba(255, 255, 255, 0.018) 20px),
    rgba(8, 12, 17, 0.965);
  border-color: rgba(230, 239, 245, 0.48);
  box-shadow:
    0 18px 46px rgba(0, 0, 0, 0.52),
    0 0 22px rgba(205, 229, 242, 0.055),
    inset 0 0 26px rgba(255, 255, 255, 0.025);
  clip-path: polygon(0 0, calc(100% - 10px) 0, 100% 10px, 100% 100%, 10px 100%, 0 calc(100% - 10px));
}
[data-theme="graphite"] .rw-dossier.is-orchestrator .rw-dossier-head {
  min-height: 30px;
  padding: 0 13px;
  font-size: 12px;
  letter-spacing: 2px;
  color: #9aa5ad;
}
/* orchestrator header label is set from JS (textContent = "IDENTITY") */
/* the identity card carries its own mini profile: the project body underneath
   stays in the DOM from the previous hover and must never show through */
[data-theme="graphite"] .rw-dossier.is-orchestrator .rw-dossier-body { display: none; }
/* the identity card is the one card that leads somewhere, so it keeps a foot:
   the GitHub mark plus the invitation, centred under the profile rows */
[data-theme="graphite"] .rw-dossier.is-orchestrator .rw-dossier-foot {
  min-height: 30px;
  justify-content: center;
  padding: 0 13px;
  font-size: 12px;
  letter-spacing: 2px;
}
[data-theme="graphite"] .rw-dossier-action {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}
[data-theme="graphite"] .rw-dossier-action .rw-gh {
  width: 14px; height: 14px;
  flex: 0 0 auto;
  color: currentColor;
}
[data-theme="graphite"] .rw-dossier.is-orchestrator .rw-mini-profile {
  display: grid;
  /* One row for mark + name, one for the table: the mark used to span both
     rows, which is why it sat off-centre against the name. */
  grid-template-columns: 38px 1fr;
  align-items: center;
  column-gap: 13px;
  padding: 14px 14px 14px;
}
[data-theme="graphite"] .rw-mini-mark {
  grid-row: 1;
  justify-self: center;
  width: 30px;
  height: 30px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(238, 245, 250, 0.42);
  transform: rotate(45deg);
  box-shadow: inset 0 0 12px rgba(255, 255, 255, 0.07), 0 0 12px rgba(210, 233, 245, 0.06);
}
[data-theme="graphite"] .rw-mini-mark::before,
[data-theme="graphite"] .rw-mini-mark::after,
[data-theme="graphite"] .rw-mini-mark span {
  content: "";
  display: block;
  width: 3px;
  height: 3px;
  background: #eef5fa;
  border-radius: 50%;
  box-shadow: 0 0 7px rgba(238, 245, 250, 0.68);
}
[data-theme="graphite"] .rw-mini-mark::before { transform: translate(-7px, 7px); }
[data-theme="graphite"] .rw-mini-mark::after { transform: translate(7px, -7px); }
[data-theme="graphite"] .rw-mini-mark span { transform: rotate(-45deg); }
[data-theme="graphite"] .rw-mini-title {
  align-self: center;
  font-size: 18px;
  line-height: 1.1;
  letter-spacing: 3px;
  color: #fff;
  text-shadow: 0 0 13px rgba(255, 255, 255, 0.18);
}
[data-theme="graphite"] .rw-mini-profile dl {
  grid-column: 1 / -1;
  margin: 14px 0 0;
  border-top: 1px solid rgba(230, 239, 245, 0.13);
}
[data-theme="graphite"] .rw-mini-profile dl div {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 14px;
  min-height: 26px;
  padding: 5px 0;
  border-bottom: 1px solid rgba(230, 239, 245, 0.075);
}
[data-theme="graphite"] .rw-mini-profile dl div:last-child { border-bottom: none; }
[data-theme="graphite"] .rw-mini-profile dt,
[data-theme="graphite"] .rw-mini-profile dd {
  margin: 0;
  font-size: 12px;
  letter-spacing: 1.4px;
  white-space: nowrap;
}
[data-theme="graphite"] .rw-mini-profile dd { text-align: right; }
[data-theme="graphite"] .rw-mini-profile dt { color: #8b959e; }
[data-theme="graphite"] .rw-mini-profile dd { color: #eef5fa; }

@media (max-width: 700px) {
  [data-theme="graphite"] .rw-hint { bottom: 14px; font-size: 12px; letter-spacing: 2px; }
  [data-theme="graphite"] .rw-dossier {
    top: auto;
    right: 12px;
    bottom: 44px;
    left: 12px;
    width: auto;
  }
  [data-theme="graphite"] .rw-dossier.dock-left { left: 12px; right: 12px; }
  [data-theme="graphite"] .rw-dossier-body { grid-template-columns: 82px 1fr; gap: 12px; padding: 12px; }
  [data-theme="graphite"] .rw-dossier-portrait { padding: 8px 5px 6px; }
  [data-theme="graphite"] .rw-profile-orb { width: 62px; height: 62px; margin-bottom: 5px; transform: scale(.74); transform-origin: center; }
  [data-theme="graphite"] .rw-dossier-name { font-size: 18px; letter-spacing: 2px; }
  [data-theme="graphite"] .rw-dossier-description { font-size: 14px; line-height: 1.35; }
  [data-theme="graphite"] .rw-dossier-foot { display: none; }
  [data-theme="graphite"] .rw-dossier.is-orchestrator {
    right: auto;
    bottom: 28px;
    left: 50%;
    width: min(252px, calc(100% - 32px));
    transform: translateX(-50%);
  }
  [data-theme="graphite"] .rw-dossier.is-orchestrator.show { transform: translateX(-50%); }
}