:root{--bg:#fbfaf7;--ink:#1f1d1b;--muted:#6f6a64;--line:#d6d0c6;--accent:#1f1d1b}
*{box-sizing:border-box}html{color-scheme:light;overflow-x:hidden}body{overflow-x:hidden}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.7 Inter,system-ui,sans-serif;-webkit-font-smoothing:antialiased;position:relative}
header,main,footer{position:relative;z-index:1}
.wrap{max-width:680px;margin:0 auto;padding:0 24px}a{color:var(--ink);text-decoration:underline;text-decoration-color:var(--line);text-underline-offset:3px}a:hover{text-decoration-color:var(--ink)}
h1,h2,h3,.logo{font-family:"Cormorant Garamond",Georgia,serif;font-weight:500;font-style:italic;letter-spacing:-.01em}h1{font-size:2.8rem;line-height:1.1;margin:0 0 .6em}h2{font-size:1.7rem;margin:3.2rem 0 1rem}
.nav{display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px;padding-top:36px;padding-bottom:36px}.logo{font-size:1.5rem;text-decoration:none}nav a{margin-left:22px;color:var(--muted);font-size:.8rem;text-decoration:none;letter-spacing:.04em;text-transform:lowercase}nav a[aria-current],nav a:hover{color:var(--ink)}.nav nav a:first-child{margin-left:0}
main{min-height:60vh;padding-top:32px}.lede{font-size:1.05rem;color:#3d3a37}.muted{color:var(--muted);font-style:italic}
.list{list-style:none;padding:0;margin:0}.list li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--line)}.list span{color:var(--muted);font-size:.85rem;white-space:nowrap}
.meta{color:var(--muted);font-size:.85rem;margin:0}.prose img{max-width:100%;height:auto}.prose a{word-break:break-word}.orig{margin-top:3rem;padding-top:1rem;border-top:1px solid var(--line);color:var(--muted);font-size:.9rem}
.todo{border:1px dashed var(--muted);border-radius:8px;padding:20px 22px;color:#4a4642;background:rgba(255,255,255,.5)}
footer{margin-top:96px;padding-top:28px;padding-bottom:48px;border-top:1px solid var(--line);color:var(--muted);font-size:.8rem}footer nav a{margin:0 18px 0 0}
.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:16px;margin:2.5rem 0 .6rem}.stat{background:rgba(255,255,255,.55);border:1px solid var(--line);border-radius:10px;padding:24px}.stat b{display:block;font:italic 500 2.6rem/1 "Cormorant Garamond",Georgia,serif;margin-bottom:8px}.stat span{color:var(--muted);font-size:.88rem}
.form{display:grid;gap:16px;max-width:440px}.form label{display:grid;gap:6px;font-size:.85rem;color:var(--muted)}.form input,.form select{font:inherit;color:var(--ink);padding:10px 12px;border:1px solid var(--line);border-radius:6px;background:#faf8f4}.form input:focus,.form select:focus{outline:none;border-color:var(--ink)}.form button{justify-self:start;font:500 .9rem Inter,sans-serif;background:var(--ink);color:#f5f2ec;border:0;border-radius:999px;padding:11px 24px;cursor:pointer}.hp{display:none}
/* home */
.home .wrap{max-width:860px}.home footer{margin-top:120px}
.masthead{text-align:center;padding:48px 0 88px}
@media(prefers-reduced-motion:reduce){}
.title{font-size:clamp(3.4rem,8vw,6rem);margin:0;line-height:1}.title sup{font:500 .9rem Inter,sans-serif;font-style:normal;letter-spacing:.08em;vertical-align:.9em;margin-left:14px}.tag{font-size:.68rem;letter-spacing:.06em;color:var(--muted);margin:8px 0 0}
.spread{border-top:1px solid var(--line);padding-top:56px}



.blocks{display:grid;grid-template-columns:1fr 1fr;gap:56px 72px}.blk h2{font-size:2rem;margin:0 0 10px;display:flex;align-items:flex-end;gap:10px}.blk h3{font-size:1.2rem;margin:18px 0 4px}
.blk p{font-size:.88rem;line-height:1.65;margin:0 0 12px;color:#3d3a37}.blk small{display:block;font-size:.65rem;color:var(--muted)}.blk b{display:block;font-weight:600;color:var(--ink)}
.about{}
.bar{font-size:.75rem;display:grid;grid-template-columns:auto 1fr;gap:4px 12px;align-items:center}.bar i{height:9px;border:1px solid var(--ink);border-radius:9px;background:linear-gradient(90deg,var(--ink) var(--p),transparent 0)}.bar em{grid-column:2;font-size:.65rem;color:var(--muted);font-style:normal}
.find a{margin-right:12px}
@media(max-width:820px){.blocks{gap:44px}.masthead{padding:24px 0 56px}.spread{grid-template-columns:1fr}.blocks{grid-template-columns:1fr}.about{grid-row:auto}}
@media(max-width:560px){h1{font-size:2.2rem}.nav nav a{margin-left:12px}.list li{flex-direction:column;gap:2px}.stats{grid-template-columns:1fr}}
.cjk{font-family:"Noto Serif TC","Songti TC","PMingLiU",serif;font-size:.85rem;letter-spacing:.18em;color:var(--ink)}
/* travel */
.travel .wrap{max-width:1180px}.sample-note{font:400 .72rem "IBM Plex Mono",monospace;color:var(--muted);margin:0 0 8px}
.tv{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:40px;align-items:center;min-height:620px}
.wheel{position:relative;height:620px;overflow:hidden;cursor:grab;touch-action:none;outline:none;user-select:none;-webkit-mask-image:linear-gradient(transparent,#000 14%,#000 86%,transparent);mask-image:linear-gradient(transparent,#000 14%,#000 86%,transparent)}.wheel:active{cursor:grabbing}
.wheel:focus-visible .dot{box-shadow:0 0 0 4px rgba(58,91,217,.18)}
.dot{position:absolute;left:84px;top:50%;width:11px;height:11px;margin-top:-5.5px;border-radius:50%;background:#3a5bd9}
.arc{position:absolute;left:120px;top:50%}
.city{position:absolute;left:0;top:0;margin-top:-.8em;white-space:nowrap;transform-origin:0 50%;background:none;border:0;padding:2px 0;font:400 1.02rem/1.3 "IBM Plex Mono",ui-monospace,monospace;color:var(--ink);cursor:pointer;will-change:transform}
.city.on{font-weight:500}
.photos h2{font:400 .85rem "IBM Plex Mono",monospace;font-style:normal;margin:0 0 16px;color:var(--muted)}
.grid{display:grid;grid-template-columns:repeat(2,1fr);grid-auto-rows:250px;gap:12px;transition:opacity .18s ease}.grid.fade{opacity:0}.grid[data-n="3"] figure:first-child{grid-row:span 2}
.grid figure{margin:0}.grid img{width:100%;height:100%;object-fit:cover;display:block;border-radius:4px}.grid[data-n="3"] figure:first-child img{aspect-ratio:auto}
.grid figcaption{font:400 .7rem "IBM Plex Mono",monospace;color:var(--muted);margin-top:6px}
@media(max-width:820px){.tv{grid-template-columns:1fr;gap:16px}.wheel{height:400px}.arc{left:64px}.dot{left:30px}.grid{grid-auto-rows:190px}.city{font-size:.9rem}}
@media(prefers-reduced-motion:reduce){.grid{transition:none}}