/* ===== Ruin Archive miniature frame v4.2 — paired atlas / archive frames ===== */

.room-view[data-room="ruin-atlas"] .ruin-mini-section {
  width: min(50vw, 700px);
  margin: 0 auto clamp(92px, 13vh, 150px);
  padding: 0;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-shell {
  /* Clean rebuild: the frame is only a transparent outlined construction.
     No cracks, chips, filled material or random fracture geometry. */
  --ruin-mini-frame-top: 7.8%;
  --ruin-mini-frame-bottom: 11.585%;
  --ruin-mini-frame-left: 19.5%;
  --ruin-mini-frame-right: 11.5%;
  --ruin-mini-frame-side: 15%;
  position: relative;
  width: 100%;
  height: auto;
  aspect-ratio: 1.22 / 1;
  overflow: visible;
  isolation: isolate;
  background: transparent;
  border: 0;
  box-shadow: none;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-map {
  position: absolute;
  inset: 1px;
  z-index: 1;
  overflow: hidden;
  clip-path: none !important;
  -webkit-clip-path: none !important;
  background: var(--ruin-mini-paper, #fffffb);
  border: 0;
  outline: 0;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-chassis {
  position: absolute;
  inset: 0;
  z-index: 840;
  overflow: visible;
  pointer-events: none;
  color: var(--ruin-mini-line-strong, rgb(102,102,96));
}

.room-view[data-room="ruin-atlas"] .ruin-mini-coords {
  position: absolute;
  left: 50%;
  top: calc(var(--ruin-mini-frame-top) + 6px);
  z-index: 6;
  transform: translateX(-50%);
  color: var(--ruin-mini-muted, rgba(103,103,97,.68));
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: clamp(6px, .58vw, 8px);
  font-weight: 300;
  letter-spacing: .12em;
  opacity: .56;
  white-space: nowrap;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-clean-frame {
  position: absolute;
  inset: 0;
  z-index: 12;
  overflow: visible;
  pointer-events: none;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-frame-svg {
  position: absolute;
  inset: 0;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
  shape-rendering: geometricPrecision;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-frame-line {
  fill: none;
  stroke: var(--ruin-mini-line-strong, rgba(102,102,96,.72));
  stroke-width: 1.08px;
  vector-effect: non-scaling-stroke;
  stroke-linecap: square;
  stroke-linejoin: miter;
}

/* Retire every older fracture renderer. */
.room-view[data-room="ruin-atlas"] .ruin-mini-fracture-host,
.room-view[data-room="ruin-atlas"] .ruin-mini-authored-fractures {
  display: none !important;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-shell .leaflet-pane,
.room-view[data-room="ruin-atlas"] .ruin-mini-shell .leaflet-control-container {
  z-index: auto;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-shell .leaflet-control-container {
  position: relative;
  z-index: 780;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-tone-control.leaflet-bar {
  margin: calc(var(--ruin-mini-frame-top) + 7px) calc(var(--ruin-mini-frame-right) + 7px) 0 0 !important;
  transform: scale(.88);
  transform-origin: top right;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-source {
  margin: 38px 0 0;
  color: rgba(23,24,19,.42);
  font-family: var(--serif);
  font-size: 9px;
  line-height: 1.65;
  letter-spacing: .035em;
  text-align: left;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-source a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid rgba(23,24,19,.22);
  transition: color 180ms ease, border-color 180ms ease;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-source a:hover,
.room-view[data-room="ruin-atlas"] .ruin-mini-source a:focus-visible {
  color: rgba(23,24,19,.82);
  border-bottom-color: rgba(23,24,19,.52);
}

.room-view[data-room="ruin-atlas"] .ruin-mini-updated {
  margin: 5px 0 0;
  color: rgba(23,24,19,.42);
  font-size: 9px;
  letter-spacing: .11em;
  text-align: right;
}

@media (max-width: 900px) {
  .room-view[data-room="ruin-atlas"] .ruin-mini-section {
    width: min(60vw, 560px);
  }
}

@media (max-width: 760px) {
  .room-view[data-room="ruin-atlas"] .ruin-mini-section {
    width: min(calc(100vw - 28px), 560px);
    margin-bottom: 104px;
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-shell {
    --ruin-mini-frame-top: 7.8%;
    --ruin-mini-frame-bottom: 11.585%;
    --ruin-mini-frame-left: 19.5%;
    --ruin-mini-frame-right: 11.5%;
    --ruin-mini-frame-side: 15%;
    aspect-ratio: 1.06 / 1;
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-coords {
    top: calc(var(--ruin-mini-frame-top) + 4px);
    font-size: 5.5px;
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-tone-control.leaflet-bar {
    margin: calc(var(--ruin-mini-frame-top) + 4px) calc(var(--ruin-mini-frame-right) + 4px) 0 0 !important;
    transform: scale(.72);
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-source {
    margin-top: 36px;
    font-size: 8.5px;
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-updated {
    margin-top: 4px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .room-view[data-room="ruin-atlas"] .ruin-mini-frame-line {
    transition: none !important;
  }
}


/* ===== Paired Archive cabinet miniature · source-system refinement ===== */
.room-view[data-room="ruin-atlas"] .ruin-mini-cabinet-section {
  margin-top: clamp(62px, 9vh, 98px);
  margin-bottom: clamp(26px, 4vh, 48px);
}

.room-view[data-room="ruin-atlas"] .ruin-mini-cabinet-shell {
  --ruin-mini-page: #f7f5ef;
  overflow: hidden;
  background: transparent;
  opacity: 1;
  transition: opacity .23s ease;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-cabinet-shell.is-refracturing {
  opacity: 0;
}


.room-view[data-room="ruin-atlas"] .ruin-mini-archive-system {
  position: absolute;
  inset: 1px;
  z-index: 120;
  overflow: visible;
  background: transparent;
  color: var(--ruin-mini-text, rgba(23,24,19,.82));
  pointer-events: none;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-file-stack {
  position: absolute;
  z-index: 130;
  pointer-events: none;
  transition: transform .4s cubic-bezier(.25,1,.5,1), z-index 0s;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-file-stack.sink-down {
  transform: translateY(115%) !important;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-file-stack.elevated-z {
  z-index: 225 !important;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-position-left {
  left: var(--mini-record-left, -22px);
  top: 0;
  width: var(--mini-record-stack-w, 172px);
  height: 100%;
  overflow: visible;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-position-right {
  right: var(--mini-garden-right, 0px);
  bottom: var(--mini-garden-bottom, 132px);
  width: var(--mini-garden-stack-w, 88px);
}

.room-view[data-room="ruin-atlas"] .ruin-mini-archive-doc {
  position: absolute;
  width: var(--mini-garden-doc-w, 78px);
  height: var(--mini-garden-doc-h, 322px);
  box-sizing: border-box;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  pointer-events: auto;
  overflow: hidden;
  transition:
    transform .4s cubic-bezier(.19,1,.22,1),
    top .4s cubic-bezier(.19,1,.22,1),
    opacity .26s ease;
  -webkit-tap-highlight-color: transparent;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-archive-doc::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background: var(--ruin-mini-paper, #f4f3ee);
  clip-path: var(--archive-doc-shape-clip);
  -webkit-clip-path: var(--archive-doc-shape-clip);
}

.room-view[data-room="ruin-atlas"] .ruin-mini-archive-cut-outline {
  position: absolute;
  inset: 0;
  z-index: 2;
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
  pointer-events: none;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-archive-cut-outline path {
  fill: none;
  /* Share the index-drawer's stone-outline color, but allow the smaller
     archive-doc silhouettes a stronger, more legible hairline. */
  stroke: var(--index-stone-outline, var(--ruin-mini-line-strong, rgba(102,102,96,.74)));
  stroke-width: 1.5px;
  vector-effect: non-scaling-stroke;
  stroke-linecap: square;
  stroke-linejoin: miter;
}


/* Never display any old archive-doc interior crack paths, including
   if a previously cached script left one in the miniature SVG. */
.room-view[data-room="ruin-atlas"] .ruin-mini-archive-hairline-crack {
  display: none !important;
}

.room-view[data-room="ruin-atlas"] #ruin-mini-stack-record .ruin-mini-archive-doc {
  top: 0 !important;
  left: 0 !important;
  width: var(--mini-record-doc-w, 132px);
  height: var(--mini-record-doc-h, 408px);
  transform: translate3d(var(--stack-x,0px),var(--stack-y,0px),0);
}

.room-view[data-room="ruin-atlas"] #ruin-mini-stack-garden .ruin-mini-archive-doc {
  right: 0;
  width: var(--mini-garden-doc-w, 78px);
  height: var(--mini-garden-doc-h, 322px);
}

/* No hover-driven stack translation in the portfolio miniature. */
.room-view[data-room="ruin-atlas"] .ruin-mini-archive-doc:hover:not(.extracted) {
  transform: inherit;
}

.room-view[data-room="ruin-atlas"] #ruin-mini-stack-record .ruin-mini-archive-doc.extracted {
  top: var(--mini-record-extract-top, 152px) !important;
  left: 0 !important;
  transform: translateX(var(--mini-record-extract-x, 131px)) skewY(-1.5deg) !important;
  z-index: 260 !important;
}

.room-view[data-room="ruin-atlas"] #ruin-mini-stack-garden .ruin-mini-archive-doc.extracted {
  top: var(--mini-garden-extract-top, -198px) !important;
  bottom: auto !important;
  transform: translateX(var(--mini-garden-extract-x, -141px)) skewY(1.5deg) !important;
  z-index: 260 !important;
}

.room-view[data-room="ruin-atlas"] #ruin-mini-stack-record .ruin-mini-archive-doc.extracted.retracting {
  top: 0 !important;
  transform: translate3d(var(--stack-x,0px),var(--stack-y,0px),0) !important;
  transition:
    transform .46s cubic-bezier(.19,1,.22,1),
    top .46s cubic-bezier(.19,1,.22,1);
}

.room-view[data-room="ruin-atlas"] .ruin-mini-archive-doc.index-filter-muted {
  opacity: .11;
}

/* Frame sits below the archive sheets; its lines remain slightly heavier. */
.room-view[data-room="ruin-atlas"] .ruin-mini-cabinet-frame {
  position: absolute;
  inset: 0;
  z-index: 90;
  overflow: visible;
  pointer-events: none;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-cabinet-frame svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: visible;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-cabinet-frame-lines {
  fill: none;
  stroke: var(--ruin-mini-line-strong, rgba(102,102,96,.76));
  stroke-width: 1.42px;
  vector-effect: non-scaling-stroke;
  stroke-linecap: square;
  stroke-linejoin: miter;
}

/* ===== Miniature port of ruin-archive index-drawer ===== */
.room-view[data-room="ruin-atlas"] .ruin-mini-index-drawer {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 79%;
  z-index: 190;
  transform: translateY(calc(100% - var(--mini-index-handle-h, 42px)));
  transition: transform .4s cubic-bezier(.25,1,.5,1);
  pointer-events: auto;
  clip-path: var(--mini-index-drawer-shell-clip, polygon(0 42px, 19.5% 0, 88.5% 0, 100% 42px, 100% 100%, 0 100%));
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-drawer.open {
  transform: translateY(0);
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-handle {
  position: relative;
  z-index: 2;
  width: 100%;
  height: var(--mini-index-handle-h, 42px);
  pointer-events: none;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-stone-layer {
  position: absolute;
  inset: 0;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-stone-layer > svg {
  display: block;
  width: 100%;
  height: 100%;
  overflow: hidden;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-stone-face {
  fill: color-mix(in srgb, var(--ruin-mini-paper,#f4f3ee) 92%, transparent);
  fill-opacity: var(--stone-alpha,.84);
  stroke: color-mix(in srgb, var(--ruin-mini-line-strong,#666660) 76%, transparent);
  stroke-opacity: var(--stone-stroke-alpha,.72);
  stroke-width: 1.02px;
  vector-effect: non-scaling-stroke;
  stroke-linecap: butt;
  stroke-linejoin: bevel;
}


.room-view[data-room="ruin-atlas"] .ruin-mini-index-crack-void {
  stroke: var(--ruin-mini-page, #f7f5ef);
  stroke-width: var(--crack-gap, 2px);
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-crack-face,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-crack-mouth-edge {
  fill: none;
  stroke: var(--ruin-mini-line-strong, rgba(102,102,96,.72));
  stroke-width: .78px;
  stroke-opacity: var(--crack-face-alpha,.62);
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-crack-mouth {
  fill: var(--ruin-mini-page, #f7f5ef);
  stroke: none;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-surface-trigger {
  position: absolute;
  inset: 0;
  z-index: 3;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  clip-path: polygon(0 100%, 19.5% 0, 88.5% 0, 100% 100%);
  cursor: pointer;
  pointer-events: auto;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-bottom-labels {
  position: absolute;
  left: 3.4%;
  right: 3.4%;
  bottom: 7px;
  z-index: 2;
  display: grid;
  grid-template-columns: 1fr auto 1fr;
  align-items: end;
  gap: 12px;
  pointer-events: none;
  -webkit-mask-image: var(--mini-index-stone-mask, none);
  mask-image: var(--mini-index-stone-mask, none);
  -webkit-mask-size: 100% var(--mini-index-drawer-height, 100%);
  mask-size: 100% var(--mini-index-drawer-height, 100%);
  -webkit-mask-position: 0 0;
  mask-position: 0 0;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  font-family: var(--serif);
  font-size: clamp(6.5px,.62vw,9px);
  letter-spacing: .055em;
  color: var(--ruin-mini-text,rgba(23,24,19,.72));
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-bottom-labels span:last-child {
  text-align: right;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-bottom-labels strong {
  font-size: 1.18em;
  font-weight: 400;
  letter-spacing: .16em;
  white-space: nowrap;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-content {
  position: relative;
  z-index: 2;
  height: calc(100% - var(--mini-index-handle-h, 42px));
  box-sizing: border-box;
  padding: 26px 9.5% 20px 12.5%;
  overflow-y: auto;
  background: transparent;
  border-top: 0;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  -webkit-mask-image: var(--mini-index-stone-mask, none);
  mask-image: var(--mini-index-stone-mask, none);
  -webkit-mask-size: 100% calc(100% + var(--mini-index-handle-h, 42px));
  mask-size: 100% calc(100% + var(--mini-index-handle-h, 42px));
  -webkit-mask-position: 0 calc(0px - var(--mini-index-handle-h, 42px));
  mask-position: 0 calc(0px - var(--mini-index-handle-h, 42px));
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  scrollbar-width: none;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-content::-webkit-scrollbar {
  display: none;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-fracture-zone {
  padding: 0 3% 18px;
  border-bottom: 1px solid color-mix(in srgb,var(--ruin-mini-line-strong,#666) 28%,transparent);
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-top-title {
  margin: 0 0 14px;
  text-align: center;
  font-family: var(--serif);
  font-size: clamp(8px,.78vw,11px);
  line-height: 1.55;
  letter-spacing: .05em;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-columns {
  columns: 2;
  column-gap: 34px;
  font-family: var(--serif);
  font-size: clamp(7px,.70vw,10px);
  line-height: 1.65;
  text-align: justify;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-columns p {
  margin: 0 0 8px;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-stable-zone {
  padding: 18px 0 0;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-title {
  text-align: center;
  font-family: var(--serif);
  font-size: clamp(9px,.85vw,12px);
  letter-spacing: .16em;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-lex {
  max-width: 78%;
  margin: 8px auto 16px;
  text-align: center;
  font-family: var(--serif);
  font-size: clamp(6.5px,.62vw,9px);
  line-height: 1.55;
  opacity: .68;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-system {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px 18px;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-row {
  display: flex;
  align-items: baseline;
  gap: 6px;
  font-family: var(--serif);
  font-size: clamp(7px,.66vw,9.5px);
  line-height: 1.65;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-category {
  font-weight: 500;
  white-space: nowrap;
  pointer-events: none;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-separator {
  opacity: .42;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 1px 8px;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-tag {
  position: relative;
  margin: 0;
  padding: 0;
  border: 0;
  background: transparent;
  color: inherit;
  font: inherit;
  cursor: pointer;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-tag:hover,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-tag.active {
  font-weight: 600;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-tag.active::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -3px;
  width: 3px;
  height: 3px;
  border-radius: 50%;
  background: currentColor;
  transform: translateX(-50%);
}

.room-view[data-room="ruin-atlas"] .ruin-mini-refracture-control {
  margin: 18px 0 0;
  text-align: center;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-refracture-button {
  appearance: none;
  margin: 0;
  padding: 3px 8px 4px;
  border: 1px solid rgba(23,24,19,.34);
  background: transparent;
  color: rgba(23,24,19,.66);
  font-family: var(--serif);
  font-size: 9px;
  line-height: 1.35;
  letter-spacing: .12em;
  cursor: pointer;
  transition: opacity .18s ease, border-color .18s ease, color .18s ease;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-refracture-button:hover,
.room-view[data-room="ruin-atlas"] .ruin-mini-refracture-button:focus-visible {
  color: rgba(23,24,19,.92);
  border-color: rgba(23,24,19,.62);
  outline: none;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-refracture-button:disabled {
  opacity: .34;
  cursor: default;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-refracture-note {
  margin: 7px 0 0;
  color: rgba(23,24,19,.42);
  font-family: var(--serif);
  font-size: 8.5px;
  line-height: 1.55;
  letter-spacing: .04em;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-cabinet-source {
  margin-top: 12px;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-cabinet-section + .room-note {
  padding-top: clamp(30px,4.5vh,52px);
}

@media (max-width:760px) {
  .room-view[data-room="ruin-atlas"] .ruin-mini-cabinet-section {
    margin-top: 56px;
    margin-bottom: 22px;
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-index-drawer {
    height: 82%;
    transform: translateY(calc(100% - var(--mini-index-handle-h, 34px)));
    clip-path: var(--mini-index-drawer-shell-clip, polygon(0 var(--mini-index-handle-h, 34px), 19.5% 0, 88.5% 0, 100% var(--mini-index-handle-h, 34px), 100% 100%, 0 100%));
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-index-handle {
    height: var(--mini-index-handle-h, 34px);
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-index-content {
    height: calc(100% - var(--mini-index-handle-h, 34px));
    padding: 16px 8% 18px;
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-index-columns {
    columns: 1;
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-index-system {
    display: block;
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-index-row {
    margin-bottom: 5px;
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-index-bottom-labels {
    font-size: 6px;
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-cabinet-source {
    margin-top: 12px;
  }
}


.room-view[data-room="ruin-atlas"] .ruin-mini-index-crack-branch-face {
  stroke-width: .62px;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-crack-branch-void {
  stroke-linecap: round;
}

@media (max-width:760px) {
  .room-view[data-room="ruin-atlas"] .ruin-mini-refracture-control {
    margin-top: 14px;
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-refracture-button {
    font-size: 8.5px;
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-refracture-note {
    font-size: 8px;
  }
}


/* ===== Exact Ruin Archive v268+ stone-fragment port ===== */
.room-view[data-room="ruin-atlas"] .ruin-mini-cabinet-shell {
  --index-stone-frost-bg: rgba(244,243,238,.68);
  --index-stone-face-wash: rgba(244,243,238,.16);
  --index-stone-outline: var(--ruin-mini-line-strong, rgba(102,102,96,.72));
  --index-stone-immune-bg: rgba(244,243,238,.84);
  --index-stone-frost-brightness: 1.02;
}

.room-view[data-room="ruin-atlas"] #ruin-mini-index-stone-layer {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  z-index: 0 !important;
  pointer-events: none !important;
  isolation: isolate;
  overflow: hidden !important;
}

.room-view[data-room="ruin-atlas"] #ruin-mini-index-stone-layer > .index-stone-frost-host {
  position: absolute !important;
  inset: 0 !important;
  z-index: 0 !important;
  display: block !important;
  pointer-events: none !important;
  overflow: hidden !important;
}

.room-view[data-room="ruin-atlas"] #ruin-mini-index-stone-layer .index-stone-frost-face {
  position: absolute !important;
  inset: 0 !important;
  display: block !important;
  pointer-events: none !important;
  background: var(--index-stone-frost-bg, rgba(244,243,238,.68)) !important;
  backdrop-filter:
    blur(4.2px)
    saturate(.90)
    brightness(var(--index-stone-frost-brightness,1.02)) !important;
  -webkit-backdrop-filter:
    blur(4.2px)
    saturate(.90)
    brightness(var(--index-stone-frost-brightness,1.02)) !important;
}

.room-view[data-room="ruin-atlas"] #ruin-mini-index-stone-layer > svg.index-stone-fragment-svg {
  position: absolute !important;
  inset: 0 !important;
  z-index: 1 !important;
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

.room-view[data-room="ruin-atlas"] #ruin-mini-index-stone-layer .index-stone-fragment-face {
  fill: var(--index-stone-face-wash, rgba(244,243,238,.16)) !important;
  fill-opacity: 1 !important;
  stroke: var(--index-stone-outline, rgba(102,102,96,.72)) !important;
  stroke-width: var(--stone-stroke-width,.86px) !important;
  stroke-opacity: var(--stone-stroke-alpha,.80) !important;
  stroke-linecap: round !important;
  stroke-linejoin: round !important;
  vector-effect: non-scaling-stroke !important;
  filter: none !important;
}

.room-view[data-room="ruin-atlas"] #ruin-mini-index-stone-layer > .index-stone-crack-immunity {
  position: absolute !important;
  z-index: 2 !important;
  display: block !important;
  pointer-events: none !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
  background: var(--index-stone-immune-bg, rgba(244,243,238,.84)) !important;
  backdrop-filter:
    blur(4.8px)
    saturate(.88)
    brightness(var(--index-stone-frost-brightness,1.02)) !important;
  -webkit-backdrop-filter:
    blur(4.8px)
    saturate(.88)
    brightness(var(--index-stone-frost-brightness,1.02)) !important;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-content {
  -webkit-mask-image: none !important;
  mask-image: none !important;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-fracture-zone,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-bottom-labels {
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-content,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-handle {
  position: relative;
  z-index: 3 !important;
}

.room-view[data-room="ruin-atlas"] #ruin-mini-index-stable-zone {
  position: relative;
  z-index: 14 !important;
  isolation: isolate;
}

@media (max-width:760px) {
  .room-view[data-room="ruin-atlas"] #ruin-mini-index-stone-layer > .index-stone-crack-immunity {
    display: none !important;
  }
}


/* ===== Mini Index Drawer · white slab + bottom protected index ===== */
.room-view[data-room="ruin-atlas"] .ruin-mini-cabinet-shell {
  --index-stone-frost-bg: rgba(255,255,255,.965);
  --index-stone-face-wash: rgba(255,255,255,.24);
  --index-stone-immune-bg: #fff;
}

.room-view[data-room="ruin-atlas"] #ruin-mini-index-stone-layer .index-stone-frost-face {
  background: rgba(255,255,255,.965) !important;
  backdrop-filter:
    blur(4.2px)
    saturate(.90)
    brightness(1.025) !important;
  -webkit-backdrop-filter:
    blur(4.2px)
    saturate(.90)
    brightness(1.025) !important;
}

/* The source immunity veil was a solid rectangle above the generated fragments.
   In the miniature that rectangle was masking the lower half of the fractures
   after the drawer opened. The protected index now owns a softer gradient veil. */
.room-view[data-room="ruin-atlas"] #ruin-mini-index-stone-layer > .index-stone-crack-immunity {
  display: none !important;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-content {
  position: absolute !important;
  left: 0;
  right: 0;
  top: var(--mini-index-handle-h,42px);
  bottom: 0;
  width: auto;
  height: auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  pointer-events: none;
  z-index: 3 !important;
}

/* Only the index survives. It sits at the very bottom and is protected by a
   progressive white field: transparent above, increasingly opaque toward the
   controls, so fractures remain readable until they approach the index. */
.room-view[data-room="ruin-atlas"] #ruin-mini-index-stable-zone {
  position: absolute !important;
  left: 0;
  right: 0;
  bottom: 0;
  min-height: 36%;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  gap: 12px;
  padding: clamp(54px,8.5%,84px) 9.5% 20px !important;
  background:
    linear-gradient(
      to bottom,
      rgba(255,255,255,0) 0%,
      rgba(255,255,255,.14) 18%,
      rgba(255,255,255,.44) 34%,
      rgba(255,255,255,.76) 52%,
      rgba(255,255,255,.94) 70%,
      rgba(255,255,255,1) 86%,
      rgba(255,255,255,1) 100%
    );
  z-index: 14 !important;
  isolation: isolate;
  pointer-events: auto;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-title {
  margin: 0;
  text-align: center;
  font-family: var(--serif);
  font-size: clamp(8px,.78vw,11px);
  font-weight: 400;
  line-height: 1.4;
  letter-spacing: .18em;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-system {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: baseline;
  gap: 8px 16px;
  margin: 0 auto;
  width: min(92%,760px);
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-fracture-zone,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-top-title,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-columns,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-lex,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-bottom-labels {
  display: none !important;
}

@media (max-width:760px) {
  .room-view[data-room="ruin-atlas"] #ruin-mini-index-stable-zone {
    min-height: 42%;
    gap: 9px;
    padding: 46px 7.5% 16px !important;
  }

  .room-view[data-room="ruin-atlas"] .ruin-mini-index-system {
    width: 96%;
    gap: 5px 10px;
  }
}


/* ===== Mini stele inscription · no frosted backing ===== */

/* Remove the source's frosted-glass host entirely. The only visible surface is
   now the white fragment geometry itself. */
.room-view[data-room="ruin-atlas"] #ruin-mini-index-stone-layer > .index-stone-frost-host,
.room-view[data-room="ruin-atlas"] #ruin-mini-index-stone-layer .index-stone-frost-face,
.room-view[data-room="ruin-atlas"] #ruin-mini-index-stone-layer > .index-stone-crack-immunity {
  display: none !important;
  visibility: hidden !important;
  opacity: 0 !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* White stone, without a second translucent plate behind it. */
.room-view[data-room="ruin-atlas"] #ruin-mini-index-stone-layer .index-stone-fragment-face {
  fill: #fff !important;
  fill-opacity: 1 !important;
}

/* Clear the previous protected-index gradient and every old index-system layer. */
.room-view[data-room="ruin-atlas"] #ruin-mini-index-stable-zone,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-system,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-title,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-row,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-tags,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-tag {
  display: none !important;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-index-content {
  position: absolute !important;
  inset: var(--mini-index-handle-h,42px) 0 0 !important;
  width: auto !important;
  height: auto !important;
  padding: 0 !important;
  overflow: hidden !important;
  background: transparent !important;
  pointer-events: none !important;
  z-index: 3 !important;
}

/* The inscription is an actual rubbing: the exact source stone-polygons are
   applied as a CSS mask by syncMiniSourceStoneMask(), so glyphs disappear at
   the same physical fractures as the white stele. */
.room-view[data-room="ruin-atlas"] .ruin-mini-stele-copy {
  position: absolute;
  box-sizing: border-box;
  overflow: hidden;
  color: rgba(23,24,19,.72);
  font-family: "IBM Plex Sans JP", var(--serif);
  font-weight: 300;
  -webkit-font-smoothing: antialiased;
  text-rendering: geometricPrecision;
  pointer-events: none;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
}

/* Chinese / Japanese follow the Ruin Archive stele convention: vertical-rl. */
html[lang="zh-Hans"] .room-view[data-room="ruin-atlas"] .ruin-mini-stele-copy,
html[lang="ja"] .room-view[data-room="ruin-atlas"] .ruin-mini-stele-copy {
  top: 5%;
  bottom: 6%;
  left: 19%;
  right: 19%;
  writing-mode: vertical-rl;
  -webkit-writing-mode: vertical-rl;
  text-orientation: mixed;
  white-space: normal;
  word-break: normal;
  overflow-wrap: normal;
  text-align: start;
}

html[lang="zh-Hans"] .room-view[data-room="ruin-atlas"] .ruin-mini-stele-copy {
  font-size: clamp(9.5px,.82vw,12.4px);
  line-height: 1.84;
  letter-spacing: .10em;
}

html[lang="ja"] .room-view[data-room="ruin-atlas"] .ruin-mini-stele-copy {
  left: 18%;
  right: 18%;
  font-size: clamp(9px,.78vw,11.9px);
  line-height: 1.91;
  letter-spacing: .055em;
}

/* English remains horizontal, matching the source site's inscription mode. */
html[lang="en"] .room-view[data-room="ruin-atlas"] .ruin-mini-stele-copy {
  top: 14%;
  left: 15%;
  right: 15%;
  width: auto;
  height: auto;
  writing-mode: horizontal-tb;
  text-orientation: mixed;
  white-space: normal;
  text-align: left;
  font-size: clamp(9px,.76vw,11.5px);
  line-height: 1.72;
  letter-spacing: .035em;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-stele-lead {
  font-weight: 400;
  color: rgba(23,24,19,.88);
}

html[lang="zh-Hans"] .room-view[data-room="ruin-atlas"] .ruin-mini-stele-lead {
  font-size: 1.08em;
  letter-spacing: .135em;
}

html[lang="ja"] .room-view[data-room="ruin-atlas"] .ruin-mini-stele-lead {
  font-size: 1.08em;
  letter-spacing: .085em;
}

html[lang="en"] .room-view[data-room="ruin-atlas"] .ruin-mini-stele-lead {
  font-size: 1.06em;
  letter-spacing: .055em;
}

.room-view[data-room="ruin-atlas"] .ruin-mini-stele-separator,
.room-view[data-room="ruin-atlas"] .ruin-mini-stele-body {
  color: rgba(23,24,19,.70);
}

/* No old white protection slab behind the inscription. */
.room-view[data-room="ruin-atlas"] .ruin-mini-index-content::before,
.room-view[data-room="ruin-atlas"] .ruin-mini-index-content::after {
  content: none !important;
  display: none !important;
}

@media (max-width:760px) {
  html[lang="zh-Hans"] .room-view[data-room="ruin-atlas"] .ruin-mini-stele-copy,
  html[lang="ja"] .room-view[data-room="ruin-atlas"] .ruin-mini-stele-copy {
    top: 4%;
    bottom: 5%;
    left: 15%;
    right: 15%;
  }

  html[lang="en"] .room-view[data-room="ruin-atlas"] .ruin-mini-stele-copy {
    top: 12%;
    left: 11%;
    right: 11%;
    font-size: 9px;
  }
}
