
:root{color-scheme:dark;--ink:#d6d8cc;--muted:#94a69a;--line:#31453a;--night:#07130d;font-family:Arial,"Microsoft JhengHei",sans-serif;background:var(--night);color:var(--ink)}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0}body:before{content:"";position:fixed;inset:0;background:url("assets/hk-grain.svg");opacity:.13;pointer-events:none;z-index:8}a{color:inherit;text-underline-offset:4px}button,input,select{font:inherit}button,a,input,select,summary{-webkit-tap-highlight-color:transparent}button,summary{cursor:pointer}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid #bdd4db;outline-offset:5px}[hidden]{display:none!important}.site-header,main,footer{max-width:1240px;margin:auto;padding-left:42px;padding-right:42px}.site-header{display:flex;align-items:center;justify-content:space-between;gap:22px;padding-top:24px;padding-bottom:23px;border-bottom:1px solid var(--line)}.brand{display:block;max-width:330px}.brand img{display:block;width:100%;height:auto}.site-header nav{display:flex;flex-wrap:wrap;gap:28px;font-size:12px}.site-header nav a{text-decoration:none}.skip-link{position:absolute;top:-100px;left:18px;padding:12px;background:#07130d;z-index:9}.skip-link:focus{top:12px}.opening{display:flex;justify-content:space-between;gap:32px;align-items:center;padding:72px 0 56px}.eyebrow,.section-heading>span{font:10px/1.5 Consolas,monospace;letter-spacing:2px;color:#a9b6a8}.opening h1{font-size:clamp(38px,5.5vw,72px);line-height:1.02;letter-spacing:-2px;font-weight:400;margin:24px 0}.intro{max-width:540px;line-height:1.7;font-size:16px;color:#abb8ad}.opening-aside{font-family:"PMingLiU","Microsoft JhengHei",serif;font-size:28px;letter-spacing:5px;color:#83968a;writing-mode:vertical-rl;line-height:1.8;margin-right:25px}.opening-aside span{writing-mode:horizontal-tb;font:11px/1.8 Consolas,monospace;letter-spacing:.6px;display:block;margin-top:20px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:28px}.button{display:inline-block;padding:13px 20px;border:1px solid #526456;text-decoration:none;font-size:12px;letter-spacing:.3px;background:#17271c}.button:hover{background:#253a2a}.primary{background:#d1d2bb;color:#122118;border-color:#d1d2bb}.primary:hover{background:#e4e3d0}.release-note,.small-note{font-size:11px;color:#96a99a;line-height:1.8}.section-heading{display:flex;justify-content:space-between;align-items:baseline;gap:20px;margin-bottom:22px}h2{font-size:clamp(26px,3vw,38px);font-weight:400;letter-spacing:-.6px;margin:0}.frame{position:relative;aspect-ratio:2.15;overflow:hidden;background:#07130d;border:1px solid #344d3c;isolation:isolate}.scene{display:block;width:100%;height:100%;object-fit:cover;filter:brightness(.7)}.frame-label{position:absolute;top:20px;left:22px;font:9px Consolas,monospace;color:#b6beac;letter-spacing:1.5px}#subtitle-demo{position:absolute;inset:0}.frame-caption{display:flex;gap:18px;align-items:baseline;justify-content:space-between;margin:15px 0 22px}.frame-caption strong{font-size:15px;font-weight:400;color:#d9ddcf}.frame-caption span{font-size:11px;color:#9aac9b}.featured-prints{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.print-choice{text-align:left;border:1px solid #354d3c;background:#0d1e13;padding:18px 16px;color:#cbd2c4}.print-choice[aria-pressed="true"]{border-color:#c9cbb7;background:#233224}.print-choice strong{display:block;font-size:17px;font-weight:400;margin-bottom:7px}.print-choice span{font-size:11px;color:#98aa98;line-height:1.6;display:block}.demo-controls{display:grid;grid-template-columns:1.4fr 1fr;gap:44px;margin:26px 0 20px;padding:22px 0;border-top:1px solid var(--line)}.demo-controls label{font-size:12px}.demo-controls output{float:right;color:#cbd5ca}.demo-controls input{display:block;width:100%;accent-color:#bfcbb9;margin:20px 0 9px}.endpoints{display:flex;justify-content:space-between;color:#8da18f;font-size:10px}.demo-controls select{width:100%;padding:11px;background:#12251a;border:1px solid #4a624e;color:#d5ddcf;margin-top:12px}.all-prints{border-bottom:1px solid var(--line);padding-bottom:18px}.all-prints summary{font-size:12px;list-style:none;display:flex;justify-content:space-between;padding:13px 0}.all-prints-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:16px}.all-prints-grid .print-choice{padding:14px;font-size:12px}.how{padding:70px 0}.how ol{list-style:none;display:grid;grid-template-columns:repeat(3,1fr);gap:34px;padding:25px 0 8px;margin:0}.how li{border-top:1px solid var(--line);padding-top:20px}.how li>span{font:12px Consolas,monospace;color:#8ba38f}.how h3{font-size:19px;font-weight:400;margin:16px 0 10px}.how li p{font-size:13px;line-height:1.8;color:#9bb09e}.support-project{display:grid;grid-template-columns:1fr 1fr;gap:28px 64px;padding:54px 0;border-top:1px solid #52624e;border-bottom:1px solid #52624e}.support-project .eyebrow{grid-column:1/-1;margin:0}.support-project h2{font-size:clamp(34px,4.5vw,57px);line-height:1.1}.support-copy p{font-size:14px;color:#a9baa8;line-height:1.8;margin-top:0}.support-copy .small-note{font-size:11px}.questions{padding:64px 0}.questions h2{font-size:27px;margin-bottom:25px}.questions details{border-bottom:1px solid var(--line);padding:18px 0;max-width:900px}.questions summary{font-size:14px}.questions details p{font-size:13px;color:#a0b19f;line-height:1.8;max-width:740px}footer{display:flex;justify-content:space-between;gap:20px;flex-wrap:wrap;border-top:1px solid var(--line);padding-top:23px;padding-bottom:35px;font-size:11px;color:#98aa98}footer div{display:flex;gap:22px}footer p{width:100%;font-size:10px;color:#748d78;margin:0}.document{max-width:940px;padding-top:54px;padding-bottom:70px}.document h1{font-size:38px;font-weight:400}.document h2{font-size:23px;margin:30px 0 12px}.document p,.document li{color:#abbcac;font-size:14px;line-height:1.9}.document ol{padding-left:22px}@media(max-width:750px){.site-header,main,footer{padding-left:20px;padding-right:20px}.site-header{align-items:flex-start;flex-direction:column}.brand{max-width:300px}.site-header nav{gap:22px;font-size:11px}.opening{padding-top:44px}.opening-aside{display:none}.opening h1{font-size:49px}.section-heading{align-items:flex-start;flex-direction:column;gap:6px}.frame{aspect-ratio:1.7}.frame-label{font-size:7px;top:12px;left:12px}.frame-caption{display:block}.frame-caption span{display:block;line-height:1.6;margin-top:6px}.featured-prints{grid-template-columns:1fr}.print-choice{padding:14px 16px}.featured-prints .print-choice strong{font-size:16px;display:inline-block;margin-right:14px}.featured-prints .print-choice span{display:inline}.demo-controls{grid-template-columns:1fr;gap:22px}.all-prints-grid{grid-template-columns:1fr 1fr}.how{padding:45px 0}.how ol{grid-template-columns:1fr;gap:16px}.support-project{grid-template-columns:1fr;gap:22px}.questions{padding:45px 0}footer{line-height:1.7}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

.tip-currency{font-size:11px!important;letter-spacing:1px;text-transform:uppercase}.tip-amounts{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;margin:18px 0}.tip{text-align:center;padding:15px 12px;font-size:18px;min-width:0}.tip[aria-expanded="true"]{border-color:#c9cbb7;background:#233224}.other-amount-form{margin:16px 0}.other-amount-form label{display:block;font-size:12px;margin-bottom:8px}.other-amount-form>div{display:flex;gap:10px}.other-amount-form input{width:125px;min-width:0;padding:11px;background:#12251a;border:1px solid #4a624e;color:#d5ddcf}.feedback-section{padding:60px 0;border-bottom:1px solid var(--line)}.feedback-section>p{font-size:14px;color:#a9baa8}.feedback-section form{max-width:720px}.feedback-section label{display:block;font-size:12px;margin:18px 0 8px}.feedback-section select,.feedback-section textarea{width:100%;padding:12px;background:#12251a;border:1px solid #4a624e;color:#d5ddcf;font:inherit}.feedback-section textarea{resize:vertical;line-height:1.7}.feedback-section button:disabled{opacity:.4;cursor:not-allowed}.feedback-section textarea:focus-visible{outline:2px solid #bdd4db;outline-offset:4px}@media(max-width:500px){.tip{font-size:16px;padding:14px 7px}.other-amount-form>div{flex-wrap:wrap}.feedback-section{padding:40px 0}}

/* Compact tip jar at the top; every print stays visible. */
.site-header:has(.top-tip){display:grid;grid-template-columns:minmax(250px,1fr) auto;gap:14px 32px}.site-header:has(.top-tip)>nav{grid-column:1;grid-row:2}.top-tip{grid-column:2;grid-row:1/3;width:260px;padding:12px 15px;border:1px solid #425644;background:#0c1e12}.top-tip-title{font-size:11px;color:#cbd4c3}.top-tip .tip-currency{display:inline;margin-left:9px;font-size:9px!important;color:#94a58f;letter-spacing:0;text-transform:none}.top-tip .tip-amounts{margin:10px 0 0;gap:6px}.top-tip .tip{font-size:14px;padding:9px 7px;line-height:1}.top-tip #payment-note{font-size:9px;line-height:1.5;margin:9px 0 0}.top-tip .other-amount-form{margin:12px 0 0}.top-tip .other-amount-form>div{flex-wrap:wrap}.top-tip .other-amount-form input{width:100%}.top-tip .other-amount-form button{font-size:11px;padding:9px;width:100%}.old-joke{display:block;color:#859a88;font-size:13px;margin-top:8px}.all-prints h3{font-size:16px;font-weight:400;margin:12px 0 18px}.all-prints-grid{margin-top:0}.all-prints-grid .print-choice strong{font-size:16px;line-height:1.4;margin:0}.all-prints-grid .print-choice{min-height:68px}.opening{padding-top:48px}@media(max-width:750px){.site-header:has(.top-tip){grid-template-columns:1fr;gap:15px}.site-header:has(.top-tip)>nav{grid-column:1;grid-row:2}.top-tip{grid-column:1;grid-row:3;width:100%;max-width:360px}.top-tip #payment-note{max-width:310px}.all-prints-grid{grid-template-columns:1fr 1fr}}

.demo-controls{grid-template-columns:1fr;max-width:620px}.frame-caption{justify-content:flex-start}

.bottom-tip{max-width:420px;padding:18px 20px;border:1px solid #425644;background:#0c1e12}.bottom-tip .small-note{font-size:11px;line-height:1.5}.bottom-tip .tip-amounts{margin:12px 0}.bottom-tip .top-tip-title{font-size:14px}
