:root{color-scheme:dark;--ink:#edf5ff;--muted:#b8cce0;--cyan:#8ae2ef;--line:#24384e;--base:#070b16}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:24px}body.reading{margin:0;background:var(--base);color:var(--ink);font-family:"PingFang SC","Microsoft YaHei",sans-serif;font-size:16px;line-height:1.9;overflow-wrap:break-word}a{color:var(--cyan);text-underline-offset:5px}a:hover{color:#fff}a:focus-visible{outline:2px solid var(--cyan);outline-offset:5px;border-radius:2px}p{margin:0 0 20px;color:var(--muted);max-width:68ch}h1,h2,h3{line-height:1.4;letter-spacing:-.025em;font-weight:600}h1{font-size:clamp(36px,4.8vw,64px);margin:16px 0 24px;max-width:15em}h2{font-size:clamp(26px,3vw,38px);margin:0 0 24px}h3{font-size:21px;margin:0 0 14px}
.reading-header,.reading-footer{max-width:1280px;margin:auto;padding:26px 40px;display:flex;align-items:center;justify-content:space-between;gap:24px}.reading-header{border-bottom:1px solid var(--line)}.reading-brand{color:var(--ink);text-decoration:none;font-size:28px;font-weight:700;display:inline-flex;align-items:center;white-space:nowrap;gap:2px}.reading-brand>span{color:var(--cyan)}.reading-brand small{font-size:15px;font-weight:400;margin-left:20px;padding-left:20px;border-left:1px solid var(--line);color:var(--cyan)}.reading-header nav{display:flex;gap:28px;align-items:center;flex-wrap:wrap}.reading-header nav a{font-size:14px;text-decoration:none;color:var(--muted);padding:8px 0}.reading-header nav a[aria-current]{color:var(--cyan);box-shadow:0 1px 0 var(--cyan)}
.reading main{max-width:1200px;margin:auto;padding:24px 40px 0}.reading-breadcrumb{display:flex;gap:12px;color:var(--muted);font-size:13px}.reading-breadcrumb a{color:inherit}.reading-hero{padding:58px 0 64px;position:relative}.reading-signature{color:var(--cyan);font-size:14px;margin-bottom:14px}.reading-lead{font-size:clamp(18px,1.8vw,22px);line-height:1.8;color:#d8e8f5}.reading-hero>.reading-lead{max-width:42em}.reading-links{display:flex;flex-wrap:wrap;align-items:center;gap:14px 26px;margin:24px 0}.reading-links a,.reading-film,.reading-download{display:inline-flex;align-items:center;min-height:44px;text-decoration:none;border-bottom:1px solid #476887;font-size:14px}.reading-links a:hover,.reading-film:hover{border-color:var(--cyan)}.reading-film{gap:16px}.reading-section{padding:56px 0;border-top:1px solid var(--line)}.reading-directions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:40px}.reading-directions h3{color:var(--cyan);font-size:24px}.reading-directions span{color:var(--muted);font-size:13px}.reading-journey{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px;margin-top:36px}.reading-journey p{font-size:15px}
.reading-project-nav{display:flex;flex-wrap:wrap;gap:12px 24px;margin-top:36px;max-width:920px}.reading-project-nav a{font-size:14px;min-height:36px;padding:5px 0}.reading-project{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,.88fr);gap:56px;align-items:center;padding:64px 0;border-top:1px solid var(--line);scroll-margin-top:28px}.reading-project-copy{min-width:0}.reading-project h2{margin-bottom:20px}.reading-project-copy>p:not(.reading-lead):not(.reading-signature){font-size:15px}.reading-project-copy .reading-note{font-size:13px;color:var(--muted)}.reading-tags{list-style:none;display:flex;gap:10px 18px;flex-wrap:wrap;padding:0;margin:24px 0;font-size:13px;color:var(--cyan)}.reading .project-visual.project-art{max-width:520px;width:100%;aspect-ratio:1.3;margin:0;opacity:1;transform:none;position:relative;inset:auto}.reading .project-art>svg{height:100%;width:100%}.reading-contact{display:grid;grid-template-columns:minmax(0,1fr) 240px;gap:80px;align-items:center;border-top:1px solid var(--line);padding:64px 0 80px}.reading-contact img{width:240px;height:240px;max-width:100%;background:white;border:10px solid white;border-radius:8px;object-fit:contain}.reading-contact h2{max-width:17em}.reading-contact p{font-size:15px}.reading-contact .reading-links{margin:16px 0}.reading-footer{border-top:1px solid var(--line);font-size:13px;color:var(--muted)}.reading-skip{position:absolute;top:8px;left:12px;z-index:10;padding:8px;background:#122039;transform:translateY(-200%)}.reading-skip:focus{transform:none}
@media(max-width:760px){.reading-header,.reading-footer{padding:20px 24px;gap:18px;flex-wrap:wrap}.reading-header nav{gap:24px}.reading main{padding:22px 24px 0}.reading-hero{padding:36px 0 48px}.reading-section{padding:40px 0}.reading-directions,.reading-journey{grid-template-columns:1fr;gap:24px;margin-top:28px}.reading-directions p{margin-bottom:8px}.reading-project{grid-template-columns:1fr;padding:40px 0;gap:14px}.reading-project .project-visual{max-width:460px;margin:0 auto}.reading-project .reading-links{margin:16px 0}.reading-project-nav{margin-top:24px;gap:10px 20px}.reading-contact{grid-template-columns:1fr;gap:32px;padding:48px 0}.reading-contact img{width:216px;height:216px}.reading-footer{align-items:flex-start}.reading-brand small{margin-left:12px;padding-left:12px}.reading-breadcrumb{font-size:12px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* Each project owns its silhouette and composition. Only lighting and typography are shared. */
.cinema.scene-2 .film-atmosphere { opacity: .12; }
.project-visual.project-art { max-width: 520px; border: 0; background: none; box-shadow: none; border-radius: 0; animation: none; isolation: isolate; overflow: visible; }
.project-visual.project-art::after { content: none; }
.project-art > svg { display: block; width: 100%; height: 100%; overflow: visible; }
.project-art .art-wire { stroke: var(--project-accent); stroke-opacity: .58; stroke-width: 1; }
.project-art .art-wire.faint { stroke-opacity: .18; }
.project-art .art-link { stroke: var(--project-accent); stroke-opacity: .32; stroke-width: 1.1; fill: none; }
.project-art .art-detail { stroke: var(--project-accent); stroke-opacity: .27; stroke-width: 1; }
.project-art .art-bright { stroke: var(--project-accent); stroke-opacity: .96; }
.project-art .art-signal { stroke: #e2f9ff; stroke-opacity: .92; stroke-width: 1.8; fill: none; }
.project-art .art-spark, .project-art .art-dot { fill: var(--project-accent); }
.project-art .art-highlight { fill: var(--project-accent); fill-opacity: .15; stroke: var(--project-accent); stroke-opacity: .55; stroke-width: .8; }
.project-art .art-soft { fill: var(--project-accent); fill-opacity: .07; }
.project-art text { font-family: "PingFang SC", "Microsoft YaHei", sans-serif; font-weight: 400; fill: #d9eaf5; }
.project-art .art-label { font-size: 19px; }
.project-art .art-small { font-size: 14px; }
.project-art .art-caption { font-size: 16px; fill: #b7d0e1; }
.project-art .art-note { font-size: 12px; fill: #9eb5cc; }
.project-art .art-paper-title { font-size: 29px; fill: #e7eaff; }
.project-art .art-code-line { stroke: #a9bfd5; stroke-opacity: .5; stroke-width: 3; stroke-linecap: round; }
.project-art .art-parcel { stroke: var(--project-accent); stroke-opacity: .25; stroke-width: 1; }
.project-art .art-map-road { stroke: #c6f1dd; stroke-opacity: .35; stroke-width: 2.3; }
.project-art .art-headphone-band { stroke: var(--project-accent); stroke-opacity: .82; stroke-width: 13; }
.project-art .art-grid-line { stroke: var(--project-accent); stroke-opacity: .1; stroke-width: .7; }
.project-art .art-candle-up { stroke: #8ae2ef; fill: #8ae2ef; fill-opacity: .6; }
.project-art .art-candle-down { stroke: #ffad87; fill: #ffad87; fill-opacity: .45; }
.project-art .art-strategy { stroke: #eef3ff; stroke-opacity: .85; stroke-width: 1.8; fill: none; }
.project-art .art-gateway-stripe { stroke: var(--project-accent); stroke-opacity: .25; stroke-width: 2; }
@media (max-width: 760px) {
  .project-art .art-wire { stroke-width: 1.3; }
  .project-art .art-label { font-size: 20px; }
  .project-art .art-caption { font-size: 17px; }
}
