@charset "UTF-8";
:root { color-scheme:light; --bg:#fafbfc; --surface:#fff; --line:#d8dcdf; --text:#171a1f; --muted:#616870; --mint:#264ada; --coral:#e05037; --yellow:#dbb946; }
body.preview-page { background:var(--bg); }
.sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.header { background:rgba(250,251,252,.97); border-color:#d8dcdf; }
.header-inner { min-height:68px; }
.header .brand { color:#171a1f; }
.brand-mark { border-radius:0; background:#171a1f; color:#fff; font-size:23px; font-family:Georgia,serif; font-style:italic; }
.header nav a { color:#626970; }
.header nav a[aria-current],.header nav a:hover { color:#171a1f; border-color:#171a1f; }
.preview-status { color:#727981; border-color:#d8dcdf; }
.eyebrow,.field-number { color:#727981; font-size:12px; font-weight:500; }
.button.primary { background:#264ada; border-color:#264ada; color:white; }
.button.primary:hover { background:#153bc4; }
.text-link:hover { color:#171a1f; }
.footer { background:#f0f2f3; }
.footer-bottom { color:#707880; }
.footer .brand-mark { background:#171a1f; color:white; }
dialog { border-color:#d8dcdf; box-shadow:0 20px 80px #10182040; }
.image-action { color:white; }
.product-card { background:none; border:0; border-radius:0; }
.product-image { background:#e7ecef; border:0; border-radius:0; }
.product-card.coral .product-image { background:#f1e6e2; }
.product-card.yellow .product-image { background:#e9ede1; }
.product-info { padding:24px 0; }
.product-card:hover { border:0; }
.release-dot { background:#517369; }
.game-visual { background:#e9edf0; }
.case-row:hover { background:#eef0f2; }
.page-heading h1 { font-size:38px; }
.section-heading h2 { font-size:28px; }
.field-arrow { display:inline-flex; align-items:center; gap:16px; min-height:44px; font-size:14px; border:0; background:none; color:inherit; }
.field-arrow .icon { width:18px; height:18px; transition:transform .2s; }
.field-arrow:hover .icon { transform:translate(2px,-2px); }
.field-arrow:hover { color:#264ada; }
.field-hero { position:relative; isolation:isolate; height:min(660px,calc(100svh - 144px)); min-height:480px; background:#27342f; color:white; overflow:hidden; }
.field-hero-photo { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; object-position:50% 61%; z-index:-3; }
.field-hero-shade { position:absolute; inset:0; background:linear-gradient(180deg,#09110e8c,transparent 30%),linear-gradient(90deg,rgba(9,17,14,.6),rgba(9,17,14,.04) 80%),linear-gradient(0deg,rgba(8,16,13,.6),transparent 65%); z-index:-2; }
.field-hero-top { display:flex; justify-content:space-between; gap:20px; padding-top:26px; color:#f5f5f1; font-size:12px; text-shadow:0 1px 3px #000; }
.field-hero-copy { position:absolute; left:0; right:0; bottom:28px; }
.ink-name { width:min(730px,72%); margin-left:-20px; line-height:0; }
.ink-art { position:relative; display:block; width:100%; aspect-ratio:2048/683; }
.ink-static,.ink-writing { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
.ink-art.is-writing .ink-static { visibility:hidden; }
.field-hero-copy>p { color:#f5f6f4; font-size:17px; font-weight:450; line-height:1.85; margin-top:-5px; }
.field-hero-bottom { border-top:1px solid #ffffff40; margin-top:26px; padding-top:16px; display:flex; align-items:center; gap:28px; }
.field-hero-bottom>a { display:inline-flex; align-items:center; gap:16px; min-height:44px; font-size:14px; }
.field-hero-bottom>a .icon { width:18px; height:18px; }
.field-hero-bottom>a:hover { color:#dbe6ff; }
.ink-replay { margin-left:auto; border:0; background:transparent; color:white; }
.ink-replay:hover { border:0; color:white; background:#ffffff15; }
.field-atlas { background:#181d23; color:#f3f5f7; padding-block:34px 30px; }
.field-atlas h2 { font-size:30px; margin-top:12px; font-weight:500; }
.field-atlas .field-number { color:#aeb7bd; }
.field-atlas-head { display:flex; align-items:end; justify-content:space-between; gap:24px; }
.field-atlas .field-arrow:hover { color:#c8d5ff; }
.field-map-stage { position:relative; aspect-ratio:2.2; min-height:330px; max-height:550px; margin-top:16px; }
.field-map-fallback { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; opacity:.8; }
.field-map-stage.is-ready .field-map-fallback { visibility:hidden; }
.field-map-motion { width:100%; height:100%; position:absolute; inset:0; }
.field-map-bottom { display:flex; align-items:center; justify-content:space-between; gap:24px; padding-block:6px 22px; }
.field-place-meta { display:flex; gap:18px; align-items:center; min-width:0; }
.field-place-meta>span { font-size:15px; }
.field-place-meta>small { font-size:11px; color:#aeb7bd; }
.field-map-actions { display:flex; align-items:center; gap:18px; }
.field-map-actions .icon-button { background:none; color:#e8ecf1; border:1px solid #414851; border-radius:50%; }
.field-place-tabs { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); border-top:1px solid #42474e; }
.field-place-tabs>button { display:flex; align-items:center; gap:20px; padding:18px 20px 4px 0; min-height:82px; background:none; border:0; color:#a4adb6; text-align:left; }
.field-place-tabs>button[aria-pressed="true"] { color:#fff; }
.field-place-tabs>button[aria-pressed="true"] .field-tab-number { color:#d9ef78; }
.field-tab-number { font-size:12px; }
.field-place-tabs>button>span:nth-child(2) { font-size:15px; }
.field-place-tabs small { display:block; color:#a4adb6; font-size:11px; margin-top:2px; }
.field-place-tabs .icon { width:16px; height:16px; margin-left:auto; opacity:.7; }
.field-work { padding-block:62px; }
.field-section-label { display:flex; align-items:center; justify-content:space-between; gap:20px; color:#727981; font-size:12px; padding-bottom:24px; border-bottom:1px solid #d8dcdf; }
.field-work-heading { display:flex; align-items:center; justify-content:space-between; gap:24px; padding-top:30px; }
.field-work-heading h2 { font-size:40px; font-weight:500; }
.field-work-heading p { font-size:12px; margin-top:5px; }
.field-work-copy { color:#414b54; margin:16px 0 30px; font-size:16px; }
.field-memory-image { display:block; width:100%; position:relative; border:0; background:#20272f; padding:28px 48px; overflow:hidden; }
.field-memory-image img { width:100%; max-height:580px; object-fit:contain; }
.field-image-action { display:flex; align-items:center; gap:7px; position:absolute; right:16px; bottom:12px; color:#fff; font-size:11px; background:#20272fdf; padding:4px 8px; }
.field-image-action .icon { width:14px; height:14px; }
.field-work-foot { display:flex; align-items:center; justify-content:space-between; padding-block:12px 28px; color:#727981; font-size:11px; }
.field-work-foot .field-arrow { color:#171a1f; }
.field-app-row { display:flex; align-items:center; gap:24px; min-height:132px; border-top:1px solid #d8dcdf; padding-block:24px; }
.field-row-index { font-size:12px; color:#727981; }
.field-app-row>img { border-radius:12px; width:56px; height:56px; flex:none; }
.field-app-row>div { flex:1; }
.field-app-row h3 { font-size:23px; font-weight:500; }
.field-app-row p { font-size:14px; margin-top:8px; }
.field-app-row .icon-button { border:0; background:none; }
.field-app-row>.field-arrow { margin-left:8px; }
.field-photo-strip { border-block:1px solid #d8dcdf; padding-block:34px 0; }
.field-photo-intro { display:flex; align-items:center; gap:36px; margin-bottom:24px; }
.field-photo-intro h2 { font-size:25px; font-weight:500; }
.field-photo-intro .field-chinese-ink { width:150px; height:76px; object-fit:contain; }
.field-photo-intro .field-number { flex:none; }
.field-photo-intro>h2 { line-height:0; }
.field-photo-intro>.field-arrow { margin-left:auto; }
.field-photo-grid { display:grid; grid-template-columns:1.25fr 1fr 1fr; gap:2px; }
.field-photo { display:block; }
.field-photo>img { width:100%; aspect-ratio:4/3; object-fit:cover; }
.field-photo>span { display:flex; align-items:center; gap:16px; padding:20px 32px; font-size:15px; }
.field-photo>span>small { font-size:11px; color:#727981; }
.field-photo>span .icon { margin-left:auto; width:16px; }
.field-notes { display:grid; grid-template-columns:1fr 1.6fr; gap:80px; padding-block:64px; }
.field-notes h2 { font-size:28px; font-weight:500; margin:12px 0 18px; }
.field-notes p { font-size:14px; }
.field-note-list { border-top:1px solid #d8dcdf; }
.field-note-list>a { min-height:84px; display:flex; align-items:center; justify-content:space-between; gap:20px; border-bottom:1px solid #d8dcdf; font-size:17px; }
.field-note-list>a:hover { color:#264ada; }
.field-note-list .icon { width:18px; }
.field-contact { border-top:1px solid #d8dcdf; padding-block:38px 62px; display:flex; justify-content:space-between; align-items:end; gap:40px; }
.field-contact>p { font-size:16px; color:#414b54; line-height:2; }
.journey-motion { position:absolute; inset:0; width:100%; height:100%; z-index:2; pointer-events:none; }
.journey-play { position:absolute; left:14px; top:14px; z-index:3; background:#0d171ae8; }
.preview-atlas { color-scheme:dark; --bg:#151b21; --surface:#1d272d; --line:#38444d; --text:#edf1f3; --muted:#b2bdc3; --mint:#bfd2ee; }
.preview-atlas .header { background:#fafbfc; }
.preview-atlas .header nav a { border-color:transparent; }
.preview-atlas .header nav a[aria-current] { border-color:#171a1f; }
.preview-atlas .footer { --text:#171a1f; --muted:#616870; --line:#d8dcdf; color:#171a1f; }
.preview-atlas .text-link:hover { color:white; }
.preview-atlas .button.primary,.preview-atlas .atlas-auth-panel button { background:#bfd2ee; border-color:#bfd2ee; color:#182535; }
.preview-atlas .eyebrow { color:#a5b5c3; }
@media(max-width:980px) {
  .field-memory-image { padding:24px; }
  .field-hero .ink-name { width:78%; }
  .field-photo>span { padding:18px; gap:8px; }
  .field-notes { gap:40px; }
}
@media(max-width:700px) {
  .wrap { width:calc(100% - 36px); }
  html { scroll-padding-top:76px; }
  .header-inner { display:flex; min-height:60px; width:calc(100% - 24px); gap:10px; flex-wrap:nowrap; padding-top:0; }
  .header .brand { gap:0; }
  .header .brand>span:not(.brand-mark) { display:none; }
  .header .brand-mark { width:28px; height:28px; font-size:21px; }
  .header nav { margin-left:auto; gap:0; width:auto; border:0; justify-content:start; }
  .header nav a { padding:0 8px; min-width:44px; min-height:44px; font-size:12px; }
  .header nav a .icon { display:none; }
  .preview-status { padding-left:8px; margin-left:0; font-size:10px; gap:0; }
  .preview-status .icon { display:none; }
  .field-hero { height:calc(100svh - 144px); min-height:440px; max-height:740px; }
  .field-hero-top { padding-top:20px; font-size:10px; }
  .field-hero-photo { object-position:62% 50%; }
  .field-hero-shade { background:linear-gradient(180deg,#09110e8c,transparent 30%),linear-gradient(0deg,#0b1913ba,transparent 88%); }
  .field-hero-copy { bottom:24px; }
  .field-hero .ink-name { width:calc(100% + 12px); margin-left:-9px; }
  .field-hero-copy>p { font-size:14px; line-height:1.95; margin-top:10px; }
  .field-hero-bottom { gap:22px; margin-top:24px; padding-top:12px; }
  .field-hero-bottom>a { font-size:12px; gap:10px; }
  .field-atlas { padding-block:26px; }
  .field-atlas h2 { font-size:26px; margin-top:8px; }
  .field-atlas-head { gap:16px; align-items:end; }
  .field-atlas-head>.field-arrow { font-size:11px; gap:8px; }
  .field-map-stage { height:310px; min-height:0; max-height:none; aspect-ratio:auto; margin-top:4px; }
  .field-map-bottom { display:block; padding-block:0 12px; }
  .field-place-meta { gap:12px; }
  .field-place-meta>span { font-size:14px; }
  .field-map-actions { margin-top:14px; justify-content:space-between; }
  .field-map-actions .field-arrow { font-size:12px; }
  .field-place-tabs>button { gap:9px; padding-right:8px; min-height:74px; }
  .field-place-tabs>button>span:nth-child(2) { font-size:12px; }
  .field-place-tabs .icon { display:none; }
  .field-place-tabs small { font-size:10px; }
  .field-tab-number { font-size:10px; }
  .field-work { padding-block:38px; }
  .field-section-label { font-size:11px; padding-bottom:18px; }
  .field-work-heading { padding-top:24px; }
  .field-work-heading h2 { font-size:32px; }
  .field-work-heading .field-arrow { font-size:12px; gap:8px; }
  .field-work-copy { font-size:14px; margin:14px 0 24px; }
  .field-memory-image { padding:12px; }
  .field-memory-image>img { min-height:180px; }
  .field-image-action { right:6px; bottom:4px; font-size:9px; }
  .field-app-row { gap:14px; flex-wrap:wrap; position:relative; min-height:126px; padding:20px 0; }
  .field-row-index { display:none; }
  .field-app-row>img { width:44px; height:44px; border-radius:10px; }
  .field-app-row>div { min-width:0; flex:1; padding-right:48px; }
  .field-app-row h3 { font-size:20px; }
  .field-app-row p { font-size:12px; }
  .field-app-row>.icon-button { position:absolute; top:20px; right:0; }
  .field-app-row>.field-arrow { margin:0 0 0 58px; font-size:12px; }
  .field-photo-intro { display:grid; grid-template-columns:1fr auto; gap:10px; }
  .field-photo-intro>.field-number { grid-column:1/-1; }
  .field-photo-intro h2 { font-size:21px; }
  .field-photo-intro .field-chinese-ink { width:124px; height:62px; }
  .field-photo-intro .field-arrow { font-size:11px; gap:8px; }
  .field-photo-grid { grid-template-columns:1fr 1fr; gap:2px; }
  .field-photo:first-child { grid-column:1/-1; }
  .field-photo:first-child>img { aspect-ratio:16/10; }
  .field-photo>span { flex-wrap:wrap; padding:12px 18px 20px; gap:8px; font-size:12px; }
  .field-photo>span>small { font-size:10px; }
  .field-photo>span .icon { display:none; }
  .field-notes { grid-template-columns:1fr; gap:26px; padding-block:38px; }
  .field-notes h2 { font-size:24px; margin-bottom:12px; }
  .field-notes p>br { display:none; }
  .field-note-list>a { font-size:14px; min-height:72px; }
  .field-contact { display:block; padding-block:28px 38px; }
  .field-contact>p { font-size:14px; margin-bottom:16px; }
  .footer { padding:28px 18px 22px; }
  .page-heading { padding-top:32px; }
  .page-heading h1 { font-size:30px; }
}
@media(max-width:360px) {
  .header-inner { width:calc(100% - 16px); gap:6px; }
  .header nav a { padding:0 4px; }
  .preview-status { padding-left:4px; }
  .field-hero-bottom { gap:16px; }
  .field-hero-bottom>a { font-size:11px; }
  .field-hero-copy>p { font-size:13px; }
  .field-place-tabs>button>span:nth-child(2) { font-size:11px; }
  .field-photo-intro h2 { font-size:19px; }
}
@media(max-height:600px) and (min-width:701px) {
  .field-hero { height:calc(100svh - 100px); min-height:270px; }
  .field-hero-top { padding-top:12px; }
  .field-hero-copy { bottom:12px; }
  .field-hero .ink-name { width:380px; }
  .field-hero-copy>p { font-size:13px; }
  .field-hero-copy>p>br { display:none; }
  .field-hero-bottom { margin-top:10px; padding-top:2px; }
}
@media(prefers-reduced-motion:reduce) {
  .field-arrow .icon { transition:none; }
  .ink-writing { display:none !important; }
  .ink-art.is-writing .ink-static { visibility:visible; }
  .journey-motion { display:none; }
}
