:root { color-scheme: light dark; --ink: #202423; --paper: #e7e6df; --muted: #686d69; --rule: rgba(32, 36, 35, 0.3); }
@media (prefers-color-scheme: dark) { :root { --ink: #e1e2dc; --paper: #17252b; --muted: #a3acab; --rule: rgba(225, 226, 220, 0.28); } }
* { box-sizing: border-box; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 1.0625rem/1.55 Charter, "Bitstream Charter", Georgia, serif; }
main, .site-head, .site-foot { max-width: 44rem; margin: 0 auto; padding: 1.25rem 1.1rem; }
.site-head { display: flex; gap: 1rem; align-items: baseline; border-bottom: 1px solid var(--rule); }
.site-mark, .marker { font: 0.72rem/1.4 ui-monospace, "SF Mono", Menlo, Consolas, monospace; letter-spacing: 0.14em; text-transform: lowercase; color: var(--muted); text-decoration: none; }
h1 { font-weight: 300; font-size: clamp(2rem, 6vw, 3.5rem); line-height: 1.1; margin: 2rem 0 1rem; }
h2 { font-weight: 400; font-size: 1.1rem; }
a { color: inherit; }
ul.rooms, ul.works { list-style: none; padding: 0; margin: 0; }
li.room, ul.works li { padding: 0.6rem 0; border-top: 1px solid var(--rule); display: flex; gap: 1rem; flex-wrap: wrap; align-items: baseline; }
.empty { color: var(--muted); }
figure { margin: 1.5rem 0; }
img { max-width: 100%; height: auto; }