/* Ruinwright Manifesto: add the 2026-10-05 linked tenets to the original
   white portfolio page. The original room-head, room-lead, h1, three-column
   introduction and footer are deliberately inherited from style.css. */
.writing-room.mp-room {
  --mp-ink:rgba(26,27,23,.88);
  --mp-muted:rgba(26,27,23,.49);
  --mp-faint:rgba(26,27,23,.33);
  --mp-line:rgba(61,58,48,.26);
  --mp-paper:#f4f3ee;
  background:#f4f3ee;
}
.writing-room.mp-room .room-scroll {
  background:#f4f3ee;
}
.writing-room.mp-room .mp-intro-final {
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  min-width:0;
}
.writing-room.mp-room .mp-intro-visit {
  display:inline-block;
  margin-top:clamp(25px,3.5vw,46px);
  padding:0 0 6px;
  border-bottom:1px solid rgba(26,27,23,.25);
  color:rgba(26,27,23,.66);
  font:400 clamp(13px,1.1vw,16px)/1.7 var(--serif);
  letter-spacing:.025em;
  text-decoration:none;
  transition:color .18s ease,border-color .18s ease;
}
.writing-room.mp-room .mp-intro-visit:hover,
.writing-room.mp-room .mp-intro-visit:focus-visible {
  color:rgba(26,27,23,.94);
  border-color:rgba(26,27,23,.75);
}
.writing-room.mp-room .mp-additions {
  position:relative;
  width:100%;
  margin:0;
  padding:0 0 clamp(42px,7vh,92px);
  color:var(--mp-ink);
}
.writing-room.mp-room .mp-atlas-map {
  position:relative;
  width:100%;
  isolation:isolate;
  min-height:560px;
}
.writing-room.mp-room .mp-tenet-atlas {
  position:relative;
  z-index:3;
  display:grid;
  grid-template-columns:repeat(10,minmax(0,1fr));
  align-items:stretch;
  width:100%;
  margin:0;
  padding:8px 3px 0;
  border-top:1px solid var(--mp-line);
  border-bottom:1px solid var(--mp-line);
  background:var(--mp-paper);
}
.writing-room.mp-room .mp-tenet-card {
  display:flex;
  flex-direction:column;
  align-items:stretch;
  min-width:0;
  margin:0;
  padding:12px clamp(4px,.65vw,11px) 17px;
  border:0;
  border-right:1px solid var(--mp-line);
  background:transparent;
  color:var(--mp-ink);
  text-align:center;
  opacity:.75;
  transition:opacity .2s ease,background .2s ease;
}
.writing-room.mp-room .mp-tenet-card:first-child {
  border-left:1px solid var(--mp-line);
}
.writing-room.mp-room .mp-tenet-card.is-selected,
.writing-room.mp-room .mp-tenet-card:hover,
.writing-room.mp-room .mp-tenet-card:focus-visible {
  opacity:1;
  background:rgba(255,255,255,.22);
}
.writing-room.mp-room .mp-tenet-ordinal {
  display:block;
  min-height:25px;
  margin:0 0 6px;
  color:var(--mp-muted);
  font:400 clamp(10px,.79vw,12px)/1.5 var(--serif);
  white-space:nowrap;
}
.writing-room.mp-room .mp-tenet-tile {
  position:relative;
  box-sizing:border-box;
  display:block;
  flex:none;
  width:100%;
  aspect-ratio:1 / 1.08;
  border-top:5px solid #fbfaf6;
  border-left:5px solid #f9f8f4;
  border-right:5px solid #d4d1c8;
  border-bottom:5px solid #c9c6bc;
  box-shadow:inset 1px 1px 0 rgba(255,255,255,.85);
  background:#eeece5;
  transition:transform .2s ease;
}
.writing-room.mp-room .mp-tenet-card:hover .mp-tenet-tile,
.writing-room.mp-room .mp-tenet-card:focus-visible .mp-tenet-tile {
  transform:translateY(-2px);
}
.writing-room.mp-room .mp-tenet-mat {
  position:absolute;
  display:grid;
  place-items:center;
  inset:clamp(4px,.7vw,10px);
  background:transparent;
}
.writing-room.mp-room .mp-tenet-mat img {
  display:block;
  width:100%;
  height:100%;
  object-fit:contain;
  border:0;
  background:transparent;
  filter:none;
}
.writing-room.mp-room .mp-tenet-name {
  display:block;
  margin:11px -3px 0;
  color:var(--mp-ink);
  font:400 clamp(10px,.8vw,13px)/1.45 var(--serif);
  letter-spacing:.012em;
  overflow-wrap:anywhere;
  text-wrap:balance;
}
.writing-room.mp-room .mp-connectors {
  position:absolute;
  /* The former under-atlas layer hid the first few connectors as they left
     the frames. Display the line over the atlas, still non-interactive. */
  z-index:4;
  inset:0;
  width:100%;
  height:100%;
  overflow:visible;
  pointer-events:none;
}
.writing-room.mp-room .mp-connector {
  opacity:.39;
  transition:opacity .18s ease;
}
.writing-room.mp-room .mp-connector path {
  fill:none;
  stroke-linecap:butt;
  stroke-linejoin:miter;
  stroke-miterlimit:12;
  vector-effect:non-scaling-stroke;
  shape-rendering:geometricPrecision;
}
.writing-room.mp-room .mp-connector-depth,
.writing-room.mp-room .mp-connector-light {
  /* Offset shadow/highlight strokes softened each fracture into a cable.
     A single fine stroke preserves the sharp marble-like facets. */
  display:none;
}
.writing-room.mp-room .mp-connector-main {
  stroke:rgba(103,100,93,.79);
  stroke-width:1.12px;
}
.writing-room.mp-room .mp-connector.is-selected {
  opacity:.91;
}
.writing-room.mp-room .mp-connector.is-selected .mp-connector-main {
  stroke:rgba(51,50,46,.88);
  stroke-width:1.28px;
}
.writing-room.mp-room .mp-toc-reading {
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:clamp(265px,23.5vw,370px) minmax(0,1fr);
  gap:clamp(30px,6vw,100px);
  align-items:start;
  min-height:clamp(650px,66vw,880px);
  padding:26px clamp(25px,4vw,68px) 100px clamp(20px,2vw,40px);
  background:transparent;
}
.writing-room.mp-room .mp-toc {
  box-sizing:border-box;
  width:100%;
  min-width:0;
  padding:11px 0 24px;
}
.writing-room.mp-room .mp-toc-kicker {
  margin:0 0 25px;
  color:var(--mp-ink);
  font:400 clamp(17px,1.45vw,22px)/1.5 var(--serif);
  letter-spacing:.035em;
}
.writing-room.mp-room .mp-toc-group > p {
  margin:0 0 9px;
  padding:6px 0 12px;
  border-bottom:1px solid var(--mp-line);
  color:var(--mp-muted);
  font:400 11px/1.5 var(--sans);
  letter-spacing:.08em;
}
.writing-room.mp-room .mp-toc-row,
.writing-room.mp-room .mp-toc-group > a {
  display:grid;
  box-sizing:border-box;
  min-width:0;
  max-width:100%;
  grid-template-columns:50px minmax(0,1fr);
  align-items:baseline;
  gap:clamp(9px,1.2vw,17px);
  width:100%;
  margin:0;
  padding:6px 0;
  background:transparent;
  border:0;
  color:var(--mp-ink);
  font:400 clamp(11px,.91vw,14px)/1.65 var(--serif);
  text-align:left;
  text-decoration:none;
  opacity:.42;
  overflow-wrap:anywhere;
  transition:opacity .18s ease,transform .18s ease;
}
.writing-room.mp-room .mp-toc-group > a.mp-toc-main {
  opacity:.70;
  padding:9px 0;
}
.writing-room.mp-room .mp-toc-group > a.mp-toc-secondary {
  padding-left:12px;
}
.writing-room.mp-room .mp-toc-group > a.mp-toc-chapter-start {
  margin-top:13px;
}
.writing-room.mp-room .mp-toc-group > a.mp-toc-group-start {
  margin-top:26px;
  padding-top:16px;
  border-top:1px solid var(--mp-line);
}
.writing-room.mp-room .mp-toc-row {
  padding-left:19px;
}
.writing-room.mp-room .mp-toc-row > span:last-child,
.writing-room.mp-room .mp-toc-group > a > span:last-child {
  display:block;
  min-width:0;
  max-width:100%;
  white-space:normal;
  overflow-wrap:anywhere;
  word-break:normal;
  hyphens:auto;
  text-wrap:wrap;
}
.writing-room.mp-room .mp-toc-number {
  color:var(--mp-muted);
  font:400 10px/1.5 var(--sans);
  font-variant-numeric:tabular-nums;
  letter-spacing:.028em;
  white-space:nowrap;
}
.writing-room.mp-room .mp-toc-row.is-selected,
.writing-room.mp-room .mp-toc-row:hover,
.writing-room.mp-room .mp-toc-row:focus-visible,
.writing-room.mp-room .mp-toc-group > a:hover,
.writing-room.mp-room .mp-toc-group > a:focus-visible {
  opacity:1;
  transform:translateX(2px);
}
.writing-room.mp-room .mp-preview {
  min-width:0;
  width:min(100%,760px);
  margin:clamp(58px,8vw,130px) auto 0;
  padding:17px 0 0;
  border-top:1px solid var(--mp-line);
}
.writing-room.mp-room .mp-preview-kicker {
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:20px;
  color:var(--mp-ink);
  font:400 clamp(17px,1.45vw,22px)/1.5 var(--serif);
  letter-spacing:.035em;
}
.writing-room.mp-room .mp-preview-kicker [data-mp-count] {
  color:var(--mp-muted);
  font-size:.68em;
  font-variant-numeric:tabular-nums;
}
.writing-room.mp-room .mp-preview-figure {
  display:grid;
  grid-template-columns:minmax(128px,288px) minmax(0,1fr);
  align-items:end;
  gap:clamp(23px,3.5vw,57px);
  width:100%;
  margin:clamp(27px,4vw,58px) 0 0;
}
.writing-room.mp-room .mp-preview-figure > img {
  display:block;
  width:100%;
  max-height:clamp(216px,24.8vw,344px);
  object-fit:contain;
  filter:none;
  border:0;
  background:transparent;
}
.writing-room.mp-room .mp-preview-figure figcaption {
  min-width:0;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:29px;
  padding-bottom:12px;
}
.writing-room.mp-room .mp-preview-figure figcaption span {
  color:var(--mp-ink);
  font:400 clamp(19px,1.9vw,31px)/1.55 var(--serif);
  letter-spacing:.025em;
}
.writing-room.mp-room .mp-preview-figure figcaption a {
  padding:4px 0;
  border-bottom:1px solid var(--mp-line);
  color:var(--mp-muted);
  font:400 clamp(12px,1vw,15px)/1.65 var(--serif);
  text-decoration:none;
}
.writing-room.mp-room .mp-preview-figure figcaption a:hover {
  color:var(--mp-ink);
}
/* Maintain the original portfolio's following read-the-manifesto link and
   footer; nothing is duplicated or taken out of the page. */
