/* ─────────────────────────────────────────────────────────────────────────
   Full-screen reader overlay — site-wide.
   A large floating reading window for any long-form rich-text block.
   Trigger: a [data-arch-reader] button. Markup: partials/_reader_overlay.html.
   Logical properties throughout so it mirrors cleanly under [dir="rtl"].
   ───────────────────────────────────────────────────────────────────────── */

/* ── Trigger button — corner flavour (cards without an existing toolbar) ── */
.arch-reader-trigger{
  width:28px;height:28px;border-radius:99px;border:1px solid var(--border);
  background:var(--bg-surface);color:var(--text-muted);
  font-size:12px;line-height:1;cursor:pointer;
  display:inline-flex;align-items:center;justify-content:center;
  transition:background .15s,color .15s,border-color .15s;
}
.arch-reader-trigger:hover{background:var(--accent-dim);color:var(--accent);border-color:var(--border-hover)}
.arch-reader-trigger:focus-visible{outline:var(--focus-ring);outline-offset:2px}
.arch-reader-trigger--corner{
  position:absolute;top:14px;inset-inline-end:14px;z-index:3;
}
/* Hidden until the script confirms the target has enough content to warrant it */
.arch-reader-trigger[hidden]{display:none}

/* Cards that host a corner trigger need a positioning context */
.proj-description-card,.hall-detail-prose,.situ-pin-body,.qa-q-body,.qa-a-body{position:relative}
/* Keep body text clear of the corner button */
.qa-q-body,.qa-a-body,.situ-pin-body{padding-inline-end:38px}

/* ── Overlay ───────────────────────────────────────────────────────────── */
.arch-reader{
  position:fixed;inset:0;z-index:1300;
  background:rgba(0,0,0,.62);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);
  display:flex;align-items:center;justify-content:center;
  padding:clamp(12px,3vw,40px);
  opacity:0;transition:opacity .18s ease;
}
.arch-reader:not([hidden]){opacity:1}
.arch-reader[hidden]{display:none}

.arch-reader__window{
  background:var(--bg-card,var(--bg-surface));
  border:1px solid var(--border);
  border-radius:16px;
  width:min(900px,100%);
  height:min(92vh,100%);
  display:flex;flex-direction:column;overflow:hidden;
  box-shadow:0 30px 80px rgba(0,0,0,.5);
  transform:translateY(8px) scale(.99);
  transition:transform .18s ease;
}
.arch-reader:not([hidden]) .arch-reader__window{transform:none}

.arch-reader__bar{
  display:flex;align-items:center;gap:12px;
  padding:14px 18px;border-bottom:1px solid var(--border);
  background:linear-gradient(180deg,var(--accent-dim),transparent);
  flex:0 0 auto;
}
.arch-reader__title{
  font-weight:700;font-size:15px;color:var(--text-primary);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;flex:1 1 auto;
}
.arch-reader__tools{display:inline-flex;align-items:center;gap:4px;flex:0 0 auto}
.arch-reader__zoom{
  width:32px;height:32px;border-radius:99px;border:none;background:transparent;
  color:var(--text-muted);font-size:13px;font-weight:700;line-height:1;
  display:inline-flex;align-items:center;justify-content:center;cursor:pointer;
  transition:background .15s,color .15s;
}
.arch-reader__zoom:hover{background:var(--accent-dim);color:var(--accent)}
.arch-reader__zoom:disabled{opacity:.35;cursor:not-allowed}
.arch-reader__zoom:focus-visible{outline:var(--focus-ring);outline-offset:1px}
.arch-reader__close:hover{background:rgba(220,53,69,.12);color:#dc3545}
.arch-reader__sep{display:inline-block;width:1px;height:18px;background:var(--border);margin:0 4px}
[data-arch-reader-act="reset"]{font-family:Georgia,'Times New Roman',serif;font-size:15px}

/* ── Reading column ────────────────────────────────────────────────────── */
.arch-reader__content{
  --arch-reader-fs:19px;
  --arch-reader-lh:1.85;
  flex:1 1 auto;overflow-y:auto;overflow-x:hidden;
  padding:clamp(20px,4vw,48px) clamp(18px,5vw,64px);
  font-size:var(--arch-reader-fs);line-height:var(--arch-reader-lh);
  color:var(--text-secondary);
  text-align:start;hyphens:auto;overflow-wrap:break-word;
  scrollbar-width:thin;scrollbar-color:var(--accent-dim) transparent;
}
.arch-reader__content:focus{outline:none}
/* The inner wrapper holds the cloned HTML, capped for an easy line length */
.arch-reader__inner{max-width:70ch;margin-inline:auto}
.arch-reader__content::-webkit-scrollbar{width:10px}
.arch-reader__content::-webkit-scrollbar-track{background:transparent;margin:6px 0}
.arch-reader__content::-webkit-scrollbar-thumb{
  background:var(--accent-dim);border:3px solid transparent;background-clip:padding-box;border-radius:99px;
}
.arch-reader__content::-webkit-scrollbar-thumb:hover{background:var(--accent);background-clip:padding-box}

.arch-reader__content h1,.arch-reader__content h2,.arch-reader__content h3,.arch-reader__content h4{
  color:var(--text-primary);margin-top:1.4em;margin-bottom:.55em;line-height:1.3;text-align:start;
}
.arch-reader__content h1:first-child,.arch-reader__content h2:first-child,
.arch-reader__content h3:first-child,.arch-reader__content > *:first-child{margin-top:0}
.arch-reader__content p{margin-bottom:1em}
.arch-reader__content img{max-width:100%;height:auto;border-radius:10px;margin:18px 0;display:block;box-shadow:0 6px 22px rgba(0,0,0,.3)}
.arch-reader__content iframe{max-width:100%;width:100%;border:0;border-radius:8px;display:block;margin:1em 0;aspect-ratio:16/9;height:auto}
.arch-reader__content a{color:var(--accent)}
.arch-reader__content a:hover{text-decoration:underline}
.arch-reader__content blockquote{
  border-inline-start:3px solid var(--accent);padding:8px 0;padding-inline-start:18px;margin:18px 0;
  color:var(--text-muted);font-style:italic;text-align:start;
}
.arch-reader__content pre{background:var(--bg-surface);border:1px solid var(--border);border-radius:8px;padding:16px;overflow-x:auto;font-size:.85em;text-align:start}
.arch-reader__content code{background:var(--bg-surface);padding:1px 5px;border-radius:4px;font-size:.9em}
.arch-reader__content ul,.arch-reader__content ol{text-align:start;padding-inline-start:1.4em;margin-bottom:1em}

@media (max-width:600px){
  .arch-reader{padding:0}
  .arch-reader__window{width:100%;height:100%;border-radius:0;border:none}
}