@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Mono:ital,wght@0,300;0,400;0,600;1,400&family=Cormorant+Garamond:ital,wght@0,500;0,600;1,500&display=swap');
/* lotus at dawn — palette + full styles (base.css/components.css retired) */
:root { --dawn1:#f7ede2; --dawn2:#f2e2d0; --rose:#b46a5a; --ink:#4a4038; --faint:#9b8b7c; --teal:#04655f; --card:#fffcf7; --border:#e6d5c4; }
* { box-sizing:border-box; margin:0; }
html { scroll-behavior:smooth; }
body { background:linear-gradient(180deg, var(--dawn1) 0%, var(--dawn2) 60%, #f7ede2 100%); color:var(--ink); font-family:"Noto Sans Mono",ui-monospace,Menlo,monospace; font-size:13.5px; line-height:1.85; min-height:100vh; }
.wrap { max-width:1080px; margin:0 auto; padding:70px 24px 100px; }
a { color:var(--teal); text-decoration:none; }
a:hover { text-decoration:underline; }
.hero { text-align:center; }
.hero svg { width:180px; height:auto; display:block; margin:0 auto 18px; }
.hero svg path { stroke:var(--rose); fill:none; stroke-width:2.4; stroke-linecap:round; }
.hero .en { font-size:13px; letter-spacing:.42em; color:var(--ink); }
.hero .ety { font-family:"Cormorant Garamond",Georgia,serif; font-style:italic; font-size:19px; color:var(--faint); margin-top:10px; }
.hero .zh { font-family:"Cormorant Garamond",Georgia,serif; font-size:30px; color:var(--rose); margin-top:26px; }
.hero .tag { font-size:12px; color:var(--faint); margin-top:8px; letter-spacing:.14em; }
.pro { margin:60px auto 0; max-width:480px; text-align:center; }
.pro .who { font-size:15.5px; font-weight:600; }
.pro .what { font-size:12.5px; color:var(--faint); margin-top:8px; }
.pro .links { margin-top:14px; font-size:12px; }
.pro .links a { margin:0 7px; }
h2 { font-family:"Cormorant Garamond",Georgia,serif; font-size:26px; font-weight:600; text-align:center; margin:84px 0 10px; color:var(--ink); }
h2 + .sub { text-align:center; font-size:12px; color:var(--faint); margin-bottom:26px; }
.pager { display:flex; justify-content:center; gap:6px; margin:-8px 0 22px; }
.pager button { min-width:88px; padding:5px 14px; color:var(--faint); font:600 11px/1.5 "Noto Sans Mono",ui-monospace,Menlo,monospace; background:rgba(255,252,247,.58); border:1px solid var(--border); border-radius:999px; cursor:pointer; }
.pager button:hover { color:var(--ink); border-color:#d8bba9; }
.pager button[aria-selected="true"] { color:#fffcf7; background:var(--rose); border-color:var(--rose); }
.page-panel[hidden] { display:none; }
.projects { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:18px; }
.project .banner { display:block; width:100%; aspect-ratio:1280/360; object-fit:cover; border-radius:9px; border:1px solid var(--border); margin-bottom:16px; }
.project { position:relative; display:block; background:var(--card); border:1.5px solid var(--border); border-radius:12px; padding:18px 18px 20px; transition:border-color .25s ease, transform .25s ease, box-shadow .25s ease; }
.project:hover { border-color:var(--rose); transform:translateY(-3px); box-shadow:0 14px 40px rgba(180,106,90,.14); }
.project:focus { outline:2px solid var(--rose); outline-offset:4px; }
.project .cover { position:absolute; inset:0; z-index:1; border-radius:12px; }
.project .top { display:flex; justify-content:space-between; align-items:baseline; gap:14px; }
.project h3 { font-family:"Cormorant Garamond",Georgia,serif; font-size:23px; font-weight:600; color:var(--ink); }
.project .url { font-size:11.5px; color:var(--teal); white-space:nowrap; }
.project p { font-size:12.5px; color:var(--faint); margin-top:8px; line-height:1.75; }
.project .proofs { margin-top:14px; display:flex; gap:8px; flex-wrap:wrap; align-items:center; position:relative; z-index:2; }
.project .proofs span, .project .proofs a { font-size:10.5px; color:var(--rose); border:1px solid #e0c4b6; border-radius:99px; padding:2px 11px; background:var(--card); }
.project .proofs a { cursor:pointer; transition:all .2s ease; }
.project .proofs a:hover { background:var(--rose); color:#fffcf7; text-decoration:none; border-color:var(--rose); }
.quote { font-family:"Cormorant Garamond",Georgia,serif; font-style:italic; font-size:26px; line-height:1.6; text-align:center; color:#6a5a4c; margin-top:20px; }
.quote-src { text-align:center; font-size:11.5px; color:var(--faint); margin-top:8px; }
.gifts { max-width:520px; margin:0 auto; display:grid; gap:14px; }
.gift { background:var(--card); border:1.5px solid var(--border); border-radius:12px; padding:18px 20px; }
.gift .label { font-size:11px; letter-spacing:.18em; color:var(--rose); margin-bottom:8px; }
.gift .addr { display:flex; align-items:center; justify-content:space-between; gap:12px; cursor:pointer; }
.gift .addr code { font-size:10.8px; word-break:break-all; color:var(--ink); background:#f4e6d6; padding:4px 10px; border-radius:6px; line-height:1.6; }
.gift .addr:hover code { background:#eed9c4; }
.gifts .why { text-align:center; font-size:11.5px; color:var(--faint); margin-top:6px; }
footer { margin-top:90px; text-align:center; font-size:11.5px; color:var(--faint); }
footer a { color:var(--faint); margin:0 6px; }
/* modals — lotus styling */
#modal { position:fixed; inset:0; z-index:50; display:none; align-items:center; justify-content:center; padding:18px; background:rgba(74,64,56,.48); backdrop-filter:blur(4px); }
#modal.open { display:flex; }
.modal-card { position:relative; width:min(100%, 390px); max-height:calc(100vh - 36px); overflow:auto; padding:28px clamp(20px, 7vw, 38px) 30px; text-align:center; background:linear-gradient(180deg,#fff8ef 0%,#f3e2d0 100%); border:1.5px solid var(--rose); border-radius:16px; box-shadow:0 30px 80px rgba(74,64,56,.34); }
.modal-card svg { display:block; width:106px; height:auto; margin:0 auto 10px; }
.modal-card svg path { stroke:var(--ink); fill:none; stroke-width:2.8; stroke-linecap:round; }
.modal-card h3 { margin:4px 0 0; color:var(--ink); font-size:13px; font-weight:600; letter-spacing:.08em; text-transform:uppercase; }
#qr-box { width:min(100%, 236px); margin:18px auto 0; padding:14px; background:#fff; border:1px solid rgba(74,64,56,.1); border-radius:10px; box-shadow:inset 0 0 0 1px rgba(255,255,255,.8); }
#qr-box img { display:block; width:100%; height:auto; }
.modal-card .addr { margin:14px auto 0; padding:7px 9px; color:#7c6d61; font-size:9.5px; line-height:1.55; word-break:break-all; cursor:pointer; background:rgba(255,252,247,.62); border:1px solid rgba(230,213,196,.78); border-radius:8px; }
.modal-card .addr:hover { color:var(--ink); border-color:rgba(180,106,90,.55); }
.modal-card .hint { margin-top:10px; color:var(--faint); font-size:10.5px; }
#modal-close { position:absolute; top:12px; right:12px; display:grid; place-items:center; width:28px; height:28px; padding:0; color:var(--ink); background:rgba(255,252,247,.7); border:1px solid rgba(180,106,90,.5); border-radius:999px; cursor:pointer; line-height:1; }
#modal-close:hover { color:#fffcf7; background:var(--rose); border-color:var(--rose); }

.cv-actions a { color:var(--teal); margin:0 10px; }
.nl-wrap, .nl-badge, .nl-card { display:none !important; visibility:hidden !important; pointer-events:none !important; }
@media (prefers-reduced-motion: reduce) { .project, .project:hover { transition:none; transform:none; } }
@media (max-width: 780px) { .wrap { max-width:680px; } .projects { grid-template-columns:1fr; } }
/* retired — all styles live in theme.css (lotus design) */
/* retired — all styles live in theme.css (lotus design) */