@media (max-width:1199px) {
  .writing-room.mp-room .mp-tenet-atlas {
    grid-template-columns:none;
    grid-auto-flow:column;
    grid-auto-columns:clamp(128px,15vw,175px);
    overflow-x:auto;
    overflow-y:hidden;
    padding:13px 18px 15px;
    scroll-snap-type:x proximity;
    -webkit-overflow-scrolling:touch;
  }
  .writing-room.mp-room .mp-tenet-card {
    min-height:218px;
    border-left:1px solid var(--mp-line);
    scroll-snap-align:start;
  }
  .writing-room.mp-room .mp-tenet-name {font-size:12px;}
  .writing-room.mp-room .mp-connectors {display:none;}
  .writing-room.mp-room .mp-toc-reading {
    grid-template-columns:clamp(240px,29vw,315px) minmax(0,1fr);
    gap:34px;
    padding:28px 27px 70px;
  }
  .writing-room.mp-room .mp-preview-figure {
    grid-template-columns:minmax(0,1fr);
    gap:24px;
    justify-items:start;
  }
  .writing-room.mp-room .mp-preview-figure > img {max-width:248px;}
}
@media (max-width:760px) {
  .writing-room.mp-room .mp-tenet-atlas {grid-auto-columns:clamp(138px,43vw,178px);}
  .writing-room.mp-room .mp-tenet-card {min-height:225px;}
  .writing-room.mp-room .mp-toc-reading {
    display:block;
    padding:26px 20px 60px;
    min-height:0;
  }
  .writing-room.mp-room .mp-toc {
    max-width:560px;
    padding:10px 0 32px;
  }
  .writing-room.mp-room .mp-toc-row,
  .writing-room.mp-room .mp-toc-group > a {
    font-size:12px;
  }
  .writing-room.mp-room .mp-preview {
    margin:60px 0 0;
    max-width:560px;
  }
  .writing-room.mp-room .mp-preview-figure {
    grid-template-columns:minmax(0,1fr);
    gap:25px;
  }
  .writing-room.mp-room .mp-preview-figure > img {
    max-width:min(100%,296px);
    max-height:304px;
  }
  .writing-room.mp-room .mp-preview-figure figcaption span {
    font-size:21px;
  }
}
@media (prefers-reduced-motion:reduce) {
  .writing-room.mp-room .mp-tenet-card,
  .writing-room.mp-room .mp-tenet-tile,
  .writing-room.mp-room .mp-toc-row,
  .writing-room.mp-room .mp-connector {
    transition:none!important;
  }
}