/* 门三、门四的"工地开放"页：一件作品 + 一段话 + 接下来。墨色底，与大厅连续。 */
:root { --ink:#0e100c; --paper:#f3eee3; --mist:#a9a59a; --faint:#6f6c64; --line:rgba(243,238,227,.16); --gold:#c8a36a; --serif: Georgia, "Times New Roman", "Songti SC", serif; --sans: "Helvetica Neue", Arial, "PingFang SC", sans-serif; }
* { box-sizing:border-box; }
html { background:var(--ink); }
body { margin:0; color:var(--paper); background:radial-gradient(circle at 75% 10%, #262820 0, transparent 30rem), var(--ink); font-family:var(--sans); line-height:1.6; }
a { color:inherit; }
img { display:block; max-width:100%; }

.site-header { display:flex; justify-content:space-between; align-items:center; gap:1.5rem; padding:1.4rem clamp(1.25rem,4vw,4rem); }
.muma-logo { height:3.4rem; width:auto; filter:invert(1) brightness(.94); }
.doors { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:.35rem 1.4rem; font-size:.74rem; letter-spacing:.06em; }
.doors a { padding-bottom:.2rem; border-bottom:1px solid transparent; text-decoration:none; white-space:nowrap; }
.doors a span { margin-right:.25rem; color:var(--mist); font-size:.62rem; }
.doors a:hover, .doors a:focus-visible, .doors a[aria-current="page"] { border-color:var(--paper); outline:0; }

main { display:grid; grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr); gap:clamp(2rem,6vw,7rem); align-items:center; min-height:calc(100svh - 6rem); padding:clamp(2rem,5vw,4rem) clamp(1.25rem,6vw,8rem) clamp(4rem,8vw,7rem); }
.work { margin:0; }
.work-frame { position:relative; background:var(--paper); }
.work figcaption { display:flex; justify-content:space-between; gap:1rem; margin-top:.9rem; color:var(--mist); font-size:.72rem; letter-spacing:.06em; }
.work figcaption b { color:var(--paper); font-family:var(--serif); font-weight:400; font-size:1rem; letter-spacing:.02em; }

.status { display:inline-flex; align-items:center; gap:.6rem; margin:0 0 1.6rem; color:var(--gold); font-size:.66rem; letter-spacing:.18em; }
.status::before { content:""; width:.5rem; height:.5rem; border-radius:50%; background:currentColor; animation:pulse 2.4s ease-in-out infinite; }
h1 { margin:0; font-family:var(--serif); font-weight:400; font-size:clamp(2.6rem,5vw,4.8rem); line-height:1; letter-spacing:-.02em; }
h1 span { display:block; margin-top:.7rem; color:var(--mist); font-family:var(--sans); font-size:.2em; letter-spacing:.14em; }
.lead { margin:2rem 0 0; font-family:var(--serif); font-size:clamp(1.15rem,1.7vw,1.5rem); line-height:1.4; }
.lead span { display:block; margin-top:.5rem; color:var(--mist); font-family:var(--sans); font-size:.6em; letter-spacing:.02em; }
.body { max-width:32rem; margin:1.8rem 0 0; color:#d8d3c8; font-size:.92rem; }
.next { margin:2.6rem 0 0; padding:1.4rem 0 0; border-top:1px solid var(--line); }
.next h2 { margin:0 0 .9rem; color:var(--mist); font-weight:400; font-size:.66rem; letter-spacing:.18em; }
.next ol { margin:0; padding:0; list-style:none; counter-reset:step; }
.next li { position:relative; padding-left:2rem; margin:.55rem 0; font-size:.9rem; color:#d8d3c8; counter-increment:step; }
.next li::before { content:counter(step); position:absolute; left:0; color:var(--faint); font-family:var(--serif); }
.next li.is-done { color:var(--mist); }
.next li.is-done::after { content:" ✓"; color:var(--gold); }
.back { display:inline-block; margin-top:2.6rem; padding-bottom:.2rem; border-bottom:1px solid var(--line); color:var(--mist); font-size:.74rem; letter-spacing:.08em; text-decoration:none; }
.back:hover, .back:focus-visible { color:var(--paper); border-color:var(--paper); outline:0; }

@keyframes pulse { 0%,100% { opacity:.35; } 50% { opacity:1; } }
@media (max-width:820px) {
  .site-header { flex-direction:column; align-items:flex-start; }
  .doors { justify-content:flex-start; }
  main { grid-template-columns:1fr; padding-top:1rem; }
}
@media (prefers-reduced-motion:reduce) { .status::before { animation:none; } }

.site-footer { display:flex; flex-wrap:wrap; justify-content:space-between; gap:.6rem 2rem; padding:2rem clamp(1.25rem,6vw,8rem) 2.4rem; border-top:1px solid var(--line); color:var(--faint); font-size:.72rem; letter-spacing:.04em; }
.site-footer a { color:var(--mist); text-decoration:none; border-bottom:1px solid var(--line); }
.copyright { margin:0; }
.copyright span { margin-left:.5rem; }