
/* Cross Border Notes · jade / ink / champagne. */
:root[data-theme]{
 --ui-bg:#f5f7f5;--ui-panel:#fff;--ui-soft:#edf3ef;--ui-text:#183830;--ui-muted:#62766e;--ui-line:#d9e4dd;
 --ui-accent:#16674f;--ui-glow:#51c59d24;--ui-shadow:0 12px 40px #18383007;--ui-on:#fff;
 --ink:var(--ui-text);--muted:var(--ui-muted);--paper:var(--ui-bg);--line:var(--ui-line);--green:var(--ui-accent);--purple:var(--ui-accent);color-scheme:light;
}
:root[data-theme="dark"]{
 --ui-bg:#0b1518;--ui-panel:#111f23;--ui-soft:#192b2e;--ui-text:#e3eee8;--ui-muted:#9aafa7;--ui-line:#293e40;
 --ui-accent:#8cdec0;--ui-glow:#72dcbf1a;--ui-shadow:0 12px 40px #0002;--ui-on:#102b24;color-scheme:dark;
}
html[data-theme] body{background:var(--ui-bg);color:var(--ui-text);-webkit-font-smoothing:antialiased}
html[data-theme] body:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 12% 0,var(--ui-glow),transparent 55%)}
html[data-theme] ::selection{background:#69caa873;color:var(--ui-text)}
html[data-theme] :focus-visible{outline:2px solid var(--ui-accent);outline-offset:4px}
html[data-theme] .topbar,html[data-theme] .site-nav{min-height:83px;gap:16px}
html[data-theme] .brand,html[data-theme] .site-brand{color:var(--ui-text);letter-spacing:.06em}
html[data-theme] .mark{background:#143e35;border:1px solid #79b59e55;box-shadow:inset 0 1px 0 #ffffff25}
.theme-tools{display:flex;align-items:center;gap:10px;margin-left:auto}
.theme-toggle{display:inline-flex;align-items:center;justify-content:center;gap:7px;height:38px;min-width:38px;padding:0 12px;border:1px solid var(--ui-line)!important;border-radius:30px;background:var(--ui-panel)!important;color:var(--ui-text)!important;cursor:pointer;font:500 12px system-ui,sans-serif;transition:transform .2s,border-color .2s;box-shadow:0 3px 12px #00000004;flex-shrink:0}
.theme-toggle svg{width:16px;height:16px;stroke:currentColor;fill:none;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}
.theme-toggle:hover{transform:translateY(-2px);border-color:var(--ui-accent)!important}
:root[data-theme="light"] .theme-toggle .sun,:root[data-theme="dark"] .theme-toggle .moon{display:none}
html[data-theme] .site-nav>a:last-of-type{margin-left:auto;color:var(--ui-muted)}
html[data-theme] .site-nav .theme-tools{margin-left:0}
html[data-theme] footer{color:var(--ui-muted);border-color:var(--ui-line)}
/* A luminous title and a living route diagram, rather than a full-screen intro. */
html[data-theme] .hero{min-height:412px;padding:53px 48px;border:1px solid #547d6c55;border-radius:24px;background:#0d2529;box-shadow:0 20px 70px #12362b16;grid-template-columns:1.05fr 1fr;gap:12px}
html[data-theme] .hero:after{inset:-30%;background:radial-gradient(ellipse at 76% 35%,#3e9e7950,transparent 40%),radial-gradient(ellipse at 25% 90%,#a67e3e23,transparent 40%);animation:ambient-drift 16s ease-in-out infinite alternate}
.hero-copy{position:relative;z-index:1}
html[data-theme] .hero .eyebrow{display:flex;align-items:center;gap:9px;font-size:11px;letter-spacing:.17em;color:#b6d0c2}
.hero .eyebrow:before{content:"";width:6px;height:6px;border-radius:50%;background:#94dfb9;box-shadow:0 0 14px #94dfb955}
html[data-theme] .hero h1{font-size:clamp(44px,5.4vw,68px);font-weight:800;line-height:1.3;letter-spacing:.055em;margin:20px 0 19px;white-space:nowrap}
html[data-theme] .hero h1 .title-foil{color:#eff8ec;background:linear-gradient(110deg,#f2f8ed 15%,#f2f8ed 30%,#8bdfc1 44%,#e6c492 53%,#f2f8ed 67%);background-size:240% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;animation:title-sheen 5s ease-in-out infinite}
html[data-theme] .hero h1 .title-dot{display:inline-block;color:#e8bc7b;text-shadow:0 0 28px #e8bc7b30;margin-left:0;letter-spacing:0}
.hero-caption{font:10px/1.5 ui-monospace,Consolas,monospace;letter-spacing:.27em;color:#89aa9c;margin:0 0 14px}
html[data-theme] .hero p{font-size:15px;color:#bdd0c6;max-width:340px}
html[data-theme] .hero .actions{margin-top:28px}
html[data-theme] .hero .button{border:1px solid #a4ceb450;border-radius:30px;padding:11px 20px;background:#dfeee3;color:#163d31;box-shadow:0 4px 24px #7dc49c16;transition:transform .2s,box-shadow .2s}
html[data-theme] .hero .button:hover{transform:translateY(-2px);box-shadow:0 8px 30px #7dc49c35}
html[data-theme] .route-map{height:auto;width:100%;max-height:320px;overflow:visible;filter:drop-shadow(0 12px 28px #0002)}
.map-caption{font-family:ui-monospace,Consolas,monospace!important}
.map-ring{transform-origin:242px 160px;animation:orbit 60s linear infinite}
.map-ring-reverse{animation-direction:reverse;animation-duration:85s}
.route-flow{stroke-dasharray:3 11;animation:route-flow 16s linear infinite}
.route-signal{stroke-dasharray:12 360;animation:route-signal 5s linear infinite}
.map-pulse{transform-box:fill-box;transform-origin:center;animation:map-pulse 4s ease-out infinite}
.map-pulse.second{animation-delay:2s}
.map-star{animation:map-star 5s ease-in-out infinite alternate}
@keyframes title-sheen{0%,20%{background-position:100% 0}65%,100%{background-position:0 0}}
@keyframes ambient-drift{to{transform:translate(3%,-3%) rotate(8deg)}}
@keyframes orbit{to{transform:rotate(360deg)}}
@keyframes route-flow{to{stroke-dashoffset:-168}}
@keyframes route-signal{from{stroke-dashoffset:360}to{stroke-dashoffset:-12}}
@keyframes map-pulse{0%{transform:scale(.75);opacity:.7}80%,100%{transform:scale(1.65);opacity:0}}
@keyframes map-star{to{opacity:.25}}
/* Quiet, compact editorial cards. */
html[data-theme] .notes{padding-top:36px}
html[data-theme] .notes>h2{font-size:19px;display:flex;align-items:center;gap:12px;letter-spacing:.04em}
html[data-theme] .notes>h2:after{content:"FIELD NOTES";font:9px ui-monospace,Consolas,monospace;letter-spacing:.18em;color:var(--ui-muted);border-left:1px solid var(--ui-line);padding-left:12px}
html[data-theme] .note-card{position:relative;background:var(--ui-panel);border:1px solid var(--ui-line);box-shadow:var(--ui-shadow);border-radius:16px;gap:18px;transition:transform .25s,border-color .25s,box-shadow .25s;overflow:hidden}
html[data-theme] .note-card:after{content:"";position:absolute;pointer-events:none;inset:0;background:radial-gradient(320px circle at var(--pointer-x,50%) var(--pointer-y,50%),var(--ui-glow),transparent 70%);opacity:0;transition:opacity .3s}
html[data-theme] .note-card:hover:after{opacity:1}
html[data-theme] .note-card:hover{border-color:var(--ui-accent);transform:translateY(-3px);box-shadow:0 14px 32px #17392b12}
html[data-theme] .note-card.featured{background:var(--ui-panel);border-color:#85ab976b}
html[data-theme] .note-card h3,html[data-theme] .featured h3{color:var(--ui-text);font-weight:650;font-size:17px}
html[data-theme] .category,html[data-theme] .note-card .arrow{color:var(--ui-accent)}
html[data-theme] .note-card .date{color:var(--ui-muted)}
html[data-theme] .note-card .bank-mark{position:relative;background:linear-gradient(150deg,#1c4b40,#132d32)!important;color:#c5e3d3!important;border:1px solid #6d97813d;overflow:hidden;box-shadow:inset 0 1px 0 #e0eee01a}
html[data-theme] .bank-mark:before{content:"";position:absolute;width:90px;height:90px;border:1px solid #a7c9af20;border-radius:50%;right:-45px;bottom:-40px;box-shadow:0 0 0 14px #a7c9af09;pointer-events:none}
html[data-theme] .bank-mark span{color:#98b8a9!important}
html[data-theme] .pin-label{background:#e4c595;color:#4e3c20}
html[data-theme] .note-card .arrow{transition:transform .25s}
html[data-theme] .note-card:hover .arrow{transform:translate(2px,-2px)}
/* Article surfaces: photographs stay untouched in both modes. */
html[data-theme] article#article{background:var(--ui-panel);color:var(--ui-text);border:1px solid var(--ui-line);box-shadow:var(--ui-shadow)}
html[data-theme] article>header{background:linear-gradient(120deg,#102b30,#1e453c);border-bottom:1px solid #8db39d33}
html[data-theme] article>header:after{background:radial-gradient(ellipse at 90% 0,#44896938,transparent 65%)}
html[data-theme] article>header h1{color:#f0f5ed}
html[data-theme] article>header .eyebrow{color:#d8b682}
html[data-theme] article>header .meta,html[data-theme] article>header .tag{color:#b9d0c4}
html[data-theme] article h2,html[data-theme] article h3{color:var(--ui-text);border-color:var(--ui-line)}
html[data-theme] article h2 span,html[data-theme] article a:not(.image-zoom),html[data-theme] .inline-invite code{color:var(--ui-accent)}
html[data-theme] article .note,html[data-theme] article .lede,html[data-theme] article figcaption,html[data-theme] article .sources{color:var(--ui-muted)}
html[data-theme] article .related-note{position:relative;background:var(--ui-soft);border-color:var(--ui-line);border-left:3px solid var(--ui-accent);border-radius:4px 13px 13px 4px;transition:transform .2s,box-shadow .2s}
html[data-theme] article .related-note:hover{transform:translateY(-2px);box-shadow:var(--ui-shadow)}
html[data-theme] article .related-note h3{color:var(--ui-text)}
html[data-theme] article :is(.facts,.invitation,.bank-overview a,.download-list,.download-entry,.deposit-tutorial,blockquote,pre){background:var(--ui-soft);color:var(--ui-text);border-color:var(--ui-line)}
html[data-theme] article :is(.facts b,.invitation code,.bank-overview b){color:var(--ui-accent)}
html[data-theme] article :is(.facts span,.invitation .label){color:var(--ui-muted)}
html[data-theme] article :is(table,td,th){border-color:var(--ui-line)}
html[data-theme] article th{background:var(--ui-soft);color:var(--ui-text)}
html[data-theme] article td{background:transparent;color:var(--ui-text)}
html[data-theme] article :is(.copy-inline,#copy-code){background:var(--ui-soft);color:var(--ui-accent);border-color:var(--ui-line)}
html[data-theme] .sources{border-color:var(--ui-line)}
html[data-theme="dark"] article :is(.source-red,.source-red strong){color:#f8a595}
html[data-theme="dark"] article .source-blue{color:#9dbef3}
html[data-theme="dark"] article :is(.ui-label,.step-number){color:var(--ui-text)}
html[data-theme] :is(.article-toc,.toc-panel){background:var(--ui-panel);color:var(--ui-text);border-color:var(--ui-line)}
html[data-theme] .article-toc :is(a,button,h2){color:var(--ui-text)}
html[data-theme] :is(.article-nav-buttons button,.feedback-home-float button){background:var(--ui-panel);border-color:var(--ui-line);color:var(--ui-accent);box-shadow:var(--ui-shadow)}
/* Forms, discussion and dashboard use the same theme, not CSS inversion. */
html[data-theme] :is(.feedback-dialog,.comments-section form,.feedback-card,.metric,.traffic-box,.editor-box,form#login){background:var(--ui-panel);color:var(--ui-text);border-color:var(--ui-line);box-shadow:var(--ui-shadow)}
html[data-theme] :is(.comments-section,.comments-section h2,.comments-section .comment-text,.feedback-dialog h2){color:var(--ui-text)}
html[data-theme] :is(.comments-section,.comment-item,.comment-replies,.comment-reply){border-color:var(--ui-line)}
html[data-theme] :is(.comment-meta,.comment-count,.comment-status,.reply-context,.feedback-meta,.traffic-note,.status,.visit-agent,.traffic-list-heading span,.metric span,.editor-note-row small){color:var(--ui-muted)}
html[data-theme] :is(.comment-name,.reply-bar,.ip-note-row,.feedback-url,.editor-box a){color:var(--ui-accent)}
html[data-theme] :is(input,textarea,select,.feedback-dialog textarea,.comments-section textarea,.editor-box #note-editor){background:var(--ui-soft);color:var(--ui-text);border-color:var(--ui-line)}
html[data-theme] :is(.comments-section button,.ip-note-row button,.ip-note-editor button,.admin-tabs button,.editor-box .secondary,.password-field button){background:var(--ui-soft);color:var(--ui-accent);border-color:var(--ui-line)}
html[data-theme] :is(.comments-section .comment-submit,.feedback-dialog .feedback-submit,.admin-tabs button[aria-selected="true"]){background:var(--ui-accent);color:var(--ui-on);border-color:var(--ui-accent)}
html[data-theme] .editor-box :is(.ql-toolbar,.image-tools){background:var(--ui-soft);color:var(--ui-text);border-color:var(--ui-line)}
html[data-theme] .ql-snow :is(.ql-stroke){stroke:var(--ui-text)}
html[data-theme] .ql-snow :is(.ql-fill){fill:var(--ui-text)}
html[data-theme] .ql-snow :is(.ql-picker,.editor-text-button){color:var(--ui-text)}
html[data-theme] .ql-snow :is(.ql-picker-options,.ql-tooltip){background:var(--ui-panel);color:var(--ui-text);border-color:var(--ui-line)}
html[data-theme] .ql-container{border-color:var(--ui-line)}
html[data-theme] .editor-note-row{border-color:var(--ui-line)}
html[data-theme] main>header:has(h1){background:linear-gradient(120deg,#102b30,#1e453c);border:1px solid #577a6866;box-shadow:var(--ui-shadow)}
html[data-theme] main>header .theme-toggle{margin-left:auto}
html[data-theme] .admin-tabs{gap:8px}
html[data-theme] .admin-tabs button{border:1px solid var(--ui-line);border-radius:30px;font-size:13px}
html[data-theme] .metric{border-radius:16px}
html[data-theme] .metric strong{font-variant-numeric:tabular-nums;font-size:30px}
html[data-theme] .metric:first-child{border-color:#8ac3a280}
html[data-theme] .traffic-controls select{background:var(--ui-panel);color:var(--ui-text);border-color:var(--ui-line)}
html[data-theme] .feedback-dialog form{background:transparent;border:0;padding:0;margin:0;max-width:none;box-shadow:none}
/* Progressive decoration never hides content while waiting for JavaScript. */
@keyframes card-arrive{from{opacity:.5;transform:translateY(10px)}to{opacity:1;transform:none}}
.note-card.is-arriving{animation:card-arrive .55s both}
html[data-theme].motion-paused :is(.hero:after,.title-foil,.map-ring,.route-flow,.route-signal,.map-pulse,.map-star){animation-play-state:paused!important}
@media(max-width:850px){
 html[data-theme] .hero{padding:38px 30px;min-height:350px}
 html[data-theme] .hero h1{font-size:46px}
}
@media(max-width:620px){
 html[data-theme] .topbar,html[data-theme] .site-nav{min-height:72px;padding-top:17px;padding-bottom:17px;gap:10px}
 .theme-toggle{height:34px;min-width:34px;padding:0 9px}.theme-toggle .theme-label{display:none}
 html[data-theme] .hero{grid-template-columns:1fr;padding:29px 26px 12px;gap:0;min-height:0;border-radius:19px}
 html[data-theme] .hero h1{font-size:42px;margin:13px 0 11px}
 html[data-theme] .hero p{font-size:13px;max-width:none}
 html[data-theme] .hero .eyebrow{font-size:9px}
 .hero-caption{font-size:9px;margin-bottom:10px;letter-spacing:.22em}
 html[data-theme] .hero .actions{margin-top:18px}
 html[data-theme] .hero .button{padding:8px 14px;font-size:12px}
 html[data-theme] .hero .route-map{width:calc(100% + 24px);height:auto;aspect-ratio:460/320;max-width:400px;max-height:none;margin:8px -12px 0;justify-self:center}
 html[data-theme] .route-map text{font-size:13px}
 html[data-theme] .route-map .map-caption{font-size:9px;display:block}
 html[data-theme] .notes{padding-top:25px}
 html[data-theme] .notes>h2{font-size:18px}
 html[data-theme] .note-card{gap:13px}
 html[data-theme] .note-card h3,html[data-theme] .featured h3{font-size:15px;line-height:1.65}
 html[data-theme] article>header h1{font-size:25px}
 html[data-theme] main>header:has(h1){flex-wrap:wrap;padding:18px}
 html[data-theme] .admin-tabs{gap:6px}.admin-tabs button{padding:8px 11px}
}
@media(max-width:350px){html[data-theme] .hero{padding:25px 19px 10px}html[data-theme] .hero h1{font-size:36px}}
@media(prefers-reduced-motion:reduce){
 html[data-theme]{scroll-behavior:auto}
 html[data-theme] *,html[data-theme] *:before,html[data-theme] *:after{animation:none!important;transition:none!important}
}
@media print{
 html[data-theme]{--ui-bg:#fff;--ui-panel:#fff;--ui-soft:#f2f4f2;--ui-text:#182c35;--ui-muted:#596a62;--ui-accent:#176d59;--ui-line:#ddd;color-scheme:light}
 .theme-tools{display:none!important}html[data-theme] article>header{background:#fff;color:#182c35}html[data-theme] article>header h1{color:#182c35}
}

/* Keep floating article controls and TOC legible in either theme. */
html[data-theme] .article-float .float-control{background:var(--ui-panel);color:var(--ui-accent);border-color:var(--ui-line);box-shadow:var(--ui-shadow)}
html[data-theme] .article-toc :is(.toc-heading,.toc-close){background:var(--ui-panel);color:var(--ui-text);border-color:var(--ui-line)}
html[data-theme] .article-toc a:hover{background:var(--ui-soft)}
html[data-theme] .article-toc a[aria-current="location"]{background:var(--ui-soft);color:var(--ui-accent)}
html[data-theme] article figure img{border-color:var(--ui-line)}
html[data-theme].motion-paused .hero:after{animation-play-state:paused}
html[data-theme] main>header #logout{margin-left:auto;order:1}
html[data-theme] main>header .theme-tools{margin-left:0;order:2}
html[data-theme] .comment-actions textarea{background:transparent}
/* Mobile route illustration keeps its native proportions and readable motion. */
@media(max-width:620px){
 html[data-theme] .hero .route-map text{display:block}
 html[data-theme] .hero .route-map .map-ring{stroke-width:1.6;opacity:.65;animation-duration:26s}
 html[data-theme] .hero .route-map .map-ring-reverse{opacity:.45;animation-duration:38s}
 html[data-theme] .hero .route-map .route-flow{stroke-width:1.8;opacity:.85;animation-duration:10s}
 html[data-theme] .hero .route-map .route-signal{stroke-width:3.5;animation-duration:3.5s}
 html[data-theme] .hero .route-map .map-pulse{stroke-width:1.5;animation-duration:3s}
 html[data-theme] .hero .route-map .map-pulse.second{animation-delay:1.5s}
}

html[data-theme] article :is(.bank-combo,.broker-overview){background:var(--ui-soft);border-color:var(--ui-line);color:var(--ui-text)}
html[data-theme] article :is(.bank-combo strong,.bank-combo h2,.deposit-tutorial>summary,.download-list>summary,h4){color:var(--ui-text)}
html[data-theme] article :is(.bank-overview,.bank-combo li+li,.deposit-tutorial[open]>summary){border-color:var(--ui-line)}
html[data-theme] article .bank-overview{background:var(--ui-line)}
html[data-theme] article :is(.download-entry a,.download-list li a){background:var(--ui-panel);border-color:var(--ui-line)}
html[data-theme] article :is(.bank-overview span,.download-action){color:var(--ui-muted)}
html[data-theme="dark"] article :is(.source-green,.path,.flow-arrow){color:var(--ui-accent)}
html[data-theme="dark"] article :is(.source-orange){color:#e3bd85}
html[data-theme="dark"] article :is(.benefits-label,.subtopic){color:#f8a595}

/* Animated article cover: all motion sits behind stable, readable typography. */
html[data-theme] article#article>header{isolation:isolate;overflow:hidden}
html[data-theme] article#article>header:after{
 content:"";position:absolute;inset:-30%;z-index:-1;pointer-events:none;
 background:radial-gradient(ellipse at 78% 25%,#67cfa353,transparent 38%),radial-gradient(ellipse at 20% 85%,#d5ac6925,transparent 42%),radial-gradient(ellipse at 45% 10%,#397f8a40,transparent 50%);
 animation:article-aurora 18s ease-in-out infinite alternate;
}
html[data-theme] article#article>header:before{
 content:"";position:absolute;right:-70px;top:-150px;width:400px;height:400px;z-index:-1;pointer-events:none;
 border:1px solid #a4d2b82e;border-radius:50%;box-shadow:0 0 0 45px #a4d2b80a,0 0 0 90px #a4d2b805;
 background-image:radial-gradient(#c0dfce2e .8px,transparent 1px);background-size:22px 22px;
 animation:article-orbit 24s ease-in-out infinite alternate;
}
@keyframes article-aurora{from{transform:translate(-2%,2%) rotate(-4deg);opacity:.65}to{transform:translate(4%,-3%) rotate(7deg);opacity:1}}
@keyframes article-orbit{from{transform:translate(0,0) rotate(-8deg) scale(.92);opacity:.55}to{transform:translate(-45px,32px) rotate(12deg) scale(1.08);opacity:1}}
html[data-theme].motion-paused article#article>header:before,html[data-theme].motion-paused article#article>header:after{animation-play-state:paused}
@media(max-width:640px){html[data-theme] article#article>header:before{width:280px;height:280px;right:-110px;top:-80px}}
@media print{html[data-theme] article#article>header:before,html[data-theme] article#article>header:after{display:none}}
/* Editorial night-sky covers: image, typography and navigation. */
html[data-theme] .site-nav .site-brand{display:inline-flex;align-items:center;gap:10px;font-size:18px;font-weight:750;letter-spacing:.12em;color:var(--ui-text);white-space:nowrap}
.brand-orbit{display:grid;place-items:center;width:35px;height:35px;border:1px solid var(--ui-line);border-radius:12px;background:linear-gradient(145deg,var(--ui-soft),var(--ui-panel));box-shadow:inset 0 1px 0 #ffffff18}
.brand-orbit svg{width:29px;height:29px;fill:none;stroke:var(--ui-accent);stroke-width:1.1;transition:transform .6s}
.brand-orbit circle:last-child{fill:#d9b57b;stroke:none}.site-brand:hover .brand-orbit svg{transform:rotate(25deg)}
html[data-theme] .site-nav .home-return{display:inline-flex;align-items:center;gap:7px;padding:9px 13px;border:1px solid var(--ui-line);border-radius:12px;font-size:12px;font-weight:550;background:var(--ui-panel);color:var(--ui-text);transition:border-color .2s,transform .2s}
.home-return svg{width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round}.home-return:hover{transform:translateY(-2px);border-color:var(--ui-accent)!important}
html[data-theme] article#article>header{padding:42px 52px 32px;min-height:330px;background:#0c222b;display:flex;flex-direction:column;justify-content:center;border-bottom:1px solid #c5b48760}
html[data-theme] article#article>header .cover-scene{position:absolute;inset:0;z-index:-3;background:linear-gradient(90deg,#081e29 0%,#081e29dd 32%,#081e2955 63%,#081e2910 100%),linear-gradient(0deg,#081e29bb,transparent 55%),var(--cover-image),var(--cover-placeholder,linear-gradient(#102a32,#102a32));background-size:cover;background-position:center,center,center 28%;pointer-events:none;animation:cover-breathe 24s ease-in-out infinite alternate}
header[data-cover="hong-kong"]{--cover-image:url('./covers/hong-kong.webp?v=reference-1')}
header[data-cover="macau"]{--cover-image:url('./covers/macau.webp?v=reference-1')}
header[data-cover="brokers"]{--cover-image:url('./covers/brokers.webp?v=reference-1')}
header[data-cover="transfer"]{--cover-image:url('./covers/transfer.webp?v=reference-1')}
html[data-theme] article#article>header:before{inset:auto 32px 25px auto;width:160px;height:160px;border-color:#b1c7d228;box-shadow:0 0 0 24px #aec5d308;background:none;opacity:.5}
html[data-theme] article#article>header:after{inset:0;background:radial-gradient(ellipse at 8% 5%,#6698b020,transparent 55%);opacity:.6}
html[data-theme] article#article>header .eyebrow{display:flex;align-items:center;gap:11px;margin:0 0 20px;font:600 10px/1.6 ui-monospace,Consolas,monospace;letter-spacing:.2em;color:#e1c899}
html[data-theme] article#article>header .eyebrow:before{content:'';width:24px;height:1px;background:#e1c899;box-shadow:0 0 10px #e1c89966}
html[data-theme] article#article>header h1{position:relative;max-width:730px;margin:0 0 24px;font-size:clamp(27px,3vw,38px);line-height:1.48;letter-spacing:.035em;font-weight:750;color:#f3f5ed;text-shadow:0 2px 16px #0008;text-wrap:balance}
html[data-theme] article#article>header h1 br{display:none}
html[data-theme] article#article>header .title-subline{display:block;margin-top:9px;font-size:.65em;font-weight:500;line-height:1.65;letter-spacing:.08em;color:#d1e0df}
html[data-theme] article#article>header .meta{margin:0 0 10px;display:flex;align-items:center;flex-wrap:wrap;gap:6px 20px;color:#c0d0d4;font-size:12px;line-height:1.8}
html[data-theme] article#article>header .article-tags{font-size:0;gap:6px;margin-top:6px}
html[data-theme] article#article>header .tag{font-size:11px;padding:3px 9px;border-radius:5px;background:#10232cd9;border:1px solid #a3b8bb38;color:#d0dedb;letter-spacing:.03em}
.cover-constellation{position:absolute;right:45px;top:32px;width:68px;height:50px;pointer-events:none;background:radial-gradient(circle at 10% 75%,#eee6ce 1px,transparent 2px),radial-gradient(circle at 54% 10%,#fff 1px,transparent 2px),radial-gradient(circle at 85% 60%,#e6c48a 2px,transparent 3px);opacity:.7;animation:map-star 6s ease-in-out infinite alternate}
.cover-constellation:after{content:'';position:absolute;left:9px;top:22px;width:40px;height:25px;border-top:1px solid #b1cbd540;transform:rotate(-40deg)}
@keyframes cover-breathe{from{transform:scale(1)}to{transform:scale(1.045)}}
/* Sparse, low-luminance stars live below content; screenshots remain opaque. */
.note-reading{isolation:isolate}
.reading-sky{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;color:var(--ui-accent)}
.sky-stars{position:absolute;inset:-15%;background-image:radial-gradient(circle at 12% 28%,currentColor 1px,transparent 1.7px),radial-gradient(circle at 64% 67%,currentColor .7px,transparent 1.3px),radial-gradient(circle at 89% 34%,currentColor .8px,transparent 1.5px);background-size:191px 241px,277px 173px,337px 307px;opacity:.2;animation:sky-drift 65s linear infinite alternate}
.sky-orbit{position:absolute;width:470px;height:470px;right:-260px;top:48%;border:1px solid var(--ui-line);border-radius:50%;box-shadow:0 0 0 28px #83aab005;transform:rotate(-25deg) scaleY(.5)}
.sky-meteor{position:absolute;left:7%;top:15%;width:95px;height:1px;background:linear-gradient(90deg,transparent,var(--ui-accent));opacity:0;transform:rotate(35deg);animation:sky-meteor 19s linear infinite}
html[data-theme] body.note-reading article#article{position:relative;isolation:isolate;background-color:var(--ui-panel);background-image:radial-gradient(circle at 19% 31%,#83a8ac10 .7px,transparent 1.3px),radial-gradient(circle at 74% 65%,#83a8ac0c 1px,transparent 1.5px);background-size:233px 269px,367px 311px}
html[data-theme] body.note-reading article#article:after{content:'';position:fixed;inset:0;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 90% 70%,#4d8c9a08,transparent 45%);animation:reading-glow 22s ease-in-out infinite alternate}
@keyframes sky-drift{to{transform:translate3d(15px,30px,0);opacity:.1}}
@keyframes sky-meteor{0%,85%{opacity:0;transform:translate(0,0) rotate(35deg)}86%{opacity:.35}92%,100%{opacity:0;transform:translate(330px,230px) rotate(35deg)}}
@keyframes reading-glow{to{opacity:.3;transform:translateY(-50px)}}
html.motion-paused .cover-scene,html.motion-paused .cover-constellation,html.tab-hidden :is(.sky-stars,.sky-meteor,article#article:after){animation-play-state:paused!important}
@media(max-width:640px){
 html[data-theme] .site-nav{gap:8px}
 html[data-theme] .site-nav .site-brand{font-size:15px;gap:7px;letter-spacing:.06em}.brand-orbit{width:30px;height:30px;border-radius:10px}.brand-orbit svg{width:25px;height:25px}
 html[data-theme] .site-nav .home-return{padding:8px 9px;font-size:11px;gap:5px}
 html[data-theme] article#article>header{min-height:320px;padding:30px 24px 25px}
 html[data-theme] article#article>header h1{font-size:26px;line-height:1.5;margin-bottom:21px;max-width:100%;letter-spacing:.02em;text-wrap:pretty}
 html[data-theme] article#article>header .title-subline{font-size:18px;letter-spacing:.025em;margin-top:8px}
 html[data-theme] article#article>header .eyebrow{font-size:8px;letter-spacing:.13em;gap:8px;margin-bottom:21px;max-width:90%}
 html[data-theme] article#article>header .eyebrow:before{width:17px;flex-shrink:0}
 html[data-theme] article#article>header .cover-scene{background-image:linear-gradient(90deg,#081e29e8,#081e2980),linear-gradient(0deg,#081e29dd,transparent 75%),var(--cover-image),var(--cover-placeholder,linear-gradient(#102a32,#102a32));background-position:center,center,64% center,64% center}
 html[data-theme] article#article>header .meta{font-size:11px;gap:3px 12px}
 html[data-theme] article#article>header .tag{font-size:10px;padding:2px 7px}
 .cover-constellation{right:14px;top:16px;transform:scale(.7);transform-origin:right top}
}
@media(prefers-reduced-motion:reduce){.cover-scene,.cover-constellation,.sky-stars,.sky-meteor,html[data-theme] body.note-reading article#article:after{animation:none!important}.sky-meteor{display:none}}
@media print{.reading-sky,.cover-scene,.cover-constellation,.brand-orbit{display:none!important}html[data-theme] article#article>header{background:white;min-height:0}html[data-theme] article#article>header :is(h1,.title-subline,.eyebrow,.meta,.tag){color:#182c35;text-shadow:none}html[data-theme] body.note-reading article#article:after{display:none}}
/* A softer spectrum for navigation, feedback and the notebook index. */
.home-reading{isolation:isolate}
.home-atmosphere{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background:radial-gradient(ellipse at 2% 10%,#7ab8bb13,transparent 55%),radial-gradient(ellipse at 98% 75%,#a194d31b,transparent 50%)}
.home-atmosphere i{position:absolute;width:55vw;height:55vw;min-width:350px;min-height:350px;border-radius:50%;background:radial-gradient(ellipse,#88b7df25,transparent 65%);left:-20%;top:5%;animation:atmosphere-float 35s ease-in-out infinite alternate}
.home-atmosphere i:nth-child(2){left:auto;right:-25%;top:30%;background:radial-gradient(ellipse,#c9a5da20,transparent 65%);animation-delay:-12s}
.home-atmosphere i:nth-child(3){left:20%;top:65%;background:radial-gradient(ellipse,#87d7b91b,transparent 65%);animation-delay:-24s}
@keyframes atmosphere-float{to{transform:translate3d(6vw,-5vh,0) scale(1.12)}}
html[data-theme] .hero .eyebrow{gap:16px}
html[data-theme] .hero .eyebrow:before{display:none}
.hero .eyebrow>span{display:inline-flex;align-items:center;gap:9px}
.hero .eyebrow>span:before{content:'';width:5px;height:5px;flex-shrink:0;border-radius:50%;background:#a5dfcf;box-shadow:0 0 0 3px #a5dfcf1c,0 0 12px #a5dfcf66;animation:signal-glow 5s ease-in-out infinite alternate}
.hero .eyebrow>span:nth-child(2):before{background:#d4c1f4;box-shadow:0 0 0 3px #d4c1f41c,0 0 12px #d4c1f466;animation-delay:-1.6s}
.hero .eyebrow>span:nth-child(3):before{background:#edd09d;box-shadow:0 0 0 3px #edd09d1c,0 0 12px #edd09d66;animation-delay:-3.2s}
@keyframes signal-glow{to{opacity:.55;filter:brightness(1.25)}}
html[data-theme] .hero-caption{font-size:9px;letter-spacing:.32em;color:#a8c2ba}
html[data-theme] .route-map .map-caption{font-family:Georgia,'Times New Roman',serif!important;font-weight:500;font-size:11px;letter-spacing:1.6px;fill:#dbe7df}
.map-caption-line{animation:caption-trace 10s ease-in-out infinite alternate;opacity:.6}
@keyframes caption-trace{to{stroke-dashoffset:-130}}
html[data-theme] .notes>h2{font-family:'Noto Serif SC','Source Han Serif SC','Songti SC','SimSun',serif;font-size:27px;font-weight:650;letter-spacing:.12em;margin-bottom:23px;gap:13px}
html[data-theme] .notes>h2:before{content:'';width:19px;height:19px;background:linear-gradient(135deg,var(--ui-accent),#bfa3dc);clip-path:polygon(50% 0,61% 39%,100% 50%,61% 61%,50% 100%,39% 61%,0 50%,39% 39%);opacity:.85}
html[data-theme] .notes>h2:after{content:'';height:1px;width:70px;padding:0;border:0;background:linear-gradient(90deg,var(--ui-line),transparent)}
html[data-theme] .note-card{--card-color:#53a9be;--card-wash:#53a9be12;--card-rx:0deg;--card-ry:0deg;transform:perspective(950px) rotateX(0deg) rotateY(0deg);transition:transform .35s,border-color .35s,box-shadow .35s,background .35s}
html[data-theme] .note-card:nth-of-type(4n+2){--card-color:#c79864;--card-wash:#c7986414;animation-delay:-2s}
html[data-theme] .note-card:nth-of-type(4n+3){--card-color:#a48bd4;--card-wash:#a48bd414;animation-delay:-4s}
html[data-theme] .note-card:nth-of-type(4n){--card-color:#62b495;--card-wash:#62b49514;animation-delay:-6s}
html[data-theme] .note-card:after{background:radial-gradient(360px circle at var(--pointer-x,50%) var(--pointer-y,50%),color-mix(in srgb,var(--card-color) 15%,transparent),transparent 75%)}
html[data-theme] .note-card:hover,html[data-theme] .note-card:focus-visible{border-color:var(--card-color);background:linear-gradient(120deg,var(--card-wash),transparent 75%),var(--ui-panel);box-shadow:0 18px 40px #14293219,0 0 24px var(--card-wash);transform:perspective(950px) translateY(-5px) rotateX(var(--card-rx)) rotateY(var(--card-ry))}
html[data-theme] .note-card:hover .arrow{color:var(--card-color);transform:translate(3px,-3px)}
html[data-theme] .note-card .bank-mark{border-color:color-mix(in srgb,var(--card-color) 35%,transparent);box-shadow:inset 0 1px 0 #ffffff14,0 5px 20px var(--card-wash)}
@media(hover:hover) and (pointer:fine) and (prefers-reduced-motion:no-preference){html[data-theme] .note-card.card-visible{animation:note-levitate 9s ease-in-out infinite;animation-delay:-1s}html[data-theme] .note-card.card-visible:nth-of-type(2n){animation-delay:-4s}html[data-theme] .note-card.card-visible:nth-of-type(3n){animation-delay:-6s}}
@keyframes note-levitate{0%,100%{translate:0 0}50%{translate:0 -3px}}
/* Notes read as quiet asides, without a quote-style vertical rule. */
html[data-theme] article .note{position:relative;border:0!important;border-radius:9px;padding:12px 15px 12px 32px;background:color-mix(in srgb,var(--ui-soft) 65%,transparent);font-size:12px;line-height:1.85;color:var(--ui-muted)}
html[data-theme] article .note:before{content:'';position:absolute;left:14px;top:21px;width:4px;height:4px;border-radius:50%;background:var(--ui-accent);opacity:.65;box-shadow:0 0 0 3px var(--ui-glow)}
html[data-theme] article .note a{color:var(--ui-accent)}
/* Frosted feedback card, with a distinct heading and stable input contrast. */
html[data-theme] .feedback-dialog{width:min(460px,calc(100vw - 32px));padding:27px;border-radius:24px;border:1px solid color-mix(in srgb,var(--ui-accent) 32%,var(--ui-line));background:radial-gradient(ellipse at 100% 0,#9d96dc1d,transparent 60%),radial-gradient(ellipse at 0 0,#69bca51c,transparent 55%),var(--ui-panel);box-shadow:0 30px 100px #0005,inset 0 1px 0 #ffffff22}
.feedback-dialog[open]{animation:feedback-arrive .25s ease-out}
.feedback-dialog::backdrop{background:#07151d99;backdrop-filter:blur(7px)}
html[data-theme] .feedback-dialog .feedback-heading{padding-bottom:18px;margin-bottom:20px;border-bottom:1px solid var(--ui-line)}
html[data-theme] .feedback-dialog h2{display:flex;align-items:center;gap:11px;font:600 24px/1.4 'Songti SC','SimSun',serif;letter-spacing:.12em;color:var(--ui-text)}
.feedback-dialog h2:before{content:'';width:24px;height:24px;background:linear-gradient(145deg,var(--ui-accent),#bba0df);clip-path:polygon(50% 0,63% 37%,100% 50%,63% 63%,50% 100%,37% 63%,0 50%,37% 37%)}
html[data-theme] .feedback-dialog .feedback-close{width:32px;height:32px;padding:0;border-radius:50%;font-size:22px;background:var(--ui-soft);color:var(--ui-muted);transition:transform .2s}
.feedback-close:hover{transform:rotate(90deg)}
html[data-theme] .feedback-dialog label{font-size:13px;color:var(--ui-muted);margin-bottom:12px}
html[data-theme] .feedback-dialog textarea{background:var(--ui-panel);border:1px solid var(--ui-line);border-radius:13px;min-height:155px;padding:14px;font-size:14px;transition:border-color .2s,box-shadow .2s}
html[data-theme] .feedback-dialog textarea:focus{outline:0;border-color:var(--ui-accent);box-shadow:0 0 0 3px var(--ui-glow)}
.feedback-input-footer{display:flex;justify-content:space-between;gap:10px;color:var(--ui-muted);font-size:10px;margin:7px 0 20px;font-variant-numeric:tabular-nums}
html[data-theme] .feedback-dialog .feedback-submit{border-radius:12px;letter-spacing:.08em;font-size:14px;font-weight:600;transition:transform .2s,box-shadow .2s}
.feedback-submit:enabled:hover{transform:translateY(-2px);box-shadow:0 6px 20px var(--ui-glow)}
@keyframes feedback-arrive{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
html[data-theme] .article-float{gap:6px;padding:6px;border:1px solid var(--ui-line);border-radius:25px;background:color-mix(in srgb,var(--ui-panel) 90%,transparent);backdrop-filter:blur(12px);box-shadow:0 8px 30px #0001}
html[data-theme] .article-float .float-control{border-color:transparent;background:transparent;box-shadow:none;transition:background .2s,transform .2s}
html[data-theme] .article-float .float-control:hover{background:var(--ui-soft);transform:translateY(-1px)}
html[data-theme] .article-toc{max-height:calc(100dvh - 290px)}
html.tab-hidden :is(.home-atmosphere i,.note-card,.map-caption-line,.hero .eyebrow>span:before){animation-play-state:paused!important}
@media(max-width:640px){html[data-theme] .notes>h2{font-size:23px;margin-bottom:19px}html[data-theme] .hero .eyebrow{gap:15px}.hero .eyebrow>span{gap:8px}html[data-theme] .feedback-dialog{padding:22px}.feedback-dialog::backdrop{backdrop-filter:blur(4px)}html[data-theme] .article-float{padding:3px;gap:2px;right:5px;border-radius:24px}html[data-theme] .article-float .float-control{width:38px;height:38px;min-height:38px}html[data-theme] .route-map .map-caption{font-size:11px}}
@media(prefers-reduced-motion:reduce){.home-atmosphere i,.map-caption-line,.hero .eyebrow>span:before,.feedback-dialog[open]{animation:none!important}}
@media print{.home-atmosphere{display:none}html[data-theme] article .note{background:none;padding-left:0}html[data-theme] article .note:before{display:none}}
/* Consistent editorial lettering and a nebula within the reading surface. */
html[data-theme] .hero-caption{font-family:Georgia,'Times New Roman',serif;font-size:11px;font-style:italic;letter-spacing:.22em;color:#d1ddd8;text-shadow:0 0 18px #b4d5cc22}
html[data-theme] .hero p{font-family:'Noto Serif SC','Songti SC','SimSun',serif;font-size:17px;letter-spacing:.07em;line-height:1.9;color:#c8dbd4}
html[data-theme] .route-map text{font-family:'Noto Serif SC','Songti SC','SimSun',serif;font-size:15px;font-weight:600;letter-spacing:.08em;paint-order:stroke;stroke:#0d252950;stroke-width:1px}
html[data-theme] .route-map .map-caption{font-family:Georgia,'Times New Roman',serif!important;font-size:12px;font-style:italic;font-weight:500;letter-spacing:1.4px;filter:drop-shadow(0 0 5px #a6d5ce44)}
html[data-theme] article#article>header h1{font-family:'Noto Serif SC','Source Han Serif SC','Songti SC','SimSun',serif;font-weight:700;font-size:clamp(28px,3.3vw,40px);letter-spacing:.035em;line-height:1.5;color:#f0f2e8;background:linear-gradient(115deg,#fff7e7 12%,#edf5f0 50%,#bcdedb 90%);background-clip:text;-webkit-background-clip:text;-webkit-text-fill-color:transparent;text-shadow:0 2px 20px #0003}
html[data-theme] article#article>header .title-subline{font-size:.62em;font-family:'Noto Serif SC','Songti SC','SimSun',serif;font-weight:500;letter-spacing:.065em;color:#cee1df;-webkit-text-fill-color:#cee1df}
html[data-theme] article#article>header .article-byline{gap:8px;font-size:11px;font-family:ui-monospace,'Microsoft YaHei',monospace;letter-spacing:.015em;color:#d8e5df}
html[data-theme] article#article>header .article-byline>span{display:inline-flex;align-items:center;gap:6px;padding:5px 10px;background:linear-gradient(120deg,#203846b3,#182e3990);border:1px solid #a8c8c72b;border-radius:7px;box-shadow:inset 0 1px 0 #ffffff08}
html[data-theme] article#article>header .article-byline>span:before{content:'';width:4px;height:4px;border-radius:50%;background:#d9bd8d;box-shadow:0 0 6px #d9bd8d55}
html[data-theme] article#article>header .article-byline>span+span:before{background:#9ad7cd;box-shadow:0 0 6px #9ad7cd55}
html[data-theme] article#article>header .article-tags>span:not(.tag){display:none}
html[data-theme] article#article>header .article-tags{gap:7px;margin-top:6px}
html[data-theme] article#article>header .tag{font-family:'Microsoft YaHei',system-ui,sans-serif;font-size:10px;letter-spacing:.07em;border-radius:20px;padding:4px 10px;background:linear-gradient(135deg,#91c3b51a,#778acb17);border-color:#a6c3c13d;box-shadow:inset 0 1px 0 #ffffff0a;color:#d0e1df}
html[data-theme] article#article>header .tag:before{content:'#';color:#c7b88f;opacity:.75;margin-right:4px;font-family:Georgia,serif;font-style:italic}
html[data-theme] body.note-reading article#article{background-color:var(--ui-panel);background-image:none}
html[data-theme] body.note-reading article#article:before{content:'';position:absolute;inset:0;z-index:-1;pointer-events:none;background-image:radial-gradient(circle at 12% 32%,#8eb7c13d .8px,transparent 1.5px),radial-gradient(circle at 82% 67%,#a39dc331 .7px,transparent 1.4px),radial-gradient(ellipse at 95% 20%,#6d92c619,transparent 62%),radial-gradient(ellipse at 4% 75%,#946cba13,transparent 60%);background-size:269px 317px,359px 239px,100% 950px,100% 1350px;opacity:.75}
html[data-theme] body.note-reading article#article:after{content:'';position:fixed;inset:-5%;z-index:-1;pointer-events:none;background:radial-gradient(ellipse at 72% 32%,#5b86ad17,transparent 43%),radial-gradient(ellipse at 23% 70%,#9c74be17,transparent 47%),radial-gradient(ellipse at 50% 95%,#5aaf9e13,transparent 42%);animation:reading-nebula 27s ease-in-out infinite alternate;opacity:1}
html[data-theme='light'] body.note-reading article#article:before{opacity:.35}
html[data-theme='light'] body.note-reading article#article:after{opacity:.5}
@keyframes reading-nebula{from{transform:translate3d(-1%,1%,0) scale(1)}to{transform:translate3d(2%,-2%,0) scale(1.06)}}
html.tab-hidden body.note-reading article#article:after{animation-play-state:paused}
@media(max-width:640px){html[data-theme] .hero p{font-size:13px;letter-spacing:.045em}html[data-theme] .hero-caption{font-size:10px;letter-spacing:.16em}html[data-theme] .route-map text{font-size:15px}html[data-theme] .route-map .map-caption{font-size:12px}html[data-theme] article#article>header h1{font-size:27px;letter-spacing:.025em}html[data-theme] article#article>header .title-subline{font-size:18px}html[data-theme] article#article>header .article-byline{font-size:10px;gap:6px}html[data-theme] article#article>header .article-byline>span{padding:4px 7px}html[data-theme] article#article>header .tag{font-size:9px;padding:3px 8px}}
@media print{html[data-theme] body.note-reading article#article:before,html[data-theme] body.note-reading article#article:after{display:none}html[data-theme] article#article>header h1{background:none;-webkit-text-fill-color:#182c35}}

/* Avoid live backdrop sampling while scrolling the reading surface. */
html[data-theme] .article-float{backdrop-filter:none;background:var(--ui-panel)}

/* Blend the comment editor with its surrounding form in both themes. */
html[data-theme] #comments #comment-message{background:transparent;border:0;box-shadow:none;padding:6px;color:var(--ui-text)}
html[data-theme] .comments-section textarea:focus{outline:none}
html[data-theme] .comments-section form:focus-within{border-color:var(--ui-accent);box-shadow:0 0 0 2px var(--ui-glow)}
/* Blue chapter headings across all notes; retain orange subheadings. */
html[data-theme] article :is(section,.crypto-body,.remittance-body,.wise-body)>h2,html[data-theme] article :is(section,.crypto-body,.remittance-body,.wise-body)>h2>span{color:#00a6ed}

/* Quiet starlight behind the reading area; never above text or screenshots. */
html[data-theme] body.note-reading article#article:before{background-image:radial-gradient(ellipse at 95% 20%,#6d92c619,transparent 62%),radial-gradient(ellipse at 4% 75%,#946cba13,transparent 60%);background-size:100% 950px,100% 1350px}
.reading-stardust{position:fixed;inset:0;z-index:-1;pointer-events:none;overflow:hidden;contain:strict}
.reading-stardust[hidden]{display:none}
.reading-stardust i{position:absolute;inset:-32px;pointer-events:none;background-repeat:repeat;animation:reading-star-drift 34s ease-in-out infinite alternate;opacity:.36}
.reading-stardust i:first-child{background-image:radial-gradient(circle at 9% 13%,#c6e5ff 0 1.25px,transparent 2.3px),radial-gradient(circle at 34% 46%,#a3bdd9 0 1.1px,transparent 2px),radial-gradient(circle at 71% 21%,#e0e7ff 0 1.5px,transparent 2.6px),radial-gradient(circle at 88% 77%,#b1d8d9 0 1.25px,transparent 2.2px),radial-gradient(circle at 52% 89%,#c9b9e6 0 1.1px,transparent 2px);background-size:320px 310px}
.reading-stardust i:last-child{background-image:radial-gradient(circle at 24% 72%,#d2e9ff 0 1.8px,transparent 3.2px),radial-gradient(circle at 78% 43%,#d0c6eb 0 1.35px,transparent 2.5px),radial-gradient(circle at 48% 15%,#c5e1e9 0 1.1px,transparent 2.1px);background-size:440px 390px;animation-name:reading-star-depth;animation-duration:47s;animation-delay:-17s;opacity:.28}
@keyframes reading-star-drift{from{transform:translate3d(-12px,16px,0);opacity:.34}to{transform:translate3d(16px,-18px,0);opacity:.54}}
@keyframes reading-star-depth{from{transform:translate3d(18px,12px,0);opacity:.28}to{transform:translate3d(-15px,-14px,0);opacity:.44}}
html[data-theme='light'] .reading-stardust{opacity:.22;filter:brightness(.35)}
html.tab-hidden .reading-stardust i{animation-play-state:paused!important}
@media(max-width:620px){.reading-stardust i:first-child{background-size:240px 280px}.reading-stardust i:last-child{background-size:350px 370px}}
@media(prefers-reduced-motion:reduce){.reading-stardust i{animation:none!important;opacity:.38}}
@media print{.reading-stardust{display:none!important}}

/* Headings inserted with the article editor use the same chapter palette. */
html[data-theme] article :is([data-cms-before],[data-cms-after],[data-cms-block]) h2{color:#00a6ed}
